@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400&display=swap');

*{
          font-family: "poppins", sans-serif;
          margin: 0;
          padding: 0;
          box-sizing: border-box;
          text-decoration: none;
          outline: none;
          border: none;
          text-transform: none;
          transition: all .2s linear;
          -webkit-transition: all .2s linear;
          -moz-transition: all .2s linear;
          -ms-transition: all .2s linear;
          -o-transition: all .2s linear;
}

html{
          font-size: 62.5%;
          overflow-x: hidden;
}

section{
          min-height: 100vh;
          padding-top: 7.5rem;
}

body{
          background: #f9f9f9;
}

header{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  font-size: 2.2rem;
  background: #fabb28;
  padding: 1.3rem 4%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 1000;
  box-shadow: 0 .5rem 1rem solid black;
}
    
                  

header .logo{
  font-size: 2.3rem;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  color: #1e1e1e;
  font-weight: bold

}

header .logo span{
color: #f5f4f4;
font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}


header .navbar ul{
  list-style: none;
}

header .navbar ul li{
  position: relative;
  float: left;
}

header .navbar ul li a{
  font-size: 16px;
  font-weight: bold;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  padding: 16px;
  display: block;
  color: #1e1e1e;
}

header .navbar ul li ul li a{
  text-align: center;
  font-size: 14px;
  font-weight: 599;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  color: #1e1e1e;
  background: #f5f4f4;
}

header .navbar ul li:hover{
  background: #f5f4f4;
  color: #fdb714;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
}

header .navbar ul li ul{
  position:absolute;
  left: 0;
  width: 140px;
  display: none;
}

header .navbar ul li ul li a:hover{
  background: #fdb714;
  color: #1e1e1e;
}


header .navbar ul li ul li{
  width: 100%;
  border-top: 1px solid black;
}

header .navbar ul li:hover > ul{
  display: initial;
}

.icons{
  display: flex;
  padding: 3px 5px;
}

.icons .icona{
  margin-top: 7px;
}

.icons .icona i{
  font-size: 4rem;
  color: #1e1e1e;
}




.icons .icona i:hover{
  color: #f9f9f9;
  transform: rotate(360deg);
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -o-transform: rotate(360deg);
}


header #toggler{
  display: none;
}

header .fa-bars{
  font-size: 3.3rem;
  color: #f5f4f4;
  background: #1e1e1e;
  border-radius: 0.5rem;
  padding: .5rem 1rem;
  cursor: pointer;
  border: .1rem solid #f5f4f4;
  display: none;
}

a.active{

  background: #f5f4f4;
  transition: 0.6s;
  -webkit-transition: 0.6s;
  -moz-transition: 0.6s;
  -ms-transition: 0.6s;
  -o-transition: 0.6s;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
}


.heading{
  width: 100%;
  text-align: center;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
color: whitesmoke;
background: #353030;
  font-size: 2.5rem;
  padding: 1rem;
  height: 50px;
}

.heading h1{
  font-size: 40px;

}


.tekneler{
  width: 100%;
  height: 750px;
  background-color: white;
  display: flex;
  flex-wrap: wrap;
}

.teknelercc{
  width: 100%;
  height: auto;
  background-color: white;
  display: flex;
  flex-wrap: wrap;
}

.blmlr{
  width: 30%;
  height: 720px;
  display: flex;
  flex-wrap: wrap;
  background-color: white;
margin: 8px 20px;
}

.blmlrcc{
  width: 30%;
  height: auto;
  display: flex;
  flex-wrap: wrap;
  background-color: white;
margin: 8px 20px;
}


.tknlr{
  width: 100%;
  height: 350px;
  background:whitesmoke;
}

.tknlrcc{
  width: 100%;
  height: 350px;
  background:whitesmoke;
}

.tknlr .rsm{
  width: 100%;
  height: 230px;
margin: 3px 0 3px 0;
}

.tknlr .rsm img{
  width: 100%;
height: 100%;
object-fit: cover;
}

.tknlr .rsm h3{
  position: relative;
  width: 50%;
  top: -23rem;
  left: 0;
  font-size: 2rem;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  color: #f9f9f9;
  background: #fdb714;
  font-weight: bold;
  padding: .5rem 1rem;
  border-radius: .5rem;
  -webkit-border-radius: .5rem;
  -moz-border-radius: .5rem;
  -ms-border-radius: .5rem;
  -o-border-radius: .5rem;
}

