body{

padding:0;

margin:0;

background-color:#E8E9EB;

}



*{

font-family: 'Raleway', sans-serif;

	color: #000000;

}

a.page-btn {
    font-family:'Lato',sans-serif;
    font-size:13px;
    text-transform:uppercase;
    text-decoration:none;
    color:#FFFFFF;
    background:#ff3333;
    border:2px solid #FFFFFF;
    padding:10px 14px;
    cursor:pointer;
    letter-spacing:2px;
    text-align:center;
    display:inline-block;
    -webkit-transition:.4s background ease;
    -moz-transition:.4s background ease;
    -o-transition:.4s background ease;
    transition:.4s background ease;
}
.page-btn:hover {
    color:#fff;
    background: #34495e;
}

#headerwrap{

width:100%;

background-color: #222629;

float: left;

}

#header{

max-width:1350px;

margin:0 auto;

}

#subheader{

width:100%;

margin:0 auto;

}

#subheader img{

width:100%;



}

#lrgslideshowwrap{

clear:both;

}



#content-home{

margin:0 auto;

 

}

#mslideshowwrap{

display: none;

}



#logo{

margin:0 auto;

padding-top: 10%;

padding-bottom: 180px;

width:100%;

}

#logo img{

width:100%;

}

#contentsubs{

clear:both;

margin:0 auto;

max-width:1240px;

 padding left: 2%;

  padding right: 2%;

}
#contentsubs img{

width:100%;

}
#content{

clear:both;

margin:0 auto;

max-width:1240px;

 padding left: 2%;

  padding right: 2%;

}

#content-mobile{

display: none;

}

#squares{

margin:0 auto;

padding-top: 20px;

max-width:1240px;

}

#squares img{

width:100%;

}

#msquares{

display: none;

}

#col{

float:left;

border: 1px solid #222629; 

width:23%;

margin-right:2.3%;

margin-bottom:30px;

}



#colright{

float:right;

border: 1px solid #222629; 

width:23%;

margin-bottom:30px;

 

}



#colphoto{

margin:0 auto;

width:100%;

 

}

#colphoto img{

width:100%;

 

}

#coltext{

margin:0 auto;

background-color: #222629;

width:100%;

font-family: 'Raleway', sans-serif;

font-size:18px;

color: #FFFFFF;

padding-top: 10px;

 padding-bottom: 10px;

}

.border {

border: 1px solid #222629; 

}

#contentbox{

float: left;

margin-right: 3%;

width:70%;

}

#photobox{

margin-top: 5%;

float:right;

width:27%;

}

#photobox img{

width:100%;

}

#right-margin-photo-col{

border: 1px solid #222629; 

width:100%;

margin-bottom:30px;

}



#right-margin-photo-col img{

width:100%;

 

}

#right-margin-col-text{

margin:0 auto;

background-color: #222629;

width:100%;

font-family: 'Raleway', sans-serif;

font-size:18px;

color: #FFFFFF;

padding-top: 10px;

 padding-bottom: 10px;

 text-align: center;

}

#spacebox{

clear: both;

float: left;

width:100%;

margin: 2%;

}

a{

color:#115b8a;

text-decoration:none;

}

a:hover{

color:#15193B;

text-decoration:none;

}

h1{

font-size:36px;

font-weight: lighter;

}

h2{

font-size:28px;

font-weight: lighter;

}

h3{

font-size:24px;

font-weight: lighter;

}

p{

font-size:16px;

}

#content li{

font-size:16px;

}

.whitetext{

color:#FFFFFF;

font-size:18px;

}



#greenwwrap{

clear: both;

float: left;

width:100%;

background: #CFCFCF;

margin:0 auto;

}

#green{

width:100%;

margin:0 auto;

float: left;

background: #CFCFCF;

}

#greencontent{

margin:0 auto;

max-width:1240px;

 padding left: 2%;

  padding right: 2%;

}



#footerwrap{

clear: both;

float:left;

width:100%;

background-color: #272B2E;

padding-bottom: 20px;

}

#footer{

max-width:1160px;

margin:0 auto;

color:#ffffff;

font-size:14px;

margin-top:20px;

padding-top:20px;

}

.footercol{

display:table-cell;

width:28%;

padding:2.5%;

}

#footer p{

color:#ffffff;

font-size:14px;

}

#footer a{

color:#ffffff;

text-decoration:none;

font-size:14px;

}

#footer a:hover{

color:#cccccc;

text-decoration:none;

}





/* #### MAIN MENU #### */

