/*---------------------------------------------------------------------------------

 Theme Name:   Rietvink Transport | Transportbedrijf uit Julianadorp
 Theme URI:    https://rietvinktransport.nl
 Description:  Customized divi theme by Netfire
 Author:       Netfire
 Author URI:   https://netfire.nl/
 Template:     Divi
 Version:      1.0.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html

------------------------------ ADDITIONAL CSS HERE ------------------------------*/

/*********************************
* Variables */
:root{
    --donkerrood: #932f2e;
    --rood: #da4444;
    --oranje: #f6c500;
}
.logo_container > a{position:relative;}
.logo_container > a:after {
    position: absolute;
    display: block;
    min-width: 250px;
    top: 0;
    left: 0;
    margin: 5px 0px 0px 60px;
    content: 'Rietvink Transport';
    color: #da4344;
    display: block;
    font-size: 1.4em;
    font-weight: 600;
}
@media screen and (max-width: 1300px) and (min-width: 980px) {
  .logo_container > a:after{
    display:none;
  }
}
@media screen and (max-width: 800px) {
  .logo_container > a:after{
    font-size: 1.2em;
  }
}

body.home #page-container{
  overflow-x:hidden;
}

#main-footer #footer-bottom{
  display:none !important;
}

#main-footer li.current_page_item a{
  background-color:#fff;
  color:#010101 !important;
}

.nf_box_center{
  display:flex;
  align-items:center;
  justify-content:center;
}


#footer-info{
  display:flex;
}

#nf_footer_scroller {
  display:flex;
  position: relative;   
  min-width:25em;
  margin-left:5px;
}

#nf_footer_brand{
  position:relative;
  display:inline-block;
  background-color:#932f2e;
  z-index:2;
  font-weight:bold;
  animation: nf_brand 12s infinite;
  opacity:0;
}

.nf_scroller {
  opacity: 0;
  left:0;
  top:0;
  position: absolute;
  display: block;
  text-align: left;  
  animation: nf_horizontalScroll 12s infinite;
}

@keyframes nf_brand {
  7% { opacity: 0; transform: translateX(-50%) }
  12% { opacity: 1; transform: translateX(0); }
  99% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(-20px) }
}

@keyframes nf_horizontalScroll {
  0% { opacity: 0; transform: translateY(0) translateX(-50%); }
  12% { opacity: 0; transform: translateX(-50%); }
  20% { opacity: 1; transform: translateX(0); }
  35% { opacity: 1; transform: translateX(0); }
  40% { opacity: 0; transform: translateY(-20px); }
  100% { opacity: 0; transform: translateY(-20px); }
}

.nf_scroller:nth-child(2) {  animation-delay: 4s;}
.nf_scroller:nth-child(3) {  animation-delay: 8s;}

/* diensten*/
.nf_col_diensten{
  position: relative;
  display: block;
  margin-bottom: 30px;
  border-radius:9px;
}
.nf_col_diensten:hover .nf_blurb_diensten{
    margin-top: -100px;
}
.nf_col_diensten .nf_img_diensten{
  position: relative;
  display: block;
  overflow: hidden;
  background:var(--oranje);
  border-radius:9px;
  
  /*clip-path: polygon(0 10%, 100% 0%, 100% 100%, 0% 100%);*/

}
.nf_col_diensten .nf_img_diensten .et_pb_image_wrap img {
  width: 100%;
  height: 100%;
  transform: scale(1.1) translateX(4%);
  transition: all 0.4s;
}
.nf_col_diensten:hover .nf_img_diensten .et_pb_image_wrap img {
  opacity: .4;
  transform: scale(1.1) translateX(-4%);
}

