/* Main CSS */

/* #Basic Styles
================================================== */
html{}

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

div.ccm-area, div.ccm-area-drag-area{border-color:#837777 !important; color:#837777 !important;}
.hide-on-desktop{display:none;}
.edit-mode{position:relative !important; margin-top:5px !important; margin-bottom:5px !important; height:auto !important; z-index:auto !important; top:0 !important; bottom:0 !important;}

/* #Header
================================================== */
#header-wrap{background:url("images/header-bg.jpg") no-repeat right bottom ; padding-bottom:20px; padding-top:20px;}
#logo{text-align:center;}
#logo img{}

#header{text-align: right; margin-top:10px; width:100%;}


/*Navigation 
================================================== */


@media only screen and (min-width: 768px) { 
	#mobile-dropdown-button{display:none;}
	#navigation-wrap{background:#6dc9ec;}
	#navigation{}
	#navigation a{display:block; text-decoration:none; }
	#navigation a:hover{}
	#navigation>#mobile-dropdown>ul{padding:0; margin:0; list-style:none; float:left; width:100%; font-size: 16px}
	#navigation>#mobile-dropdown>ul>li{float:left; position:relative; }
	#navigation>#mobile-dropdown>ul>li>a{color:#595f67; padding: 7px; text-align:center; font-style: normal;}
    #navigation>#mobile-dropdown>ul>li:hover>a{background:#5bacdf;}

	#navigation>#mobile-dropdown>ul>li>ul{
		z-index:10; 
		display:none;
		position:absolute;
	    padding:0;}
	#navigation>#mobile-dropdown>ul>li>ul>li{background:#5bacdf; width:200px; float:left; list-style-type:none; height:auto !important; }
	#navigation>#mobile-dropdown>ul>li>ul>li:hover{background:#dce9f7;}
	#navigation>#mobile-dropdown>ul>li>ul>li a{padding:5px 15px; color:#2f2f2f; margin:auto; text-decoration:none; font-size:16px;}

	#navigation>#mobile-dropdown>ul>li:hover>ul{display:block;}
	#navigation>#mobile-dropdown>ul>li:hover>ul>li a{font-style: normal; }
	#navigation>#mobile-dropdown>ul>li:hover>ul>li a:hover{}

	#navigation>#mobile-dropdown>ul>li>ul>li:hover>ul{display:block; }
	#navigation>#mobile-dropdown>ul>li>ul>li>ul>li{background:#5bacdf; }
	#navigation>#mobile-dropdown>ul>li>ul>li>ul>li:hover{background:#dce9f7;}
	#navigation>#mobile-dropdown>ul>li>ul>li>ul{display:none; list-style:none; padding:0; position:absolute; margin-top:-33px;  right:-200px; width:200px; font-size:16px;} 
}


/* #Content
================================================== */

#content-wrap{}

#slideshow{min-height:200px}
#secondary-slideshow{border-top:5px solid #6dc9ec; border-bottom:10px solid #6dc9ec;}

#main-wrap{margin-bottom:40px; margin-top:20px;}
#feature-wrap{padding:20px; border-bottom:10px solid #6dc9ec;}

.feature{padding:10px; text-align:center;}

#blue-wrap{background:#6dc9ec; color:#fff; padding:20px;}


/* #Footer
================================================== */
#footer-feature-wrap{margin-bottom:-150px;  }
#footer-wrap{background:url("images/footer-bg.jpg") no-repeat right bottom; min-height:500px; padding-top:200px; }

#copyright{}

/* #Mobile
=================================================== */
@media only screen and (max-width: 768px) { 

	.hide-on-mobile{display:none;}
	.hide-on-desktop{display:block;}

	#logo img{margin:0 auto;}

	#header{display:none;}
	
	#mobile-dropdown-button{display:block; padding:10px; width:100%; cursor:pointer; font-weight:bold; color:#595f67; background:#6dc9ec; position:relative;}
	#mobile-dropdown{display:none; z-index:99; width:100%; position:absolute; }
	#mobile-dropdown a{display:block; color:#595f67; font-style: normal; width:100%; padding:8px 25px; text-decoration:none;}
	#mobile-dropdown>ul{list-style:none; padding:0; background:#5bacdf; margin-right:30px; }
	#mobile-dropdown a:hover{background-color:#dce9f7; }
	#mobile-dropdown ul>li>ul {list-style:none; padding-left:0;}
	#mobile-dropdown ul>li>ul a{padding-left:50px;}
	#mobile-dropdown ul>li>ul>li>ul a{padding-left:70px;}
}