.tknlr .rsm h3 span{
  padding-left: 1rem;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  font-size: 2.7rem;
  color: #1e1e1e;
}

.tknlr .rsm h3 i{
  color: #1e1e1e;
  padding-right: 1rem;
}

.tknlr .rsm img:hover{
  transition: 2s;
  transform: scale(1.05);
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
  -webkit-transition: 2s;
  -moz-transition: 2s;
  -ms-transition: 2s;
  -o-transition: 2s;
}

.tknlr .tekneismi{
  width: 100%;
  height: 30px;
  background: #1e1e1e;
}

.tknlr .tekneismi h1{
  font-size: 21px;
  color: white;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  text-align: center;
  font-weight: bold;
}

.tknlr .icerikler{
  width: 100%;
  height: 38px;
  border: 0.1rem solid rgb(132, 132, 156);
}

.tknlr .icerikler .servisa{
  float: left;
  width: 50%;
  height: 100%;
}

.tknlr .icerikler .servisb{
  float: left;
  width: 50%;
  height: 100%;
}

.tknlr .icerikler .servisa .servisasol{
  float: left;
  width: 50%;
  height: 100%;
}

.tknlr .icerikler .servisb .servisbsol{
  float: left;
  width: 50%;
  height: 100%;
}


.tknlr .icerikler .servisa .servisasol .servisasolsol{
  background-color: white;
  float: left;
  width: 50%;
  height: 100%;
}

.tknlr .icerikler .servisb .servisbsol .servisbsolsol{
  background-color: white;
  float: left;
  width: 50%;
  height: 100%;
}

.servisasol .servisasolsol i{
  font-size: 16px;
  padding: 3px 11px 0;
  color: rgb(10, 41, 145);
}

.servisasol .servisasolsol h4{
  text-align: center;
}

.servisbsol .servisbsolsol i{
  font-size: 16px;
  padding: 3px 17px 0;
  color: rgb(10, 41, 145);
}

.servisbsol .servisbsolsol h4{
  text-align: center;
}



.tknlr .icerikler .servisa .servisasol .servisasolsag{
  background-color: white;
  float: right;
  width: 50%;
  height: 100%;
}


.tknlr .icerikler .servisb .servisbsol .servisbsolsag{
  background-color: white;
  float: right;
  width: 50%;
  height: 100%;
}

.servisasol .servisasolsag h1{
  font-size: 21px;
  color: black;
  padding: 5px 0 0 11px;
}

.servisbsol .servisbsolsag h1{
  font-size: 17px;
  color: black;
  padding: 5px 0 0 5px;
}


.tknlr .icerikler .servisa .servisasag .servisasagsol{
  background-color: rgb(218, 211, 211);
  float: left;
  width: 50%;
  height: 100%;
}

.tknlr .icerikler .servisb .servisbsag .servisbsagsol{
  background-color: rgb(218, 211, 211);
  float: left;
  width: 50%;
  height: 100%;
}


.servisasag .servisasagsol i{
  font-size: 16px;
  padding: 3px 13px 0;
  color: rgb(10, 41, 145);
}

.servisasag .servisasagsol h4{
  text-align: center;
}

.servisbsag .servisbsagsol i{
  font-size: 16px;
  padding: 3px 15px 0;
  color: rgb(10, 41, 145);
}

.servisbsag .servisbsagsol h4{
  text-align: center;
}

.tknlr .icerikler .servisa .servisasag .servisasagsag{
  background-color: rgb(218, 211, 211);
  float: right;
  width: 50%;
  height: 100%;
}

.tknlr .icerikler .servisb .servisbsag .servisbsagsag{
  background-color: rgb(218, 211, 211);
  float: right;
  width: 50%;
  height: 100%;
}

.servisasag .servisasagsag h1{
  font-size: 18px;
  color: black;
  padding: 5px 0 0 6px;
}


.servisbsag .servisbsagsag h1{
  font-size: 16px;
  color: black;
  padding: 5px 0 0 3px;
}




.tknlr .icerikler .servisa .servisasag{

  float: right;
  width: 50%;
  height: 100%;
}




.tknlr .icerikler .servisb .servisbsol{
  float: left;
  width: 50%;
  height: 100%;
}


.tknlr .icerikler .servisb .servisbsag{
  float: right;
  width: 50%;
  height: 100%;
}

.teknefiyat{
  width: 100%;
  height: 38px;
  background: #2b2a2a;
  text-align: center;
border: 0.2rem solid rgb(109, 100, 100);
}
 
.teknefiyat i{
  color: #f9f9f9;
}

