@import url(https://fonts.googleapis.com/css?family=Merriweather:400,400italic|Open+Sans);
* { margin: 0; padding: 0; outline: 0; }

body, html { height: 100%; }

body {
	font-size: 16px;
	line-height: 26px;
	font-family: 'Open Sans', sans-serif;
	color: #383838;
	background: url(images/bkgd.gif) repeat 0 0;
	min-width: 100%;
}

a { color: #0252aa; text-decoration: none; cursor: pointer; }
a:hover { text-decoration: underline; }
a img { border: 0; }
a.more { color: #2b9208; text-decoration: underline; padding-left: 11px; background: url(images/arr-ico.png) no-repeat 0 5px; }
a.more:hover { text-decoration: none;  }
input, textarea, select { font-size: 12px; font-family: arial, sans-serif; }
textarea { overflow: auto; }

.cl { display: block; height: 0; font-size: 0; line-height: 0; text-indent: -4000px; clear: both; }
.notext { font-size: 0; line-height: 0; text-indent: -4000px; }
.left, .alignleft { float: left; display: inline; }
.right, .alignright { float: right; display: inline; }
.txtrt { text-align: right; }
body.home .btt { display: none; }
.btt { text-align: center; margin-bottom: 15px; margin-top: 60px; }
.btt a, .btt a:visited { color: #777; text-decoration: none; }
hr { width: 100%; border:none; height:4px; background: url(images/green-div.png) repeat-x; margin: 25px 0; }

footer, header, menu, nav, { display: block; }

.shell { max-width: 1185px; margin: 0 auto; padding: 0 4%; }
#header { float: left; width: 310px; }
#logo { width: 100%; float: left; margin-top: 20px; margin-bottom: 42px; font-size: 0; line-height: 0;}
#logo a { height: 112px; display: block; background: url(images/resource-restoration-group-logo.png) no-repeat 0 0; }
#logo a:hover { opacity: 0.5; filter: alpha(opacity=50); /* For IE8 and earlier */
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition:    all 0.2s ease-in-out;
	-ms-transition:     all 0.2s ease-in-out;
	-o-transition:      all 0.2s ease-in-out;
	transition:         all 0.2s ease-in-out;
}
.nav-contact-cont { clear: both; }

#navigation { margin-bottom: 60px; font: 20px 'Merriweather', serif; clear: both; }
#navigation ul { list-style: none; list-style-position: inside; }
#navigation ul li { margin-bottom: 26px; }
#navigation ul li a { display: block; color: #383838; padding-left: 13px; }
#navigation ul li a:hover { text-decoration: none; color: #8e7f50; border-left: 3px solid #8e7f50; padding-left: 10px; }
.menu_button { display: none; }

.side-contact { margin-bottom: 0px; padding-left: 13px; font: 20px 'Merriweather', serif; clear: both; color: #8e7f50; }
.side-contact ul { list-style: none; list-style-position: inside; }
.side-contact ul li { margin-bottom: 16px; }
.side-contact a { color: #8e7f50; }

/* Slider */
.rslides { position: relative; top: -60px; list-style: none; overflow: hidden; max-width: 904px; padding: 0; margin: 0;  }
.rslides li { -webkit-backface-visibility: hidden; position: absolute; display: none; width: 100%; left: 0; top: 0; }
.rslides li:first-child { position: relative; display: block; float: left; }
.rslides img { display: block; height: auto; float: left; width: 100%; border: 0; }

.home-mission { width: 310px; margin: 40px 0 40px 10px; padding-top: 15px; background: url(images/green-div.png) repeat-x; font-size: 0; line-height: 0; text-indent: -4000px; }
body.home .home-mission { width: 310px; margin: 40px 0 40px 10px; padding-top: 15px; font: 18px 'Merriweather', serif; font-style: italic; line-height: 26px; text-indent: 0; color: #819a7e; background: url(images/green-div.png) repeat-x;  }
.home-mission-m { display: none; } 
.int-mission { margin-bottom: 10px; font: 17px 'Merriweather', serif; font-style: italic; line-height: 26px; color: #819a7e; text-align: center; }
body.home .int-mission { display: none; }

p { margin-bottom: 25px; }
.quote { padding: 25px; font: 20px 'Merriweather', serif; font-style: italic; line-height: 36px; color: #819a7e; }
.small { font-size: 15px; margin-right: 5px; }
.video { background-color: #000; }
.rt-inset-video { width: 50%; float: right; margin-left: 20px; }
.rt-inset { float: right; max-width: 100%; height: auto; margin-left: 20px; margin-top: 10px; border-radius: 0 20px; -moz-border-radius: 0 20px; -webkit-border-radius: 0 20px; }

#project-links { font: 22px 'Merriweather', serif; }
#project-links ul { list-style: none; list-style-position: inside; }
#project-links ul li { width: 48%; float: left; margin: 1%;  background: none; padding-bottom: 0px; padding-left: 0px; }
#project-links li { text-align: center; }
#project-links ul li a { padding-top: 10%; height: 100px; display: block;  color: #002246; text-shadow: 2px 1px #CCC; border-radius: 0 20px; -moz-border-radius: 0 20px; -webkit-border-radius: 0 20px; }
#project-links ul li a:hover { color: #002246; opacity: 0.6; filter: alpha(opacity=60); /* For IE8 and earlier */ text-decoration: none; border: none; 	 
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition:    all 0.2s ease-in-out;
	-ms-transition:     all 0.2s ease-in-out;
	-o-transition:      all 0.2s ease-in-out;
	transition:         all 0.2s ease-in-out;
 }
.p-sr { background: url(images/projects-stream-restoration.jpg) no-repeat top center; }
.p-rsc { background: url(images/projects-rsc.jpg) no-repeat top center; }
.p-brg { background: url(images/projects-rain-garden.jpg) no-repeat top center; }
.p-sp { background: url(images/projects-shoreline-protection.jpg) no-repeat top center; }

.main {  }
.main-rt { width: 65%; float: right; margin-top: 20px;  }
.hbanner { margin-bottom: 25px; border-radius: 0 10px; -moz-border-radius: 0 10px; -webkit-border-radius: 0 10px; display: block; height: auto; float: left; width: 100%; border: 0; }
.main h1, .main-rt h1 { font-size: 25px; color: #002246; line-height: 36px; margin-top: 25px;  padding-bottom: 8px; font-family: 'Merriweather', sans-serif; }
.main h2, .main-rt h2 { font-size: 22px; color: #2d5900; line-height: 28px; margin-top: 15px; padding-bottom: 8px; font-family: 'Merriweather', sans-serif; }
.main h3, .main-rt h3 { font-size: 18px; color: #5e5e5e; line-height: 22px; padding-bottom: 8px; font-family: 'Merriweather', sans-serif; }
.main ul, .main-rt ul { list-style: none; list-style-position: outside; }
.main ul li, .main-rt ul li { padding-bottom: 6px; padding-left: 10px; background: url(images/arr-ico.png) no-repeat 0 12px; }
.main ul li a, .main-rt ul li a { color: #0252aa; text-decoration: none; } 
.main ul li a:hover, .main-rt ul li a:hover { text-decoration: underline; } 

.full-twothird-col { float: left; width: 65%; padding: 2%; }
.full-onethird-col { float: left; width: 27%; padding: 2%; }

.main .cols { padding-left: 0; padding-right: 0; }
.main .cols .col { width: 314px; float: left; }
.main .cols .col:after { content:''; width: 100%; clear: both; }
.main .cols .col + .col { padding-left: 20px; }
.main .cols .col img { float: left; width: 129px; height: 108px;  }
.main .cols .col-cnt { width: 183px; float: right; }

.popup-gallery img { width: 130px; height: auto; margin: 5px; border: 5px solid #ded9c2; border-radius: 0 10px; -moz-border-radius: 0 10px; -webkit-border-radius: 0 10px; }
.popup-gallery a:hover img { border-color: #beb9a6; }
.popup-gallery:after { content:''; width: 100%; clear: both; }

#footer { font-size: 13px; background: url(images/footer-bkgd.png) repeat-x; padding: 20px; margin-bottom: 40px; margin-top: 20px; border-radius: 10px 10px 0 0; }
#footer a { color: #8e7f50; text-decoration: none; }
#footer a:hover { color: #aa9860; }
.footer-cols { float: left; width: 50%; }
.fi { font-family: 'Merriweather', sans-serif; }
.connections2 { display: none; text-align: center; }

/* #Media Queries
================================================== */

/* ipad portrait */
@media only screen and ( min-width: 768px) and ( max-width: 980px ) {
	body { width: 100%; }
	.shell { width: 100%; padding: 0; margin: 0 auto; }
	#header { float: none; height: 75px; width: 92%; padding: 10px 4%; clear: none; z-index: 1000;  }
	
	#logo { width: 250px; float: left; margin-top: 0; margin-bottom: 0; }
	#logo a { height: 75px; display: block; background: url(images/resource-restoration-group-logo_m.png) no-repeat 0 0; }
	.nav-contact-cont { width: 60%; float: right; clear: none; margin: 0 auto; }
	
	.side-contact { float: left; width: 45%; margin-top: 10px; margin-left: 0; margin-right: 20px; margin-bottom: 0; font-size: 18px; clear: none; }
	.side-contact ul { list-style-position: outside; }
	.side-contact ul li { margin-bottom: 5px; text-align: center; }
	.t { width: 100%; }
	.e { width: 100%; }
	.connections1 { display: none; }
	
	#navigation { position: absolute; top: 0; right: 4%; margin-top: 15px; margin-left: 0px; margin-bottom: 0px; padding: 5px 8px; background-color: #d6ceb3; color: #fff; text-align: center; clear: none; border-radius: 5px; }
	#navigation ul { display: none; list-style: none; margin-left: 0; padding-left: 0; margin-bottom: 0; }
	#navigation ul.expanded { display: block; }
	#navigation ul li { margin-bottom: 0; }
	#navigation ul li a { display: block; padding: 20px; border-top: 1px solid #a9975e; font-size: 18px; color: #383838; text-decoration: none; }
	#navigation ul li a:hover,
	#navigation ul li.active a { text-decoration: none; text-align: center; color: #8e7f50; border-left: 0; padding: 20px; background-color: #e8e0c4; }
	.menu_button { display: block; text-align: right; color: #8e7f50; text-decoration: none; }
	.menu_button:hover { color: #7f7247; text-decoration: none; }
	
	.home-mission { display: none; }
	.home-mission-m { display: block; margin-top: 20px; margin-bottom: 40px; padding-top: 15px; font: 20px 'Merriweather', serif; font-style: italic; text-align: center; color: #819a7e; background: url(images/green-div.png) repeat-x; clear: both; } 

	.rslides { position: relative; top: 0px; clear: both; margin: 0 4%; }
	.rslides img { display: block; height: auto; float: none; width: 100%; border: 0; }
	
	.quote { text-align: center; }

	#project-links ul li { width: 42%; float: left; margin: 1%; background: none; padding-bottom: 0px; padding-left: 0px; }
	
	.full-twothird-col { float: none; width: 100%; padding: 0; }
	.full-onethird-col { float: none; width: 100%; padding: 0; }

	.main { padding: 0 4%; }
	.main-rt { width: 92%; float: none; padding: 0 4%; clear: both;  }
	.hbanner { float: none; width: 100%; }
	.main .cols { margin: 0; padding-left: 30px; padding-right: 22px;   }
	.main .cols .col { width: 188px; }
	.main .cols .col img { float: none; display: block; margin: 0 auto;  }
	.main .cols .col + .col { padding-left: 66px; }
	.main .cols .col-cnt {text-align: center; }

	.connections2 { display: block; }
	.footer-cols { float: none; width: 100%; text-align: center; }
	.txtrt { text-align: center; }
}
	
@media only screen and ( max-width: 767px) { 
	body { width: auto; font-size: 17px; line-height: 26px; }
	.shell { width: 95%; margin: 0 auto; padding: 0; }
	#header { width: 92%; position: relative; z-index: 1000; padding: 0 4%; }
	#logo { width: 220px; float: none; display: block; margin: 0 auto; padding: 10px;  }
	#logo a { height: 75px; background: url(images/resource-restoration-group-logo_m.png) no-repeat 0 0; }
	.nav-contact-cont { max-width: 100%; float: none; clear: both; margin: 0 auto; padding: 0; }

	.side-contact { float: none;  margin-top: 0; margin-left: 0; margin-right: 20px; margin-bottom: 10px; font-size: 18px; clear: none; }
	.side-contact ul { list-style-position: outside; }
	.side-contact ul li { margin-bottom: 5px; text-align: center; }
	.t { width: 100%; }
	.e { width: 100%; }
	.connections1 { display: none; }
	
	#navigation { position: absolute; top: 0; right: 0; margin-top: 15px; margin-left: 0; margin-bottom: 20px; padding: 5px 7px; background-color: #d6ceb3; color: #fff; text-align: center; clear: none; border-radius: 5px; }
	#navigation ul { display: none; list-style: none; margin-left: 0; padding-left: 0; margin-bottom: 0; }
	#navigation ul.expanded { display: block; }
	#navigation ul li { margin-bottom: 0; }
	#navigation ul li a { display: block; padding: 20px; border-top: 1px solid #a9975e; font-size: 18px; color: #383838; text-decoration: none; }
	#navigation ul li a:hover,
	#navigation ul li.active a { text-decoration: none; text-align: center; color: #8e7f50; border-left: 0; padding: 20px; background-color: #e8e0c4; }
	.menu_button { display: block; text-align: center; color: #8e7f50; text-decoration: none; font-size: 16px; }
	.menu_button:hover { color: #7f7247; text-decoration: none; }

	.home-mission { display: none; }
	.home-mission-m { display: block; margin-bottom: 30px; padding-top: 15px; font: 18px 'Merriweather', serif; font-style: italic; text-align: center; color: #819a7e; background: url(images/green-div.png) repeat-x; clear: both; } 

	.rslides { position: relative; top: 0px; clear: both; margin: 0 2%; }
	.rslides img { display: block; height: auto; float: none; width: 100%; border: 0; }

	.quote { text-align: center; font-size: 19px; line-height: 28px; }
	.rt-inset-video { width: 100%; float: none; margin-left: 0; margin-bottom: 10px; }
	.rt-inset { float: none; margin-left: 0; margin-bottom: 10px; margin-top: 0;}
	.main h1, .main-rt h1 { font-size: 20px; color: #002246; line-height: 26px; margin-top: 25px;  padding-bottom: 8px; font-family: 'Merriweather', sans-serif; }
	.main h2, .main-rt h2 { font-size: 18px; color: #2d5900; line-height: 22px; margin-top: 15px; padding-bottom: 8px; font-family: 'Merriweather', sans-serif; }
	
	#project-links ul li { width: 100%; float: none; margin: 0; margin-bottom: 15px; }
	.p-sr, .p-rsc, .p-brg, .p-sp { width: 100%; background-size: cover; }

	
	.full-twothird-col { float: none; width: 100%; padding: 0; }
	.full-onethird-col { float: none; width: 100%; padding: 0; }

	.main { padding: 0 4%; }
	.main-rt { width: 92%; float: none; padding: 0 4%; clear: both; margin: 0 auto;  }
	.hbanner { float: none; width: 100%; }
	.main .cols { margin: 0; }
	.main .cols .col { width: 188px; float: none; display: block; padding-bottom: 22px; margin: 0 auto; }
	.main .cols .col img { float: none; display: block; margin: 0 auto; }
	.main .cols .col + .col { padding-left: 0px; }
	.main .cols .col-cnt { text-align: center; float: none; display: block;  }
	.main a.m-btn-grey { display: block; background: url(images/m-btn-grey.png) repeat-x 0 0; margin: 0 10px 14px;  height: 39px; text-align: center; line-height: 39px; border: 1px solid #9e9f9f; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; -o-border-radius: 6px; display: block; font-weight: bold; font-size: 18px;  color: #636363; text-shadow: rgba(255,255,255,0.4) 0px 1px 0px; }
	.main a.m-btn-grey:hover { background-position: 0 bottom; text-decoration: none; }

	.popup-gallery img { width: 120px; height: auto; margin: 2px; border: 5px solid #ded9c2; border-radius: 0 10px; -moz-border-radius: 0 10px; -webkit-border-radius: 0 10px; }
	
	.footer-cols { float: none; width: 100%; text-align: center; }
	.footer-cols .col + .col { padding-left: 0px; }
	.connections2 { display: block; }
	.txtrt { text-align: center; }
}

@media only screen and ( max-width: 767px) and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-resolution: 240dpi)  { 

	#logo { width: 220px; float: none; display: block; margin: 0 auto; padding: 10px; padding-bottom: 5px;  }
	#logo a { height: 75px; background: url(images/resource-restoration-group-logo_m.png) no-repeat 0 0; }
	
	.home-mission-m { background: none; }
	
}