.nf_blurb_diensten{
  margin-top: -95px;
  transition: all 500ms ease;
  border-radius:9px;
}
.nf_blurb_diensten .et_pb_blurb_content{  
    position: relative;
    display: block;
    -webkit-transition: all 500ms ease;
    transition: all 500ms ease;
    z-index: 1;
    filter: drop-shadow(0 5px 10px #ddd);
}
.nf_col_diensten:hover .nf_blurb_diensten .et_pb_blurb_content{
  filter: drop-shadow(0px 10px 60px rgba(0, 0, 0, 0.07));
}



.nf_blurb_diensten .et_pb_blurb_content .et_pb_main_blurb_image {
  border-radius:9px;
  position: absolute;
  top: -12px;
  right: 5px;
  height: 35px;
  width: 35px;
  background-color: var(--oranje);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
  z-index: 2;
}
.nf_blurb_diensten .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon {
  font-size:22px;
  position: relative;
  display: inline-block;
  transition: all 250ms linear;
  transition-delay: 0s;
  transition-delay: 0.05s;
  transform: scale(1);
  color: #fff;
}
.nf_col_diensten:hover .nf_blurb_diensten .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon {
  transform: scale(2);
}


.nf_blurb_diensten .et_pb_blurb_content .et_pb_blurb_container {
  position: relative;
  display: block;
  background-color: #ffffff;
  padding: 20px;
  /*clip-path: polygon(0 15%, 100% 0%, 100% 100%, 0% 100%);*/
  margin: 0px 15px;
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
  z-index: 1;
  border-radius:9px;
}

.nf_blurb_diensten .et_pb_blurb_content .et_pb_blurb_container .et_pb_blurb_description {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.nf_col_diensten .nf_blurb_diensten .et_pb_blurb_content .et_pb_blurb_container .et_pb_module_header,
.nf_col_diensten:hover .nf_blurb_diensten .et_pb_blurb_content .et_pb_blurb_container .et_pb_module_header {
  color: var(--oranje);
}



/*********************************
 * Text selection */
::-moz-selection {  color: #1d1d1b;background-color:#ece4d9;}
::selection {       color: #1d1d1b;background-color:#ece4d9;}

/*********************************
* youtube icon header 
* Whatsapp icon header */
.et-social-youtube a.icon:before { content: '\e0a3'; }
.et-social-whatsapp a.icon:before { content: '\e065'; }

#et-info{float:none;}
#top-header .et-social-icons{float:right;}
#top-header .nf_wrapper_netfire_nl{display:none !important;opacity:0;}




.footer-widget a.et-social-icon{
    font-family: ETmodules !important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    -webkit-font-feature-settings: normal;
    font-feature-settings: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-shadow: 0 0;
    direction: ltr;
}

.footer-widget a.et-social-icon span{
  margin-left:10px;
  font-family:"Open Sans", Arial, sans-serif;
  display:inline-block;
}
.footer-widget  a.et-social-youtube.icon:before { content: '\e0a3'; }
.footer-widget  a.et-social-whatsapp.icon:before { content: '\e065'; }
.footer-widget  a.et-social-facebook.icon:before { content: "\e093";}

.footer-widget .et-social-icons{  
  float:none;
  list-style:none;
}
.footer-widget .et-social-icons li{
  display:block;
  margin:0;
}
.footer-widget .et-social-icons li:before{ display:none;}

/*********************************
 * Credits */
.netfire{
    display: block;
    width: 20px;/*30*/
    height: 30px;/*45*/
    background: url(https://netfire.nl/images/logo_netfire_icon.png);
    background-size: contain;
    background-repeat: no-repeat;
}


/* Menu */
li.menu-item.current_page_item a{
  color:#fff !important;
  background-color: var(--rood);
  border-radius: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px !important;
  margin: 0;
}



/*********************************
 * Slider arrows */
.et-pb-arrow-next, .et-pb-arrow-prev,
.et-pb-arrow-next, .et-pb-arrow-next{
  color:var(--rood);
}
.et-pb-controllers a,
.et-pb-controllers .et-pb-active-control{
  background-color:var(--rood);
}



/*********************************
 * Footer menu */
#menu-hoofdmenu .current_page_item a{
  color:#fff !important;
}

@media screen and (max-width: 980px) {
  .et_pb_section_3_tb_footer  .et_pb_menu__menu,
  .et_pb_section_3_tb_footer .et_pb_menu__wrap,
  .et_pb_menu .et_pb_menu__menu>nav>ul{
    flex-direction:column;
  }
  .et_pb_menu .et_pb_menu__menu {
    display: block !important;
  }
  .et_pb_section_3_tb_footer  .mobile_menu_bar {
    display: none;
  }
  .et_pb_menu--style-left_aligned .et_pb_menu__wrap {
    justify-content:flex-start !important;
  }

  .et_mobile_nav_menu{display:none !important;}
}



/*********************************
 * Border button wrapper */

  /* .nf_block_wrapper{
    display: inline-block;
    position: relative;
    
  }
  .nf_block_wrapper .nf_block_span{
    display: block;
    height:300px;
    width:100%;
  }
  .nf_block_wrapper .et_pb_blurb_content{padding:50px;}

  .nf_block_wrapper .nf_block_span::before, .nf_block_wrapper .nf_block_span::after,
  .nf_block_wrapper .et_pb_image_wrap::before, .nf_block_wrapper .et_pb_image_wrap::after,
  .nf_block_wrapper .et_pb_blurb_content::before, .nf_block_wrapper .et_pb_blurb_content::after{
    content: "";
    position: absolute;
    width: 1px;
    height: 1px;
    transition: 0.5s ease-in-out;
    pointer-events: none;
  }
  .nf_block_wrapper .nf_block_span::before,
  .nf_block_wrapper .et_pb_image_wrap::before,
  .nf_block_wrapper .et_pb_blurb_content::before {
    top: -4px;
    left: -4px;
    border-top: 3px solid var(--donkerrood);
    border-left: 3px solid var(--donkerrood);
  }
  .nf_block_wrapper .nf_block_span::after,
  .nf_block_wrapper .et_pb_image_wrap::after,
  .nf_block_wrapper .et_pb_blurb_content::after{
    right: -4px;
    bottom: -4px;
    border-bottom: 3px solid var(--donkerrood);
    border-right: 3px solid var(--donkerrood);
  }
  .nf_block_wrapper.et_had_animation .nf_block_span::before, .nf_block_wrapper.et_had_animation .nf_block_span::after,
  .nf_block_wrapper.et_had_animation .et_pb_image_wrap::before, .nf_block_wrapper.et_had_animation .et_pb_image_wrap::after,
  .nf_block_wrapper.et_had_animation .et_pb_blurb_content::before, .nf_block_wrapper.et_had_animation .et_pb_blurb_content::after {
    width: calc(100% + 6px);
    height: calc(100% + 6px);
  }
  .nf_block_wrapper.et_had_animation:hover .nf_block_span::before, .nf_block_wrapper.et_had_animation:hover .nf_block_span::after,
  .nf_block_wrapper.et_had_animation:hover .et_pb_image_wrap::before, .nf_block_wrapper.et_had_animation:hover .et_pb_image_wrap::after,
  .nf_block_wrapper.et_had_animation:hover .et_pb_blurb_content::before, .nf_block_wrapper.et_had_animation:hover .et_pb_blurb_content::after{
    width: calc(100% + 18px);
    height: calc(100% + 18px);
  }

  .nf_block_wrapper::before, .nf_block_wrapper::after {
    content: "";
    position: absolute;
    width: 0px;
    height: 0px;
    transition: 0.7s ease-in-out;
    pointer-events: none;
  }
  .nf_block_wrapper::before {
    top: -9px;
    left: -9px;
    border-top: 1px solid var(--donkerrood);
    border-left: 1px solid var(--donkerrood);
  }
  .nf_block_wrapper::after {
    right: -9px;
    bottom: -9px;
    border-bottom: 1px solid var(--donkerrood);
    border-right: 1px solid var(--donkerrood);
  }
  .nf_block_wrapper.et_had_animation::before, .nf_block_wrapper.et_had_animation::after{
    width: calc(50% + 12px);
    height: calc(50% + 12px);
  }
  .nf_block_wrapper.et_had_animation:hover::before, .nf_block_wrapper.et_had_animation:hover::after{
    width: calc(60% + 12px);
    height: calc(60% + 12px);
  } */



































/* ===== NF Mobile menu ======*/
  
.et_mobile_menu li li{padding-left: 5% !important;}
.et_pb_menu .et_mobile_menu li ul{padding-left: 10px !important;}

.et_pb_module .et_mobile_menu .menu-item-has-children.clickable, .et_pb_module .et_mobile_menu .menu-item-has-children>a {
	position:relative
}
.et_pb_module .et_mobile_menu .menu-item-has-children.clickable>span.parent_icon:after, 
.et_pb_module .et_mobile_menu .menu-item-has-children:not(.clickable)>a:after {
  font-family:ETmodules;
  text-align:center;
  speak:none;
  font-weight:400;
  font-variant:normal;
  text-transform:none;
  color:var(--color-1);
  font-size:16px;
  -webkit-font-smoothing:antialiased
}
.et_pb_module .et_mobile_menu .menu-item-has-children:not(.clickable)>a:after {
  position:absolute;
  top:13px;
  right:10px;
}
.et_pb_module .et_mobile_menu .menu-item-has-children.clickable>span.parent_icon {
  display:grid;
  align-items:center;
  position:absolute;
  width:50px;
  height:50px;
  background:rgba(0, 0, 0, 0);
  right:0;
  top:0;
  z-index:9
}
.et_pb_module .et_mobile_menu .menu-item-has-children.clickable>span.parent_icon:after, .et_pb_module .et_mobile_menu .menu-item-has-children:not(.clickable)>a:after {
  content:"\4c"
}
.et_pb_module .et_mobile_menu .menu-item-has-children.clickable.visible>span.parent_icon:after, .et_pb_module .et_mobile_menu .menu-item-has-children:not(.clickable).visible>a:after {
  content:"\4b"
}
.et-db #et-boc .et-l .et_pb_fullwidth_menu .et_mobile_menu>ul.sub-menu, .et-db #et-boc .et-l .et_pb_menu .et_mobile_menu>ul.sub-menu, .et_pb_module .et_mobile_menu ul.sub-menu {
  display:none!important;
	visibility:hidden!important
}
.et-db #et-boc .et-l .et_pb_fullwidth_menu .et_mobile_menu .visible>ul.sub-menu, .et-db #et-boc .et-l .et_pb_menu .et_mobile_menu .visible>ul.sub-menu, .et_pb_module .et_mobile_menu .visible>ul.sub-menu {
	display:block!important;
	visibility:visible!important
}
.mobile_nav.closed .et_mobile_menu {
  -webkit-transform:translateX(-100%);
  -moz-transform:translateX(-100%);
  -ms-transform:translateX(-100%);
  -o-transform:translateX(-100%);
  transform:translateX(-100%);
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
  -webkit-transition:-webkit-transform .4s 0s;
  -moz-transition:-moz-transform .4s 0s;
  transition:transform .4s 0s
}
.mobile_nav.opened .et_mobile_menu {
  -webkit-transform:translateX(100%);
  -moz-transform:translateX(100%);
  -ms-transform:translateX(100%);
  -o-transform:translateX(100%);
  transform:translateX(100%);
  -webkit-overflow-scrolling:touch;
  -webkit-transition:-webkit-transform .4s 0s;
  -moz-transition:-moz-transform .4s 0s;
  transition:transform .4s 0s
}
.et_mobile_menu {
	min-height:100vh;
	height:100%;
	display:block!important;
	padding-top:40px !important;
	padding-bottom:100px !important;
	position:absolute;
	z-index:9998;
	overflow:scroll;
	border-top:none;
	padding-right:0;
	top:0px !important;
	left:-100%;
	position:fixed
}
.et_mobile_menu {
	width:320px;
	margin-left:calc(100% - 340px);
	border-top: 0px solid #fff;
	font-weight: normal;
}
.et_mobile_menu .menu-item-has-children > a:hover, .et_mobile_menu .menu-item-has-children > a {
	background-color: transparent;
	font-weight:normal;
}
.et_pb_menu ul li.current-menu-item a:hover, .et_pb_menu ul li.current-menu-item a {
	color:var(--color-1);
}
.mobile_nav.opened .mobile_menu_bar::before {
  content:"\4d";
}
.mobile_nav.opened:before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, .8);
}