.teknefiyat h1{
  padding-top: 4px;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  text-align: center;
  color: #fdb714;
  font-size: 21px;
  cursor: pointer;
}

.teknefiyat :hover{
background: white;
}


.booking{
  background-color: #f9f9f9;
  height: 390px;
  width: 100%;
  margin-bottom: 20px;
  
}

.booking .rrow{
  width: 70%;
  height: 370px;
  float: right;
  display: flex;
  flex-wrap: wrap;
  margin-top: 1rem;
}

.booking .rrow img{
  width: 33.3%;
  height: 183px;
  padding: 1px;
}

.booking .rrow img:hover{
  transition: 2s;
  transform: scale(1.5);
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -o-transform: scale(1.5);
  -webkit-transition: 2s;
  -moz-transition: 2s;
  -ms-transition: 2s;
  -o-transition: 2s;
}

.booking .rrrow{
  width: 30%;
  height: 380px;
  float: left;
  padding: 1rem;
 margin-top: .3rem;
}

.booking .rrrow img{
  width: 100%;
  height: 100%;
}



.contact{
  background-color: #f9f9f9;
  height: 500px;
  width: 100%;
  margin-bottom: 15px;
  
}

.contact .row{
  width: 50%;
  height: 470px;
  float: right;
  margin-top: 20px;
}


.contact .map{
  width: 100%;
height: 100%;

}

.contact form{
  width: 50%;
  height: 480px;
  float: left;
  background-color: #1e1e1e;
  padding: 2rem;
 margin-top: 15px;
}


.contact form h3{
  padding-bottom: 0.5rem;
  text-align: center;
  font-size: 25px;
  font-weight: bold;
  color: #c5c5c5;
}


.contact .boxxx{
  margin: .7rem 0;
  width: 100%;
  padding: 0.6rem 0.8rem;
  background-color: rgb(241, 237, 237);
  font-size: 1.2rem;
}



.contact .box{
  resize: none;
  height: 13rem;
  width: 100%;
  padding: 0.6rem 0.8rem;
}

.btn{
  text-align: center;
height: 3.5rem;
  font-size: 15px;
  width: 100%;
  background: #fdb714;
  cursor: pointer;
font-weight: bold;
}

.btn:hover{
  background: #f9f9f9;
}


.icon-container{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  height: 100px;
  background: #fdb714;
}

.icon-container .iccons{
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 2rem 4.9rem;
}

.icon-container .iccons i{
  font-size:4rem;
  color: green;
}


.icon-container .iccons h3{
  font-size: 2.2rem;
  color: #1e1e1e;
  padding-bottom: 0.5rem;
}


 .footer{
          background: #1e1e1e;
          width: 100%;
          height: auto;
          padding: 0 4%;
        }
        
        .footer .box-container{
          display: grid;
          grid-template-columns: repeat(auto-fit, minmax(26rem, 1fr));
          gap: 2rem;
        }
        
        .footer .box-container .box h3{
           font-size: 2.1rem;
           color: #fdb714;
           padding: 1rem 0;
        }
        
        .footer .box-container .box h3 i{
          color: #fdb714;
        }
        
        .footer .box-container .box .links{
          display: block;
          font-size: 1.5rem;
          color: white;
          padding: 0.7rem 0;
        }
        
        .footer .box-container .box .links i{
          color: orange;
          padding-right: 0.5rem;
        }
        
        .footer .box-container .box .links:hover i{
          padding-right: 2rem;
        }
        
        .footer .box-container .box p{
          line-height: 1;
          font-size: 1.5rem;
          color: white;
          padding: 1rem 0;
        }
        
        .footer .box-container .box .share a{
          height: 3.5rem;
          width: 3.5rem;
          line-height: 3.5rem;
          color: #1e1e1e;
          background: #fdb714;
          text-align: center;
          margin-top: 2rem;
          margin-right: 2rem;
          font-size: 2.5rem;
          border-radius: .7rem;
          -webkit-border-radius: .7rem;
          -moz-border-radius: .7rem;
          -ms-border-radius: .7rem;
          -o-border-radius: .7rem;
        }
        
        .footer .box-container .box .share a:hover{
          background: #fdb714;
          color: #c5c5c5;
        }
        
        .footer .box-container .box .email{
          width: 100%;
          margin: .7rem 0;
          padding: 1rem;
          background: #5f5c5c;
          font-size: 1.6rem;
          color: #1e1e1e;
          text-transform: none;
          border-radius: .5rem;
          -webkit-border-radius: .5rem;
          -moz-border-radius: .5rem;
          -ms-border-radius: .5rem;
          -o-border-radius: .5rem;
        }
        
        .footer .immage img{
          margin-top: 1.7rem;
          height: 5rem;
        }
        
        .footer .credit{
          text-align: center;
          margin-top: 1.3rem;
          padding: 1rem;
          padding-top: 1.5rem;
          font-size: 1.5rem;
          color: #fdb714;
          border-top: 0.7rem solid #c5c5c5;
        }
        
        .footer .credit span{
          color: #c5c5c5;
        }


