/* splash page */

*,
*:before,
*:after {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
html, body {
  height:100%; /* allows us to size the header height based as a percent */
}


body {
    margin: 0;
    padding: 0;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 1.5;
    color: #666;
    overflow-x: hidden;
    background-color: #FFF;
    -webkit-font-smoothing: antialiased!important;
    -moz-osx-font-smoothing: grayscale!important;
}

article, 
aside, 
details, 
figcaption, 
figure, 
footer, 
header, 
hgroup, 
main, 
menu, 
nav, 
section, 
summary {
  display: block;
}

img {
    border: 0;
    max-width: 100%;
    vertical-align: middle;
}

.img { margin: 0 auto; display: block;}

a, area {
    border: 0;
    outline: none;
    cursor: pointer;
    text-decoration: none;
}
div,ul, li {
    list-style: none;
    margin: 0;
    padding: 0;
}
.vertical-center {
    display: table;
    width:100%;
    height: 100%;
}
.content-vertical-top {
    display: table-cell;
    vertical-align: top;
}
.content-vertical-center {
    display: table-cell;
    vertical-align: middle;
}
.content-vertical-bottom {
    display: table-cell;
    vertical-align: bottom;
}
.splash-page { 
    position: fixed;
    width: 100%; height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.splash-page .splash-content { 
    max-width: 1200px; 
    height: 100%;
    padding: 0 40px;
    margin:0 auto;
    overflow: hidden;
}
.splash-page .row-col { font-size: 0; }
.splash-page .col-img { width:45%; display: inline-block; text-align: center; vertical-align: middle;}
.splash-page .col-content { width:55%; display: inline-block; vertical-align: middle; text-align: center;}
.splash-page .a-action { margin-top: 40px;}
.splash-page .btn { 
    height:40px;
    line-height:40px;
    padding: 0 25px;
    font-size:16px;
    font-weight: 400;
     -webkit-border-radius: 4;
    -moz-border-radius: 4;
    border-radius: 4px;
    cursor: pointer;
    text-align: center;
    display: inline-block;
    white-space: nowrap;
    vertical-align: middle;
    text-decoration: none;
    color: #FFF; 
    background: #c9973b;
    background-image: -webkit-linear-gradient(top, #c9973b, #a1610c);
    background-image: -moz-linear-gradient(top, #c9973b, #a1610c);
    background-image: -ms-linear-gradient(top, #c9973b, #a1610c);
    background-image: -o-linear-gradient(top, #c9973b, #a1610c);
    background-image: linear-gradient(to bottom, #c9973b, #a1610c);
    touch-action: manipulation;
    -ms-touch-action: manipulation;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    margin:10px 15px;
}
.splash-page .btn:hover { opacity: 0.9;}
.splash-page .btn.btn-white { 
    background: #fff;
    background-image: -webkit-linear-gradient(top, #fff, #eee);
    background-image: -moz-linear-gradient(top, #fff, #eee);
    background-image: -ms-linear-gradient(top, #fff, #eee);
    background-image: -o-linear-gradient(top, #fff, #eee);
    background-image: linear-gradient(to bottom, #fff, #eee);
    color: #000;}
.splash-page .btn.btn-brown { 
     background: #f2be83;
    background-image: -webkit-linear-gradient(top, #f2be83, #e29838);
    background-image: -moz-linear-gradient(top, #f2be83, #e29838);
    background-image: -ms-linear-gradient(top, #f2be83, #e29838);
    background-image: -o-linear-gradient(top, #f2be83, #e29838);
    background-image: linear-gradient(to bottom, #f2be83, #e29838);
    color: #FFF;
}

@media screen and (max-width:1140px) {
    
    .splash-page .row-col { padding: 40px 0;}
    
    .splash-page .col-img img,
    .splash-page .col-content img { width:95%;}
}

@media screen and (max-width:767px) {
    
    .splash-page { position: relative; height: auto;}
    .splash-page .col-img ,
    .splash-page .col-content  { display: block; width: 100%;}
    .splash-page .col-img { margin-bottom:20px;}
    
    .splash-page .col-img img { width:75%;}
    
    .splash-page .btn { margin: 10px 6px;}
}