/*--------------------
TABLE OF CONTENTS
01. Base Styles
02. Typography/Link Styles
03. Header Styles
04. Navigation Styles
05. Content Styles
06. Footer Styles
*/


@font-face {
    font-family: 'vincentia';
    src: url('../fonts/vincentia-webfont.eot'); /* IE9 Compat Modes */
    src: url('../fonts/vincentia-webfont.eot?') format('eot'), /* IE6-IE8 */
        url('../fonts/vincentia-webfont.woff') format('woff'), /* Modern Browsers */
        url('../fonts/vincentia-webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
        url('../fonts/vincentia-webfont.svg#vincentia-webfont') format('svg') /* Legacy iOS */
}

/*======================
01. BASE STYLES
========================*/

body {
    font:100%/1.4 'Montserrat', sans-serif;
    color:#3c3c3c;
}

img {max-width:100%;}

.container {
    width:95%;
    margin:0 auto;
    max-width:1200px;
    position:relative;
}

.column {
    float:left;
    margin:0 1%;
}

/*USE class="row" to add "padding" to top and bottom of a section area. */

.row {
    width:100%;
    padding:50px 0;
    display:inline-block;
}

.teal {
    background:#7687a0;
}
.red {
	background:#f6c5ae;
}
.orange {
	color:#D07E58;
}
.yellow{
    color: #f6c5ae;
}

.text {padding-top:15px;}

.grid12 {width:98%;}
.grid11 {width:89.6667%;}
.grid10 {width:81.3333%;}
.grid9 {width:73%;}
.grid8 {width:65%;}
.grid7 {width:56.3333%;}
.grid6 {width:48%;}
.grid5 {width:39.6667%;}
.grid4 {width:31%;}
.grid3 {width:23%;}
.grid2 {width:14.6667%;}
.grid1 {width:6.3333%;}

.clear {clear:both;}

.alignleft {
    float:left;
    margin-right:20px !important;
}

.alignright {
    float:right;
    margin-left:20px !important;
}

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

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

blockquote {
    color:#7687a0;
    font-size: 1.8em;
    width:33%;
    margin:0 0 0 50px;
    padding:0;
    float: right;
}

hr {
    border:0;
    height:1px;
    background:#debdaf;
    padding:0;
    margin-top:35px;
    margin-bottom:35px;
}

video::-webkit-media-controls-start-playback-button {
    display: none;
}

a.screenreader-text {
    left:-999px;
    position:fixed;
    top:auto;
    width:1px;
    height:1px;
    overflow:hidden;
    z-index:-999;
    transition: none;
}

a.screenreader-text:focus, a.screenreader-text:active {
    color: #000;
    background-color:#fff;
    left: 0;
    right: 0;
    top: auto;
    width: 25%;
    height: auto;
    overflow:auto;
    margin: 10px auto;
    padding:5px;
    text-align:center;
    font-size:1em;
    border: 2px solid #000;
    text-decoration: none;
    z-index:9999;
}

/*======================
02. TYPOGRAPHY/LINK STYLES
========================*/

h1 {
    font-size:4em;
    line-height:1.2em;
    padding-bottom:0;
    font-family: 'vincentia', cursive;
    margin-bottom: 20px;
}

h1,h2,h3,h4,h5,h6 {

    color: #7687a0;
    font-weight: normal;
    padding-bottom:0;
}

h2,h3,h4,h5,h6 {
    font-family: inherit;
    margin-bottom: 20px;
}

h2 {font-size:2.5em;}
h3 {font-size:2.1em;}
h4 {font-size:1.7em;}
h5 {font-size:1.4em;}
h6 {font-size:1em;}

.support h2,.support h3,.support h3,.support h4 {
    padding-bottom:0;
}

h2 strong {
    color:#d07e58;
    font-weight:700;
}

.content h2, .content h3, .content h4, .contenth5, .content h6{
    padding-bottom: 0;
}

a {
    color:#d07e58;
    transition:0.5s all ease;
}

a:hover {color:#7687a0;}

p {
    line-height:1.7em;
}

.column li {
    line-height:1.7em;
}

a.button {
    background: #f6c5ae;
    color:#333;
    display:inline-block;
    text-decoration:none;
    margin:15px 0;
    text-transform: uppercase;
	font-weight:600;
    font-size:1em;
    padding: 18px 12px;
	color:#647390;
}

a.button:hover {
    background: #D1E5DE;
	color:#647390;
}

a.white {color:#fff;}

a.button i {margin-left:15px;}

/*======================
03. HEADER STYLES
========================*/

header{
    position: relative;
}
header:after{
    content: '';
    display: inline-block;
    width: 100%;
    height: 16px;
    background: url(../img/triangle-white.png) repeat-x;
    position: absolute;
    bottom: -16px;
    z-index: 100;
}
header .container{
    max-width: inherit;
    width: 95%;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    -webkit-align-items: center; /* Safari 7.0+ */
}
.logo {
    /*    float: left;*/
}

header .logo img {
    margin:0 auto;
    display: block;
    max-height: 200px;
    padding: 5% 0;
	width: 100%;
	max-width: 300px;
}
.logo a{
    margin: 0;
    display: block;
}

/*======================
04. NAVIGATION STYLES
========================*/

.mobile {display:none;}

.navwrap {
    position:relative;
    z-index:999;
    /*    float:right;*/
    margin-left: auto;
}

.contact-info .social a{
    transition: 0.5s all ease;
    color: #7687a0;
}
.contact-info .social a .fa-inverse{
    color: #fff;
}
.contact-info .social a:hover {
    color:#d07e58;
}

.number {display:none;}

.navwrap > .social a .fa-circle {
    color:#32d7c5;
    transition:0.5s all ease;
}

.navwrap > .social a:hover .fa-circle {
    color:#f6c5ae;
}

nav {float:right;}

ul.navigation {
    list-style-type:none;
    padding-bottom:0;
}

ul.navigation:after {
    display:block;
    content:"";
    clear:both;
}

ul.navigation li {
    float:left;
    margin:0;
    padding:0;
    position:relative;
}

ul.navigation li:last-child ul{
    right: 0;
}
ul.navigation li:last-child:hover li a{
    text-align: right;
}

ul.navigation li a {
    display:block;
    text-decoration:none;
    color:#4b4b4b;
    line-height:137px;
    padding:0 18px;
    text-transform:uppercase;
    transition:0.5s all ease;
}

ul.navigation li:hover a {
    color:#7687a0;
}

/* DROPDOWN */

ul.navigation li ul {
    display: none;
}
ul.navigation li:hover ul {
    display: block;
    margin-left: 0;
    position: absolute;
    top: 137px;
    z-index: 9999;
    list-style-type:none;
}
ul.navigation li:hover li {
    float: none;
    white-space: nowrap;
    width: 100%;
    background:none;
}

ul.navigation li:hover li a {
    background: #fff;
    color: #4b4b4b;
    display: block;
    margin:0;
    height: auto;
    text-align: left;
    font-size:1em;
    line-height:2.7em;
    padding:0 20px 0 15px;
    border:0;
}
ul.navigation li:hover li a:hover {
    color: #debdaf;
}

/*======================
05. CONTENT STYLES
========================*/

.full-header{
    position: relative;
    max-height: 700px;
    overflow: hidden;
}
.home .full-header h1{
	color: #7688A1;
}
.full-header h1{
    font-size: 7em;
    color: #fff;
}
.home .full-header h2{
	color: #7688A1;
}
.full-header h2{
    font-size: 2em;
    color: #fff;
}
.full-header p{
    font-size: 2em;
}
#slideshow{
    padding: 0;
}
#slideshow li{
    margin: 0;
    list-style-type: none;
}
#slideshow img{
    display: block;
}
#slideshow video{
    display: block;
    width: 100%;
}
.full-header .overlay{
    position: absolute;
    top: 30%;
    left: 0;
    right: 0;
    text-align: center;
    color: #fff;
}