.hea {
  margin-top: 110px;
  background-color: #2b2a2a;
  color: #f9f9f9;
  font-size: 30px;
  text-align: center;
  font-weight: bold;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}

.hea span{
  padding-left: 3rem;
  color: whitesmoke;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}



.sooking{
  margin-top: 135px;
  background-color: #f9f9f9;
  height: 375px;
  width: 100%;
  margin-bottom: 20px;
  padding: 0 3%;
}


.sooking .sookingsol{
  width: 50%;
  height: 370px;
  float: left;
  padding: .3rem;
   display: flex;
   flex-wrap: wrap;
}


.sooking .sookingsol .sookust{
  top: 0;
  height: 40px;
  background-color: #f9f9f9;
  width: 100%;
}

.sookust h1{
  text-align: center;
  font-weight: bold;
  font-size: 3.3rem;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}

.sookust h1 span{
  font-size: 1.7rem;
  color: #fdb714;
}

.sookussol{
  width: 33.3%;
  background-color: #f5f4f4;
  height: 275px;
  margin-top: .1rem;
  border-right: .2rem solid rgb(240, 234, 234);
}

.sookussol h1{
  color: #2b2a2a;
  text-align: center;
  font-size: 2rem;
  padding-top: 2rem;
  margin-bottom: 2.5rem;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}

.sookussol h2{
  text-align: center;
  font-size: 1.3rem;
padding: .2rem;
  color: #5f5c5c;

}

.sookussol h2 i{
  color: green;
  padding-right: .8rem;
}

.sooking .sookkk{
  height: 40px;
  background-color: #1e1e1e;
  width: 100%;
  text-align: center;
}

.sooking .sookkk:hover{
  background-color: #fdb714;
}

.sooking .sookkk a{
  color: #fdb714;
  font-size: 3rem;
  font-weight: bold;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}

.sooking .sookkk a:hover{
  color: #1e1e1e;
}

.sooking .sookkk a i{
  color: white;
  padding: 0 1rem 0 1rem;
}

.sooking .rrow{
  width: 50%;
  height: 370px;
  float: right;
  display: flex;
  flex-wrap: wrap;
  margin-top: 1rem;
}

.sooking .rrow img{
  width: 33.3%;
  height: 183px;
  padding: 1px;
  object-fit: cover;
}

.sooking .rrow img:hover{
  transition: 2s;
  transform: scale(1.5);
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -o-transform: scale(1.5);
  -webkit-transition: 2s;
  -moz-transition: 2s;
  -ms-transition: 2s;
  -o-transition: 2s;
}

.sooking .rrrow{
  width: 50%;
  height: 380px;
  float: left;
  padding: 1rem;
 margin-top: .3rem;
}

.sooking .rrrow img{
  width: 100%;
  height: 100%;
}



.sooking form{
  width: 50%;
  height: 360px;
  float: left;
  background-color: rgb(14, 6, 15);
  padding: 1.1rem;
}

.sooking form h3{
  padding-bottom: 0.5rem;
  text-align: center;
  font-size: 25px;
  font-weight: bold;
  color: #c5c5c5;
}



.sooking .boxxx{
  margin: .7rem 0;
  width: 100%;
  padding: 0.2rem 0.8rem;
  background-color: rgb(241, 237, 237);
  font-size: 1.7rem;
}



.sooter{
  background: #f1f1f1;
  width: 100%;
  height: auto;
  padding: 2rem 5%;
  padding-bottom: .1rem;
}

