@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,500,700);
body { font-size: 16px; margin: 0px; color: #313140; font-family: 'Roboto', sans-serif !important; font-weight:300;}
::selection { background: #7CB438; /* WebKit/Blink Browsers */ }
::-moz-selection {
background: #7CB438; /* Gecko Browsers */
}

.hide {display:none;}
img { max-width: 100%; height: auto; }
.wedidthis { text-align: right; }
.closeOC { padding: 20px 15px 15px 15px; cursor: pointer; }
.navbar-toggle-overidde { border-radius: 0px !important; width: 40px; }
.SpacingBottom { margin-bottom: 40px; }
/*-- SITE SPECIFIC --*/
p, .Normal, li, ol { font-size: 16px; line-height: 160%; font-family: 'Roboto', sans-serif !important; font-weight:300;}
a, a:link, a:visited {color: #7CB438;}
ul { margin-left: 40px; list-style-image: none; list-style-type: circle; }
a:hover {color: #211E1F;}
h1 {font-size: 28px !important; text-shadow: 4px 4px 8px rgba(200, 200, 200, 1);}
h2 {color: #7CB438 !important; font-size:26px !important; font-weight:300 !important; text-shadow: 4px 4px 8px rgba(200, 200, 200, 1);}
h3 {color: #7CB438 !important; font-size:24px !important; font-weight:300 !important; text-shadow: 4px 4px 8px rgba(200, 200, 200, 1);}
h4 {color: #7CB438 !important; font-size:22px !important; font-weight:300 !important; text-shadow: 4px 4px 8px rgba(200, 200, 200, 1);}
h5 {color: #7CB438 !important; font-size:18px !important; font-weight:300 !important;}
.mainHeader { }
.logo { height: 120px; line-height: 120px; }
.tag { height: 120px; line-height: 120px; text-align: right; }
.contentWrapper { background-color: #EEEEEE; text-align: left; padding-top: 20px; padding-bottom: 20px; }
.homeCallWrapper { background-color: #211E1F; text-align: center; padding-top: 10px; padding-bottom: 10px; font-size: 24px; }
.homeCallWrapper a, .homeCallWrapper a:visited { color: #FFFFFF; text-decoration: none; }
.homeCallWrapper a:hover { color: #7CB438; text-decoration: none; }
.threeColWrapper { padding-top: 10px; padding-bottom: 40px; background-image: url(images/54339242-3-blur.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; text-align: center; }
.whiteBox { padding: 20px; background-color: #FFFFFF; position: relative; height: 100%; display: block; }
.whiteBox h3 { text-transform: uppercase; }
.border { padding: 0px; background-color: transparent; }
.shadow { display: block; position: relative; }
.shadow img { display: block; width: 100%; }
.shadow::before { display: block; content: ''; position: absolute; width: 100%; height: 100%; -moz-box-shadow: inset 0px 0px 3px 1px rgba(0,0,0,0.2); -webkit-box-shadow: inset 0px 0px 3px 1px rgba(0,0,0,0.2); box-shadow: inset 0px 0px 3px 1px rgba(0,0,0,0.2); }
.blackBar { height: 6px; background-color: #211E1F; margin-top: 6px; }
.greenBtn { background-color: #7CB438; display: block !important; padding-top: 10px; padding-bottom: 10px; color: #FFFFFF !important; text-align: center; }
.greenBtnLrg {background-color: #7CB438; display: block !important; padding: 14px; color: #FFFFFF !important; text-transform: uppercase; font-weight:500; font-size:18px; }
.greenBtnLrg:hover { text-decoration: none; background-color: #9FCF65; }
.hvr-fade:hover { background-color: #ECECEC !important; color: #000000 !important; }
.greenBarWrapper { background-color: #7CB438; text-align: center; color: #FFFFFF; padding-top: 10px; padding-bottom: 10px; font-size: 24px; }
.logosBarWrapper { background-color: #EEEEEE; padding-top: 10px; padding-bottom: 10px; }
.footerWrapper { background-color: #211E1F; color: #FFFFFF; padding-top: 20px; padding-bottom: 40px; font-size: 12px; background-image: url(images/wood_1.png); background-repeat: repeat; }
.twoColWrapper { padding-top: 20px; padding-bottom: 20px; background-color: #EEEEEE; }
cite { font-size: 14px; text-transform: uppercase; }
.headingGreen h3 { color: #7CB438; }
.greenBarTop { border-top: 6px solid #7CB438; padding-top: 20px; }
.slider p { line-height: 180%; }
.clearBtn { background-color: transparent; display: block !important; padding-top: 10px; padding-bottom: 10px; color: #7CB438 !important; font-size: 16px; text-transform: uppercase; float: right; }
.mediaNav { list-style: none; margin-left: 0px; font-size: 18px; }
.mediaNav li { border-bottom: 1px solid #FFFFFF; }
.mediaNav li a, .mediaNav li a:visited { display: block; padding-top: 6px; padding-bottom: 6px; color: #1F1E1F; text-decoration: none; }
.mediaNav li a:hover { display: block; padding-top: 6px; padding-bottom: 6px; color: #7CB438; }
.footerWrapper hr { border: 0; border-bottom: 1px dashed #5C5457; background: #5C5457; }
.contactBtns { display: block; text-align: center; }
.headingWrapper { position: relative; height: 180px; background-image: url(images/backgrounds/zoom-23530905-3.jpg); background-position: center bottom; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; }
.headingWrapper h1 { font-weight:400; position: absolute; bottom: 5px !important; z-index: 11; color: #FFF; text-shadow: 2px 2px 2px rgba(0,0,0,0.36); font-size: 28px; margin-left: 20px;}
.greenbarHeading { background-color: #7CB438; height: 60px; width: 100%; position: absolute; bottom: 0px !important; z-index: 10; opacity: 0.88 !important; }
.randbg { background: url('images/backgrounds/zoom-23530905-3.jpg') no-repeat center bottom fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
.randbg.bg1 { background-image: url('images/backgrounds/zoom-54339242-3.jpg'); }
.randbg.bg2 { background-image: url('images/backgrounds/zoom-9060339-3.jpg'); }
.leftAlign {text-align:left;}
.fb-page  {width: 100% !important; margin: 0px !important; padding: 0px !important; border: solid 1px #CCCCCC;}
.processStep { display: block; width: 30px; height: 30px; background-color: #7CB438; border-radius: 15px; line-height: 30px; color: #FFFFFF; font-size: 16px; font-weight: 500; text-align: center; box-shadow: inset 0px 0px 1px 0px rgba(0,0,0,0.30); -webkit-box-shadow: inset 0px 0px 1px 0px rgba(0,0,0,0.30); margin-top: 5px; }
.boldGreenText {font-weight:500; color:#7CB438;}
cite {color:#7CB438; font-weight: 400;}
.sqaure {width: 50px; height: 50px; line-height: 50px; text-align:center; display:block; background-color: #7CB438; color: #FFFFFF; margin-top: 4px;  }
.spaceBar {height: 6px; background-color: #7CB438; margin-top: 20px; margin-bottom: 20px;}
/* Background */
.rsDefault,
.rsDefault .rsOverflow,
.rsDefault .rsSlide,
.rsDefault .rsVideoFrameHolder,
.rsDefault .rsThumbs { background: #E4E4E4 !important; color: #151515; border-radius: 5px; padding-left: 3px; padding-right: 5px; padding-bottom: 10px; }

.rsDefault .rsThumb.rsNavSelected {
	background: transparent !important; border: 4px solid #7CB438;
}

/* creates triangle */
.triangle-isosceles:after {
  content:"";
  position:absolute;
  bottom:-10px; /* value = - border-top-width - border-bottom-width */
  left:25px; /* controls horizontal position */
  border-width:10px 10px 0; /* vary these values to change the angle of the vertex */
  border-style:solid;
  border-color:#7CB438 transparent;
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
}

.details { margin:165px 20px; color: #FFFFFF; text-transform:uppercase; }
.details p {font-size:22px;}
.details a:link, .details a:hover, .details p {text-decoration:none !important; color: #FFFFFF;}
.bar .mosaic-overlay:hover {text-decoration:none !important;}

.details .btn {font-size:20px; margin-top: 30px;}	
.details .btn:hover {color: #FFFFFF;}
.mosaic-overlay a:hover {text-decoration:none !important;}
.mosaic-backdrop {text-align:center !important;}
.mosaicHeading { text-transform: uppercase; font-weight:500 !important; display: block; z-index: 10; position: relative; background-color: rgba(255,255,255,0.78); line-height: 40px; top: 10px; padding-top: 20px; padding-bottom: 20px; }

/************************************
 * Close button
************************************/
.closebt-container {
	position: relative;
	width:100%;
	text-align:center;
	margin-top:40px;
}

.closebt {
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-ms-transition: all 0.2s;
	-o-transition: all 0.2s;
	transition: all 0.2s;
	cursor:pointer;
}

.closebt:hover {
	transform:rotate(90deg);
}

#item > p  {
	margin:0px;
	color:#E74B3D;
}

.modal-content2 {text-align:center;}
.modal-content2 h3 {color: #FFFFFF !important; text-transform:uppercase; font-weight:700 !important;}

		#makeMeScrollable
		{
			width:100%;
			height: 330px;
			position: relative;
		}
		#makeMeScrollable div.scrollableArea img {max-height: 330px;}
		/* Replace the last selector for the type of element you have in
		   your scroller. If you have div's use #makeMeScrollable div.scrollableArea div,
		   if you have links use #makeMeScrollable div.scrollableArea a and so on. */
		#makeMeScrollable div.scrollableArea a
		{
			position: relative;
			float: left;
			margin: 0;
			padding: 0;
			
			/* If you don't want the images in the scroller to be selectable, try the following
			   block of code. It's just a nice feature that prevent the images from
			   accidentally becoming selected/inverted when the user interacts with the scroller. */
	/*		-webkit-user-select: none;
			-khtml-user-select: none;
			-moz-user-select: none;
			-o-user-select: none;
			user-select: none;*/
		}
		
		
.mosaic-block {margin: 3% !important; max-width:27% ; max-height:380px ; border:2px solid transparent !important;}

.projectThumbnail {position:relative; text-align: center !important; overflow:hidden; margin-bottom: 20px;}
.projectThumbnail h4  {font-size: 14px !important; text-transform:uppercase; color: #ffffff !important; position:absolute; z-index: 100; bottom: 40%; width: 100%; height: 40px; line-height: 40px; border-top: 1px solid #ffffff; border-bottom: 1px solid #ffffff;}
.projectThumbnail img {border: 2px solid #FFFFFF;}

.projCover {display: block; background:#7CB438; width: 92% !important; height: 100%; position:absolute; z-index: 99; margin-top: 300px;}

@media screen and (max-width: 1199px) {
	.mosaic-block {
	float:left;
	position:relative;
	overflow:hidden;
	width:400px; 
	height:400px !important;
	margin:0px;
	background:#fff url(../img/progress.gif) no-repeat center center;
	border:2px solid transparent;
	-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.5);
}
}

@media screen and (max-width: 992px) {
	.mosaic-block {
	float:left;
	position:relative;
	overflow:hidden;
	width:400px; 
	height:300px !important;
	margin:0px;
	background:#fff url(../img/progress.gif) no-repeat center center;
	border:6px solid transparent;
	-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.5);
}
.details p {font-size:16px;}
.details { margin:115px 20px; color: #FFFFFF; text-transform:uppercase; }
.projCover {display: block; background:#7CB438; width: 94.5% !important; height: 100%; position:absolute; z-index: 99; margin-top: 500px;}
}

@media screen and (max-width: 768px) {
	
	.mosaic-block {
	float:none;
	position:relative;
	overflow:hidden;
	width:100% !important; 
	max-width:99% ;
	height:550px !important;
	margin:0px;
	background:#fff url(../img/progress.gif) no-repeat center center;
	border:6px solid transparent;
	-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.5);
}
.mosaics {padding-left: 80px; padding-right:80px;}
.mosaics .col-md-4 {margin-bottom: 10px !important;}

.projCover {display: block; background:#7CB438; width: 97% !important; height: 100%; position:absolute; z-index: 99; margin-top: 800px;}
}

@media screen and (max-width: 550px) {
	.mosaics {padding-left: 30px; padding-right: 30px;}
	.details { margin:125px 20px; color: #FFFFFF; text-transform:uppercase; }
}

@media screen and (max-width: 468px) {
.mosaic-block {
	float:left;
	position:relative;
	overflow:hidden;
	width:400px; 
	height:450px !important;
	margin:0px;
	background:#fff url(../img/progress.gif) no-repeat center center;
	border:6px solid transparent;
	-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.5);
}
}
/*///// ROYAL SLIDER /////*/
.greenbar { background-color: #7CB438; height: 60px; width: 100%; position: relative; bottom: 0px !important; z-index: 400; margin-top: 94px; }
.redbar { background-color: transparent; height: 154px; width: 100%; position: relative; bottom: 0px !important; z-index: 501; }
.redbar img { float: right; }
.bContainer { position: relative; z-index: 9999 !important; }
.txtCent { text-align: center; width: 100%; }
.redbar img { width: auto !important; height: auto !important; }
.slide1 .bContainer { bottom: 140px; position: absolute; width: 100%; }
.slide2 .bContainer { bottom: 140px; position: absolute; width: 100%; }
.slide3 .bContainer { bottom: 140px; position: absolute; width: 100%; }
#full-width-slider { width: 100%; color: #FFF; }
.fullWidth { max-width: 1400px; margin: 0 auto 24px; }

@media screen and (min-width:960px) and (min-height:660px) {
.heroSlider .rsOverflow, .royalSlider.heroSlider { height: 520px !important; }
}

@media screen and (min-width:960px) and (min-height:1000px) {
.heroSlider .rsOverflow, .royalSlider.heroSlider { height: 660px !important; }
}

@media screen and (min-width: 0px) and (max-width: 800px) {
.royalSlider.heroSlider, .royalSlider.heroSlider .rsOverflow { height: 300px !important; }
}

@media screen and (min-width: 0px) and (max-width: 740px) {
.royalSlider.heroSlider, .royalSlider.heroSlider .rsOverflow { height: 200px !important; }
.greenbar { background-color: #7CB438; height: 60px; width: 100%; position: relative; bottom: 0px !important; z-index: 400; margin-top: 24px; opacity: 0.58 !important; }
.slide1 .bContainer { bottom: 78px; position: absolute; width: 100%; }
.slide2 .bContainer { bottom: 78px; position: absolute; width: 100%; }
.slide3 .bContainer { bottom: 78px; position: absolute; width: 100%; }
.redbar img { max-width: 300px !important; height: auto; }
}

@media screen and (max-width: 590px) {
.royalSlider.heroSlider, .royalSlider.heroSlider .rsOverflow { height: 160px !important; }
.greenbar { background-color: #7CB438; height: 60px; width: 100%; position: relative; bottom: 0px !important; z-index: 400; margin-top: 24px; }
.slide1 .bContainer { bottom: 78px; position: absolute; width: 100%; }
.slide2 .bContainer { bottom: 78px; position: absolute; width: 100%; }
.slide3 .bContainer { bottom: 78px; position: absolute; width: 100%; }
.redbar img { max-width: 300px !important; height: auto; }
}