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

body {
background: #2f2f2f url(images/bar.png) repeat-x center top;
margin:0 auto;
height: 100%;
color:#fff;
font-size:100%;
font-family:'montserratultra_light', "Helvetica Neue", Helvetica, Arial, sans-serif;
text-align: center;
letter-spacing:.05em;
padding: 0;
margin:0;}

p {
margin: 0 0 12px 0;
line-height: 140%;}
	
ul {margin:0 0 10px 10px;}

li {margin: 0 0 5px 13px;}

strong {
	font-family:'montserratbold', "Helvetica Neue", Helvetica, Arial, sans-serif;
	color:#406FB9;
	font-weight:normal;}

a, a:link, a:visited {
	color:#ed9614;
	text-decoration: none;}

a:hover {color:#fccd87;}
a:focus, a:active {color:#fccd87;}


/* responsive mostly fluid layout (each layout div has a class assigned which governs how the divs move when viewport size changes) */

   .container {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: -o-flex;
      display: flex;
      -webkit-flex-flow: row wrap;
	  -moz-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
      -o-flex-flow: row wrap;
      flex-flow: row wrap;
	  margin-left: auto;
      margin-right: auto;}
   

@media (min-width: 1400px) {
      .container {
        width: 1400px;
        margin-left: auto;
        margin-right: auto;}
    }
	 
 .c1 {width: 100%;} /*header*/
 .c2 {width:265px;} /*header h1*/
 .c3 {} /*nav*/
 .c4 {width: 100%;} /*content*/
 .c5 {width: 100%;} /*slideshow*/
 .c6 {width: 31%;} /*columns*/
 .c7 {width: 100%;} /*footer*/
 .c8 {width: 50%;} /*main*/
 .c9 {} /*side*/


#wrapper {
	padding:24px 0 0;
	clear:both;}

header {
	text-align: justify;
	padding: 0 8%;
	margin: 0;
	background: transparent;	}
	
header h1, header nav {display:inline-block;}
	
header h1 {
	color:#fff;
	font-family:'montserratlight', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:250%;
    height: 100%;
	margin:0;
	float:left;}
	
header h1 img {width:100%; height:auto;}


h1 {	
	font-family:'montserratultra_light', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:normal;
	margin:0 0 30px;
	font-size:220%;
	color:#ed9614;
	line-height:100%;}
	
.highlight {margin:0 0 10px; font-size:150%;}
	
h2 {	
	font-family:'montserratultra_light', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:normal;
	margin:30px 0 10px;
	font-size:160%;
	color:#ed9614;
	line-height:100%;}
	
h3 {	
	font-family:'montserratultra_light', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:normal;
	margin:20px 0 5px 0;
	font-size:140%;
	color:#ed9614;}
	
h4 {
	font-family:'montserratultra_light', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:normal;
	margin:0 0 15px;
	font-size:130%;
	color:#ed9614;}

h5 {
	font-family:'montserratultra_light', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:normal;
	margin: -5px 0 15px 0;
	line-height:120%;
	font-size:115%;	}

h6 {	font-size:90%;}


	
nav { 
	padding: 0;
	margin:20px 0 0;
	vertical-align: top;
	float:right;}

nav:after {
	content:"";
	display:table;
	clear:both;}

nav ul {
	display:inline-block;
	padding:0;
	margin:5px auto 0;
	list-style: none;
	position: relative;}
	
nav ul li {
	margin: 0;
	display:inline-block;
	padding: 0 5px;}
	
nav ul ul {
	display: none;
	position: absolute; 
	margin:0 0 0 -5px;
	text-align:left;
	top:100%;}
	/*top: 38px;} this relates to line height in nav a. if line height is not defined in nav a then default line height is being used */
	
nav ul li:hover > ul {display:inherit;}
	
nav ul ul li {
	width:180px;
	display:list-item;
	position: relative;}

nav a, nav a:link, nav a:visited {
	display:block;
	padding:8px 10px;
	color:#008eb9;
	font-size:125%;
	font-family:'montserratlight', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-transform:uppercase;
	letter-spacing:.05em;
	text-decoration:none;}

nav a:hover, nav .on a:hover {
	background-color: #fccd87;
	color:#008eb9;}	

.on a, .on a:link, .on a:visited {
	background: #ed9614;
	color:#fff;}
	
.submenu a, .submenu a:link, .submenu a:visited {
	text-transform:none; 
	background: #212221;
	color:#008eb9;
	padding:10px;
	font-family:'montserratultra_light', "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:110%;}
	
.submenu a:hover {background-color: #fccd87;}

.menu {display:none;}
.social {}
	
	
#content {
	text-align:left;
	margin: 30px 14% 40px 14%;	
	min-height:400px;
	max-width:1100px;}

#content p {	line-height:150%;}

#column {padding:0 8%;}

#main {float:left;}
#side, #side_about {float:right;}
#side {width: 48%;}
#side_about {width: 43%;}

.column_1, .column_2, .column_3, .column_4, .column_5 {min-height:120px;}

.column_4, .column_5 {margin: 30px 0 0;}

.column_1 {padding:0 1.75% 0 0; float:left;}
.column_2 {padding:0 1.75% 0 1.75%; float:left;}
.column_3 {padding:0 0 0 1.75%; float:left;}
.column_4 {padding:0 1.75% 0 0; float:left;}
.column_5 {padding:0 0 0 1.75%; float:left;}

.item_container {width:100%;}

.slideshow {margin: 0 0 40px 0;}
.slideshow img {width:100%; height:auto;}

.photo_r {float:right; margin:-15px 0 0 20px;}
.photo_l {float:left; margin:5px 0 0 0;}
.photo_c {width:100%; margin:30px 0 0 0;}

.photo_r img, .photo_l img, .photo_c img {width: 100%; height:auto; margin:20px 0 0;}
.photo_r p, .photo_l p, .photo_c p {font-size:90%; margin:0;}
.photo_r p, .photo_l p, .photo_c p {text-align:left;}

.pad {padding-bottom:30px; text-align:right;}

.clear {clear:both;}

.link img {vertical-align:middle;}	
.link {text-align:right;}


.space {padding:0 10px;}

.large img {	margin: 30px 0 0; }

.design {font-size:80%;}

.video_l, .video_r {width:48%;}
.video_l img, .video_r img {width: 100%; height:auto; margin:0;}

.video_l {float:left; margin: 0 10px 0 0;}
.video_r {float:right; margin: 0 0 0 10px;}
	

.googlemap {
        /*position: relative;*/
		margin-top: 50px;
        padding-bottom: 60px; /*4:3 ratio*/
        height: 100%;
        overflow: hidden;}

.googlemap iframe {
    /*position: absolute;*/
    top: 0;
    left: 0;
    width: 80% !important;
    height: 100% !important;}
	
.front {}

.form-group {margin-top:15px;}
label {margin-bottom:5px;}


#footer_container {
	position:fixed;
	bottom:0;
	left:0;
	background:#121413;
	clear:both;
	padding:10px 0;
	margin: 80px 0 0;}
	
#footer {
	font-family:'montserratultra_light', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-align:center;
	color:#008eb9;}
	
#footer p {margin:0; font-size:90%;}

#footer a, #footer a:link, #footer a:visited {
	color:#008eb9;
	text-decoration: none;}

#footer a:hover {color:#ed9614;}
#footer a:focus, #footer a:active {color:#ed9614;}

.f_hidden { }
.icon {visibility:hidden;position:absolute;}
.email img {vertical-align:middle; padding:0 0 2px;}
.copyright {
	visibility:hidden; 
	position:absolute;
	color:#008eb9; 
	margin:60px 0 15px; 
	font-size:90%;}

#circle {
	position:fixed;
	bottom:-5px;
	right:0;
	padding:0;
	z-index:-100;}
	
.do_or_question {color:#F801EA;}



/* contact form */

#contact {width:90%; margin-top:30px; text-align:left;}

#contact input, #contact textarea {
	display:block;
    font-size: 90%;
    padding: 8px 10px;
    width: 100%;}

#contact input, #contact textarea {
	font-family:'montserratultra_light', "Helvetica Neue", Helvetica, Arial, sans-serif;
    border: 1px solid #abb0b2;
    border-radius: 3px;}

.form-group label {margin-bottom:5px;}
.from-control {margin-top:5px;}

.indicates-required {font-size: 80%; text-align: right; margin-top:-20px;}
.asterisk {color:#e85c41; font-size:100%;}

.check {text-align:left;}
.check p {margin-bottom:0;}

#contact .check ul {list-style: outside none none; margin: 0; padding: 5px 0;}
#contact .check ul li {display: block; margin: 0; padding: 3px 0;}
#contact .check input {border: medium none; display: inline; width: auto;}

#contact .button {
    background-color: #ed9614;
    border: 0 none;
    border-radius: 4px;
    clear: both;
    color: #ffffff;
    display: inline-block;
	font-family:'montserratlight', "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 120%;
    font-weight: normal;
    line-height: 32px;
    margin: 15px 5px 10px 0;
    padding: 0 22px;
    text-decoration: none;
    width: 150px;}	

#contact .button:hover {background-color:#fccd87; color:#008eb9;}
#contact .button {cursor:pointer;}



/* modal box code */
#button {
	float:left;
    color: #ffffff;
    font-size: 18px;
    line-height: 20px;
    margin: 20px 20px 0 0;
    padding: 0;
    text-align: center;}
	
#button a, #button a:link, #button a:visited {
    background: #ed9614;
    color: #fff;
	padding: 5px 22px;
	border-radius: 4px;
    display: inline-block;
    font-weight: normal;
    text-decoration: none;}