.sooter .sox{
  height: auto;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.sooter  h2{
  text-align: center;
   font-size: 2.7rem;
   font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
   color: whitesmoke;
   padding: .2rem 0;
   font-weight: bold;
   margin-bottom: 3rem;
   background: #2b2a2a;
}


.sooter .sox  i{
  color: orange;
  padding-right: 1rem;
  font-size: 1.5rem;
}

.sooter .sox h3{
  font-size: 1.3rem;
  padding-right: 2rem;
  padding-bottom: 2.5rem;
  color: #5f5c5c;
}
 
.sooter .sox h3 span{
  color: #fdb714;
  padding-right: 2rem;
}
 

.feature{
  background: #fdb714;
  width: 100%;
}

.feature .card-container{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  padding: 1rem 0;
  cursor: pointer;
}

.feature .card-container .card{
  height: 29rem;
  width: 37rem;
  margin: 1rem 2rem;
  position: relative;
  overflow: hidden;
}

.feature .card-container .card img{
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.feature .card-container .card .info{
  height: 100%;
  width: 100%;
  position: absolute;
  bottom: -100%;
  left: 0;
  padding: 0 2rem;
  padding-top: 5%;
  background: #2b2a2a;
}

.feature .card-container .card:hover .info{
  bottom: 0;
}

.feature .card-container .card .info h3{
  font-size: 1.7rem;
  color: #fdb714;
  text-align: center;
}

.feature .card-container .card .info p{
  font-size: 1.1rem;
  color: #d3cdc6;
}

.feature .card-container .card h4{
  position: relative;
  width: 100%;
  top: -29.5rem;
  left: 0;
  font-size: 3rem;
  text-align: center;
 font-family: Arial, Helvetica, sans-serif;
  color: #f9f9f9;
  background: #2b2a2a;
  font-weight: bold;
}


.aboutus{
  height: auto;
  width: 100%;
  justify-content: space-between;
  margin-top: 20rem;
  margin-bottom: 5rem;
  padding: 0 5%;
}


.aboutus h1 {
  font-size: 1.7rem;
  color: rgb(12, 9, 68);
}

.aboutus h1 a{
  color: #fabb28;
  font-size: 1.6rem;
}

.aboutus h1 span{
  color: #fdb714;
  font-size: 1.5rem;
}

.aboutus h2 {
  font-size: 1.5rem;
}

.aboutus h2 span{
  color: #fdb714;
  font-size: 1.7rem;
}






























#slider{
  overflow: hidden;
 margin-top: 8.5rem;
}


#slider figure{
  position: relative;
  width: 500%;
  margin: 0;
  left: 0;
  animation: 20s slider infinite;
  -webkit-animation: 20s slider infinite;
}


#slider figure img{
  width: 20%;
  float: left;
  height: 530px;
  object-fit: fill;
}


@keyframes slider{

  0%{
    left: 0;
  }
  20%{
    left: 0;
  }
  25%{
    left: -100%;
  }
  45%{
    left: -100%;
  }
  50%{
    left: -200%;
  }
  70%{
    left: -200%;
  }
  75%{
    left: -300%;
  }
  95%{
    left: -300%;
  }
  100%{
    left: -400%;
  }
}













@media(max-width:1200px){
          html{
            font-size: 55%;
          }
        
                  #slider{
                    overflow: hidden;
                   margin-top: 8.5rem;
                  }

                  .icon-container .iccons{
                    display: flex;
                    align-items: center;
                    width: 23%;
                  }
                 
                  .icon-container .iccons i{
                    padding-right: 0;
                  }
                        
                  .tekneler{
                    height: auto;
                    display: flex;
                    flex-wrap: wrap;
                    width: 100%;
                  }

                  .teknelercc{
                    height: auto;
                    display: flex;
                    flex-wrap: wrap;
                    width: 100%;
                  }
            
                  .blmlr{
                    width: 30%;
                    height: 720px;
                    display: flex;
                    flex-wrap: wrap;
                    background-color: white;
                    margin: 10px 17px;
                  }

                  .blmlrcc{
                    width: 29.5%;
                    height: auto;
                    display: flex;
                    flex-wrap: wrap;
                    background-color: white;
                    margin: 10px 15px;
                  }

                  .servisasol .servisasolsag h1{
                    font-size: 18px;
                    padding: 3px 0 0 7px;
                  }
              
                  .servisasag .servisasagsag h1{
                    font-size: 16px;
                    padding: 5px;
                  }
                
                  .servisbsol .servisbsolsol i{
                    padding: 4px 13px 0;
                  }

                  .servisbsol .servisbsolsag h1{
                    font-size: 14px;
                    padding-top: 6px;
                  }
              
                  .servisbsag .servisbsagsag h1{
                    font-size: 14px;
                    padding-top: 6px;
                  }
            

          }


          
