@charset "UTF-8";
/* CSS Document */

/* reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td { border:0; font-size:100%; margin:0; padding:0; }
a { outline:none; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
del,ins { text-decoration:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; font-variant:normal; }
sup,sub { vertical-align:baseline; }
legend { color:#000; }
input,button,textarea,select,optgroup,option { font-family:inherit; font-size:inherit; font-style:inherit; font-weight:inherit; }
input,button,textarea,select { font-size:100%; }

/* Clearfix */
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}

div, article, input, form, figure, header, main, footer, section, article {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;}

figure, figure img {margin: 0; padding: 0;}
figure img {width: 100%; height: auto;}

body {font-family:Calibri,'Calibri',Helvetica,Arial,sans-serif; font-size: 1em; height: 100%; color: rgba(0,0,0,1);}
body.fixed {height: 100%; overflow: hidden;}

/********** FORMAT **********/
h1, h2 {font-family:inherit; font-size: 1.125em; line-height: 1.25em;}
h1 {margin-bottom: 1rem;}

p {font-family:inherit; font-size: 1em; line-height: 1.5em;}

p.bold, .bold {font-family:inherit;}

.text p {margin-bottom: 0.5rem; }

.dark p {color: rgba(255,255,255,1);}

.big p, .big ul, .big ol {font-size: 1.125em;}
.big h1 {font-size: 1.5em;}

hr {width: 100%; height: 1px; border: none; background: rgba(177,219,210,1); margin: 2rem 0;}

.uppercase {text-transform: uppercase;}

.red {color: rgba(235,0,0,1);}

/********** LINKS **********/
a {text-decoration: none; color: rgba(0,0,0,0.6);
transition: color .3s, background .3s, border .3s; -moz-transition: color .3s, background .3s, border .3s; -webkit-transition: color .3s, background .3s, border .3s;}

a:hover, .dark a:hover {color: rgba(94,197,237,1);}

a.phone, a.phone:hover {cursor: default; color: rgba(0,0,0,1);}
.dark a.phone, .dark a.phone:hover {cursor: default; color: rgba(255,255,255,1);}

.dark a {color: rgba(255,255,255,1);}

/********** LAYOUT **********/
.wrapper {height:auto; margin:0 auto; max-width: 64em; width: 100%; position: relative;
-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;}

header {width: 100%; padding: 2rem 0 0 1rem;}

#logo {width: 100%;}
#logo img {width: 17.375rem; height: 3.25rem;}

main {width: 100%; height: 100%; position: relative; display: block;}

img {width: 100%; display: block;}

#main-content {padding: 1.5rem 1rem;}

footer {width: 100%; margin: 2.25rem 0 0 0; position: relative; background: rgba(255,255,255,1);}

.content {width: 100%; height: 100%; position: fixed; padding: 1.5rem 1rem; top: 0; z-index: 10; background:white; -webkit-overflow-scrolling: touch;}
.content .text {padding: 0 1rem;}

.dark {background: rgba(51,51,51,1); padding: 1rem 0;}
.third {padding: 0 1rem;}

.teaser {margin: 2rem 0;}

.close {width: 2rem; height: 2rem; position: absolute; top: 1.5rem; right: 1rem; cursor: pointer;}
.close:before, .close:after {width: 2rem; height: 0.25rem; content: ''; display: block; position: absolute; background: rgba(177,176,179,1);}
.close:hover:before, .close:hover:after {background: rgba(177,219,210,1);}
.close:before {-ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.close:after {-ms-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg);}

.marg-bottom {margin-bottom: 2rem;}

/* ALERT */
.overlay-dark {width: 100%; height: 100%; position: fixed; padding: 2rem 1rem; top: 0; z-index: 10; background: rgba(0,0,0,0.8); -webkit-overflow-scrolling: touch;}

.alert {max-width: 48em; margin:0 auto; width: 100%; position: relative;}
.alert .text {background: rgba(255,255,255,1); padding: 1rem; border: 0.125rem solid rgba(235,0,0,1);}

.close-small {width: 2rem; height: 2rem; position: absolute; top: -1rem; right: -1rem; background: rgba(20,20,20,1); cursor: pointer; border-radius: 50%; transition: transform .3s;}
.close-small:hover {-ms-transform: scale(1.2); -webkit-transform: scale(1.2); transform: scale(1.2);}

.close-small:before, .close-small:after {width: 75%; height: 0.125rem; content: ''; display: block; position: absolute; left: 50%; top: 50%; background: rgba(255,255,255,1);}
.close-small:before {-ms-transform: translate(-50%,-50%) rotate(45deg); -webkit-transform: translate(-50%,-50%) rotate(45deg); transform: translate(-50%,-50%) rotate(45deg);}
.close-small:after {-ms-transform: translate(-50%,-50%) rotate(135deg); -webkit-transform: translate(-50%,-50%) rotate(135deg); transform: translate(-50%,-50%) rotate(135deg);}

/********** NAVI **********/
ul#main-nav, ul {font-family:'Conduit ITC W01 Light', sans-serif; list-style-type: none; line-height: 1.5em;}
ul#main-nav li {display: block; border: none;}

/* responsiveness
--------------------------------------------- */

/* medium */
@media screen and (min-width:48em) {
/********** FORMAT **********/
header {padding: 4rem 0 0 1rem;}
#logo {width: auto;}

/********** LAYOUT **********/
.wrapper {max-width: 48rem;}
.third {width: 33.33%; float: left;}

.overlay-dark {padding-top: 5rem;}
}

/* large */
@media screen and (min-width:64em) {
/********** FORMAT **********/
.text ul li {display: inline; border-right: 1px solid rgba(0,0,0,1); padding: 0 0.25rem;}
.text ul li:first-of-type {padding: 0 0.25rem 0 0;}
.text ul li:last-of-type {border-right: none;}

/********** LAYOUT **********/
.wrapper {max-width: 64rem;}

.overlay-dark {padding-top: 7rem;}

/********** NAVI **********/
}

/* large */
@media screen and (min-width:94em) {
/********** LAYOUT **********/
.wrapper {max-width: 74rem;}

header {padding: 4rem 0 0 0;}
#main-content {padding: 1.5rem 0;}

.content .text {padding: 0;}
}
/* end responsiveness
--------------------------------------------- */
