/*
 Theme Name:     Mediakanjers
 Theme URI:      http://www.mediakanjers.nl
 Description:    Website ontworpen door Mediakanjers
 Author:         Mediakanjers
 Author URI:     http://www.mediakanjers.nl
 Template:       Divi
 Version:        1.0.0
*/

@import url("../Divi/style.css");
@import url('https://fonts.googleapis.com/css?family=Russo+One|Titillium+Web:300,400,600,700');

h1, h2, h3, h4, h5, h6 {font-family: "Russo One"; text-transform: uppercase;}
h1{font-size: 46px !important;}
h2 {font-size: 38px !important;}
body {font-family: "Titillium Web"}
li {list-style-image: url("images/li.png")}

/* Buttons */
.et_button_no_icon .et_pb_button {font-family: "Russo One"; text-transform: uppercase !important; padding: 10px 25px !important;}
.et_button_no_icon .et_pb_button:hover {padding: 10px 25px !important;}

/* Contact info */
#et-info {float: left; font-weight: 600; background:url("images/topheader-bg.png") no-repeat; padding: 20px;}
#et-info-phone {position: relative;}
#et-info-email {position: relative;}
#et-info-email:hover, #et-info-phone:hover {-webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; opacity: 0.7;}
#et-info-phone:before {position: relative; margin-right: 5px; content: "T." !important; font-family:"Titillium Web" !important;font-size: 12.5px; top:0px;}
#et-info-email:before {position: relative; margin-right: 5px; content: "E." !important; font-family:"Titillium Web" !important;font-size: 12.5px; top:0px;}

/* Header */
#top-header .container {padding-top: 0 !important; padding-left: 23%;}
.keurmerken {margin-left: 20px; display: inline-block; padding-top: 3px;}
.talen { float: right; padding-top: 7px }
/* Hoofdmenu */
.menu-container {background: url("images/mainheader-bg.png") left top no-repeat; padding-bottom: 47px;}
#top-header, #main-header {background-color: transparent !important; box-shadow: none;}
.ubermenu .ubermenu-target {padding: 51px 2px 42px 6px !important;}
#ubermenu-nav-main-3-primary-menu { width: 120% }

/*Nieuw*/
.fullheader {width: 100%; display: block; background: url("images/mainheader-bg.png") #121827 right -666px top no-repeat}
.logo_container {position: relative !important;  float: left; width:30% !important; height: 111px !important;
    margin-top: 50px;}
.menu-container {width: 70%; float: right;}

/* Slider */

/* Content */
.home1 h1:after {display: block; content: ""; background-color: #fbba10; width: 98px; height: 11px; margin-top: 5px;}
.home2 h2 {/*font-size: 59px !important;*/}
.home2 h2:after {display: block; content: ""; background-color: #fbba10; width: 98px; height: 11px; margin-top: 5px;}
.home2 li {float: left; width: 33%;}
.home2 ul {margin: 20px 0!important; float: left; width: 100%;}


.home3 h4 {font-size: 25px; padding-bottom: 20px;}
.home3 h4:after{display: block; content:""; background-color: #fbba10; width: 63px; height: 7px; margin-top: 18px;}



#main-content a{text-decoration: underline;}

/* Grafity Forms opmaak */
.gform_wrapper .button {padding: 8px; cursor: pointer; transition: 0.15s ease-in-out;color: #fff; border: 1px solid #000;}
.gform_wrapper .button:hover {background: #2f334f;}
.gform_wrapper input[type=text], .gform_wrapper select, .gform_wrapper textarea {border: 1px solid #e2e2e2;background: #f7f7f7;}
.gform_wrapper input[type=text]:hover, .gform_wrapper select:hover, .gform_wrapper textarea:hover {border: 1px solid #ccc;}

/* Footer */
#footer-widgets .footer-widget li:before {content: none;}
#footer-widgets .footer-widget li {padding-left: 0;}

/*Responsive*/
@media only screen and (max-width: 1470px) {
	.keurmerken { margin-left: 10px }
}

@media only screen and (max-width: 1420px) {
	#top-header { width: 103% }
	h1{font-size: 40px !important;}
	.menu-container {width: 75%!important;}
	.logo_container {width: 25%!important;}
	.keurmerken { margin-left: 0px }
span.logo_helper {display: none;}
	
}

@media only screen and (max-width: 1300px) {

}

@media only screen and (max-width: 1200px) {
.menu-container {width: 64%!important;}
.logo_container {width: 36%;}
#top-header {background-color: #fff !important;}
#main-header {background-color: #0f1524; padding: 12px 0; float:right;}
.ubermenu-responsive-toggle {background-color: #fbba10 !important; float: right;}
.ubermenu-main {background-color: #fbba10 !important;}
.home2 h2 {font-size: 28px !important;}
#top-header .container {padding-left: 0;}
#logo {height: 90% !important; max-height: none;}
nav#ubermenu-main-3-primary-menu {position: absolute; top: 70px;}
.ubermenu .ubermenu-target {padding: 20px 15px 20px 15px !important;}
.keurmerken {padding: 22px 0 10px 0; zoom: 0.6; margin-left: 0; margin-left: 0 !important; float: left;}
h1{font-size: 30px !important;}
}
@media only screen and (max-width: 980px) {
.menu-container {width: 80%!important;}
.logo_container {width: 20% !important;}
#logo {max-width: 100% !important;}
.talen {float: left; margin-left: 5%}
}
@media only screen and (max-width: 767px) {
	.fullheader {background-image: none !important;}
	.fullheader .container {width: 100%; padding-top: 95px;}
.menu-container {width: 100%!important; background-image: none !important;}
.logo_container {width: 100% !important; margin-top: 0;}
#et-info {display: inline-block; width: 100%; padding: 10px 0;}
#et-info-email {font-size: 15px; float: left; width: 50%; margin-right: 0; float: left;}
#et-info-phone {font-size: 15px; float: left; width: 50%; margin-bottom: 0em; margin-right: 0; float: right;}
.logo_container {position: relative!important; text-align: center; padding: 15px 0 !important; width: 100% !important; float: none;}
#logo {max-width: 100% !important; max-height: 80px!important;}
.menu-container {padding-bottom: 10px;}
.ubermenu-responsive-toggle {float: none; margin: 0 !important;}
.ubermenu-nav {position: relative !important;}
#ubermenu-main-3-primary-menu {position: relative !important; top: auto !important;}
#main-header {background-color: #121827 !important; padding:0; margin-top: 11%}
#top-header {padding-bottom: 0; position: absolute; top: 0; left:0; width: 100%;}
#et-info {background-image: none !important;}
#black-studio-tinymce-4 {float: none; text-align: center;}
.keurmerken {float:none !important; width: 100%;}
h1{font-size: 24px !important;}
#left-area ul, .entry-content ul, .comment-content ul, body.et-pb-preview #main-content .container ul{padding: 0 0 23px 1.5em;}
#top-header .container {padding: 0 25px 0 0; margin: 15px 0 0 0; width: 100%;}
.talen { width: 100%; text-align: center; margin-top: -5% }

}

@media only screen and (max-width: 479px) {
	.talen { margin-left: 0px }
	#top-header { position: relative; float: left; }
	.fullheader .container { padding-top: 0px }
	.menu-container { padding-bottom: 0px }
	.home1 h1 { word-wrap: initial; }
	.footer-widget { padding-left: 34px }
	h1 { font-size: 22px !important; }
}