/* basics */


html,
body {
    width: 100%;
    height: 100%;
}

body {
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

.r100 {
padding:5px;
height:auto;
max-width:100%;
}

/* maxes */


.max {
max-width:420px;
margin:0 0 0 15%;
text-shadow: 1px 1px 3px #444;
}


.readmax p {
max-width:660px;
margin: 0 auto;
padding:0 0 20px;
}


.readmax p.caption {
max-width:1170px;
text-indent:0;
margin: 0 auto;
padding:10px 0;
}

.readmax p.year {
display:block;
font-family: "Abril Fatface" !important;
font-style: normal;
font-weight: 400;
color: #b1b1b1;
margin:0;
padding:0;
font-size:48px;
line-height:48px;
}



img.responsive {
width:100%;
max-width:100%;
height:auto;
}



.vendor {
margin:0 auto;
}


.vendor {
    margin-bottom: 10px;
    padding: 1%;
}
iframe, embed, object {
    width: 100%;
}
.unsupported {
    background: none repeat scroll 0 0 #CCCCCC;
}



.video-caption {
display:inline-block;
font-weight:400;
font-size:14px;
line-height:20px;
text-align: justify;
padding:0;
margin:0 15px 20px;
color:#ffffff;
font-family: "myriad-pro",sans-serif;
}

h4.video {
font-size:1.30em;
font-family: "myriad-pro",sans-serif;
font-style: normal;
font-weight: 300;
margin:10px 15px 10px;
text-transform: none;
}


h4.video a:link, .video-caption a:link, .video-caption a:visited, h4.video {
color: #ffffff;
text-decoration: none;
}



a.homelink {
text-align:left;
display:block;
border:0;
padding:30px 0 30px 0;
margin:0;
color:#fff;
font-size:14px;
width:100%;
text-align:center;
overflow:hidden;
}

a.homelink:hover {
background-color: rgba(200,255,255,0.10);
}


.fa-fw {
color:#444;
}



.fa-twitter:hover {color:#00aced;}
.fa-facebook:hover {color:#3b5998;}
.fa-google-plus:hover {color:#dd4b39;}
.fa-linkedin:hover {color:#007bb6;}
.fa-pinterest:hover {color:#cb2027;}
.fa-youtube:hover {color:#bb0000;}
.fa-linkedin:hover {color:#007bb6;}
.fa-instagram:hover {color:#517fa4;}
.fa-vine:hover {color:#00bf8f;}
.fa-flickr:hover {color:#ff0084;}
.fa-rss:hover {color:#f05a28;}
.fa-vimeo:hover {color:#aad450;}





/* Custom Horizontal Rule */

hr.small {
    max-width: 100px;
}






/* Side Menu */

#sidebar-wrapper {
    z-index: 1000;
    position: fixed;
    right: 0;
    width: 250px;
    height: 100%;
    margin-right: -250px;
    overflow-y: auto;
    background: #cc0000;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.sidebar-nav {
    position: absolute;
    top: 0;
    width: 250px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sidebar-nav li {
    text-indent: 20px;
    line-height: 40px;
}

.sidebar-nav li a {
    display: block;
    text-decoration: none;
    color: #ffffff;
}


.sidebar-nav li ul li {
    text-indent: 30px;
    line-height: 40px;
    border-bottom:1px solid #ff6600;
}

.sidebar-nav li ul li a {
    display: block;
    text-decoration: none;
    color: #c3c3c3;
    font-weight:normal;
}



.sidebar-nav li a:hover {
    text-decoration: none;
    color: #42342c;
    background: rgba(255,204,8,0.9);
}

.sidebar-nav li a:active,
.sidebar-nav li a:focus {
    text-decoration: none;
}

.sidebar-nav > .sidebar-brand {
    height: 55px;
    font-size: 18px;
    line-height: 55px;
}

.sidebar-nav > .sidebar-brand a {
    color: #999;
}

.sidebar-nav > .sidebar-brand a:hover {
    color: #fff;
    background: none;
}

#menu-toggle {
    z-index: 1;
    position: fixed;
    top: 0;
    right: 0;
}

#sidebar-wrapper.active {
    right: 250px;
    width: 250px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.toggle {
    margin: 5px 5px 0 0;
}




.sidebar {
    margin-bottom: 40px;
    margin-top: 60px;
}
.sidebar ul {
    list-style: outside none none;
}
.sidebar ul li ul {
    list-style: outside none none;
}
.sidebar ul li {
    border: 0 none;
    font-family: "myriad-pro",sans-serif;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    margin: 0;
    padding: 0;
}
.sidebar ul li a {
    border-bottom: 1px dotted rgba(177, 177, 177, 0.2);
    color: #444444;
    display: block;
    line-height: 16px;
    padding: 12px 0;
}
.sidebar ul li a:hover {
    border-bottom: 1px dotted rgba(177, 177, 177, 0.4);
    text-decoration: none;
}
.sidebar ul li ul li {
    color: #0069b2;
}
.sidebar ul li ul li a:hover {
    border-bottom: 1px dotted rgba(177, 177, 177, 0.3);
    text-decoration: none;
}
.sidebar li.active {
    color: #ca0813;
    text-decoration: none;
}
.sidebar ul li.active a {
    color: #ca0813;
    font-weight: 700;
}
.sidebar ul li.active ul li a {
    color: #ca0813;
    font-family: "myriad-pro",sans-serif;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    text-transform: none;
}
.sidebar ul li.active ul li a::before {
    color: rgba(0, 0, 0, 0.3);
    content: "...";
    font-size: 14px;
    font-weight: 300;
    padding-right: 6px;
}
.sidebar ul li.active ul li.active a {
    color: #ca0813;
    font-family: "myriad-pro",sans-serif;
    font-style: normal;
    font-weight: 600;
    margin: 0;
    text-decoration: none;
}


/* Header */

.header {
display: table;
position: relative;
width: 100%;
height: 100%;
background: #707474;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
}


.header h3 {
padding-top:40px;
}


.header-narrow {
display: table;
position: relative;
width: 100%;
height: 80px;
background:#3d3f45;
}




.header-narrow #cd-logo {
    left: 5%;
    position: absolute;
    top: 20px;
}
.header-narrow #cd-logo {
    margin-bottom: 3em;
}


.text-vertical-center {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}


.text-home {
display: table-cell;
text-align: left;
vertical-align: top;
max-width:640px;
}



.text-vertical-center h1 {
    margin: 0;
    padding: 0;
}


h1 .maxhomelogo {
width:100%;
max-width:320px;
margin:5% 0 0 15%;
}




@media(max-width:800px) {

h1 .maxhomelogo {
width:100%;
max-width:300px;
margin:5% 0 0 5%;
}

.max {
margin:2% 0 0 5%;
max-width:340px;
text-shadow: 1px 1px 3px #444;
}

h3.max p {
font-size: 0.8em;
line-height: 1.00;
margin: 0 0 20px;
white-space: normal;
}

}







@media(max-width:480px) {

h1 .maxhomelogo {
width:100%;
max-width:160px;
margin:5% 0 0 5%;
}

.max {
margin: 280px 0 0 20px;
max-width: 90%;
text-shadow: 1px 1px 3px #444;
}

h3.max p {
font-size: 0.8em;
line-height: 1.00;
margin: 0 0 20px;
white-space: normal;
}

}



.maxlogosmall {
width:100%;
max-width:150px;
}


/* for the home page header */

.full-footer {
background-image: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
bottom: 0;
color: white;
font-size: 48px;
left: 0;
padding-bottom: 25px;
padding-top: 25px;
position: absolute;
right: 0;
text-align: center;
}




a:hover, a:focus {
text-decoration:none;
}





/* Sections */


.section {
width:100%;
margin:0;
padding:0;
}

.section-pad {
padding: 60px 0 40px 0;
}


.section-pad .caption {
color: #444;
}

.caption {
margin: 15px 0 10px 0;
}


.dark {
background: #3d3f45;
}

.orange {
background:#f05a28;
}

.dkgray {
background:#333333;
}

.teal {
background:#008daf;
}

.ltgray {
background:#d1d2d4;
}

.sameas {
background:#3d3f45;
}



.wallpaper2 {
display: table;
position: relative;
width: 100%;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
}

.wallpaper3 {
display: table;
position: relative;
width: 100%;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
}







/* Callout */

.callout {
    display: table;
    width: 100%;
    height: 400px;
    color: #fff;
    background: url(../img/callout.jpg) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}



/* Portfolio */

.portfolio {
    padding: 0 0 0 0;
    background: #ffffff;
}

.portfolio-item {
    margin: 0;
}

.img-portfolio {
    margin: 0 auto;
}

.img-portfolio:hover {
    opacity: 0.8;
}




/* Map */

#map_canvas {
height: 500px;
width: 100%;
}



@media(max-width:768px) {
#map_canvas  {
        height: 75%;
    }
}

/* Footer */

footer {
    padding: 100px 0;
}