@media(max-width:1022px){

          html{
            font-size: 55%;
          }
          header .fa-bars{
            display: block;
          }
        

          header .navbar{
            position: absolute;
            top: 100%;
            left: 0;
            right: 0;
            display: none;
          }
        
          header .navbar ul li{
            width: 100%;
            background: #f5f4f4;
          }
        
          header .navbar ul li ul{
            position: relative;
            width: 100%;
          }
        
          header .navbar ul li ul li{
            background: #fdb714;
          }
        
          header .navbar ul li a{
            text-align: center;
            border-bottom: .1rem solid #353030;
          }

          
          header .navbar ul li a:hover{
           background-color: #fdb714;
           color: #1e1e1e;
          }
        
          #toggler:checked ~ .navbar{
            display: initial;
          }

         
          .icon-container{
            height: 75px;
          }
        
          .icon-container .iccons{
            display: flex;
            align-items: center;
            width: 23%;
            padding: 1rem 3rem 0 8rem;
          }

          .icon-container .iccons i{
            font-size:3rem;
            color: green;
          }
          
          .icon-container .iccons h3{
            font-size: 2rem;
            color: #1e1e1e;
            padding-left: 1rem;
            padding-bottom: 0.5rem;
          }


          .blmlr{
            width: 30%;
            height: 720px;
            display: flex;
            flex-wrap: wrap;
            background-color: white;
            margin: 10px 15px;
          }
      
          .servisasol .servisasolsag h1{
            font-size: 16px;
            padding: 3px 0 0 7px;
          }
          .servisasol .servisasolsol h4{
            font-size: 7px;
          }
      
          .servisasag .servisasagsag h1{
            font-size: 15px;
            padding: 5px;
          }

          .servisasag .servisasagsol h4{
            font-size: 7px;
          }
        
          .servisbsol .servisbsolsag h1{
            font-size: 13px;
            padding-top: 6px;
          }

          .servisbsol .servisbsolsol h4{
            font-size: 7px;
          }
      
          .servisbsag .servisbsagsag h1{
            font-size: 13px;
            padding-top: 6px;
          }

          .servisbsag .servisbsagsol h4{
            font-size: 7px;
          }
         
        
          
      #slider{
        overflow: hidden;
       margin-top: 8.8rem;
      }
      

      #slider figure img{
        width: 20%;
        float: left;
        height: 360px;
      }
}        


@media(max-width:902px){
          html{
            font-size: 55%;
          }

        .icon-container{
          height: 75px;
        }

        .icon-container .iccons{
          padding: 1rem 3.5rem 0 7rem;
        }
      

        .icon-container .iccons i{
          font-size:3rem;
          color: green;
        }
        
        .icon-container .iccons h3{
          font-size: 1.6rem;
          color: #1e1e1e;
          padding-left: 1.6rem;
          padding-bottom: 0.5rem;
        }

        .blmlr{
          width: 30%;
          height: 720px;
          display: flex;
          flex-wrap: wrap;
          background-color: white;
          margin: 10px 13px;
        }
    
            .tknlr{
           margin: 1px;
            }

            .servisasol .servisasolsag h1{
              font-size: 14px;
              padding: 3px 0 0 5px;
            }
            .servisasol .servisasolsol h4{
              font-size: 6px;
            }
        
            .servisasag .servisasagsag h1{
              font-size: 13px;
              padding: 5px;
            }
  
            .servisasag .servisasagsol h4{
              font-size: 6px;
            }
          
            .servisbsol .servisbsolsag h1{
              font-size: 11px;
              padding-top: 6px;
            }
  
            .servisbsol .servisbsolsol h4{
              font-size: 6px;
            }
        
            .servisbsag .servisbsagsag h1{
              font-size: 11px;
              padding-top: 6px;
            }
  
            .servisbsag .servisbsagsol h4{
              font-size: 6px;
            }

            .servisasol .servisasolsol i{
              padding: 4px 6px 0;
            }

            .servisasag .servisasagsol i{
              padding: 4px 6px 0;
            }

            .servisbsol .servisbsolsol i{
              padding: 4px 9px 0;
            }

            .servisbsag .servisbsagsol i{
              padding: 4px 7px 0;
            }
           
            .booking{
              height: 370px;
            }
          
          
            .booking .rrow{
              height: 350px;
            }
            
            .booking .rrow img{
              height: 165px;
              margin: 0;
            }
          
            .booking .rrrow{
              height: 350px;
          
            }

        
}



