/* -------------------------------*/
/* ---------- Site Wide ----------*/
/* -------------------------------*/ 
body {margin:0px; padding:0px;  position:relative; }
#menucontainer {width:100%; background-color:rgba(0,0,0,0.75); height:125px; line-height:125px;}
#outercontainer{background:rgba(255,255,255,0.95); width:100%;}
#content {padding-bottom:20px;}
#masthead {display:table;width:100%;}
#mastheadinner {display:table-cell; vertical-align:middle;}
#insidemasthead {display:table;width:100%;}
#insidemastheadinner {display:table-cell; vertical-align:middle;}

h6.introduction {text-align:center; font-size:1.4em;margin-top:30px;}
h1.logo {font-family: 'pragmatica-web-condensed';font-weight:400 !important;margin:0px;line-height:40px; font-size:6em;text-align:center;color:white;}
.logoborder {border-top:1px solid white; border-bottom:1px solid white;}
.logoof {font-family: 'kepler-std',serif; font-style:italic;font-size:.5em;position:relative; bottom:10px; left:-3px;}
.logoopening {color:white;text-align:center;margin-top:3em;}
.dividerouter {height:30px; padding:20px 0; text-align:center;}
.dividerinner {height:1px; width:15%; margin:auto;border-left:8em solid black;border-right:8em solid black;}
.dividerinner h6 {font-family: 'kepler-std',serif; font-style:italic;font-weight:300;position:relative; top:-.75em;}

#nav ul {list-style:none; margin:0px;}
 			#nav > a
			{
				display: none;
			}

			#nav li
			{
				position: relative;
			}
				#nav li a
				{
					color: #fff;
					display: block;
				}
				#nav li a:active
				{
					background-color: #c00 !important;
				}

			#nav span:after
			{
				width: 0;
				height: 0;
				border: 0.313em solid transparent; /* 5 */
				border-bottom: none;
				border-top-color: #efa585;
				content: '';
				vertical-align: middle;
				display: inline-block;
				position: relative;
				right: -0.313em; /* 5 */
			}

			/* first level */

			#nav > ul
			{
				height: 125px; /* 60 */

			}
				#nav > ul > li
				{
					width: 19%;
					height: 100%;
					float: left;
				}
					#nav > ul > li > a
					{
						height: 100%;
						font-size: 1.5em; /* 24 */
						line-height: 125px; /* 60 (24) */
						text-align: center;
					}
						#nav > ul > li:not( :last-child ) > a
						{
							
						}
						#nav > ul > li:hover > a,
						#nav > ul:not( :hover ) > li.active > a
						{
							background-color: #c0392b;
						}


				/* second level */

				#nav li ul
				{
					background-color: #c0392b;
					display: none;
					position: absolute;
					top: 100%;
				}
					#nav li:hover ul
					{
						display: block;
						left: 0;
						right: 0;
					}
						#nav li:not( :first-child ):hover ul
						{
							left: -1px;
						}
						#nav li ul a
						{
							font-size: 1.25em; /* 20 */
							border-top: 1px solid #e15a1f;
							padding: 0.75em; /* 15 (20) */
						}
							#nav li ul li a:hover,
							#nav li ul:not( :hover ) li.active a
							{
								background-color: #e15a1f;
							}


		@media only screen and ( max-width: 62.5em ) /* 1000 */
		{
			#nav
			{
				width: 100%;
				position: static;
				margin: 0;
			}
		}

		@media only screen and ( max-width: 40em ) /* 640 */
		{


			#nav
			{
				position: relative;
				top: auto;
				left: auto;
			}
				#nav > a
				{
					width: 50px; /* 50 */
					height: 50px; /* 50 */
					text-align: left;
					text-indent: -9999px;
					background-color: #000;
					position: relative;
				}
					#nav > a:before,
					#nav > a:after
					{
						position: absolute;
						border: 2px solid #fff;
						top: 35%;
						left: 25%;
						right: 25%;
						content: '';
					}
					#nav > a:after
					{
						top: 60%;
					}

				#nav:not( :target ) > a:first-of-type,
				#nav:target > a:last-of-type
				{
					display: block;
				}


			/* first level */

			#nav > ul
			{
				height: auto;
				display: none;
				position: absolute;
				left: 0;
				right: 0;
				z-index:100;
			}
				#nav:target > ul
				{
					display: block;
				}
				#nav > ul > li
				{
					width: 100%;
					float: none;
					background-color:#000;
				}
					#nav > ul > li > a
					{
						height: auto;
						text-align: left;
						padding: 0 0.833em; /* 20 (24) */
					}
						#nav > ul > li:not( :last-child ) > a
						{
							border-right: none;
							border-bottom: 1px solid #cc470d;
						}


				/* second level */

				#nav li ul
				{
					position: static;
					padding: 1.25em; /* 20 */
					padding-top: 0;
				}
		}


