@charset "utf-8";
/* CSS Document */
html{
  	position:relative;
	background:url(images/background.jpg) no-repeat fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;

}
body {
	position:absolute;
	background:rgba(0,0,0,.6);
	width:100%;
	color: #242E33;
	font-size:14px;
	font-family: 'Lato', sans-serif;
	min-width: 950px;
	
}
html,body{
	min-height:100%;
 	margin:0;
  	padding:0;
}
.pageContentWrapper{
  	padding-top: 85px;
  	margin-bottom:60px;/* footer minus this is the padding to the content and footer*/
} 
a{
	text-decoration: none;
}

div.nav-bar{
	position:fixed;
		background-color: rgb( 245, 245, 245);
		z-index:1000;
		-moz-box-shadow: 0 0 3px 3px rgba(30, 30, 30, 0.4);
		-webkit-box-shadow:0 0 3px 3px rgba(30, 30, 30, 0.4);
		box-shadow: 0 0 3px 3px rgba(30, 30, 30, 0.4);
		width:100%;
}
div.nav-holder{
width:950px;
margin:0 auto 0 auto;
}
div.logo{
	width: 160px;
	float:left;
}
div.logo img{
	width: 100%;
}
div.nav-menu {
		position:relative;
		width:100%;
	}
	div.nav-menu ul{
		padding: 0;
  		float:right;
		border-left: .05em solid #ccc;
	}
	
	div.nav-menu ul li {
				list-style: none;
				float: left;
				height: 100%;
				border-right: .05em solid #ccc;
	}
	div.nav-menu ul li a{
				position:relative;
				display: block;
				color: #242E33;
				text-decoration: none;
				padding: 22px 22px;
				font-weight: 600;
				font-size:12px;
				height:100%;
	}
	div.nav-menu ul li a:hover {
		transition: all .5s;
		color: #383f40;
		background-color:#fff;
	}
			div.nav-menu .active a:link, div.nav-menu .active a:visited {
				background-color: #F34A4A;
				color: white;
				font-weight: 900;
			}
			/* menu button */
			.menu-trigger {
				display: none;
				color: #242E33;
				padding: 10px;
				cursor: pointer;
				z-index: 100;
				position:fixed;
				top:0px;
				right: 10px;
				font-size:30px;
			}
			.menu-trigger.white{
				color:#242E33;
			}
			/* end menu button */
	
	/* end of navigation */


/* end of header */