@media(max-width:781px){
 
  .icon-container{
    height: 70px;
  }

  .icon-container .iccons{
    padding: 1rem 3.5rem 0 7rem;
  }

  .icon-container .iccons h3{
    font-size: 1.5rem;
    color: #1e1e1e;
    padding-left: 0.5rem;
  }

  .blmlr{
    width: 100%;
    height: 760px;
    display: flex;
    flex-wrap: wrap;
    background-color: white;
    margin: 10px 6px;
  }

  .blmlrcc{
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    background-color: white;
    margin: 10px 6px;
  }

  .tknlr .rsm h3{
    width: 40%;
    top: -25rem;
    font-size: 3.2rem;
    padding: .5rem 1rem;
  }
  
  .tknlr .rsm h3 span{
    font-size: 4.1rem;
  }
  

  
}


@media(max-width:675px){


.icon-container{
  height: 70px;
}

.icon-container .iccons{
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem 5rem 0 7rem;
}

.icon-container .iccons h3{
  font-size: 1.5rem;
  color: #1e1e1e;
  padding-left: 0.2rem;
  padding-bottom: 0.5rem;
}

  
.servisasol .servisasolsol i{
  padding: 4px 25px 0;
}

.servisasag .servisasagsol i{
  padding: 4px 25px 0;
}

.servisbsol .servisbsolsol i{
  padding: 4px 30px 0;
}

.servisbsag .servisbsagsol i{
  padding: 4px 29px 0;
}

.servisasol .servisasolsag h1{
  padding-top: 9px;
}

.servisasag .servisasagsag h1{
  padding-top: 9px;
}

.servisbsol .servisbsolsag h1{
  padding-top: 9px;
}

.servisbsag .servisbsagsag h1{
  padding-top: 9px;
}

.booking{
  height: 760px;
}

.booking .rrow{
  width: 100%;
  height: 370px;
  display: flex;
  flex-wrap: wrap;
  margin-top: 1rem;
}
  
.booking .rrrow{
  width: 100%;
}

.booking{
  height: 680px;
}

.booking form{
  width: 100%;
  height: 350px;
 
}
  
.booking .rrow{
  height: 310px;
  width: 100%;
}

.tknlr .rsm h3{
  width: 40%;
  top: -25rem;
  font-size: 2.7rem;
  padding: .5rem 1rem;
}

.tknlr .rsm h3 span{
  font-size: 3.5rem;
}



}

@media(max-width:570px){

  .icon-container{
    height: 65px;
  }

  .icon-container .iccons h3{
    font-size: 1.3rem;
    color: #1e1e1e;
    padding-left: 0.4rem;
    padding-bottom: 0.5rem;
  }

  .icon-container .iccons{
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 1rem 5rem 0 5rem;
  }
 
  .servisasol .servisasolsol i{
    padding: 4px 17px 0;
  }
  
  .servisasag .servisasagsol i{
    padding: 4px 18px 0;
  }
  
  .servisbsol .servisbsolsol i{
    padding: 4px 22px 0;
  }
  
  .servisbsag .servisbsagsol i{
    padding: 4px 21px 0;
  }

  .servisasol .servisasolsag h1{
    padding-top: 9px;
  }

  .servisasag .servisasagsag h1{
    padding-top: 9px;
  }

  .servisbsol .servisbsolsag h1{
    padding-top: 9px;
  }

  .servisbsag .servisbsagsag h1{
    padding-top: 9px;
  }

  .contact{
    height: 740px;
  }

  .contact .form{
    width: 100%;
    height: 420px;
   margin-bottom: 30px;
  }
    
  .contact .row{
    height: 240px;
    width: 100%;
  }

  .booking{
    height: 680px;
  }

  
  .sooking{
    height: 650px;
    margin-bottom: 5rem;
  }

  
  .sooking .sookingsol{
    width: 100%;
    height: 300px;
  }
  
  .sookussol{
    height: 225px;
  }

  .sooking .sookkk{
  height: 35px;
  }

  .sooking .rrow{
    height: 310px;
    width: 100%;
  }
    
  .booking .rrow{
    height: 310px;
    width: 100%;
  }

  .footer{
    text-align: center;
  }

  .tknlr .rsm h3{
    width: 50%;
    top: -25rem;
    font-size: 2.7rem;
    padding: .5rem 1rem;
  }
  
  .tknlr .rsm h3 span{
    font-size: 3.5rem;
  }
  



}

