/*-----------------------------
		LAYOUT
-----------------------------*/

.clear {
clear:both;
}


section {
position: relative;
}


.fullscreen {
width:100vw;
height:100vh;
}
.fulldiv {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}


/*******************
 wrappers
*******************/
.wrapper {
width:100%;
max-width:1300px;
padding:0 2em;
margin:auto;
position:relative;
}
.wrapper.no-padding { padding: 0; }
.wrapper-full {
max-width:100%;
padding: 0 1.5em;
}
.wrapper-1400 {
max-width:1400px;
}
.wrapper-1300 {
max-width:1300px;
}
.wrapper-1200 {
max-width:1200px;
}
.wrapper-1100 {
max-width:1100px;
}
.wrapper-1000 {
max-width:1000px;
}
.wrapper-900 {
max-width:900px;
}
.wrapper-850 {
max-width:850px;
}
.wrapper-800 {
max-width:800px;
}
.wrapper-700 {
max-width:700px;
}
.wrapper-600 {
max-width:600px;
}
.wrapper-500 {
max-width:500px;
}
.wrapper-450 {
max-width:450px;
}
.wrapper-400 {
max-width:400px;
}
.wrapper-300 {
max-width:300px;
}
.wrapper-200 {
max-width:200px;
}

.v-centered {
position:relative;
top:50%;
left:0;
transform:translateY(-50%);
-webkit-transform:translateY(-50%);
-ms-transform-origin: 50% 50%; /* IE 9 */
-webkit-transform-origin: 50% 50%; /* Chrome, Safari, Opera */
transform-origin: 50% 50%;
}

/*******************
 flex
*******************/

.flex {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}
.flex__sb {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.flex__wrap {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.flex__centerV {
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.flex__column {
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}
.flex__row {
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}
.flex__center {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.flex__end {
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    justify-content: flex-end;
}
.flex__start {
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    align-items: flex-start;
}
.flex__stretch {
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    align-items: stretch;
}
.flex__expand {
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}
.col__3-4 {
width:75%;
}
.col__2-3 {
width:66.66%;
}
.col__1-2 {
width:50%;
}
.col__1-3 {
width:33.33%;
}
.col__1-4 {
width:25%;
}


/*******************
 flex columns
*******************/

.flex__2cols, .flex__4cols {
    margin: 0 -1em -2em -1em;
    width: calc(100% + 2em);
    flex-wrap: wrap;
}
    .flex__2cols.more-gap {
        margin-left: -2em;
        margin-right: -2em;
        width: calc(100% + 4em);
    }
    .flex__2cols.more-gap > div {
        padding: 0 2em;
    }
.flex__2cols > div {
    flex: 0 0 50%;
    padding: 0 1em;
    margin-bottom: 2em;
}
.flex__4cols > div {
    flex: 0 0 25%;
    padding: 0 1em;
    margin-bottom: 2em;
}
.flex__2cols.flex__mainCol2 > div:first-child, .flex__2cols.flex__mainCol1 > div:last-child {
    flex: 0 0 40%;
}
.flex__2cols.flex__mainCol2 > div:last-child, .flex__2cols.flex__mainCol1 > div:first-child {
    flex: 0 0 60%;
}
    @media screen and (max-width: 800px) {
        .flex__2cols > div,
        .flex__2cols.flex__mainCol2 > div:first-child,
        .flex__2cols.flex__mainCol2 > div:last-child,
        .flex__4cols > div {
            flex: 0 0 100%;
        }
    }