.contact-info{
    color: #7687a0;
    line-height: 106px;
}
.contact-info .container{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.contact-info .container > div{
    margin-left: 1%;
    margin-right: 1%;
}
.contact-info .phone{
    color: #647390;
    text-decoration: none;
    font-size: 2em;
    font-weight: 600;
    display: block;
}

body.home #welcome h2{
    font-size: 6em;
    text-transform: uppercase;
    color: #d07e58;
    line-height: 1em;
    font-family: inherit;
}
#welcome h2 span{
    font-weight: 700;
    color: #7687a0;
}
.content{
    position: relative;
    z-index: 10;
}
.content h2{
    color: #d07e58;
    font-family: inherit;
}
.content h4{
    color: #7687a0;
}
.content h3, .content h5, .content h6{
    color: #7687a0;
}
.sidebar {
    float:right;
    background:#d07e58;
    padding:15px 35px;
    text-align: center;
    margin-left:25px;
    margin-bottom:20px;
}
.sidebar h3 {
	color:#fff;
}

.sidebar a {color:#fff;}

/* ::: Tour Styles ::: */
.tour{
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
}
.tour{
   text-align: center;
}
.tour img{
   margin: auto;
}
.tour .column{
   max-width: 560px;
}

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* Meet The Team Styles */
.staff-photos{
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;

}
.staff{
    text-align: center;
    margin: 0 10px 5px 5px;
    float: left;
    overflow: hidden;
    position: relative;
    text-align: center;
    cursor: default;
    -webkit-transition: all .75s ease-in-out;
    -moz-transition: all .75s ease-in-out;
    -o-transition: all .75s ease-in-out;
    transition: all .75s ease-in-out;
}
.staff .overlay {
    width: 320px;
    height: 320px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
    -webkit-transition: all 0.4s  cubic-bezier(0.88,-0.99, 0, 1.81);
    transition: all 0.4s  cubic-bezier(0.88,-0.99, 0, 1.81);
}
.staff:hover .overlay {
    background-color: rgba(179, 102, 66, 0.4);
}
.staff img{
    display: block;
    position: relative;
    width: 320px;
    height: 320px;
}
.staff h3,
.staff h4{
    text-align: center;
    position: relative;
    -webkit-transition: all 0.4s  cubic-bezier(0.88,-0.99, 0, 1.81);
    transition: all 0.4s  cubic-bezier(0.88,-0.99, 0, 1.81);
}
.staff:hover h3,
.staff:hover h4{
    -webkit-transform: translateY(-175px);
    -ms-transform: translateY(-175px);
    transform: translateY(-175px);
}

/* FORM STYLES */

#form .clear {clear:both;}
#form .center {text-align:center;}
#form h3 {margin:0 1%;}
#form small {font-style:italic;}
#form hr {width:98%;margin:10px 1% 15px 1%;}

/*GRID */
#form .column {
    float:left;
    margin:0 1%;
}

