/* custom styles for roofrite */
 
* {
	font-family: "Signika" !important;
}
body {
}
/*--------------------------------------------------------
 WRAPPER
 -------------------------------------------------------*/
div#content {
	padding-top: 0;
}
div#main-sidebar-container {
    width: 100%;
	float: left;
}
#wrapper {
    overflow-x: inherit;
}
/*--------------------------------------------------------
 NAVIGATION
 -------------------------------------------------------*/
#navigation {
    width: 100%;
    float: left !important;
    margin: 24px 0;
    clear: none;
}
ul.nav li a {
	padding: 0 .8em !important;
}
/*--------------------------------------------------------
 HEADER
 -------------------------------------------------------*/
div#header-wrapper {
	margin: 10px auto 32px auto;
}
header#header {
	width: 30%;
	float: left !important;
    padding: 0 !important;
}
div#top-right-text {
	width: 70%;
	float: right;
	font-size: 18px;
	color: #4ba4ac;
	text-align: right;
	margin-bottom: 7px;
}
	div#top-right-text p {
		color: #4ba4ac;
	}
	div#top-right-text h3 {
		font-size: 24px;
		color: #4ba4ac;
		font-weight: normal;
	}
/*--------------------------------------------------------
 SLIDER
 -------------------------------------------------------*/
div#image-slider-wrapper {
    width: 100%;
	float: left;
	margin: 0 0 10px 0;
}
div#loopedSlider {
    margin-bottom: 0;
}
	div#loopedSlider.business-slider .content {
		left: -999999px;
	}
	div#loopedSlider .content {
		display: none;
	}
/*--------------------------------------------------------
 CONTENT
 -------------------------------------------------------*/
article.post, 
article.page, 
div#contact-page 
{
	width: 96%;
	float: left;
	padding: 20px 2%;
	background-color: #fafafa;
}

#content {
    margin-top: -20px;
}
/*--------------------------------------------------------*/
div.post-entries {
	width: 94%;
	float: left;
	padding: 20px 3%;
	background-color: #FFF;
}

/*--------------------------------------------------------*/
div#contact-us-wrapper {
	width: 100%;
	float: left;
}
	div#contact-us-wrapper div.col {
		width: 32%;
		float: left;
		margin-right: 2%;
	}
	div#contact-us-wrapper div.col:last-child {
		margin-right: 0;
	}
/*--------------------------------------------------------
 FOOTER
 -------------------------------------------------------*/
div#footer-section {
	width: 100%;
	float: left;
	margin: 0 0 20px 0;
}
	div#footer-section div.header {
		width: 100%;
		float: left;
		margin: 0 0 25px 0;
	}
	div#footer-section section {
		width: 32%;
		float: left;
		margin-right: 2%;
		font-size: 18px;
		line-height: 25px;
	}
	div#footer-section section:first-child {
		width: 30%;
	}
	div#footer-section section:last-child {
		margin-right: 0;
	}
		div#footer-section section h4 {
			font-size: 20px;
			font-weight: normal;
			padding: 0 0 20px 0;
			border-bottom: 1px dotted #000;
		}
		div#footer-section section a {
			color: #FFF;
			text-decoration: none;
		}
		div#footer-section section a:hover {
			text-decoration: underline;
		}
		div#footer-section section article {
			width: 100%;
			float: left;
			font-size: 18px;
			font-weight: normal;
			color: #FFF;
		}
		div#footer-section section img {
			margin: 0 0 10px 0;
		}
		div#footer-section section p {
			font-size: 18px;
		}
		div#footer-section section address {
			width: 100%;
			float: left;
			font-style: normal;
			margin: 0 0 20px 0;
		}
/*--------------------------------------------------------*/
div#credit a {
	color: #FFF;
}
div#copyright p,
div#credit p
{
	margin: 0;
}
div#copyright {
	width: 50%;
	float: left;
}
div#credit {
	width: 50%;
	float: right;
	text-align: right;
}
/*--------------------------------------------------------*/

/*--------------------------------------------------------
 INTRODUCTION AREA
 -------------------------------------------------------*/


/*--------------------------------------------------------
 FEATURES
 -------------------------------------------------------*/
section#welcome-text {
	width: 100%;
	float: left;
}
	section#welcome-text h1 {
		margin-bottom: 20px;
	}
	section#welcome-text article {
		color: #858686;
		font-size: 18px;
	}
		section#welcome-text article p {
			color: #858686;
			font-size: 18px;
			line-height: 28px;
		}
/*--------------------------------------------------------*/

/*--------------------------------------------------------
 POSTS/PAGE
 -------------------------------------------------------*/