#button a:hover {background:#fccd87; color:#008eb9;}
#button a:focus, #button a:active {background:#ed9614;}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  visibility: hidden;
  opacity: 0;
  min-height:925px;}
  
.overlay:target {
  visibility: visible;
  opacity: 1;}

.modal {
  margin: 50px auto;
  padding: 20px;
  background: #3f3f3f;
  border-radius: 5px;
  width: 50%;
  height: auto;
  z-index:800;}

.modal h2 {
  margin: 20px 0 0 20px;
  float:left;}
.modal .close {
  position:static;
  float:right;
  top: 20px;
  right: 30px;
  font-size: 40px;
  font-weight: bold;
  text-decoration: none;
  color: #fff;}
.modal .close:hover {color: #ed9614;}
.modal .m_content {overflow: auto;}

.m_content {padding-left:20px;}


@font-face {
    font-family: 'montserratultra_light';
    src: url('fonts/montserrat-ultralight-webfont.eot');
    src: url('fonts/montserrat-ultralight-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/montserrat-ultralight-webfont.woff2') format('woff2'),
url('fonts/montserrat-ultralight-webfont.woff') format('woff'),
url('fonts/montserrat-ultralight-webfont.ttf') format('truetype'),
url('fonts/montserrat-ultralight-webfont.svg#montserratultra_light') format('svg');
    font-weight: normal;
    font-style: normal;}

@font-face {
    font-family: 'montserratlight';
    src: url('fonts/montserrat-light-webfont.eot');
    src: url('fonts/montserrat-light-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/montserrat-light-webfont.woff2') format('woff2'),
url('fonts/montserrat-light-webfont.woff') format('woff'),
url('fonts/montserrat-light-webfont.ttf') format('truetype'),
url('fonts/montserrat-light-webfont.svg#montserratlight') format('svg');
    font-weight: normal;
    font-style: normal;}

@font-face {
    font-family: 'montserratbold';
    src: url('fonts/montserrat-bold-webfont.eot');
    src: url('fonts/montserrat-bold-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/montserrat-bold-webfont.woff2') format('woff2'),
url('fonts/montserrat-bold-webfont.woff') format('woff'),
url('fonts/montserrat-bold-webfont.ttf') format('truetype'),
url('fonts/montserrat-bold-webfont.svg#montserratbold') format('svg');
    font-weight: normal;
    font-style: normal;}