#form .full {width:98%;margin:0 1%;}
#form .half {width:48%;}
#form .twothird {width:65%;}
#form .onethird {width:31%;}

#form input:not([type=submit]):not([type=checkbox]):not([type=radio]) {
    width:96%;
    padding:10px 2%;
}

#form input[type=radio] {
    margin-bottom:5px;
}

#form textarea {
    width:96%;
    resize:none;
    padding:10px 2%;
    font:95%/1.4 'Tahoma',sans-serif;
}

#form select {
    width:101%;
    padding:10px 2%;
}

#form input:not([type=submit]):not([type=checkbox]):not([type=radio]) {
	width:50%;
}

/*======================
06. FOOTER STYLES
========================*/

#pre-footer{
    background: #bbd5cf;
    padding-top: 300px;
    margin-top: -280px;
    position: relative;
}
#pre-footer:before{
    content: '';
    display: inline-block;
    width: 100%;
    height: 16px;
    background: url(../img/triangle-white.png) repeat-x;
    position: absolute;
    top: 0;
}
#pre-footer .container{
    width: 80%;
    max-width: inherit;
}
#pre-footer .quick{
    width: 95%;
    margin: auto;
    position: relative;
    top: -270px;
}
#pre-footer h2{
    font-size: 6em;
    text-transform: uppercase;
    color: #d07e58;
    line-height: 1em;
    font-family: inherit;
}
#pre-footer h2 span{
    font-weight: 700;
    color: #7687a0;
}
#pre-footer h4{
    color: #7687a0;
}

/* Quicklinks */

ul.quick {
    list-style-type:none;
    padding-bottom:0;
    display:block;
    width:100%;
    margin-top:20px;
}

ul.quick:after{
    clear: both;
    content: '';
    display: block;
}