.softwhitebox {
	background-color:#fff;
	padding:7px; 
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	-o-border-radius:3px;
	-ms-border-radius:3px;
	border-radius:3px; 
	-webkit-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3); 
	-moz-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3);
	-o-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3);
	-ms-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3); 
	box-shadow: 0px 1px 10px rgba(0, 0, 0, .3);
}
.softwhiteboxnopadding {
	background-color:#fff; 
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	-o-border-radius:3px;
	-ms-border-radius:3px;
	border-radius:3px; 
	-webkit-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3); 
	-moz-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3);
	-o-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3);
	-ms-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3); 
	box-shadow: 0px 1px 10px rgba(0, 0, 0, .3);
}

p.nomargin  {margin-left:0px; margin-bottom:0px;}

.rel {position:relative;}
.abs {position:absolute;}
.nooverflow {overflow:hidden;}


.hpb {box-shadow:0px 2px 10px 0 rgba(0,0,0,0.4); }

.hpb a {width:220px; height:133px; position:absolute; top:0px; left:0px;}

.homepageboxemerland {border-top:8px solid #2ecc71;}
.homepageboxpomegranate {border-top:8px solid #c0392b;}
.homepageboxpeterriver {border-top:8px solid #3498db;}
.homepageboxpumpkin {border-top:8px solid #d35400;}

.homepageboxturquoise {border-top:8px solid #1abc9c;}
.homepageboxwisteria {border-top:8px solid #8e44ad;}
.homepageboxwetasphalt {border-top:8px solid #34495e;}
.homepageboxorange {border-top:8px solid #f39c12;}

.homepageboxalizarin {border-top:8px solid #e74c3c;}
.homepageboxsunflower {border-top:8px solid #f1c40f;}
.homepageboxsilver {border-top:8px solid #bdc3c7;}
.homepageboxasbestos {border-top:8px solid #7f8c8d;}
.homepageboxmidnightblue {border-top:8px solid #2c3e50;}
.homepageboxbelizehole {border-top:8px solid #2980b9;}


.turquoise_bg {background:#1abc9c;}  
.emerland_bg {background:#2ecc71;}
.peterriver_bg {background:#3498db;}  /* blues */
.belizehole_bg {background:#2980b9;}  /* blues */
.amethyst_bg {background:#9b59b6;}
.wetasphalt_bg {background:#34495e;}
.midnightblue_bg {background:#2c3e50;}

.sunflower_bg {background:#f1c40f;}
.pumpkin_bg {background:#d35400;}
.pomegranate_bg {background:#c0392b;}
.alizarin_bg {background:#e74c3c}
.orange_bg {background:#f39c12}
.wisteria_bg {background:#8e44ad}

.silver_bg {background:#bdc3c7}
.asbestos_bg {background:#7f8c8d}



.blurme{-webkit-filter: blur(5px) grayscale(75%)  ; -moz-filter: blur(5px) grayscale(75%)  ;-o-filter: blur(5px) grayscale(75%)  ; filter:blur(5px) grayscale(75%)   ;}
.unblurme{filter: blur(0px);-webkit-filter: blur(0px);}

#footercontainer {
	width:100%; 
	background-color:#2c3e50;

	
}

#footer a, #footer a:link, #footer a:visited {
	text-decoration:none;
	color:#ddd;
}
#footer a:hover , #footer a:active {
	text-decoration:none;
	color:#fff;
}

#footer h6{color:#fff;}
#footer P {color:#ddd;}
.quotetext {
	margin-top:20px !important;
	font-family:Constantia, "Palatino Linotype", "Book Antiqua", Palatino, serif !important;
	font-size:28px !important;
	text-align:left;
	letter-spacing:-.5px;
	color:#666;
	line-height:32px;
}
.quoteauthor {
	margin-top:20px !important;
	font-family:Calibri, Arial, Helvetica, sans-serif !important;
	font-size:18px !important;
	text-align:right;
	letter-spacing:.2px;
	color:#444;
	
}

p.lead {color:#124082;font-family: 'Oswald', arial, serif;font-size:1.3em;margin:0px 0px 1.5em 1em !important;}


/* ---------------------------------------------------------------------------- */
/* Plain Table ---------------------------------------------------------------- */
/* ---------------------------------------------------------------------------- */
table.vanilla {color:#000;font: 11px "Trebuchet MS", Arial, Helvetica, sans-serif;letter-spacing:2px;border-spacing:1px;border-collapse:collapse;}
table.vanilla caption {font-weight: bold;font-style:italic;text-transform:uppercase;letter-spacing:3px;text-align:right;margin:0px 10px 0px 0px;padding:0px;color:#444;caption-side: bottom;}
table.vanilla td, table.vanilla th {padding:4px 6px 4px 6px;}
/* ----- */
/* thead */
/* ----- */
table.vanilla thead {color:#444;font-size:12px;font-weight:bold;text-transform:uppercase;text-shadow: 0 1px 1px rgba(255,255,255,0.9);}
table.vanilla thead th, table.vanilla thead td {padding:6px;}
table.vanilla thead tr {}
/* ----- */
/* tfoot */
/* ----- */
table.vanilla tfoot tr {}
table.vanilla tfoot {font-size: 10px;}
/* ----- */
/* tbody */
/* ----- */
table.vanilla tbody tr th {text-align:right;font-weight:bold;}


/* ---------------------------------------------------------------------------- */
/* Site wide transforms  ---------------------------------------- */
/* ---------------------------------------------------------------------------- */


.hpbzoomer{
-webkit-transition-duration: 0.3s; 
-moz-transition-duration: 0.3s;
-ms-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
z-index:1 !important;
}

.hpbzoomer:hover{
-webkit-transform:scale(1.1) translate3d(0,0,0); 
-moz-transform:scale(1.1) translate3d(0,0,0); 
-o-transform:scale(1.1) translate3d(0,0,0);
-ms-transform:scale(1.1);
transform:scale(1.1) translate3d(0,0,0);
z-index:10 !important;
-webkit-box-shadow: 0px 20px 20px -15px rgba(0, 0, 0, .3); 
-moz-box-shadow: 0px 20px 20px -15px rgba(0, 0, 0, .3);
-o-box-shadow: 0px 20px 20px -15px rgba(0, 0, 0, .3);
-ms-box-shadow: 0px 20px 20px -15px rgba(0, 0, 0, .3); 
box-shadow: 0px 20px 20px -15px rgba(0, 0, 0, .3);
}

.zoomer{
-webkit-transition-duration: 0.3s; 
-moz-transition-duration: 0.3s;
-ms-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
z-index:1 !important;
}

.zoomer:hover{
-webkit-transform:scale(1.1) translate3d(0,0,0); 
-moz-transform:scale(1.1) translate3d(0,0,0); 
-o-transform:scale(1.1) translate3d(0,0,0);
-ms-transform:scale(1.1);
transform:scale(1.1) translate3d(0,0,0);
z-index:10 !important;

}


.galleryzoomer{
-webkit-transition-duration: 0.3s; 
-moz-transition-duration: 0.3s;
-ms-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
z-index:1 !important;
}

.galleryzoomer:hover{
-webkit-transform:scale(1.1) translate3d(0,0,0); 
-moz-transform:scale(1.1) translate3d(0,0,0); 
-o-transform:scale(1.1) translate3d(0,0,0);
-ms-transform:scale(1.1);
transform:scale(1.1) translate3d(0,0,0);
z-index:10 !important;
-webkit-box-shadow: 0px 25px 20px -15px rgba(0, 0, 0, .75), 0px 5px 45px 5px rgba(0, 0, 0, .5); 
-moz-box-shadow: 0px 25px 20px -15px rgba(0, 0, 0, .75), 0px 5px 45px 5px rgba(0, 0, 0, .5);
-o-box-shadow: 0px 25px 20px -15px rgba(0, 0, 0, .75), 0px 5px 45px 5px rgba(0, 0, 0, .5);
-ms-box-shadow: 0px 25px 20px -15px rgba(0, 0, 0, .75), 0px 5px 45px 5px rgba(0, 0, 0, .5); 
box-shadow: 0px 25px 20px -15px rgba(0, 0, 0, .75), 0px 5px 45px 5px rgba(0, 0, 0, .5);
}




/* ---------------------------------------------------------------------------- */
/* Project List and Show and Videoplayer ---------------------------------------- */
/* ---------------------------------------------------------------------------- */

.projectlistbox {
	float:left;
	position:relative; 
	padding:7px; 
	width:200px; 
	margin:0px 10px 0px 10px; 
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	-o-border-radius:3px;
	-ms-border-radius:3px;
	border-radius:3px; 
	-webkit-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3); 
	-moz-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3);
	-o-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3);
	-ms-box-shadow: 0px 1px 10px rgba(0, 0, 0, .3); 
	box-shadow: 0px 1px 10px rgba(0, 0, 0, .3);

}
.projectlistpicturecontainer {
width:200px;
height:150px;
display: table-cell;
vertical-align:middle;
min-height:150px;
max-height:150px;
position:relative;

}
.projectlistimage {
width:200px;
max-height:150px;
}
.projectlistoverlay {
position:absolute;
top:-17px;
right:-17px;	
}
.projectshowoverlay {
position:absolute;
top:-11px;
right:-11px;	
}
.projectlistcaption {
width:200px; margin:0px ; text-align:center; height:40px; line-height:20px;   font-family:arial, serif; font-size:16px;
}
.projectlistsummary {
font-size:12px;text-align:left;	line-height:13px;
height:60px;
}