body {
		font-size: 15px;
		color:#626262;
		margin:0px auto;
    padding:0px; 
    background: #ffffff;
		font-family: 'Open Sans', Candara, Calibri, Segoe, "Segoe UI", Optima, Arial, sans-serif;
		line-height:1.4;	
}
li,p,ol,ul {font-size: 15px;color:#626262;}

* {box-sizing: border-box;} /* MAKES ALL ELEMENTS COUNT PADDING AND BORDERS AS PART OF WIDTH*/

#headercontainer {position:fixed;top: 0;left: 0;width:100%;height:135px;background-color:white;z-index:5000;}
#bodycontainer {position:relative;top:135;left: 0;width:100%;}
.MainContainer{min-width:310px;max-width:1200px;}

h1 {margin:0px 0px;text-align:left;padding:5px 0px;font-weight:300;font-size:30px;color:#0E3E6E;}
.title {margin:0px 0px;text-align:left;padding:5px 0px;color:#0E3E6E;}
.subtitle {margin:0px 0px;text-align:left;padding:5px 0px;font-size:1.1em;color:#0E3E6E;}
h2 {margin:0px 0px;font-size:1.3em;padding:4px 4px 4px 4px;color:#FFFFFF;text-align:center;background:#626262;}
h3, th {margin:0px 0px;font-size:1em;padding:10px;color:#5a5a5a;border-right:solid 1px #ffffff;text-align:left;background:#eaeaea;border-bottom:solid 1px #FEFEFE;} /* this is the light gray header same as th element*/
td.row {text-align:left;vertical-align:top;padding:4px 5px 4px 5px;border-bottom:solid 1px #eee;font-size:.95em;} 
td.row2{text-align:left;vertical-align:top;padding:4px 5px 4px 5px;border-bottom:solid 2px #eee;font-size:.95em;} /* Manages Table Cells */
table {border-collapse: collapse;}

#iframe {height:100%;left:0px; position:relative;top:0px;width:100%;}       
#iframeload {background:url(images/loader.gif) top center no-repeat;overflow:hidden; }
#open-house {width:210px;float:right;padding-top:40px;text-align:right;} 
#home-image {width:100%;height:auto;background-size:cover;background-position:top center;background-repeat:no-repeat;}

/* In order to use the below cropper the image must be placed in a div with the following styles --> overflow:hidden;width:100px;height:100px;position:relative; */
img.CropCenter {width:100%;position:absolute;left:-100%;right:-100%;top:-100%;bottom:-100%;margin: auto;min-height:100%;}


/* For mobile phones: */
[class*="col-"] {
	  float:left;
    padding: 5px;
    width: 100%;
}

/* For tablets: */
@media only screen and (min-width: 560px) {
    .col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
    .col-m-12 {width: 100%;}

    .col-m-20 {width: 20%;}
    .col-m-40 {width: 40%;}
    .col-m-60 {width: 60%;}
    .col-m-80 {width: 80%;}
}

/* For desktop: */
@media only screen and (min-width: 900px) {
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}

    .col-20 {width: 20%;}
    .col-40 {width: 40%;}
    .col-60 {width: 60%;}
    .col-80 {width: 80%;}
}

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

@media only screen and (max-width: 440px) {
	 #hide-tablet {display:none;}
   #hide-mobile {display:none;}
   #home-image {display:none;}
   #logo {padding:5px;width:125px!important;float:left;}
   #footer {font-size:.8em;}
	 #reducefont {font-size:.8em;}
	 h1 {font-size:22px;}
}

@media only screen and (min-width: 441px) and (max-width: 560px) {
	#hide-tablet {display:none;}
	#hide-mobile {display:none;}
  #home-image {min-height:155px;}
  #logo {padding:5px;width:150px!important;float:left;}
	#reducefont {font-size:.8em;}
}
	
@media only screen and (min-width: 561px) and (max-width: 1049px) {
	#hide-tablet {display:none;}
  #logo {padding:10px;width:200px!important;float:left;} 
  #home-image {min-height:350px;}

}
@media only screen and (max-width: 1049px) {
  #BigMenu {display:none;}
  #login {display:none;}
}

@media only screen and (min-width: 1050px) {
  #SmallMenu {display:none;}
  #logo {padding:10px;width:250px!important;float:left;} 
  #home-image {min-height:600px;}
  #login {float:right;font-size:.85em;padding:9px;}
	#hide-widescreen {display:none;}
}


/* In order to use the below cropper the image must be placed in a div with the following styles --> overflow:hidden;width:100px;height:100px;position:relative; */
img.CropCenter {width:100%;position:absolute;left:-100%;right:-100%;top:-100%;bottom:-100%;margin: auto;min-height:100%;min-width:100%;}
#icon-add {margin:5px 10px;width:30px;height:auto;}
#icon-view {margin-left:0px;width:18px;}
#icon-edit {margin-left:0px;width:18px;}
#icon-delete {margin-left:0px;width:18px;}
#icon-login {margin:0px 0px -6px 0px;width:22px;}
#icon-socialmedia {margin-bottom:-5px;width:22px;}
#icon-add:hover,#icon-view:hover, #icon-delete:hover, #icon-human:hover, #icon-office:hover, #icon-socialmedia:hover, #icon-login:hover, .menu-login:hover {opacity:.75;}
#icon-edit:hover {-webkit-transform: rotate(-10deg);-moz-transform: rotate(-10deg);-o-transform: rotate(-10deg);-ms-transform: rotate(-10deg);transform: rotate(-10deg);} 
#icon-map {opacity:.75;-webkit-transform: scale(1.3);-ms-transform: scale(1.3);transform: scale(1.3);}


label {display: block;padding:5px 0px 5px 0px;text-align:left;color:#505050;font-weight:bold;}
.FormInput, Select {width:100%;font-size:1em;margin:0px 0px 10px 0px;padding:10px;color:#000000;background-color:#FFFFFF;text-decoration: none;border: 1px solid #999;border-radius:0;}
input::placeholder, textarea::placeholder{color:#aaaaaa;font-size:.9em;}
.Cal {border:0px;margin:-2px 0px 0px 1px;width:24px;vertical-align:middle;}

.read-more-state {display: none;}
.read-more-target {opacity: 0;max-height: 0;font-size: 0;transition: .25s ease;}
.read-more-state:checked ~ .read-more-wrap .read-more-target {opacity: 1;font-size: inherit;max-height: 999em;}
.read-more-state ~ .read-more-trigger:before {content: 'Show more';}
.read-more-state:checked ~ .read-more-trigger:before {content: 'Show less';}
.read-more-trigger {cursor: pointer;display: inline-block;font-weight: normal;padding: 0 .5em;color: #666;font-size: .9em;line-height: 2;border: 1px solid #ddd;border-radius: .25em;}

#articles {margin:0px 10px 20px 10px; padding:20px;overflow:hidden;border: 1px solid #999;}
#boardmember {text-align:center;float:left;width:230px;height:280px;overflow:hidden;margin:5px;}
#videobox  {float:left;width:300px;height:250px;overflow:hidden;margin:10px;}

a, a:visited, a:active, a:hover {font-weight:600;color:#0E3E6E;text-decoration: none;}	
	
ul,ol {
  color : #000000;
  font-size : 12px;
	padding-bottom:10px;
	padding-right: 50px;
	}
li.checkbox  {
list-style-image: url(images/checkbox.jpg)
}
.upcomingevents  {
	border-width: 0px;
	border-style: solid;
	padding: 0px 5px 5px 5px;
	text-align: left;
	color: #212963;
	text-decoration: none;
	font-size: 9pt; }
	

.framewrapper {width: 256px; height: 192px; padding: 0; overflow: hidden; float: left;border: 1px solid #dddddd;margin-bottom:20px;}
.frame { width: 1024px; height: 768px; border: 1px solid #dddddd;}
.frame {
    // zoom: 0.25;
    -moz-transform: scale(0.25);
    -moz-transform-origin: 0 0;
    -o-transform: scale(0.25);
    -o-transform-origin: 0 0;
    -webkit-transform: scale(0.25);
    -webkit-transform-origin: 0 0;
}	
	
.button
{
	-webkit-appearance: none;
	border-width: 0px;
  padding:12px 12px 12px 12px;
	background-color:#164179;
	color:#ffffff;
	font-weight:600;
	border-radius:0;
	cursor:pointer;
  
}

.button:hover
{
background: #123148;
}




.button-old
{
    display:inline-block;
    border-bottom: 0 none #808080;
    display:inline;
    padding:5px 15px;
    padding-bottom:5px;
    margin-bottom:0;
    margin-left: .3em;
    font-size:12px;
		font-weight: bold;
    line-height:25px;
    text-align:center;

    /*vertical-align:middle; */
    cursor:pointer;
    text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);
    border-radius: 4px;
    color:#333333;
    background: #F8F8F8;
    background-image: -webkit-linear-gradient(top, #ffffff, #ebebeb);
    background-image: -moz-linear-gradient(top, #ffffff, #ebebeb);
    background-image: -ms-linear-gradient(top, #ffffff, #ebebeb);
    background-image: -o-linear-gradient(top, #ffffff, #ebebeb);
    background-image: linear-gradient(to bottom, #ffffff, #ebebeb);
    border: solid #cccccc 1px;
}

.button-old:hover
{
    background: #f0f0f0;
    background-image: -webkit-linear-gradient(top, #f0f0f0, #ffffff);
    background-image: -moz-linear-gradient(top, #f0f0f0, #ffffff);
    background-image: -ms-linear-gradient(top, #f0f0f0, #ffffff);
    background-image: -o-linear-gradient(top, #f0f0f0, #ffffff);
    background-image: linear-gradient(to bottom, #f0f0f0, #ffffff);
    text-decoration: none;
		
}
.save {padding-left:18px;background: url(../Images/save.png) left center no-repeat;}



/* START - Simple Mortage Payment Calculator */
.smpc-div {background-color: #f9f9f9;border:1px solid #cccccc;padding:15px;}
.smpc-error {font-family: Verdana, Arial, Helvetica, sans-serif;font-size:.8em;color:#ca0000;}
.smpc-monthlypayment {margin-top:15px;font-size:1.4em;color:#ca0000;}
.smpc-friendlyreminder {display:none;}
/* END - Simple Mortage Payment Calculator */