/*
 Theme Name:     Tarik
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Tarik Theme
 Author:         Tarik
 Author URI:     https://www.elegantthemes.com
 Template:       Divi
 Version:        1.0.0
*/


/* =Theme customization starts here
------------------------------------------------------- */
:root {
  --roodknop: #ff0000;
  --logoblauw: #0A83E0;
  --textwit: #ffffff;
  --wit: #ffffff;
  --lichtgrijs: #F2F2F2;
  --donkergrijs: #2C3D46;
}
.headtekskleur {
	color: var(--logoblauw) !important;
	}

.et_pb_promo_button, .knop {
	color: var(--textwit) !important;
    border-width: 10px!important;
    border-color: var(--logoblauw);
    letter-spacing: 2px;
    font-size: 16px;
    font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif!important;
    font-weight: 700!important;
    background-color:  var(--logoblauw);
}
.knopmenubalk {
    border-radius: 0px;
    letter-spacing: 4px;
    text-transform: uppercase!important;
	color: var(--textwit) !important;
    border-width: 10px!important;
    border-color: var(--logoblauw);
    letter-spacing: 2px;
    font-size: 16px;
    font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif!important;
    font-weight: 700!important;
    background-color:  var(--logoblauw);
	}
.headerpaginaoverig {
    background-color: var(--logoblauw);
}
/* Slider Home */

.dp-carousel .swiper-button-prev {
	transform: none;
    margin-top: -100px;
    top: 10px !important;
    margin-left: auto!important;
    right: 52px;
	font-size: 20px !important;
	background-color: #fff;
    padding: 25px !important;
    visibility: hidden;
}
.dp-carousel .swiper-button-next {
	transform: none;
    top: 10px !important;
    margin-top:-100px;
    right: 0px !important;
    background-color: #fff;
    padding: 25px !important;
    visibility: hidden;
}

/* Arrow Size and Style */
.swiper-button-next:after, .swiper-button-prev:after {
	font-size: 20px;
    color: #aed4e4;
}

/* DP Slider Pagination */
.dp-carousel .swiper-pagination-bullet-active {
	background-color: var(--logoblauw);
}
.dp-carousel .swiper-pagination-bullet {
	background-color: var(--logoblauw);
    // top: 15px;
}

.recensies .et_pb_testimonial:before {
	color: var(--logoblauw);
}

/* hoofd kaarten */

@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700;800&display=swap");
.kaartenhoofd * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;
}

.kaartenhoofd .card:nth-child(3) h3  {
   top: -68px;
   position: relative ;
 }
 .kaartenhoofd .card:nth-child(2) h3  {
   top: -8px !important;
   position: relative !important;
 }
.kaarten {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  margin-top: -200px;
/*   min-height: 100vh; */
//   background: #232427;
}

.kaarten .containerkaart {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  max-width: 1200px;
  margin: 0 0;
}

.kaarten .containerkaart .card {
  position: relative;
  min-width: 320px;
  height: 470px;
  box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.2),
    inset -5px -5px 15px rgba(255, 255, 255, 0.1),
    5px 5px 15px rgba(0, 0, 0, 0.3), -5px -5px 15px rgba(255, 255, 255, 0.1);
  border-radius: 15px;
  margin: 30px;
  transition: 0.5s;
}

.kaarten .containerkaart .card .box .content a {
  background: var(--logoblauw) !important;
}
/*
.kaarten .containerkaart .card:nth-child(2) .box .content a {
  background: #e91e63;
}

.kaarten .containerkaart .card:nth-child(3) .box .content a {
  background: #23c186;
}
*/
.kaarten .containerkaart .card .box {
  position: absolute;
  top: 20px;
  left: 20px;
  right: 20px;
  bottom: 20px;
  background: #2a2b2f;
  border-radius: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  transition: 0.5s;
}

.kaarten .containerkaart .card .box:hover {
  transform: translateY(-50px);
}

.kaarten.containerkaart .card .box:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background: rgba(255, 255, 255, 0.03);
}

.kaarten .containerkaart .card .box .content {
  padding: 20px;
  text-align: center;
}

.kaarten .containerkaart .card .box .content h2 {
  position: absolute;
  top: -10px;
  right: 30px;
  font-size: 8rem;
  color: rgba(255, 255, 255, 0.1);
}
.kaarten .containerkaart .card .box .content h3 {
  font-size: 1.8rem;
  color: #fff;
  z-index: 1;
  transition: 0.5s;
  margin-bottom: 15px;
}

.kaarten .containerkaart .card .box .content p {
  font-size: 0.8rem;
  font-weight: 200;
  color: rgba(255, 255, 255, 0.9);
  z-index: 1;
  transition: 0.5s;
}

.kaarten .containerkaart .card .box .content a {
  position: relative;
  display: inline-block;
  padding: 8px 20px;
  background: black;
  border-radius: 5px;
  text-decoration: none;
  color: white;
  margin-top: 20px;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
  transition: 0.5s;
}
.kaarten .containerkaart .card .box .content a:hover {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.6);
  background: #fff;
  color: #000;
}
.container2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr;
  gap: 0px 0px;
}
.container2 .aaa { grid-area: 1 / 1 / 2 / 3;
color: white;
text-align: center;
width: 40%}
.container2 .bbb { grid-area: 1 / 2 / 2 / 3;
color: white;
text-align: center;}

.container2 {
  background-color: rgba(38,166,91,0.90);
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    padding-top: 160px;
    margin: -400px;
    position: relative;
    z-index: -1;

}
@media only screen and (max-width: 600px) {
.kaarten {
  margin-top: -90px;
  }
  }




.contact .et-pb-icon {
    color: var(--logoblauw);
}

.forminator-custom-form-241584 .forminator-input, .forminator-custom-form-241584 .select2-selection--single[role="combobox"]  {
    background-color: transparent !important;
}
.forminator-select-dropdown-container--open .forminator-custom-form-241584.forminator-dropdown--default {
    background-color: white !important;}

.et_pb_menu--style-left_aligned.et_pb_text_align_right .et_pb_menu__menu>nav>ul, .et_pb_menu--style-left_aligned.et_pb_text_align_right .et_pb_menu__wrap {
        justify-content: center;
}

.et_pb_menu--style-centered .et_pb_menu__menu>nav>ul, .et_pb_menu--style-centered .et_pb_menu__wrap {
    -ms-flex-pack: center;
    justify-content: center;
}


.et_pb_toggle_title:before {
    color: var(--logoblauw);
}



/* draai column om moviel */
@media screen and ( max-width: 980px ) {
    .omdraaienmobiel {
        display: flex;
        flex-direction: column-reverse;
    }
}



/* whatsapp */

.float{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
  background:  transparent center/cover  url("https://www.rini-logistics.com/wp-content/uploads/2022/04/WhatsApp.png") no-repeat;
	background-color:#25d366;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}
.float:hover {
    filter: brightness(50%);

}
.my-float{
	margin-top:16px;

}

@media only screen and (max-width: 600px) {
  .float{

	bottom:15px;
	right:15px;

}
}