/* content body */
			#content{
				position:relative;
				margin-left: auto ;
  				margin-right: auto ;
				Padding-right: 50px;
				padding-left: 50px;
				padding-bottom: 40px;
			}

			/* content body */
			#shell{
				width: 950px;
				margin: 0px auto 12px;
			}
			#shell figure{
				display:inline-block;
				width: 33%;
			}

			#shell figure img{
				width: 100%;
			}

			.innershell{
				width: 100%;
				margin: 0px auto 0px auto;
				color: #242E33;
				border: 4px solid rgb( 245, 245, 245);
				background-color: rgb( 245, 245, 245);
				margin-bottom: 30px;
			}

			.innershell a:link, .innershel a:visited {
				color: #F34A4A;
				text-decoration:none;
				font-weight: 700;
			}
				.innershell p{
					padding:12px 25px;
					font-size: 15px;
					font-weight: 400;
					line-height: 23px;
				}

			/* Index content*/
				.slides img{
					text-align:center;
					max-width:100%;
					height:auto;	
				}
				.blueberry {
					background-color: rgb( 245, 245, 245);
					padding: 4px 4px 0px 4px;
					width: 100%;
				}
				.buttons {
					position: relative;
    				-webkit-column-count: 3; /* Chrome, Safari, Opera */
    				-moz-column-count: 3; /* Firefox */
    				column-count: 3;
					-webkit-column-gap: 30px; /* Chrome, Safari, Opera */
    				-moz-column-gap: 30px; /* Firefox */
    				column-gap: 30px;
					margin-top: 30px;
					margin-bottom: 10px;
          			page-break-inside: avoid;
               		break-inside: avoid;
					break-inside: avoid-column;
					-webkit-column-break-inside: avoid;
					min-height: initial;
				}
				.buttons img {
					width:100%;
					border: 4px solid rgb( 245, 245, 245);
				}
			/* Index content*/

			/* about content*/
				.team {
					position: relative;
    				-webkit-column-count: 2; /* Chrome, Safari, Opera */
    				-moz-column-count: 2; /* Firefox */
    				column-count: 2;
					-webkit-column-gap: 6px; /* Chrome, Safari, Opera */
    				-moz-column-gap: 6px; /* Firefox */
    				column-gap: 6px;
					margin-bottom: 10px;
          			page-break-inside: avoid;
               		break-inside: avoid;
					break-inside: avoid-column;
					-webkit-column-break-inside: avoid;
					min-height: initial;
				}
				.team img {
					width:100%;
				}
			/* about content*/

			/* service content*/
			.catalog {
				position: relative;
    			-webkit-column-count: 3; /* Chrome, Safari, Opera */
    			-moz-column-count: 3; /* Firefox */
    			column-count: 3;
				-webkit-column-gap: 30px; /* Chrome, Safari, Opera */
    			-moz-column-gap: 30px; /* Firefox */
    			column-gap: 30px;
				margin-top: 30px;
				margin-bottom: 10px;
          		page-break-inside: avoid;
               	break-inside: avoid;
				break-inside: avoid-column;
				-webkit-column-break-inside: avoid;
				min-height: initial;
			}
				.catalog img {
					width:100%;
			}
				.catalog p {
					width:100%;
					margin:-2px 0 0 0;
					padding: 10px 0px;
					background:rgb( 245, 245, 245);
					text-align: center;
					color: #242E33;
			}
			.catalog-content{
				width:100%;
				border: 4px solid rgb( 245, 245, 245);
			}
			.catalog-content:hover{
				border: 4px solid #F34A4A;
				transition: all .5s;
			}
			/* service content*/

			/* contact content*/
				.quote-info {
    				-webkit-column-count: 2; /* Chrome, Safari, Opera */
    				-moz-column-count: 2; /* Firefox */
    				column-count: 2;
   					-webkit-column-rule-style: solid; /* Chrome, Safari, Opera */
   	 				-moz-column-rule-style: solid; /* Firefox */
    				column-rule-style: solid;
    				-webkit-column-rule-width: 1px; /* Chrome, Safari, Opera */
    				-moz-column-rule-width: 1px; /* Firefox */
    				column-rule-width: 1px;
    				-webkit-column-rule-color: #F34A4A; /* Chrome, Safari, Opera */
    				-moz-column-rule-color: #F34A4A; /* Firefox */
    				column-rule-color: #F34A4A;
					padding:25px;
					font-size: 16px;
					font-weight: 400;
					line-height: 30px;
					margin-bottom: 10px;
				}
				.quote-info ul li:before{ 
   					content: '\f058';
   					font-family: FontAwesome;
   					font-weight: normal;
   					font-style: normal;
   					margin:0px 7px 0px 0px;
   					text-decoration:none;
				} 
				span.lines{
					color:#F34A4A; 
					margin: 0 18px;
				}
				.map-responsive{
    				overflow:hidden;
    				height:300px;
					width:100%;
					border: 4px solid rgb( 245, 245, 245);
				}
				.map-responsive iframe{
   		 			left:0;
    				top:0;
    				height:300px;
    				width:100%;
					pointer-events: none;
				}
				.map-responsive iframe.clicked{
					pointer-events: auto;
				}
			h1{
				padding:12px 25px;
				text-align:center; 
				background-color: #F34A4A; 
				font-size: 18px; 
				line-height: 25px;
			}
			h2{
				padding:12px 25px;
				font-size:28px; 
				line-height:35px; 
				font-weight:700;
			}
			h3{
				padding:12px 25px; 
				line-height:23px;
				text-align:center; 
			}
			/* contact content*/
/* end of content body */

			/* footer */			
						div.social {
							position:relative;
							width: 100%;
							text-align: center;
							background-color: #242E33;							
							font-size: 15px;
							padding: 15px 0;
						}
						div.social a{
							color: #fff;
							padding: 0 8px;
						}
						.webfooter{
							position: absolute;
   			 				bottom: 0;
    						left: 0;
    						right: 0;
							width:100%;
							
						}
						.webfooter p{
							margin:0; 
							color: #fff;
							text-align: center;
							font-size: 10px;
							padding: 9px 0 7px 0;
							background-color: #141E23;
						}

