CSS CODE DRAIF

#footer-bottom {
   display:none;
}

@media only screen and (min-width: 768px) {
#top-menu a {
    color: #ffffff;
}

#top-menu a:hover, #top-menu a:focus {
    color: #ffffff;
}

.et_header_style_left #et-top-navigation nav>ul>li>a, .et_header_style_split #et-top-navigation nav>ul>li>a
.et_header_style_split #et-top-navigation nav>ul>li>a {
    padding-bottom: 25px;
    padding-right: 15px;
}

.et_fullwidth_nav #main-header .container {
    width: 100%;
    max-width: 100%;
}

#logo {
    margin-left: 40px;
}
}

/* CODE VAN MONICA ET */

@media only screen and (min-width: 768px) {
.logo_container {width: unset !important;padding-left: 40px !important;}
img#logo {margin-left: 0 !important;}
.logo_container a:after {
    content:  '';
    position:  absolute;
    left:  0;
    right:  0;
    top: 0;
    bottom:  0;
    background-image:  url(https://draif.nl/wp-content/uploads/2018/08/Draif-1024x405.png);
    background-repeat:  no-repeat;
    background-size: cover !important;
    opacity: 0;
}
.logo_container a {
    display: inline-block;
    position:  relative;
    height: 48px !important;
}
.logo_container a #logo {
    max-height: 100% !important;
}
.et-fixed-header  .logo_container a:after {
    opacity: 1 !important;
}
.et-fixed-header .logo_container #logo {
    opacity: 0 !important;
}
}
/* EINDE CODE VAN MONICA ET */


/*********************************
change logo for fixed header (quick and easy way)
**********************************/

.page-id-4188 img#logo{
opacity:0 !important;
}
.page-id-4188 .logo_container a:after{
opacity: 1 !important;
}

.page-id-4190 img#logo{
opacity:0 !important;
}
.page-id-4190 .logo_container a:after{
opacity: 1 !important;
}

.page-id-4186 img#logo{
opacity:0 !important;
}
.page-id-4186 .logo_container a:after{
opacity: 1 !important;
}

/** App Style header and Drop Down Menu **/

@media (max-width: 980px) {
 .container.et_menu_container {
 width: calc( 100% - 60px);
 }
}

.et_mobile_menu {
 margin-left: -30px;
 padding: 5%;
 width: calc( 100% + 60px);
}

.mobile_nav.opened .mobile_menu_bar:before {
 content: "\4d";
}

/*** MAKE SITE WIDER ON SMALLER SCREENS ***/
@media only screen and (max-width: 980px) {
.et_pb_row {
width: 90%; /*** you might need !important ***/
}

@media (max-width: 980px) {
.et_non_fixed_nav.et_transparent_nav #main-header, .et_non_fixed_nav.et_transparent_nav #top-header, .et_fixed_nav #main-header, .et_fixed_nav #top-header {
    position: fixed;
}
}

.et_mobile_menu {
    overflow: scroll !important;
    max-height: 83vh;
}

/* Increase mobile menu bar height */
.et_header_style_left .mobile_menu_bar {
  padding-bottom: 0px;
}

/* Moved hamburger down */
.mobile_menu_bar:before {
  top: -10px !important;
}

@media (max-width:980px) {
	.center-text-mobile,
	.center-text-mobile .et_pb_text_inner,
	.center-text-mobile .et_pb_social_media_follow {
		text-align: center!important;
  }
}

@media (max-width:980px) {
	.no-mobile-margin {
		margin-bottom: 0!important;
	}
}}

@media only screen and (max-width: 768px) {
#main-header, #main-header .nav li ul, .et-search-form, #main-header .et_mobile_menu {
    background-color: #fff;
}


.et_header_style_centered .mobile_nav .select_page, .et_header_style_split .mobile_nav .select_page, .et_nav_text_color_light #top-menu>li>a, .et_nav_text_color_dark #top-menu>li>a, #top-menu a, .et_mobile_menu li a, .et_nav_text_color_light .et_mobile_menu li a, .et_nav_text_color_dark .et_mobile_menu li a, #et_search_icon:before, .et_search_form_container input, span.et_close_search_field:after, #et-top-navigation .et-cart-info {
    color: #000000;
}

	.page-id-9 img#logo {
content: url("https://draif.nl/wp-content/uploads/2018/08/Draif-1024x405.png");
}

		.page-id-4180 img#logo {
content: url("https://draif.nl/wp-content/uploads/2018/08/Draif-1024x405.png");
}

		.page-id-4182 img#logo {
content: url("https://draif.nl/wp-content/uploads/2018/08/Draif-1024x405.png");
}

		.page-id-4184 img#logo {
content: url("https://draif.nl/wp-content/uploads/2018/08/Draif-1024x405.png");
}
}

.et_mobile_menu { border-top: 3px solid #1b509f}

span.mobile_menu_bar:before {
    color: #1b509f !important;
}