ul.quick li {
    float:left;
    margin:0;
    padding:0;
    position:relative;
    width:32.6667%;
    margin-right:1%;
}

ul.quick li img{
    opacity: .7;
    transition:0.5s all ease;
}
ul.quick li img:hover{
    opacity: 1;
}

ul.quick li span{
    position: absolute;
    top: 40%;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 2em;
}

ul.quick li a {
    display:block;
    text-decoration:none;
    color:#b36642;
    font-size:1.3em;
    line-height:2em;
    text-transform:uppercase;
    transition:0.5s all ease;
    text-align: center;
}

ul.quick li:last-child {
    margin-right:0;
}

footer {
    font-size:0.85em;
    color: #3c3c3c;
    background:#fff;
    display:block;
    position: relative;
    padding-top: 30px;
}

footer a{
    color: #3c3c3c;
    text-decoration:underline;
    transition:0.5s all ease;
}

footer:after{
    content: '';
    display: inline-block;
    width: 100%;
    height: 16px;
    background: url(../img/triangle-yellow.png) repeat-x;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    border-top: 22px solid #7687a0;
}

footer .copyright {
    background:#313d43;
    padding:0 10%;
    float:left;
    width:25%; /*45%-20% padding*/
}

footer .copyright img {
    vertical-align:middle;
    margin-left:10px;
}

footer .contact {
    background:#2a363c;
    padding:0 10%;
    float:left;
    width:35%; /*55%-20% padding*/
}

footer h2{
    font-family: 'vincentia', cursive;
    color: #3c3c3c;
}

ul.sitemap {
    list-style-type:none;
}

ul.sitemap li {
    display:block;
    margin:0;
    padding:3px 0;
}

ul.sitemap li a {
    display:block;
    text-decoration:none;
    text-transform:uppercase;
    transition:0.5s all ease;
}

footer a:hover,ul.sitemap li a:hover {color:#32bbfd;}

footer address {
    font-style:normal;
    line-height:1.6em;
    float:left;
    margin-right:40px;
}

footer .social {
    float:left;
    line-height:1.4em;
}

footer .social a .fa-circle {
    color:#3c3c3c;
    transition:0.5s all ease;
}

footer .social a:hover .fa-circle {
    color:#32bbfd;
}

footer .social a .fa-inverse {
    color:#fff;
}

.windowtop {
    display: inline-block;
    height: 40px;
    width: 40px;
    position: fixed;
    bottom: 40px;
    right: 30px;
    overflow: hidden;
    text-indent: 100%;
    background: #d07e58 url('../img/top-arrow.png') no-repeat center 50%;
    visibility: hidden;
    opacity: 0;
    border-radius:50%;
    z-index:9999;
    transition:0.5s all ease;
    cursor:pointer;
}

.windowtop.cd-is-visible {
    /* the button becomes visible */
    visibility: visible;
    opacity: 1;
}

.no-touch .windowtop:hover {
    background-color: #d07e58;
    opacity: 1;
}

/*======================
MEDIA QUERIES
========================*/

@media (max-width:1600px) {
    .container {
        width:85%;
    }

    ul.navigation li a{
        padding: 10px 0;
        font-size: 1em;
    }

    nav ul.navigation li a {
        font-size:1em;
        padding:0 16px;
    }

    ul.navigation li:hover ul {top:88px;}

    ul.quick li a {
        font-size:1em;
    }

    .row {padding:25px 0;}

    .text {padding-top:0;}

    footer .copyright {
        padding:0 5%;
        width:35%; /*45%-10% padding*/
    }

    footer .contact {
        padding:0 5%;
        width:45%; /*55%-10% padding*/
    }
}

@media (max-width: 1200px) {

    .desktopmenu{
        display: none !important;
    }
	
	.alignright {
		margin-left:10px !important;
	}
    .mobile{
        display: block;
        line-height:137px;
        cursor: pointer;
        text-align:center;
        color:#232323;
        float:right;
        text-decoration:none;
        text-transform: uppercase;
        padding: 0 20px 0 40px;
    }
    a.mobile:hover {color:#232323;}

    #menu .inner {
        padding:4em 0;
        /*Adjust Padding to reposition Close Button */
    }

    #menu .close {
        background-image: url("../img/close.svg");
        background-position: 75% 25%;
        background-repeat: no-repeat;
        background-size: 4em 4em;
        border: 0;
        content: '';
        display: block;
        height: 4em;
        overflow: hidden;
        position: absolute;
        right: 1em;
        text-align: center;
        text-indent: 8em;
        top: 1em;
        width: 4em;
    }
    #menu ul {
        list-style: none;
        padding: 0;
    }
    #menu li {
        padding: 0;
    }
    #menu li ul{
        display: none;
    }
    /*ADJUST FONT SIZE AND PADDING BELOW FOR MOBILE MENUS WITH MORE ITEMS */
    #menu li a {
        border: 0;
        display: block;
        font-size: 1.7em; /* Reg: 1.8em*/
        padding: 0.4em 0; /* Reg: 0.5em 0 */
        text-transform: uppercase;
        text-decoration: none;
        color:#fff;
    }

    #menu li a:hover {background:none;}

}