@media(max-width:450px){

  html{
    font-size: 45%;
  }

  .icon-container .iccons{
    width: 24%;
    gap: 0.2rem;
    padding: 1rem 7.5%;
  }

  .servisasol .servisasolsol i{
    padding: 4px 15px 0;
  }
  
  .servisasag .servisasagsol i{
    padding: 4px 15px 0;
  }
  
  .servisbsol .servisbsolsol i{
    padding: 4px 16px 0;
  }
  
  .servisbsag .servisbsagsol i{
    padding: 4px 16px 0;
  }

  .servisasol .servisasolsag h1{
    padding-top: 9px;
  }

  .servisasag .servisasagsag h1{
    padding-top: 9px;
  }

  .servisbsol .servisbsolsag h1{
    padding-top: 9px;
  }

  .servisbsag .servisbsagsag h1{
    padding-top: 9px;
  }

 
  .booking{
    height: 640px;
  }


  .booking .rrow{
    height: 315px;
  }
  
  .booking .rrow img{
    height: 150px;
    margin: 0;
  }

  .booking .rrrow{
    height: 290px;
  }
  
  .sooking{
    height: 580px;
  }

  .sookussol{
    height: 200px;
  }
   
  .sooking .sookkk{
    height: 30px;
  }
  .sooking .rrow{
    height: 315px;
  }
  
  .sooking .rrow img{
    height: 155px;
    margin: 0;
  }

  .sooking .rrrow{
    height: 290px;
  }




  .contact{
    height: 640px;
  }

  .contact form{
    width: 100%;
    height: 300px;
   
  }
    
  .contact .row{
    height: 300px;
    width: 100%;
  }
  
  .sooter{
    text-align: center;
  }

  
.tknlr .rsm h3{
  width: 50%;
  top: -25rem;
  font-size: 2.8rem;
  padding: .5rem 1rem;
}

.tknlr .rsm h3 span{
  font-size: 4rem;
}


 
  #slider figure img{
    height: 310px;
  }

}

@media(max-width:370px){
 
  header .logo{
    font-size: 2rem;
  }


  .icon-container{
height: 50px;
  }

  .icon-container .iccons{
    width: 24%;
    gap: 0.2rem;
    padding: 1rem 5.5%;
  }

  .icon-container .iccons h3{
    font-size: 6px;
  }
 
  .servisasol .servisasolsol i{
    padding: 4px 11px 0;
  }
  
  .servisasag .servisasagsol i{
    padding: 4px 11px 0;
  }
  
  .servisbsol .servisbsolsol i{
    padding: 4px 13px 0;
  }
  
  .servisbsag .servisbsagsol i{
    padding: 4px 13px 0;
  }

  .booking{
    height: 550px;
  }


  .booking .rrow{
    height: 280px;
  }
  
  .booking .rrow img{
    height: 130px;
    margin: 0;
  }

  .booking .rrrow{
    height: 240px;

  }

  .sooter{
    text-align: center;
  margin-top: 11rem;
    height: auto;
    padding: 3rem 5%;
    padding-bottom: 3rem;
  }

  .tknlr .rsm h3{
    width: 50%;
    top: -30rem;
    font-size: 2.2rem;
    padding: .5rem 1rem;
  }
  
  .tknlr .rsm h3 span{
    font-size: 3rem;
  }
  


  #slider figure img{
    height: 270px;
  }
}

@media(max-width:303px){
  html{
    font-size: 35%;
  }

  .servisasol .servisasolsol i{
    padding: 4px 6px 0;
  }
  
  .servisasag .servisasagsol i{
    padding: 4px 7px 0;
  }
  
  .servisbsol .servisbsolsol i{
    padding: 4px 8px 0;
  }
  
  .servisbsag .servisbsagsol i{
    padding: 4px 8px 0;
  }
 
  .contact{
    height: 680px;
  }
  .contact form{
    width: 100%;
    height: 300px;
   
  }
    


  .contact .row{
    height: 300px;
    width: 100%;
  }
 
  .btn{
  height: 5.5rem;
    font-size: 18px;
  }

  .tknlr .rsm h3{
    width: 50%;
    top: -39rem;
    font-size: 2.7rem;
    padding: .5rem 1rem;
  }
  
  .tknlr .rsm h3 span{
    font-size: 3.5rem;
  }
  .sooking{
    height: 480px;
  }
  .sooking .sookingsol{
    height: 220px;
  }
.sookussol{
  height: 150px;
}

.sookingsol .sookkk{
  height: 20px;
}
 
  #slider figure img{
    height: 260px;
  }
}