section#contents-wrapper {
	width: 100%;
	float: left;
	min-height: 300px;
}
	section#contents-wrapper h1.title {
		width: 100%;
		height: 45px;
		float: left;
		font-size: 38px;
		padding: 5px 0 0 0;
		margin: 0 0 10px 0;
	}
	section#contents-wrapper article {
		width: 100%;
		float: left;
		font-size: 15px;
		line-height: 23px;
		color: #7e7f84;
	}
		section#contents-wrapper article h2,
		section#contents-wrapper article h3
		{
			font-weight: normal;
			line-height: 30px;
			margin: 0 0 23px 0;
			text-shadow: 1px 1px 1px #333;
		}
		section#contents-wrapper article h4,
		section#contents-wrapper article h5,
		section#contents-wrapper article h6
		{
			line-height: 23px;
			margin: 0 0 20px 0;
			text-shadow: 1px 1px 1px #333;
		}
		section#contents-wrapper article a {
			color: #008e97;
		}
		section#contents-wrapper article p {
			color: #7e7f84;
			font-size: 15px;
			line-height: 23px;
			margin: 0 0 20px 0;
			text-shadow: 1px 1px 1px #333;
		}
		section#contents-wrapper article ul,
		section#contents-wrapper article ol
		{
			width: 92%;
			float: left;
			margin: 0 0 20px 8%;
		}
		section#contents-wrapper article ul li,
		section#contents-wrapper article ol li
		{
			width: 100%;
			float: left;
			margin: 0 0 5px 0;
			text-shadow: 1px 1px 1px #333;
		}
		section#contents-wrapper article ul li {
			list-style: inside disc;
		}
		section#contents-wrapper article ol li {
			list-style: inside decimal;
		}
/*--------------------------------------------------------*/
div#home-featured-image-wrapper {
	width: 100%;
	float: left;
	margin: 0 0 20px 0;
}
	div#home-featured-image-wrapper section:first-child {
		width: 49%;
		float: left;
		margin: 0 2% 0 0;
	}
	div#home-featured-image-wrapper section:last-child {
		width: 49%;
		float: left;
	}
/*--------------------------------------------------------*/
div#featured-image-wrapper {
	width: 100%;
	float: left;
	margin: 0 0 20px 0;
	position: relative;
}
	div#featured-image-wrapper h1 {
        font-size: 36px;
        font-weight: bold;
        color: #FFF;
		text-shadow: 2px 2px 2px rgba(150, 150, 150, 1);
		
        position: absolute;
        bottom: 15px;
        left: 15px;
        z-index: 10;
	}
div#featured-image-wrapper img {
    width: 100% !important;
    height: auto;
}
/*--------------------------------------------------------*/
section#main div.width-left-sidebar-wrapper {
	width: 100%;
	float: left;
}
div#nav_menu-4 {
	width: 28%;
	float: left;
	margin: 0 4% 0 0;
	min-height: 317px;
	background-color: #A3A1A2;
}
	div#nav_menu-4 div.menu-left-sidebar-menu-container {
		width: 100%;
		float: left;
	}
/*--------------------------------------------------------*/
section#main div.width-left-sidebar-wrapper div.main-content {
	width: 68%;
	float: left;
}
/*--------------------------------------------------------*/
ul#menu-left-sidebar-menu {
	width: 100%;
	float: left;
}
	ul#menu-left-sidebar-menu li {
		width: 100%;
		float: left;
	}
		ul#menu-left-sidebar-menu li a {
			width: 80%;
			float: left;
			color: #FFF;
			font-size: 18px;
			padding: 10px 10%;
			border-bottom: 1px solid #FFF;
			text-decoration: none;
		}
		ul#menu-left-sidebar-menu li a:hover,
		ul#menu-left-sidebar-menu li.current_page_item a
		{
			color: #008e97;
			background-color: #b3d6db;
		}
/*--------------------------------------------------------*/
#comments {
	width: 100%;
	float: left;
}
section.col-left,
aside.subpage-right-sidebar
{
	/*margin-top: 20px !important;*/
}
/*--------------------------------------------------------*/

/*--------------------------------------------------------
 SIDEBAR
 -------------------------------------------------------*/
div.widget {
	width: 100%;
	float: left;
	margin-bottom: 10px;
}
	div.widget h3 {
		padding: 0;
		margin-bottom: 8px !important;
	}
div.widget_recent_entries,
div.widget_archive,
div.widget_categories
{
	width: 92%;
	float: left;
	padding: 10px 4%;
	margin-bottom: 10px;
}
	div.widget_recent_entries h3,
	div.widget_archive h3,
	div.widget_categories h3
	{
		padding: 0;
		margin-bottom: 8px !important;
	}
		div.widget_recent_entries ul li a,
		div.widget_archive ul li a,
		div.widget_categories ul li a
		{
			color: #FFF;
		}
/*--------------------------------------------------------*/
div#nav_menu-2 {
	width: 100%;
	float: left;
}
	div#nav_menu-2 ul {
		width: 100%;
		float: left;
	}
		div#nav_menu-2 ul li {
			list-style: none none;
		}
			div#nav_menu-2 ul li a {
				width: 92%;
				float: left;
				color: #FFF;
				font-size: 16px;
				padding: 10px 4%;
				text-decoration: none;
			}
			div#nav_menu-2 ul li#menu-item-68 a {
				background-color: #008e97;
			}
			div#nav_menu-2 ul li#menu-item-69 a {
				background-color: #b3d6db;
			}
			div#nav_menu-2 ul li#menu-item-70 a {
				background-color: #b2b2b2;
			}
			div#nav_menu-2 ul li#menu-item-71 a {
				background-color: #7f8084;
			}
/*--------------------------------------------------------*/
div#category-posts-2 {
	width: 92%;
	float: left;
	min-height: 90px;
	padding: 10px 4%;
	background-color: #b2b2b2;
}
	div#category-posts-2 h3 {
		color: #FFF;
		font-size: 16px;
		font-weight: normal;
		padding: 0;
		border: 0;
		margin-bottom: 10px;
	}
		div#category-posts-2 h3 a {
			color: #FFF;
		}
	div#category-posts-2 ul {
		width: 100%;
		float: left;
	}
		div#category-posts-2 ul li {
			width: 100%;
			float: left;
			border: 0;
			padding: 0;
			margin: 0 0 5px 0;
		}
			div#category-posts-2 ul li a.post-title {
				width: 72%;
				float: left;
				color: #FFF;
				font-size: 11px;
				font-weight: normal;
				margin: 0 3% 0 0;
				line-height: normal;
			}
			div#category-posts-2 ul li p.post-date {
				width: 25%;
				float: left;
				color: #FFF;
				font-size: 11px;
				margin: 0;
				line-height: normal;
				text-align: right;
			}
/*--------------------------------------------------------*/
div#woo_subscribe-2 {
	width: 100%;
	float: left;
}
aside#connect {
	width: 92%;
	float: left;
	margin: 0;
	padding: 10px 4% !important;
	background: url('images/sidebar-bg-grey.jpg') top left repeat-x #C6C6C6 !important;
}
	aside#connect div p {
		color: #FFF;
		font-size: 12px;
	}
	aside#connect form.newsletter-form {
		margin-bottom: 0 !important;
	}
	aside#connect form.newsletter-form input.email {
		width: 76%;
		float: left;
		height: 25px;
		font-size: 15px;
		padding: 3px 2% 0 2%;
		border: 0;
		margin: 0;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
	}
	aside#connect form.newsletter-form input.submit {
		width: 20%;
		float: left;
		height: 28px;
		padding-bottom: 5px;
		padding-top: 5px;
		margin: 0;
		color: #333 !important;
		background-color: #b3d6db;
		box-shadow: 0;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
	}
	aside#connect div.fix {
		float: left;
	}

/*--------------------------------------------------------
 FORMS
 -------------------------------------------------------*/
section.gform_widget h3 {
	color: #FFF;
	font-size: 18px;
	font-weight: normal;
	margin: 0 0 0 25%;
}
div#gform_wrapper_1 {
	margin: 0;
}
div#gform_wrapper_1 div.gform_body {
	width: 100%;
	float: left;
}
div#gform_wrapper_1 ul.top_label label.gfield_label {
	width: 25%;
	float: left;
	font-size: 14px;
	font-weight: normal;
	padding: 0;
	margin: 0 0 15px 0;
}
div#gform_wrapper_1 ul.top_label div.ginput_container {
	width: 75%;
	float: left;
}
	div#gform_wrapper_1 ul.top_label div.ginput_container input[type=text] {
		width: 95% !important;
		height: 15px;
		font-size: 18px;
		border: 0;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
	}
	div#gform_wrapper_1 ul.top_label div.ginput_container textarea {
		width: 95% !important;
		height: 50px;
		font-size: 18px;
		border: 0;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
	}
	div#gform_wrapper_1 div.gform_footer {
		width: 100%;
		float: left;
		padding: 0;
		margin: 0;
	}
	div#gform_wrapper_1 div.gform_footer input.button, 
	div#gform_wrapper_1 div.gform_footer input[type="submit"]
	{
		color: #000 !important;
		border: 0;
		font-size: 12px;
		padding: 3px 25px !important;
		margin: 0 0 0 25%;
		background-color: #b3d6db;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
	}
/*-------------------------------------------------------*/
	div#gform_wrapper_2 ul.top_label div.ginput_container input[type=text] {
		width: 95% !important;
		font-size: 18px;
		border-color: #0D8F9F;
	}
	div#gform_wrapper_2 ul.top_label div.ginput_container textarea {
		width: 95% !important;
		font-size: 18px;
		border-color: #0D8F9F;
	}
	.gform_wrapper textarea.medium {
		height: 120px;
	}
	.gform_wrapper .gform_footer {
		padding: 0;
	}
/*-------------------------------------------------------*/
div#login-contents-left {
	width: 60%;
	float: left;
	margin-right: 4%;
}
div#login-form-right {
	width: 36%;
	float: left;
}
/*-------------------------------------------------------*/
form#login {
	width: 100%;
	float: left;
}
	form#login div.form-group {
		width: 100%;
		float: left;
	}
		form#login div.form-group label {
			width: 30%;
			float: left;
			margin-right: 5%;
		}
		form#login div.form-group input[type=text],
		form#login div.form-group input[type=password]
		{
			width: 60%;
			float: left;
		}
/*--------------------------------------------------------
 GENERIC
 -------------------------------------------------------*/
img.alignleft  {
	margin: 0 10px 0 10px;
}
img.alignright  {
	margin: 0 10px 10px 0;
}
img.aligncenter {
	margin: 0 10px 10px 10px;
}
.float-left {
	float: left !important;
}
.float-right {
	float: left !important;
}
/*--------------------------------------------------------
 BUTTONS
 -------------------------------------------------------*/



/*--------------------------------------------------------
 MOBILE CSS
 -------------------------------------------------------*/
@media only screen and (max-width: 1140px) {
	div#header-wrapper {
		padding-left: 1.618em;
		padding-right: 1.618em;
	}
}
@media only screen and (max-width: 990px) {
	#navigation {
		width: 100%;
	}
	ul.nav li a {
		padding: 0 0.4em !important;
	}
	div#top-right-text h3 {
		font-size: 20px;
	}
/*--------------------------------------------------------*/
	div#nav_menu-4 {
		width: 32%;
	}
	section#main div.width-left-sidebar-wrapper div.main-content {
		width: 60%;
	}
/*--------------------------------------------------------*/
	section.gform_widget h3 {
		margin: 0 0 0 35%;
	}
	div#gform_wrapper_1 ul.top_label label.gfield_label {
		width: 35%;
	}
	div#gform_wrapper_1 ul.top_label div.ginput_container {
		width: 65%;
	}
	div#gform_wrapper_1 div.gform_footer input.button, 
	div#gform_wrapper_1 div.gform_footer input[type="submit"]
	{
		margin: 0 0 0 35%;
	}
}
@media only screen and (max-width: 767px) {
	header#header {
		width: 100%;
		text-align: center;
		margin-top: 10px;
		margin-bottom: 15px;
	}
	div#top-right-text {
		width: 100%;
		text-align: center;
		margin-top: 10px;
	}
/*--------------------------------------------------------*/
	#navigation {
		width: 80%;
		clear: both;
	}
/*--------------------------------------------------------*/
	div#footer-section section,
	div#footer-section section article,
	div#footer-section section address
	{
		font-size: 15px;
	}
/*--------------------------------------------------------*/
	aside.page-right-sidebar {
		width: 100%;
		float: left;
	}
/*--------------------------------------------------------*/
	div#nav_menu-4 {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
		min-height: inherit;
	}
/*--------------------------------------------------------*/
	div#contact-us-wrapper div.col {
		width: 100%;
		margin-right: 0;
		margin-bottom: 25px;
	}
	.page-title, .post .title, .page .title {
		font-size: 30px;
	}
/*--------------------------------------------------------*/
	section#main div.width-left-sidebar-wrapper div.main-content {
		width: 100%;
	}
/*--------------------------------------------------------*/
	div#featured-image-wrapper h1 {
		font-size: 28px;
	}
/*--------------------------------------------------------*/
	div#login-contents-left {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}
	div#login-form-right {
		width: 100%;
	}
}

@media only screen and (max-width: 600px) {
	section#welcome-text h1 {
		font-size: 25px;
	}
	div#footer-section section.footer-widget  {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
		text-align: center;
	}
	div#footer-section section.footer-widget {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
		text-align: center;
	}
	div#footer-section div.header {
		text-align: center;
	}
}
@media only screen and (max-width: 480px) {
	div#copyright {
		width: 100%;
		float: left;
		text-align: center;
		margin-bottom: 10px;
	}
	div#credit {
		width: 100%;
		float: left;
		text-align: center;
	}
		div#copyright p {
			margin-left: 0;
		}
		div#credit p {
			margin-right: 0;
		}
}
@media only screen and (max-width: 320px) {
	
}
/*--------------------------------------------------------
 FULL SCREEN ONLY
 -------------------------------------------------------*/
@media only screen and (min-width: 860px) {
    
}
/*--------------------------------------------------------
 MOBILE ONLY
 -------------------------------------------------------*/
@media only screen and (max-width: 860px) {

}
@media only screen and (max-width: 1024px) and (min-height: 768px) {

}