#nav{

margin-top:10px;

max-width:1350px;

/*float: left;*/

margin-bottom: 10px;

}

#nav ul{

text-align:center;

list-style:none;

}

#nav li{

/*float:none;*/

display: inline;

font-size:16px;

font-weight:normal;

padding: 0 7px;

overflow:hidden;

}

#nav li:first-child{

padding-left:0;

}

#nav li:last-child{

padding-right:0px;

}

#nav li a{

color:#ffffff;

text-decoration:none;

}

#nav li a:hover{

color:#cccccc;

text-decoration:none;

}



#menu{

display:none;

}



/* The sidebar menu */

.sidebar {

  height: 100%; /* 100% Full-height */

  width: 0; /* 0 width - change this with JavaScript */

  position: fixed; /* Stay in place */

  z-index: 1; /* Stay on top */

  top: 0;

  left: 0;

  background-color:#222629; /* Black*/

  overflow-x: hidden; /* Disable horizontal scroll */

  padding-top: 60px; /* Place content 60px from the top */

  transition: 0.5s; /* 0.5 second transition effect to slide in the sidebar */

}



/* The sidebar links */

.sidebar a {

  padding: 8px 8px 8px 32px;

  text-decoration: none;

  font-size: 25px;

  color: #818181;

  display: block;

  transition: 0.3s;

    border: none;

	 

}



/* When you mouse over the navigation links, change their color */

.sidebar a:hover {

  color: #f1f1f1;

    border: none;

}



/* Position and style the close button (top right corner) */

.sidebar .closebtn {

  position: absolute;

  top: 0;

  right: 25px;

  font-size: 36px;

  margin-left: 50px;

    border: none;

	text-decoration:none;

}



/* The button used to open the sidebar */

.openbtn {

  font-size: 20px;

  cursor: pointer;

  background-color: #222629;

padding: 10px 15px;

  border: none;

  text-decoration:none;

}



.openbtn:hover {

border: none;

}

.openbtn:hover {

border: none;

}

.openbtn:active {

border: none;

}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */

#main {

  transition: margin-left .5s; /* If you want a transition effect */

  padding: 20px;

    border: none;

}



/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */





/* MEDIA QUERIES*/

@media screen and (max-width: 1350px) {

#nav li{

padding: 0 7px;

}

}

@media screen and (max-width: 1200px) {

#squares{

margin:0 auto;

width:95%;

}

#content{

margin:0 auto;

width:95%;

}

#greencontent{

margin:0 auto;

width:95%;

}

#contentsubs{

margin:0 auto;

width:95%;

}



@media screen and (max-width: 980px) {

#lrgslideshowwrap{

display:none;

}

#mslideshowwrap{

display: inherit;

margin:0 auto;

clear:both;

width:100%;

}

#slideshow{

margin:0 auto;

}

#slideshow img {

width: 100%;

}

#content{

display:none;

}

#content-mobile{

display: inherit;

clear:both;

margin:0 auto;

width:95%;

 padding left: 2%;

  padding right: 2%;

}

}

@media screen and (max-width: 900px) {





/*.fadein { position:relative; width:500px; height:291px; }*/

.fadein { 

position:relative; 

width: 500px;

height: 291px;

}





}

@media screen and (max-width: 800px) {





}

@media screen and (max-width: 750px) {



#col{

margin:0 auto;

clear:both;

float:none;

width:90%;

}

#colright{

margin:0 auto;

clear:both;

float:none;

width:90%;

}



h1{

font-size:25px;

}

h2{

font-size:20px;

}

}

@media screen and (max-width: 750px) {

#nav{

display:none;

}

#menu{

	float:left;

	display:inline;

	margin-top:10px;

	margin-left:10px;

	width:98%;

}

.sb-slidebar {

	padding: 14px;

	color: #fff;

}

.sb-toggle-left, .sb-toggle-right, .sb-open-left, .sb-open-right, .sb-close {

	cursor: pointer;

}

.sb-sidebar .closebtn {

  position: absolute;

  top: 0;

  right: 25px;

  font-size: 36px;

  margin-left: 50px;

}

#right-margin-col-text{

font-size:14px;



}

@media screen and (max-width: 600px) {





@media screen and (max-width: 550px) {

h1{

font-size:25px;

}

h2{

font-size:20px;

}

}

@media screen and (max-height: 450px) {

  .sidebar {padding-top: 15px;  border: none;}

  .sidebar a {font-size: 18px;  border: none;}

}