/* Mobile screens */
		@media screen and (max-width: 850px) {
			html{
				min-width: auto;
				min-height: auto;
			}
			.pageContentWrapper{
  				padding-top: 80px;
			}
			body {
				min-width: 320px;
			}
			
		.menu-trigger {
				display: block;
				z-index:200;
		}
		div.nav-menu {
			margin-top:59px;
			position:fixed;
			display: none;
			width:250px;
			right:0px;
			border-left: .05em solid rgba( 50, 50, 50, 0.2);
		}
		div.nav-menu ul li {
			border-top: 1px solid rgba( 50, 50, 50, 0.2);
			width:250px;
			text-align: center;
		}
			div.nav-menu ul li a {
			padding:30px 0;
		}
			div.nav-menu ul {
				background-color: rgb( 245, 245, 245);
				color: #fff;
				border-bottom: 1px solid rgba( 50, 50, 50, 0.2);
			}

			div.nav-expanded {
				display: block;
				z-index:100;
			}
			#content{
				position:relative;
				Padding-right: 0;
				padding-left: 0;
			}
			#shell{
				width: 630px;
				margin: 0px auto 12px;
			}
			.innershell p{
				padding:15px 15px;
			}
			.webfooter{
				width:100%;
			}
			.buttons {
				position: relative;
				-webkit-column-gap: 20px; /* Chrome, Safari, Opera */
    			-moz-column-gap: 20px; /* Firefox */
    			column-gap: 20px;
			}
			p.directions{
				width:25%; 
				height:200px; 
				font-size: 12px; 
				line-height: 20px;
			}
			span.lines{
				color:#F34A4A; 
				margin: 0 23px;
			}
		}
		@media screen and (max-width: 667px) {
			#shell{
				width: 530px;
			}
			.map-responsive{
    			height:200px;
			}
			.catalog {
				-webkit-column-gap: 15px; /* Chrome, Safari, Opera */
    			-moz-column-gap: 15px; /* Firefox */
    			column-gap: 15px;
			}
				.catalog p {
					font-size: 12px;
			}
			.quote-info {
    			-webkit-column-count: 1; /* Chrome, Safari, Opera */
    			-moz-column-count: 1; /* Firefox */
    			column-count: 1;
    			-webkit-column-rule-width: 0px; /* Chrome, Safari, Opera */
    			-moz-column-rule-width: 0px; /* Firefox */
    			column-rule-width: 0px;
				padding:25px;
			}			
			h2{
				padding:12px 25px 0px 25px;
				font-size:20px; 
				line-height:27px;
			}
			div.social {							
				font-size: 20px;
				padding: 20px 0;
			}
			div.social a{
				padding: 0 12px;
			}

	}
		@media screen and (max-width: 568px) {
			#shell{
				width: 460px;
			}
			.map-responsive{
    			height:180px;
			}
			div.logo{
				width: 140px;
				padding-bottom: 7px;
				margin-top:4px;
			}
			span.lines{
				display:none;
			}

		}
		@media screen and (max-width: 480px) {
			#shell{
				width: 390px;
			}
			.buttons {
				-webkit-column-gap: 1px; /* Chrome, Safari, Opera */
    			-moz-column-gap: 1px; /* Firefox */
    			column-gap: 1px;
				-webkit-column-rule-width: 1px; /* Chrome, Safari, Opera */
    			-moz-column-rule-width: 1px; /* Firefox */
    			column-rule-width: 1px;
				-webkit-column-rule-color: #f00; /* Chrome, Safari, Opera */
    			-moz-column-rule-color: #f00; /* Firefox */
    			column-rule-color: #f00;
			}
			
			.buttons img {
				border: none;
			}
			.blueberry {
				padding: 0px;
			}
			.innershell{
				border: none;
			}
			.innershell p{
				padding:10px 10px;
				font-size: 12px;
				line-height: 16px;
			}
			.map-responsive{
    			height:200px;
				border: none;
			}
			.catalog {
				position: relative;
    			-webkit-column-count: 1; /* Chrome, Safari, Opera */
    			-moz-column-count: 1; /* Firefox */
    			column-count: 1;
				-webkit-column-gap: 0px; /* Chrome, Safari, Opera */
    			-moz-column-gap: 0px; /* Firefox */
    			column-gap: 0px;
				margin-top: 30px;
			}
				.catalog p {
					background:#F34A4A;
					color: #242E33;
					font-size: 15px;
					padding: 20px 0px;
			}
			.catalog-content{
				margin-bottom: 20px;
				width:100%;
				border: 0px;
			}
			.catalog-content:hover{
				border: 0px;
			}
			.team {
    			-webkit-column-count: 1; /* Chrome, Safari, Opera */
    			-moz-column-count: 1; /* Firefox */
    			column-count: 1;
				-webkit-column-gap: 0px; /* Chrome, Safari, Opera */
    			-moz-column-gap: 0px; /* Firefox */
    			column-gap: 0px;
				margin-bottom: 10px;
			}
				.team img {
					width:100%;
			}
			h1{
				padding:12px 15px; 
				font-size: 12px; 
				line-height: 17px;
			}
			h2{
				padding:12px 15px 0px 15px;
				font-size:16px; 
				line-height:23px;
			}
			.quote-info {
				padding:12px 15px;
    			font-size:12px;
			}

		}
		@media screen and (max-width: 400px) {
			#shell{
				width: 319px;
			}
		}
		@media screen and (max-width: 320px) {
			#shell{
				width: 280px;
			}
		}
	.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }