/*
 Theme Name:   RBS Noorman
 Theme URI:    http://www.roadbearstudios.com
 Description:  Divi Child theme
 Author:       Roadbearstudios
 Author URI:   https://www.roadbearstudios.com
 Template:     Divi
 Version:      1.0.2
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
*/

/* 1. Mobile First Stylesheet ALL Screens: */

	/*	GENERAL STYLES & FIXES*/
		/* Breadcrumbs */
			.breadcrumb-wrapper {
				color: #494949;
				height: 0;
				overflow: visible;
				z-index: 1;
			}
			.breadcrumb-wrapper .breadcrumbs-before {
				content:" ";
				background-color: #83b71a;
				height: 30px;
				position: absolute;
				right: 100%;
				top: 0;
				width: 2000px;
			}
			.breadcrumb-wrapper #breadcrumbs {
				 background-color: #83b71a;
				float: left;
				height: 30px;
				line-height: 30px;
				margin-bottom: 0;
				max-width: calc(100% - 10px);
				overflow: hidden;
				padding: 0 5px 0 0;
				text-overflow: ellipsis;
				white-space: nowrap;
			}
			.breadcrumb-wrapper .breadcrumbs-after {
				border-color: #83b71a transparent transparent #83b71a;
				border-style: solid;
				border-width: 15px 5px;
				float: left;
				height: 0;
				width: 0;
			}
			#breadcrumbs span,
			#breadcrumbs a {
				font-size: 12px;
				color: #fff;
			}
		/* Arrow read more link */
			.read-more-arrow {
				background: rgba(0, 0, 0, 0) url("/wp-content/themes/rbs_noorman/images/arrow-right.png") no-repeat;
				background-size: 24px 24px;
				display: block;
				height: 24px;
				width: 114px;
				background-position: top right;
				text-indent: 0;
				-webkit-transition: width 0.1s, background-position 0.1s, color 0.4s; /* Safari */
				transition: width 0.1s, background-position 0.1s, color 0.4s;
				color: #83b71a;
				font-weight: bold;
				font-size: 16px;
				padding-top: 2px;
			}
			.read-more-arrow:active {
				padding-top: 3px;
				background-position: 90px 1px;
			}

		/* FIX: Create general heading styles and overwite them with important because of the inline variety in Divi */
			h1 {font-size: 48px !important;}
			.page-title h1 {padding-bottom: 0px !important;}
			h2 {font-size: 28px !important;}
			.service-box-title {z-index: 1000;}
			.service-box-title h2 {padding-bottom: 0px !important;}
			h3 {font-size: 24px !important;}
			.usp-title h2 {font-size: 40px !important;}
			.usp-title h3,
			.usp-title h4 {font-weight: normal !important; text-align: center !important; /* FIX: center-align usp-titles on mobile devices */}
			.usp-title .usp-main-title h3 {font-weight: bold !important;}

		/* FIX: Add secondary buttons styling */
			.secondary-button {
				font-weight: normal !important;
				padding: 7px 15px;
			}
			.secondary-button-dark {
				font-weight: bold !important;
			}
			.et_pb_button_module_wrapper .secondary-button:hover,
			.et_pb_button_module_wrapper .secondary-button:active {
				padding-top: 7px;
				padding-bottom: 7px;
			}

		/* Fix: Primary button color styles fix */
		.et_pb_button {color: #fff !important;}

		/* General Post meta Styles*/
			body #page-container p.post-meta {
				font-size: 12px;
				padding: 0 20px;
				font-style: italic;
				text-transform: lowercase;
			}
			body #page-container p.post-meta a:hover {
				text-decoration: underline;
			}
			body.single #page-container p.post-meta {
				padding-left: 0;
			}

		/*  Fix: Collapse parent items in mobile navigation */
			#main-header .et_mobile_menu .menu-item-has-children > a { background-color: transparent; position: relative; }
			#main-header .et_mobile_menu .menu-item-has-children > a:after { font-family: 'ETmodules'; text-align: center; speak: none; font-weight: normal; font-variant: normal; text-transform: none; -webkit-font-smoothing: antialiased; position: absolute; }
			#main-header .et_mobile_menu .menu-item-has-children > a:after { font-size: 16px; content: '\4c'; top: 13px; right: 10px; }
			#main-header .et_mobile_menu .menu-item-has-children.visible > a:after { content: '\4d'; }
			#main-header .et_mobile_menu ul.sub-menu { display: none !important; visibility: hidden !important;  transition: all 1.5s ease-in-out;}
			#main-header .et_mobile_menu .visible > ul.sub-menu { display: block !important; visibility: visible !important; }
			#main-header .et_mobile_menu ul li.image-link {display: none;}

	/* MODULES */
		/* PORTFOLIO (projects) */
			 .et_pb_portfolio .project {
				background: #fff;
				-webkit-box-shadow: 0px 0px 7px -3px #000;
				box-shadow: 0px 0px 7px -3px #000;
				border-bottom: 4px solid #00549F;
				padding-bottom: 20px;
				margin-bottom: 32px;
			}
			.et_pb_portfolio .project:hover {
				-webkit-box-shadow: 0px 0px 7px -2px #000;
				box-shadow: 0px 0px 7px -2px #000;
			}
			.et_pb_portfolio .project h2 {
				padding: 0 20px;
				font-weight: normal !important;
				font-size: 20px !important;
			}
		/* CONTACT FORMS */
			/* Contact Form 7 Extra Styles like Divi */
				.wpcf7-submit {float: left;}
				.wpcf7-submit:hover {color: #ffffff;}
			/* Contact Form 7 checkbox styling */
				.et_pb_contact p input[type="checkbox"] {width: auto;}
			/* Make a 3 column contact form */
				.wpcf7 textarea {height: 197px;}
				.et_pb_contact_field_1 {width: 45% !important;}
				p.et_pb_contact_field {margin-bottom: 0;}
				.wpcf7-submit-aanvraag {border-color: #fff !important; margin-top: 0px !important; color: #fff !important;}
				input.wpcf7-text:focus, textarea.wpcf7-textarea:focus {
					border-color: #2d3940;
					color: #3e3e3e;
				}

				/*Contact Form 7 Divi Performance Fix*/
				.et_pb_contact p input,
				.et_pb_contact p textarea {
					-webkit-appearance: none;
					background-color: #eee;
					width: 100%;
					border-width: 0;
					border-radius: 0;
					color: #999;
					font-size: 14px;
					padding: 16px;
				}
				input.text, input.title, input[type="text"], select, textarea {
					margin: 0;
				}
				.et_pb_contact_field *, .et_pb_contact_field.et_pb_section_parallax, .et_pb_contact_field.et_pb_section_video {
					position: relative;
				}
				.et_pb_contact_field,
				.et_pb_contact_field_half,
				.et_pb_contact_field_first,
				.et_pb_contact_field_last {
					width: 100% !important;
					padding: 0 !important;
					overflow: hidden !important;
				}

				.split-form .et_pb_contact p input {
					margin-bottom: 20px;
				}

				.wpcf7 form.invalid .wpcf7-response-output {
					border-radius: 10px;
					background-color: #ffc643 !important;
					border-color: #ffc643 !important;
				}

				.wpcf7 form.sent .wpcf7-response-output {
					background-color: #46b450;
					border-color: #46b450;
					border-radius: 10px;
				}
				.wpcf7-not-valid-tip {
					background: #dc3232;
					font-size: 1em;
					font-weight: normal;
					display: block;
					color: #fff;
					padding: 5px;
					border-radius: 4px;
					display: inline;
				}

	/*	HOMEPAGE*/
		/* Styling of the homepage news items */
			.home .et_pb_posts article {
				background: #fff;
				border-bottom: 4px solid #00549F;
				margin-bottom: 32px;
			}
			.home .et_pb_posts article a {
				margin-bottom: 0;
			}
			.home .et_pb_posts article .entry-featured-image-url {
				width: 100%;
				float: left;
				margin-right: 20px;
			}
			.home .et_pb_posts article h2 {
				font-size: 18px !important;
				font-weight: normal;
				padding: 10px 0 0 20px;
			}
			.home .et_pb_posts article .post-content {
				padding-left: 20px;
				padding-bottom: 15px;
			}
			/* Overwrite more-link styles */
			body .et_pb_blog_0 .et_pb_post .more-link {
				clear: none;
				float: none;
				margin-top: 0;
				padding: 0;
				border: 0 none;
				text-decoration: underline;
				color: #00549F;
			}
			body .et_pb_blog_0 .et_pb_post .more-link:hover {
				text-decoration: none;
			}

		/* HOOFD-DIENST (Bouw, Omgeving, Milieu, Geluid) */
			.main-category-items .et_pb_column_1_5 .et_pb_image {
				margin-bottom: 16px;
			}
		/* FIX: headings on teaserblocks /bouw /omgeving /milieu & /geluid break-word when screen size gets smaller.*/
			.main-category-items .et_pb_column .et_pb_text .et_pb_text_inner h3 {
				font-size: 24px !important;
			}
		/* FIX: link color for clickthrough to subpages */
			.main-category-items .et_pb_text .et_pb_text_inner p a {
				color: #fff;
			}
			.main-category-items .et_pb_text:last-child .et_pb_text_inner p a:hover {
				text-decoration: underline;
			}

		/* SUB-DIENST */
			.offset {
				position: relative;
				border-top: 72px solid transparent;
				margin: -50px 0 0;
				-webkit-background-clip: padding-box;
				-moz-background-clip: padding;
				background-clip: padding-box;
			 }

			 .offset:before {
				content: "";
				position: absolute;
				top: -2px;
				left: 0;
				right: 0;
				border-top: 2px solid #fff;
			 }

		/* TEAM MEMBER STYLES */
			.et_pb_team_member .et_pb_team_member_description h4 {
				font-size: 28px;
			}
			.et_pb_team_member .et_pb_team_member_description .et_pb_member_position {
				color: #00549F;
				font-size: 18px;
				padding: 4px 0 30px;
			}

/* 2. LANDSCAPE PHONE & UP 480px Breakpoint (Mobile Landscape Styles Only) */
@media only screen and (min-width: 480px) {
	/* TEAM MEMBER STYLING*/
		.et_pb_section .et_pb_row .et_pb_column .et_pb_team_member {
			margin-bottom: 50px;
		}
		.et_pb_team_member .et_pb_team_member_image {
			float: left;
			margin-right: 20px;
			max-width: 25%;
		}
		.et_pb_team_member .et_pb_team_member_description {
			padding-top: 20px;
		}
	/* NIEUWSBERICHTEN STYLING */
		.blog .et_pb_post,
		.archive .et_pb_post {
			overflow: auto;
			position: relative;
		}
		.blog .et_pb_image_container img, .blog .et_pb_post a img,
		.archive .et_pb_image_container img, .archive .et_pb_post a img{
			float: left;
			margin-right: 20px;
			max-width: 20%;
			vertical-align: bottom;
		}
		.home .et_pb_posts article .entry-featured-image-url {
			max-width: 150px;
		}
		.home .et_pb_posts article h2 {
			padding: 10px 0 0 0;
		}
}

/* 3. TABLET & UP STYLES 768px Breakpoint (Tablet Styles Only) */
@media only screen and (min-width: 768px) {
		/* Navigation styles for smaller screens */
		#top-menu li {
			padding-right: 16px !important;
		}
		#top-menu > li a {
			font-size: 14px !important;
		}
		/* Subpage Menu Styling */
		.et_pb_fullwidth_menu_0.et_pb_fullwidth_menu .fullwidth-menu-nav li.current-menu-item a {
			background: #009DDF;
			border-top-left-radius: 10px;
			border-top-right-radius: 10px;
			text-decoration: none !important;
		}
		.et_pb_fullwidth_menu_0.et_pb_fullwidth_menu .fullwidth-menu-nav li a {
			padding: 15px;
		}
		#menu-bouw li {padding: 0;}

		/* Arrow read more link */
			.read-more-arrow {
				background: rgba(0, 0, 0, 0) url("/wp-content/themes/rbs_noorman/images/arrow-right.png") no-repeat;
				background-size: 24px 24px;
				display: block;
				height: 24px;
				width: 24px;
				background-position: top left;
				text-indent: -1234em;
				-webkit-transition: width 0.1s, background-position 0.1s, color 0.4s; /* Safari */
				transition: width 0.1s, background-position 0.1s, color 0.4s;
				color: #00549F;
			}
			.read-more-arrow:hover {
				width: 114px;
				text-indent: 0;
				background-position: top right;
				color: #83b71a;
				font-weight: bold;
				font-size: 16px;
				padding-top: 2px;
			}
		/* FIX: headings on teaserblocks /bouw /omgeving /milieu & /geluid break-word when screen size gets smaller.*/
			.main-category-items .et_pb_column .et_pb_text .et_pb_text_inner h3 {
				font-size: 18px !important;
			}

			/*form styling*/
			p.et_pb_contact_field_first {
				width: 50% !important;
				float: left;
			}
			p.et_pb_contact_field_last {
				margin-left: 5%;
				width: 45% !important;
				float: left;
			}

			.split-form button.wpcf7-submit {
				float: right;
				margin-top: 20px !important;
			}


}

/* 4. DESKTOP & UP 980px Breakpoint (Desktop Styles Only) */
@media only screen and (min-width: 981px) {
	/* Styles for sticky sidebar menu  */
		.widget_nav_menu {margin-bottom: 0 !important;}
		.scrollingBox .menu {
			background: #fff;
			-webkit-box-shadow: 0px 0px 7px -3px #000;
			box-shadow: 0px 0px 7px -3px #000;
			border-bottom: 4px solid #00549F;
		}
		.scrollingBox .menu li {
			margin: 0;
		}
		.scrollingBox .menu li a {
			display: block;
			margin: 0;
			padding: 12px 15px;
		}
		.scrollingBox .menu li a:hover {
			background: #009DDF;
			color: #fff;
			font-weight: bold;
		}
		.scrollingBox .menu .active a{
			color: #fff !important;
			font-weight: bold;
			background: #83b71a;
		}

	/* FIX: Set text align to Divi values for larger screens */
		.usp-title h3, .usp-title h4 {
			text-align: inherit !important;
		}
}

/* 5. REALLY BIG SCREENS 1280px Breakpoint (Desktop Styles Only) */
@media only screen and (min-width: 1280px) {
	/* Navigation styles for smaller screens */
		#top-menu li {
			padding-right: 22px !important;
		}
		#top-menu > li a {
			font-size: 16px !important;
		}
	/* FIX: headings on teaserblocks /bouw /omgeving /milieu & /geluid break-word when screen size gets smaller.*/
		.main-category-items .et_pb_column .et_pb_text .et_pb_text_inner h3 {
			font-size: 24px !important;
		}
}

/* WIREFRAME STYLES */
/*Make multi column mega menu*/
#top-menu li.mega-menu.five-columns > ul > li
{width: 20%; clear: none;}
#top-menu li.mega-menu.two-columns > ul > li
{width: 50%; clear: none;}
#top-menu li.mega-menu > ul > li a {
padding: 2px 10px;
}
#top-menu li.mega-menu > ul > li > ul > li {
line-height: 1.2em;
}
#top-menu li.mega-menu > ul > li > ul > li a {
font-weight: normal;
font-size: 13px;
margin-bottom: 0.5em;
padding: 2px 10px;
}

/* Menu current page ancestor styling */
.et-fixed-header #top-menu .current-page-ancestor > a {color: #83B71A !important;}
