.flex {display:flex}
.f-direct-row {flex-direction:row}
.f-direct-column {flex-direction:column}

.f-wrap {flex-wrap:wrap}
.f-nowrap {flex-wrap:nowrap}
.fjustify-between {justify-content:space-between}
.fjustify-around {justify-content:space-around}
.falign-start {align-items:flex-start}.
.falign-end {align-items:flex-end}
.falign-base {align-items:baseline}
.falign-center {align-items:center}

f-shrink0 {flex-shrink:0}
f-shrink1 {flex-shrink:1}

.f-basis10 {flex-basis:10%}
.f-basis13 {flex-basis:13%}
.f-basis15 {flex-basis:19%}
.f-basis20 {flex-basis:20%}
.f-basis30 {flex-basis:30%}
.f-basis40 {flex-basis:40%}
.f-basis45 {flex-basis:45%}
.f-basis50 {flex-basis:50%}
.f-basis60 {flex-basis:60%}
.f-basis70 {flex-basis:70%}
.f-basis80 {flex-basis:80%}
.f-basis90 {flex-basis:90%}
.f-basis100 {flex-basis:100%}

.f-basis40-m80 {flex-basis:80%}
.f-basis45-m80 {flex-basis:80%}
.f-basis50-m80 {flex-basis:80%}

.f-basis40-m100 {flex-basis:100%}
.f-basis45-m100 {flex-basis:100%}
.f-basis50-m100 {flex-basis:100%}

.w100-max1000 {width:100%; max-width:1000px}
.w100-max900 {width:100%; max-width:900px}

.w100 {width:100%}
.w50 {width:50%}
.w45 {width:45%}

.w45-m100 {width:100%}
.w50-m100 {width:100%}


@media only screen and (min-width: 1000px) {
	.f-basis40-m80 {flex-basis:40%}
	.f-basis45-m80 {flex-basis:45%}
	.f-basis50-m80 {flex-basis:50%}
	
	.f-basis40-m100 {flex-basis:40%}
	.f-basis45-m100 {flex-basis:45%}
	.f-basis50-m100 {flex-basis:50%}
	
	.w45-m100 {width:45%}
	.w50-m100 {width:50%}
}





.margin-center {margin-right:auto; margin-left:auto}
.text-right {text-align:right}
.text-left {text-align:left}
.text-center {text-align:center}
.right {float:left}
.left {float:left}


.mar8 {margin:8px}
.mar8-tb {margin-top:8px;margin-bottom:8px}
.mar8-rl {margin-left:8px;margin-right:8px}
.mar8-r {margin-right:8px}
.mar8-l {margin-left:8px}
.mar8-t {margin-top:8px}
.mar8-b {margin-bottom:8px}

.mar10 {margin:10px}
.mar10-tb {margin-top:10px;margin-bottom:10px}
.mar10-rl {margin-left:10px;margin-right:10px}
.mar10-r {margin-right:10px}
.mar10-l {margin-left:10px}
.mar10-t {margin-top:10px}
.mar10-b {margin-bottom:10px}

.mar15 {margin:15px}
.mar15-tb {margin-top:15px;margin-bottom:15px}
.mar15-rl {margin-left:15px;margin-right:15px}
.mar15-r {margin-right:15px}
.mar15-l {margin-left:15px}
.mar15-t {margin-top:15px}
.mar15-b {margin-bottom:15px}

.mar20 {margin:20px}
.mar20-tb {margin-top:20px;margin-bottom:20px}
.mar20-rl {margin-left:20px;margin-right:20px}
.mar20-r {margin-right:20px}
.mar20-l {margin-left:20px}
.mar20-t {margin-top:20px}
.mar20-b {margin-bottom:20px}

.mar25 {margin:25px}
.mar25-tb {margin-top:25px;margin-bottom:25px}
.mar25-rl {margin-left:25px;margin-right:25px}
.mar25-r {margin-right:25px}
.mar25-l {margin-left:25px}
.mar25-t {margin-top:25px}
.mar25-b {margin-bottom:25px}

.mar30 {margin:30px}
.mar30-tb {margin-top:30px;margin-bottom:30px}
.mar30-rl {margin-left:30px;margin-right:30px}
.mar30-r {margin-right:30px}
.mar30-l {margin-left:30px}
.mar30-t {margin-top:30px}
.mar30-b {margin-bottom:30px}

.pad8 {padding:8px}
.pad8-tb {padding-top:8px;padding-bottom:8px}
.pad8-rl {padding-left:8px;padding-right:8px}
.pad8-r {padding-right:8px}
.pad8-l {padding-left:8px}
.pad8-t {padding-top:8px}
.pad8-b {padding-bottom:8px}

.pad12 {padding:12px}
.pad12-tb {padding-top:12px;padding-bottom:12px}
.pad12-rl {padding-left:12px;padding-right:12px}
.pad12-r {padding-right:12px}
.pad12-l {padding-left:12px}
.pad12-t {padding-top:12px}
.pad12-b {padding-bottom:12px}

.pad25 {padding:25px}
.pad25-tb {padding-top:25px;padding-bottom:25px}
.pad25-rl {padding-left:25px;padding-right:25px}
.pad25-r {padding-right:25px}
.pad25-l {padding-left:25px}
.pad25-t {padding-top:25px}
.pad25-b {padding-bottom:25px}

