.footer{
background-color:rgb(12, 67, 112);
padding-top:30px;
margin-top:20px;
}

.footer .row .col-md-2 i{
color:white;
font-size:18px;
margin-right: 15px;
margin-top:10px;

} 

.footer .row .col-md-2 div{
display:flex;
justify-content:center; 
gap:5px; 
  }

.footer h6{
  margin-top:10px !important;
}




.footer .row .col-md-3 h6{
color:white !important;
font-weight:bold;
text-align: center;
width:100%;

}


.footer .row .col-md-3 a{
display:block;
color:white;
text-decoration: none;
margin:10px;
text-align: center;
}


.footer .row .col-md-3 input[type=text]{
 font-size:14px;
  }

.footer .row .col-md-2 h6{
    color:white !important;
    font-weight:bold;
    text-align: center;
    }
    
    
    .footer .row .col-md-2 a{
    display:block;
    color:white;
    text-decoration: none;
    margin:10px;
    text-align:center;
    }
    


    .newsletter{
      background-image:linear-gradient(to right,rgba(15, 15, 17, 0.7),rgba(3, 9, 27, 0.4)),url("../assets/images/newsletter/newsletter.jpg");
      height:40vh;
      background-size:cover;
      background-position:center;
      display:flex;
      justify-content:space-around;
      align-items:center;
      gap:5px;
      position:relative;

      
      }

      .newsletter-form a{
      background-color:rgba(0, 0, 0,0.1);
      color:white;
      border: 1px solid #ccc;
      font-size:14px;
      width: 100%;

      }




      /* @media only screen and (max-width: 1200px){
      

      } */
      
      .newsletter-envelope .fa-envelope{
      font-size:141px !important;
      color:rgb(45, 119, 216);
          }

    .text-center h5{
      font-weight:bolder !important;
     
      margin:10px 0px !important;
    }

    

.essential_cookies{

    background-color: #fff;
    padding:5px;
    border-radius:8px;
    font-size:14px;
    text-align: center;
    width:100% !important;

}


.essential_cookies div{
display:flex;
justify-content: space-between;
gap:20px;
z-index:-1;
}




.essential_cookies div a{
  color: #093258 !important;
  border:1px solid #093258;
  padding:8px;
    }

@media only screen and (max-width: 1200px){
  .essential_cookies div{
    display:flex;
    justify-content:center;
  
    gap:4px;
    flex-wrap:wrap;

    }
}



    .essential_cookies div a:hover,  .essential_cookies div a:focus{
      background-color: #093258;
      color:white ! important;
      border-radius:15px;
      
        }

  .created{
   text-align: center;
   
  }

  .created p{
    color:rgb(39, 238, 56) !important;
  }

/*------------------- animation  --------------------------------*/

  .section {
    opacity: 0;
    position: relative;
    transition: opacity 1s ease, transform 1s ease; /* Transition for smooth animation */
}
  
  .from-left {
    transform: translateX(-100%); /* Start off-screen to the left */
}

.from-right {
    transform: translateX(100%); /* Start off-screen to the right */
}

.visible {
    opacity: 1;
    transform: translateX(0); /* Bring the element to its original position */
}

.popup div span strong {
  color:black !important;
  text-transform: capitalize;
}


.newsletter-choose div{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.newsletter-choose div span{
display: block;
margin:5px 3px;
font-weight: normal !important;
}

.newsletter-choose div span input[type=checkbox]{
    box-shadow: none !important;
  margin:5px 4px;
  }
  

.newsletter-choose{
  display:flex;
  justify-content: space-between;
  align-items: flex-start;
  /* flex-wrap: wrap; */
  
}

@media only screen and (max-width:767px){
  .newsletter-choose{
 
    flex-wrap: wrap;
    
  }
}


/* --------------------popup------------------------ */

#popup{
background-color: white;  
position:fixed;
padding: 10px 8px !important;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
width:80%;
height:320px !important;
z-index: 99;
box-shadow: 0 5px 40px rgba(0,0,0,.30);
background: #fff;
visibility:hidden;
opacity:0;
transition: 0.3s;
text-align: center;
font-size: 14px !important;
font-family: poppins !important;

}




#popup.active{ 
visibility: visible;
opacity: 1;
transition: 0.3s;

    }



#close{
font-size: 14px;
position: absolute;
top: -6px;
left: 98%;
padding: 0px 8px;
color:black;
cursor: pointer;
box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
border-radius: 50%;
background-color: white;
z-index: 1;
}


#close:hover, #close:focus{
opacity: 0.6;
border: none;
outline: none;
 outline: none;

}


#popup input{
border:1px solid transparent;
box-shadow: 0px 0px 4px rgba(0,0,0,0.2);
}


#btn-comment{

	text-transform: capitalize;
	font-family: poppins;
	color: white;
	box-shadow:0px 5px 8px rgba(0,0,0,0.3);
	border-radius:3px;
}


h6{
text-transform: capitalize;
}


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

#popup{
background-color: white;  
position:fixed;
top:33%;
left: 50%;
transform: translate(-50%,-50%);
width: 330px;
height:385px !important;
font-size: 14px !important;

}

}


#popup.active{
visibility: visible;
opacity: 1;
transition: 0.3s;
  }

  .btn-cart{
    cursor: pointer;
  }