/* GRID*/
*{
  box-sizing: border-box;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
body{
    margin:0;
}
html,
body{
    height:100%;
}

button, input, select, textarea{
    border:0;
    background:#fff;
    font: 14px/1.2 sans-serif;
    padding: 8px;
    vertical-align:middle;
}

td, th{
    vertical-align:top;
}



.row,
.row-center{
    width:100%;
    position:relative;
    margin:0 auto;
}
.row-center{
    max-width:1280px;
}
.clear:after,
.clear:before, 
.row:before,
.row:after,
.row-center:before,
.row-center:after{
    content:" ";
    display:table;
    clear:both;
}
[class*=cell-]{
    position:relative;
    float:left;
    padding: 0;
}
.cell-1 {width:8.333%;}
.cell-2 {width:16.666%;}
.cell-2-5{width:20%;}
.cell-3 {width:25%;}
.cell-4 {width:33.333%;}
.cell-5 {width:41.666%;}
.cell-6 {width:50%}
.cell-7 {width:58.333%;}
.cell-8 {width:66.666%;}
.cell-9 {width:75%;}
.cell-10{width:83.333%;}
.cell-11{width:91.666%;}
.cell-12{width:100%;}

.cells-align-horizontally{
    white-space:nowrap;
    font-size:0;
}
.cells-align-horizontally > [class^=cell]{
    font-size:1rem;
    position:relative;
    float:none;
    display:inline-block;
    vertical-align:top;
}

.left-8{margin-left:66.666%;}

.marg-0{margin:0;}

.padd-8-16{padding:8px 16px;}
.padd-16-24{padding:16px 24px;}

.padd-0{padding:0px;}
.padd-4{padding:4px;}
.padd-8{padding:8px;}
.padd-16{padding:16px;}
.padd-24{padding:24px;}
.padd-32{padding:32px;}
.padd-48{padding:48px;}
.padd-h-0{padding-left:0px; padding-right:0px;}
.padd-h-4{padding-left:4px; padding-right:4px;}
.padd-h-8{padding-left:8px; padding-right:8px;}
.padd-h-16{padding-left:16px; padding-right:16px;}
.padd-h-24{padding-left:24px; padding-right:24px;}
.padd-h-32{padding-left:32px; padding-right:32px;}
.padd-h-48{padding-left:48px; padding-right:48px;}
.padd-v-0{padding-top:0px; padding-bottom:0px;}
.padd-v-4{padding-top:4px; padding-bottom:4px;}
.padd-v-8{padding-top:8px; padding-bottom:8px;}
.padd-v-16{padding-top:16px; padding-bottom:16px;}
.padd-v-24{padding-top:24px; padding-bottom:24px;}
.padd-v-32{padding-top:32px; padding-bottom:32px;}
.padd-v-48{padding-top:48px; padding-bottom:48px;}
.padd-t-0{padding-top:0px;}
.padd-t-4{padding-top:4px;}
.padd-t-8{padding-top:8px;}
.padd-t-16{padding-top:16px;}
.padd-t-24{padding-top:24px;}
.padd-t-32{padding-top:32px;}
.padd-t-48{padding-top:48px;}
.padd-b-0{padding-bottom:0px;}
.padd-b-4{padding-bottom:4px;}
.padd-b-8{padding-bottom:8px;}
.padd-b-16{padding-bottom:16px;}
.padd-b-24{padding-bottom:24px;}
.padd-b-32{padding-bottom:32px;}
.padd-b-48{padding-bottom:48px;}
.padd-l-0{padding-left:0px;}
.padd-l-4{padding-left:4px;}
.padd-l-8{padding-left:8px;}
.padd-l-16{padding-left:16px;}
.padd-l-24{padding-left:24px;}
.padd-l-32{padding-left:32px;}
.padd-l-48{padding-left:48px;}
.padd-r-0{padding-right:0px;}
.padd-r-4{padding-right:4px;}
.padd-r-8{padding-right:8px;}
.padd-r-16{padding-right:16px;}
.padd-r-24{padding-right:24px;}
.padd-r-32{padding-right:32px;}
.padd-r-48{padding-right:48px;}

.nowrap{white-space: nowrap;}

.float-right{float:right;}
.float-left{float:left;}

.text-center{text-align:center;}
.text-right{text-align:right;}
.text-left{text-align:left;}

.font-xs{font-size: 0.6em; }
.font-s{font-size: 0.8em; }
.font-m{font-size: 1em;}
.font-l{font-size:1.3em;}
.font-xl{font-size:2em;}
.font-xxl{font-size:2.8em;}

.width-max{width:100%;}
[class^=absolute-].width-max{width:auto; left:0; right:0;}
.height-max{height:100%;}

.overflow-hidden{overflow:hidden;}
.overflow-auto{overflow:auto;}
.overflow-y-scroll{overflow-y:scroll;}

.relative{position:relative;}
.absolute{position:absolute; margin: 0 auto;left:0; right:0;}
[class=absolute-]{position:absolute;}
.absolute-top{top:0;}
.absolute-bottom{bottom:0;}

.top{top:0;}
.vertical-center{
    position:relative;
    top:50%;
    transform: translateY(-50%);
}

.visibility-hidden{visibility: hidden;}

.clicktrough{pointer-events:none;}

[class^=zindex]{position:relative;}
.zindex-1{z-index:1;}
.zindex-2{z-index:2;}
.zindex-3{z-index:3;}

.block{display: block;}
.inline{display: inline;}
.inline-block{display: inline-block;}

.invisible{
    position:absolute;
    visibility:hidden;
}

.overlay, .cover{
    position:absolute;
    top:0; left:0; right:0; bottom:0;
    margin: 0 auto;
}
.cover-win{
    position:fixed;
    top:0; left:0; right: 0; bottom:0;
    width:100%; width: 100vw;
    height:100%; height:100vh;
}

.round{border-radius:50%;}

/*FLEX!*/

.flex{
    display: flex;
}
.flex > div{
    /*align-items: stretch;*/
    min-height: 100%;
}
.lg-hide{
    position:absolute;
    visibility:hidden;
}
.lg-show{
    visibility: visible;
}



/* md */
@media (max-width: 1200px)  {
    .md-hide{display:none;}
}

/* sm */	
@media (max-width: 768px) {
    .flex{
        display: block;
    }
    .sm-hide{display:none;}
    .lg-hide{
        position:initial;
        visibility:visible;
    }
    .lg-show{
        position:absolute;
        visibility: hidden;
    }
    .cell-1,
    .cell-2,
    .cell-3,
    .cell-4,
    .cell-5,
    .cell-6,
    .cell-7,
    .cell-8,
    .cell-9,    
    .cell-10,
    .cell-11,
    .cell-12{width:100%;}
    .sm-cell-12{width:100%;}
    .sm-cell-6{width:50%;}
    .sm-cell-4{width:33.333%;}
    .sm-cell-3{width:25%;}
    .padd-32{padding: 16px;}
    .padd-h-32{padding: 16px;}
    .padd-h-48{padding-left: 16px; padding-right: 16px;}
}