@media screen and (max-width:1000px){
    .desktop{
        display: none;
    }
    .grid1,.grid2,.grid3,.grid4,.grid5,.grid6,.grid7,.grid8,.grid9,.grid10,.grid11,.grid12 {
        width:100%;
        margin:0;
    }

    #form .column {
        float:none;
        margin:0;
    }
    #form .full, #form .half, #form .twothird, #form .onethird {
        width:98%;margin:0;
    }

    .container img, .containerfull img {
        display:block;
        margin:0 auto 10px auto;
    }

    .containerfull .welcome img {margin:0 auto;}

    a.button {
        margin:0 0 20px 0;
    }
    footer{
        text-align: center;
    }
    footer .copyright, footer .contact {
        float:none;
        width:90%;
    }
    footer address{
        float: none;
        margin: auto;
    }
    footer .social{
        float: none;
        margin: auto;
    }
    .full-header h1{
        font-size: 3em;
    }
    .full-header p{
        font-size: 1em;
    }
    body.home #welcome h2{
        font-size: 4em;
    }
    blockquote{
        float: none;
        width: auto;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 15px;
    }
    .social{
        text-align: center;
    }
    .contact-info{
        line-height: 60px;
        padding: 30px 0;
    }
    .contact-info .phone{
        text-align: center;
    }
    #slideshow img{
        object-fit: cover;
        min-height: 160px;
    }
}

@media screen and (max-width:800px) {
    .alignleft, .alignright {
        float:none;
        display:block;
        margin:0 auto !important;
        padding-bottom:20px;
    }
    hr {
        margin-top:0px;
    }
    .logo {
        width:auto;
        height:auto;
        background:none;
        position:relative;
        top:0;
        left:0;
    }

    .logo img {
        width:80%;
        max-width:200px;
        padding-top:30px;
        padding-bottom:30px;
    }

    .mobile {width:70px;}

    .navwrap {float:none;}

    .fa-stack {width:1.7em;}

    .fa-lg {font-size:1.1em;}

    ul.quick li {
        float:none;
        width:100%;
        margin-right:0;
        margin-bottom:5px;
    }

    .number {text-align:center;}

    .sidebar {
        float:none;
        margin-left:0;
    }
    /* For menus longer than the browser height, this adds scrolling starting from top */
    #menu {
        align-items:flex-start;
        -webkit-align-items:flex-start;
        -moz-align-items:flex-start;
        -ms-align-items:flex-start;
    }
    .full-header .overlay{
        top: 25%;
    }
    .sub .full-header .overlay{
        top: 40%;
    }
    .overlay .button{
        font-size: .8em;
        padding: 5px 12px;
    }
    footer .row.last{
        padding-top: 0;
    }
    h2, #welcome h2, #pre-footer h2{
        font-size: 2.5em;
    }
    .home .full-header h1{
        font-size: 2.5em;
    }
    .full-header h2{
        display: none;
    }
    _:-ms-fullscreen, :root #slideshow img { 
        height: auto;
    }
}

@media (max-device-width:570px) {
    /*For Iphone 5S and Smaller */
    #menu li a {
        border: 0;
        display: block;
        font-size: 1.4em; /* Reg: 1.8em*/
        padding: 0.2em 0; /* Reg: 0.5em 0 */
        font-weight:700;
        text-transform: uppercase;
        text-decoration: none;
        color:#fff;
    }
}