/*
Theme Name: Skelt_ecom
Theme URI: 
Author: Quentin CERNO
Author URI: 
Description: Theme Skelt for ecommerce
Requires at least: WordPress 5.0
Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('http://fonts.cdnfonts.com/css/lucida-blackletter%27');

*{
    margin: 0;
    padding: 0;
    font-family: 'Montserrat', sans-serif;
}

body{
    background-color: rgb(255, 255, 255);
}

html{
    height: 100%;
}


/* Hero section */

.hero-section{
    position: relative;
    height: 100%;
    min-height: 100%;
}

.hero-section .hero-background img{
    position: absolute;
    height: 100vh;
    width: 100%;
    object-fit: cover;
    z-index: 1;
}

.hero-section .hero-background video{
    position: absolute;
    height: 100vh;
    width: 100%;
    object-fit: cover;
    z-index: 2;
}

.hero-content {
    position: relative;
    height: 100vh;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: rgba(0,0,0,0.5);
    z-index: 3;
}

.hero-content .title h1{
    text-align: center;
    color: white;
    font-size: 6vw;
    font-weight: 600;
}

.hero-content .sub-title h2{
    text-align: center;
    color: white;
    font-size: 4vw;
    font-weight: 300;
}

.hero-content .button { 
    display: flex;
    justify-content: center;  
    align-items: center;
    flex-wrap: wrap; 
    margin-top: 25px;
}

.hero-content .button #first {
    margin: 10px;
    background-color: transparent;
    color: white;
    font-size: 18px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid white ;    
}

.hero-content .button #first:hover {
    margin: 10px;
    background-color: white;
    color: black;
    font-size: 18px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid white ;    
}

.hero-content .button #second {
    margin: 10px;
    background-color: #E62045;
    color: white;
    font-size: 18px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid #E62045 ;    
}

.hero-content .button #second:hover {
    margin: 10px;
    background-color: white;
    color: black;
    font-size: 18px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 2px solid white ;    
}

@media (max-width: 750px){
    .hero-content .button { 
        display: flex;
        flex-direction: column;
        justify-content: center;  
        align-items: center;
    }
}

@media (max-width: 380px) {
    
}

/* Pitch section */
.pitch-section-title {
    margin-top: 40px;
    margin-left: 20px;
    margin-right: 20px;
    color: #2D4269;
    font-size: 50px;
    font-weight: 400;
    text-align: center;
    justify-content: center;
}
.pitch-section {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pitch-section-container{
    position: relative;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
}

.pitch-section-container .card{
   position: relative;
   width: 300px;
   height: 420px;
   background: #fff;
   margin: 40px;
   border-radius: 20px;
   overflow: hidden;
   box-shadow: 0 15px 25px rgba(0,0,0,0.2);
   transition: 0.5s;
}

.pitch-section-container .card .circle {
    position: relative;
    width: 100%;
    height: 100%; 
    clip-path: circle(180px at center 0);
    text-align: center;
    cursor: pointer;   
}

.pitch-section-container .card .circle img{
    display: block;
    padding-top: 20px;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}

.pitch-section-container .card .circle a{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.pitch-section-container .card .content { 
    position: absolute;
    bottom: 0px;
    padding: 25px;
    text-align: center;
}

.pitch-section-container .card .content h3{
  
  margin-bottom: 10px;
  padding-top: 10px;
  color: rgb(66, 66, 66);
  
}

.pitch-section-container .card .content p{
    
    color: #666;
    
}

.pitch-section-container .card .content .cta{
    justify-content: center;
    position: relative;
    display: inline-block;
    padding: 10px 20px;
    background: #EF7289;
    color: #fff;
    border: none;
    border-radius: 5px;
    text-decoration: none;
    margin-top: 20px;
    box-shadow:  0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.19);
  }

  .pitch-section-container .card .content .cta:hover{
    justify-content: center;
    position: relative;
    display: inline-block;
    padding: 10px 20px;
    background: #2D4269;
    color: #fff;
    border-radius: 5px;
    text-decoration: none;
    margin-top: 20px;
    border: none;
    transition: all 0.3s ease;
    box-shadow:  0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.19);  
  }

  @media (max-width: 500px){
    .pitch-section-title {
        font-size: 30px;
    }

    .pitch-section-container .card{
        margin: 20px;
     }
  }
/*Video list section */

.video-list-section {
    margin-top: 30px;
    position: relative;
    display: flex;
    flex-direction: column;
}
.video-list-section .title {
    margin-top: 20px;
    margin-left: 10px;
    margin-right: 10px;
    color: #2D4269;
    font-size: 50px;
    font-weight: 400;
    text-align: center;
    margin-bottom: 40px;
}

.video-list-section .container{
    height: 300px;
    width: 100%;
    z-index: 1;
}

.video-list-section .container video{
    position: absolute;
    height: 300px;
    width: 100%;
    object-fit: cover;
    z-index: 2;
}

.video-list-section .container .content{
    position: relative;
    display: flex;
    height: 300px;
    width: 100%;
    justify-content: start;
    align-items: center;
    background-color: rgba(0,0,0,0.3);
    z-index: 3;
}
.video-list-section .container .content .content-container-left{
    display: flex;
    height: auto;
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin-left: 70px;
}

.video-list-section .container .content .content-container-right{
    display: flex;
    height: auto;
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    margin-right: 70px;
}


.video-list-section .container .content .content-container-left h3{
    color: white;
    font-size: 40px;
}

.video-list-section .container .content .content-container-left a{
    margin: 10px;
    background-color: transparent;
    color: white;
    font-size: 18px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid white ;    
    cursor: pointer;
}


.video-list-section .container .content .content-container-left a:hover{
    margin: 10px;
    background-color: white;
    color: black;
    font-size: 18px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid white ;    
}

.video-list-section .container .content .content-container-right h3{
    color: white;
    font-size: 40px;
}

.video-list-section .container .content .content-container-right a{
    margin: 10px;
    background-color: transparent;
    color: white;
    font-size: 18px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid white ;  
    cursor: pointer;  
}


.video-list-section .container .content .content-container-right a:hover{
    margin: 10px;
    background-color: white;
    color: black;
    font-size: 18px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid white ;    
}

@media (max-width: 500px){
    .video-list-section .title {
        font-size: 30px;
    }
    .video-list-section .container .content{
        justify-content: center;
    }

    .video-list-section .container .content .content-container-left{
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-left: 0px;
    }

    .video-list-section .container .content .content-container-left h3{
        font-size: 30px;
    }

    .video-list-section .container .content .content-container-right{
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-right: 0px;
    }

    .video-list-section .container .content .content-container-right h3{
        font-size: 30px;
    }
}
/*Video list section */

/*Call to action section */

.cta-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 60px;
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #e7e7e7;
}

.cta-section h2{
   text-align: center;
   color: #2D4269;
   font-size: 40px;
   font-weight: 400;
   margin-left: 10px;
   margin-right: 10px;
}

.cta-section h3{
    text-align: center;
    color: #2D4269;
    font-size: 20px;
    font-weight: 400;
    margin-top: 20px;
    margin-left: 10px;
    margin-right: 10px;
 }

 .cta-section a{
    margin: 10px;
    margin-top: 20px;
    background-color: #E62045;
    color: white;
    font-size: 18px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid #E62045;
    cursor: pointer;
 }

 .cta-section a:hover{
    margin: 10px;
    margin-top: 20px;
    background-color: #2D4269;
    color: white;
    font-size: 18px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid #2D4269 ;
 }

 @media (max-width: 500px){
    .cta-section h2{
        font-size: 30px;
     }
     
     .cta-section h3{
         font-size: 20px;
      }
 }

 /*Image and text section */

.image-and-text-section{
    width: 100%;
    height: 500px;
    margin-top: 50px;
    margin-bottom: 50px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.image-and-text-section .image-container{
    width: 50%;
    height: 500px;
}

.image-and-text-section .image-container img{
    position: absolute;
    width: 50%;
    height: 500px;
    object-fit: cover;
    box-shadow: 7px 1px 11px -1px rgba(0,0,0,0.50);
}

.image-and-text-section .container{
   width: 50%;
   height: 500px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   background-color: #2D4269;
}

.image-and-text-section .container h2{
    text-align: start;
    font-size: 30px;
    color: white;
    text-transform: uppercase;
    margin-bottom: 20px;
 }

 .image-and-text-section .container p{
    text-align: justify;
    font-size: 20px;
    color: white;
    padding-left: 50px;
    padding-right: 50px;
    margin-bottom: 20px;
 }

 .image-and-text-section .container a{
    font-size: 15px;
    background-color: transparent;
    color: white;
    font-size: 18px;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid white ;
 }

 .image-and-text-section .container a:hover{
    font-size: 15px;
    background-color: white;
    color: #2D4269;
    font-size: 18px;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid white ;
 }

 @media (max-width: 780px){

    .image-and-text-section{
        width: 100%;
        height: 1000px;
        margin-top: 50px;
        margin-bottom: 50px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: space-between;
    }

    .image-and-text-section .image-container{
        width: 100%;
        height: 500px;
    }
    
    .image-and-text-section .image-container img{
        width: 100%;
        height: 500px;
    }

    .image-and-text-section .container{
        width: 100%;
        height: 500px;
     }
     
     .image-and-text-section .container h2{
         text-align: start;
         font-size: 30px;
         color: white;
         text-transform: uppercase;
         margin-bottom: 20px;
      }
     
      .image-and-text-section .container p{
         text-align: justify;
         font-size: 20px;
         max-width: 500px;
         color: white;
         padding-left: 20px;
         padding-right: 20px;
         margin-bottom: 20px;
      }
    
}
 /*Image and text section */

/*Product field section */

.product-section-title {
    margin-top: 50px;
    margin-left: 10px;
    margin-right: 10px;
    color: #2D4269;
    font-size: 50px;
    font-weight: 400;
    text-align: center;
}

.product-section {
    width: 100%;
}

.product-section-container{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.product-section-container .card{
   position: relative;
   display: flex;
   flex-direction: column;
   justify-content: space-around;
   align-items: center;
   width: 300px;
   height: 420px;
   background: #fff;
   margin-top: 25px;
   border-radius: 20px;
   padding: 30px;
   overflow: hidden;
   box-shadow: 0 15px 25px rgba(0,0,0,0.2);
   transition: 0.5s;
   margin-left: 20px;
   margin-right: 20px;
 }

 .product-section-container .card img{
    width: 55%;
    height: 30%;
    object-fit: cover;
    border-radius: 5px;
 }

 .product-section-container .card .content{
    height: auto;
    width: 95%;
    display: flex;
    flex-direction: column;
    align-items: center;
 }

 .product-section-container .card .content h3{
    color: #2D4269;
    text-transform: uppercase;
    font-size: 22px;
    text-align: center;
 }


 .product-section-container .card .content p{
    margin-top: 5px;
    color: #2D4269;
    font-size: 15px;
    text-align: center;
 }

 .product-section-container .card .content a{
    font-size: 15px;
    background-color: transparent;
    color: #EF7289;
    font-size: 18px;
    margin-top: 10px;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid #EF7289 ;
 }

 .product-section-container .card .content a:hover{
    font-size: 15px;
    background-color: #EF7289;
    color: white;
    font-size: 18px;
    margin-top: 10px;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid #EF7289 ;
 }

 @media (max-width: 1020px){

     .product-section-container .card {
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
        width: 400px;
        height: 620px;
     }

     .product-section-container .card img{
        height: 370px;
        width: 400px;
        object-fit: contain;
        border-radius: 5px;
    }

    .product-section-container .card .content{
        height: 370px;
        width: 370px;
        display: flex;
        flex-direction: column;
        align-items: center;
     }

     .product-section-container .card .content p{
        text-align: justify;
     }

 }

 @media (max-width: 500px){

    .product-section-title {
        font-size: 30px;
    }

    .product-section-container .card {
       flex-direction: column;
       justify-content: space-around;
       align-items: center;
       width: 80%;
       height: 520px;
    }

    .product-section-container .card img{
       height: 270px;
       width: 250px;
       object-fit: contain;
       border-radius: 5px;
   }

   .product-section-container .card .content{
       height: 280px;
       width: 230px;
       display: flex;
       flex-direction: column;
       align-items: center;
    }

    .product-section-container .card .content h3{
        font-size: 25px;
        text-align: center;
     }

    .product-section-container .card .content p{
       font-size: 12px;
       text-align: justify;
    }

}

.news-section{
    height: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}


.news-section h2{
    margin-top: 40px;
    margin-bottom: 30px;
    color: #2D4269;
    font-size: 50px;
    font-weight: 400;
    text-align: center;
}


.news-section .container{
    width: 85%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-around;
}

.news-section .container .article{
    width: 300px;
    height: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    position: relative;
    cursor: pointer;
    margin-left: 10px;
    margin-right: 10px;
}

.news-section .container .article img{
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 10px;
    margin-bottom: 15px;
}

.news-section .container .article .overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: 0.3s;
}

.news-section .container .article .overlay:hover {
    background-color: rgba(134, 134, 134, 0.05);
    transition: 0.3s;
}

.news-section .container .article .content{
    width: 100%;
    height: auto;
}

.news-section .container .article .content h3{
    font-size: 20px;
    margin-bottom: 15px;
}

.news-section .container .article .content p{
    font-size: 15px;
    color: #666;
}


.news-section .cta{
     margin-top: 20px;
     background-color: transparent;
     padding: 10px;
     color: #2D4269;
     text-decoration: none;
     border-radius: 8px;
     border: 2px solid #2D4269;
     text-align: center;
     width: 15%;
     transition: all 0.3s ease;
     min-width: 100px;
 }

 .news-section .cta:hover{
    background-color: #2D4269;
    color: white;
    transition: all 0.3s ease;
}

@media(max-width: 1050px){
    
    .news-section .container .first-post .content .info {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
     }
    
     .news-section .container .first-post .content .info .date {
        margin-left: 0px;
        margin-top: 10px;
     }
    
    .news-section .container-right .second-third-post .content h3{
        font-size: 18px;
    }

    .news-section .container-right .second-third-post .content .info {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    .news-section .container-right .second-third-post .content .info .date .fa-calendar-day{
        margin-left: 0px;
      }

      .news-section .container-right .second-third-post .content .info .date {
        margin-top: 10px;
     }
}

@media(max-width: 785px){
    .news-section .container .article {
        margin-top: 30px;
    }
}

/* footer */
footer{
    margin-top: auto;
}
.site-footer
{
  display: flex;
  flex-direction: column;
  background-color:#26272b;
  padding:45px 20px 45px 20px;
  font-size:15px;
  line-height:24px;
  color:#737373;
  bottom: 0;
}

.site-footer .footer-container
{
  display: flex;
  flex-direction: column;
  align-items: center;
}

.site-footer .footer-container .footer-content
{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.site-footer .footer-container .about
{
  display: flex;
  flex-direction: column;
  max-width: 700px;
  margin-bottom: 15px;
}

.site-footer .footer-container .about h3
{
  color: #fff;
  font-size: 20px;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.site-footer .footer-container .quick-links
{
  display: flex;
  flex-direction: column;
  padding-left: 30px;
  max-width: 700px;
}

.site-footer .footer-container .quick-links h3
{
  color: #fff;
  font-size: 20px;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.site-footer .footer-container .quick-links  ul
{
    list-style: none;
}

.site-footer .footer-container .quick-links  a
{
  color: #737373;
  font-size: 15px;
  text-decoration: none;
}

.site-footer .footer-container .quick-links  a:hover
{
  color: white;
  font-size: 15px;
}

.site-footer .footer-info{
    padding-top: 45px;
}


/*Services page */

.hero-section-services{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    height: auto;
    padding-top:150px;
    margin-bottom: 50px;
}

.hero-section-services img{
    object-fit: cover;
    width: 500px;
    height: auto;
}

.hero-section-services .content{
    width: 500px;
    display: flex;
    flex-direction: column;
    margin-left: 20px;
    margin-right: 20px;
}

.hero-section-services .content h1{
    font-size: 40px;
    color: #2D4269;
    margin-bottom: 15px;
}

.hero-section-services .content p{
    font-size: 20px;
    font-weight: 100;
    color: #2D4269;
    margin-bottom: 15px;
}

.hero-section-services .content h2{
    font-size: 30px;
    color: #2D4269;
    margin-bottom: 15px;
}

.hero-section-services .content .cta-container{
    display: flex;
    flex-direction: column;
}

.hero-section-services .content .cta-container .cta-1{
    margin: 10px;
    text-align: center;
    background-color: #EF7289;
    color: white;
    font-size: 20px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
    text-decoration: none;
    border: 2px solid #EF7289 ;
    transition: all 0.3s ease;
    box-shadow: 0px 2px 5px grey; 
}

.hero-section-services .content .cta-container .cta-1:hover{
    margin: 10px;
    background-color: #EF7289;
    color: white;
    font-size: 20px;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.1s ease;
    border: 2px solid #EF7289 ; 
    box-shadow: 0px 5px 5px grey; 
}

.hero-section-services .content .cta-container .cta-2{
    margin: 10px;
    text-align: center;
    background-color: #6180BB;
    color: white;
    font-size: 20px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0px 2px 5px grey; 
    border: 2px solid #6180BB ; 
}

.hero-section-services .content .cta-container .cta-2:hover{
    margin: 10px;
    background-color: #6180BB;
    color: white;
    font-size: 20px;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.1s ease;
    border: 2px solid #6180BB ; 
    box-shadow: 0px 5px 5px grey; 
}

.video-list-services-section{
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-bottom: 15px;
}

.video-list-services-section .container{
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding-bottom: 30px;
    padding-top: 30px;
}

.video-list-services-section .container .content-container{
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.video-list-services-section .container .content-container .location{
   display: flex;
   align-items: center;
   margin-bottom: 8px;
}

.video-list-services-section .container .content-container .location img{
    width: 10%;
    height: auto;
    margin-right: 4px;
 }

.video-list-services-section .container .content-container h2{
    color: #2D4269;
    font-size: 40px;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.video-list-services-section .container .content-container h3{
    color: #2D4269;
    font-size: 30px;
    font-style: italic;
    font-weight: 300;
}

.video-list-services-section .container .content-container p{
    color: #2D4269;
    font-size: 20px;
    margin-bottom: 8px;
}

.video-list-services-section .container .thumbnail-container{
    position: relative;
    width: 35%;
    height: 250px;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0px 5px 5px grey;
    transition: all 0.2s ease;
    max-width: 500px;
    cursor: pointer;
}

.video-list-services-section .container .thumbnail-container:hover{
    box-shadow: 0px 10px 5px grey;
    transition: all 0.2s ease;
}

.video-list-services-section .container .thumbnail-container img{
    position: absolute;
    object-fit: cover;
    height: 100%;
    width: 100%;
    z-index: 1;
}

.video-list-services-section .container .thumbnail-container .content{
    position: absolute;
    border-radius: 15px;
    background-color: rgb(104, 104, 104);
    opacity: 0.5;
    height: 100%;
    width: 100%;
    z-index: 2;
}

.video-list-services-section .container .thumbnail-container .content {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
    z-index: 3;
}

.video-list-services-section .container .thumbnail-container .content  img{
    position: absolute;
    height: 50%;
    width: 50%;
    z-index: 4;
    object-fit: contain;
}

 .video-player{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 10000;
    background: rgba(0, 0, 0, 0.95);
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    visibility: hidden;
    opacity: 0;
}

.video-player .close{
    position: absolute;
    top: 30px;
    right: 30px;
    cursor: pointer;
    max-width: 32px;
    max-height: 32px;
}

 .video-player.active{
    visibility: visible;
    opacity: 1;
}


 .video-player video{
    position: relative;
    max-width: 900px;
    outline: none;
}

@media (max-width: 1050px){
    .hero-section-services img{
        object-fit: cover;
        width: 400px;
        height: auto;
    }

    .hero-section-services .content{
        width: 400px;
        display: flex;
        flex-direction: column;
        margin-left: 20px;
        margin-right: 20px;
    }

    .video-list-services-section .container .content-container h2{
        font-size: 40px;
    }
    
    .video-list-services-section .container .content-container h3{
        color: #2D4269;
        font-size: 30px;
        font-style: italic;
        font-weight: 300;
    }
    
    .video-list-services-section .container .content-container p{
        font-size: 20px;
    }
}

@media (max-width: 950px){
    .video-player video{
        position: relative;
        max-width: 700px;
        outline: none;
    }
}

@media (max-width: 840px){
    .hero-section-services img{
        object-fit: cover;
        width: 400px;
        height: auto;
    }

    .hero-section-services .content{
        width: 700px;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-left: 30px;
        margin-right: 30px;
    }

    .hero-section-services .content p{
        text-align: justify;
        
    }

    .video-list-services-section .container .content-container h2{
        font-size: 30px;
    }
    
    .video-list-services-section .container .content-container h3{
        color: #2D4269;
        font-size: 20px;
        font-style: italic;
        font-weight: 300;
    }
    
    .video-list-services-section .container .content-container p{
        font-size: 17px;
        text-align: center;
        margin-bottom: 20px;
    }

    .video-list-services-section .container .thumbnail-container{
        width: 60%;
    }

    .video-list-services-section .container{
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        padding-bottom: 30px;
        padding-top: 30px;
    }

    .video-list-services-section .container .content-container{
        width: 60%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .video-player video{
        position: relative;
        max-width: 500px;
        outline: none;
    }
    
}
@media (max-width: 540px){
    .hero-section-services img{
        width: 280px;
    }

    .video-player video{
        position: relative;
        max-width: 300px;
        outline: none;
    }
}

@media (max-width: 450px){
    .hero-section-services img{
        width: 280px;
    }

    .video-player video{
        position: relative;
        max-width: 300px;
        outline: none;
    }
}

/* Contact page */
.header-breadcrumb {
    margin-top: 120px;
    margin-bottom: 25px;
    width: 100%;
    display: flex;
    justify-content: center;
}

.header-breadcrumb > p{
    margin-left: 15px;
}

.header-breadcrumb a{
    color: grey;
    margin-right: 5px;
}

.header-breadcrumb p{
    color: grey;
    margin: 0px;
}

.header-breadcrumb > p{
    color: grey;
    margin-right: 6px;
}

.breadcrumb-contact {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 150px;
}

.breadcrumb-contact a {
    font-size: 18px;
    font-weight: 400;
    color: grey;
}

.breadcrumb-contact p {
    font-weight: 300;
    font-size: 18px;
    color: grey;
}

.appointment-section{
    width: 100%;
    height: 400px;
    margin-top: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.appointment-section .card{
    width: 900px;
    height: auto;
    padding-top: 30px;
    padding-bottom: 30px;
    background-color: #fff;
    border-radius: 15px;
    box-shadow: 0px 4px 10px grey;
    display: flex;
    justify-content: space-around;
    align-items: center;
    overflow: hidden;
}

.appointment-section .card img{
    width: 28%;
    height: auto;
}   

.appointment-section .card .cta-content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 300px;
}

.appointment-section .card .cta-content h2{
    text-align: center;
    color: #2D4269;
    font-size: 25px;
    margin-bottom: 15px;
}

.appointment-section .card .cta-content .cta{
    color: #fff;
    text-decoration: none;
    font-size: 20px;
    background-color: #6180BB;
    border: 2px solid #6180BB;
    border-radius: 5px;
    padding: 10px 20px;
    box-shadow: 0px 4px 5px grey;
    transition: all 0.3s ease;
    cursor: pointer;
}

.appointment-section .card .cta-content .cta:hover{
    background-color: #2D4269;
    border: 2px solid #2D4269;
    transition: all 0.3s ease;
}

.title-transition h3{
    text-align: center;
    font-size: 40px;
    font-weight: 300;
    color: #b58b62;
}


.contact-form-section{
    width: 95%;
    max-width: 499px;
    margin-bottom: 47px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 47px auto;

}

.contact-form-section .form-card{
    position: relative;
    margin: auto;
    width: 100%;
    background-color: white;
    border-radius: 15px;
    box-shadow: 0px 4px 10px grey;

}

.contact-form-section .form-card .info-card{
    position: absolute;
    width: 350px;
    height: 500px;
    background-color: #EF7289;
    border-radius: 15px;
    box-shadow: 0px 4px 10px grey;
    top: 40px; left: -250px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.contact-form-section .form-card .info-card .text{
    display: flex;
    color: white;
    flex-direction: column;
    align-items: center;
    margin-top: 30px;
}

.contact-form-section .form-card .info-card .text p{
    padding-top: 15px;
    font-size: 3
    20px;
    text-align: center;
    margin-left: 30px;
    margin-right: 30px;
}

.form-content{
    padding: 30px;
    width: auto;
}

/* @media (max-width: 1024px){

    .contact-form-section{
        height: fit-content;
        margin: auto;
        margin-bottom: 17px;
        padding-top: 30px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        width: 90%;
    }
    
    .contact-form-section .form-card{
        margin-left: 0px;
        width: 100%;
    }
    
    .contact-form-section .form-card .info-card{
        display: none;
    }

    .form-content{
        padding-top: 70px;
        padding-left: 50px;
        padding-right: 40px;
    }

    .appointment-section .card{
        width: 600px;
    }
}

@media (max-width: 768px){

    .contact-form-section .form-card{
        margin-left: 0px;
    }
    
    .contact-form-section .form-card .info-card{
        
    }

    .appointment-section .card{
        width: 400px;
        height: auto;        
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
    }

    .appointment-section .card img{
        margin-bottom: 10px;
    }  

}

@media (max-width: 480px){

    .contact-form-section .form-card{
        margin-left: 0px;
    }
    
    .contact-form-section .form-card .info-card{
      
    }

    .appointment-section .card{
        width: 300px;
        height: auto;        
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
    }

} */

.social-media-footer{
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin-top: 30px;
    font-size: 10px;
}
.social-media-footer i{
    margin-left: 10px;
    margin-right: 10px;
    color: #666;
    transition: all 0.3s ease;
}

.social-media-footer #facebook:hover{
    opacity: 1;
    color: #1877f2;
    transition: all 0.3s ease;
}

.social-media-footer #instagram:hover{
    opacity: 1;
    color: #c32aa3;
    transition: all 0.3s ease;
}

.social-media-footer #youtube:hover{
    opacity: 1;
    color: #ff0000;
    transition: all 0.3s ease;
}

.social-media-footer #linkedin:hover{
    opacity: 1;
    color: #0a66c2;
    transition: all 0.3s ease;
}


.social-media{
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin-top: 30px;
}
.social-media i{
    margin-left: 7px;
    margin-right: 7px;
    color: white;
    opacity: 0.5;
    transition: all 0.3s ease;
}

.social-media i:hover{
    opacity: 1;
    transition: all 0.3s ease;
}

.control-label{
    color: #2D4269;
    font-weight: 100;
}

#fld_8768091_1{
    border-radius: 5px;
    border-color: transparent;
    box-shadow:none;
    background-color: rgb(241, 241, 241);
}

#fld_9970286_1, #fld_566973_1 {
    border-radius: 5px;
    border-color: transparent;
    box-shadow:none;
    background-color: rgb(241, 241, 241); 
}

#fld_7683514_1{
    border-radius: 5px;
    border-color: transparent;
    box-shadow:none;
    background-color: rgb(241, 241, 241); 
    resize: none;
}

#fld_7908577_1{
    border-radius: 5px;
    background-color: #6180BB;
    border-color: #6180BB;
    box-shadow: 0px 4px 8px grey;
    color: white;
    transition: all 0.3s ease;
}

#fld_7908577_1:hover{
    background-color: #2D4269;
    border-color: #2D4269;
    transition: all 0.3s ease;
}

/* page.php styles */

.page-body{
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
}


.page-title{
    width: 100%;
    padding-top: 150px;
    margin-bottom: 50px;
}

.page-title h1{
    padding-left: 80px;
    padding-right: 80px;
    text-align: center;
    font-size: 40px;
    font-weight: 300;
    color: #b58b62;
}

.page-content{
    max-width: 80%;
    margin-bottom: 100px;
}


.page-content h1, h2, h3, h4{
    margin-bottom: 15px;
    margin-top: 20px;
}

.page-content figure {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
}

.page-content img{
    width: 30%;
    height: auto;
    border-radius: 8px;
}

/* single.php styles */



.single-body{
    min-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}


.single-title{
    width: 100%;
    padding-top: 150px;
    margin-bottom: 50px;
}

.single-title h1{
    padding-left: 80px;
    padding-right: 80px;
    text-align: center;
    font-size: 50px;
    font-weight: 400;
    font-weight: 300;
    color: #2D4269;
}

.single-content{
    max-width: 1100px;
    width: 80% !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: justify;
}




.single-content figure {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    margin-bottom: 35px;
}

.single-content .alignleft {
    display: inline;     
    float: left;     
    margin-right: 1em;
}

.single-content .alignright {
    display: inline;     
    float: right;     
    margin-left: 1em;
}
    

.single-content h2{
    font-size: 35px;
    font-weight: 300;
    color: #2D4269;
    margin-bottom: 25px;
}

.single-content h3,h4,h5{
    font-size: 30px;
    font-weight: 300;
    color: #2D4269;
    margin-bottom: 25px;
}

.single-content p{
    text-align: justify;
    font-size: 20px;
    font-weight: 200;
    color: #2D4269;
}

.single-head-section{
    display: flex;
    width: 100%;
    height: auto;
    margin-bottom: 50px;
}

.single-head-section .single-head-container{
    position: relative;
    display: flex;
    justify-content: center;
    width: 100%;
    height: 100%;
    max-width: none !important;
}

.single-head-section .single-head-container img{
    object-fit: cover;
    width: 100%;
    height: 400px;
    border-radius: 8px;
    box-shadow: 0 15px 25px rgba(0,0,0,0.2);
}

.single-head-section .single-head-container .categories{
    display: flex;
    justify-content: space-around;
    position: absolute;
    z-index: 2;
    bottom: 50px;
    right: 37%;
}

.single-head-section .single-head-container .categories h3{
    padding: 10px;
    margin: 5px;
    background-color: white;
    color: #2D4269;
    font-size: 15px;
    font-weight: 400;
    border-radius: 8px;
}

.single-head-section .single-head-container .card{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 25%;
    height: 440px;
    background-color: #EF7289;
    border-radius: 8px;
    box-shadow: 0 15px 25px rgba(0,0,0,0.2);
}

.single-head-section .single-head-container .card h2{
    margin-bottom: 10px;
    margin-top: 15px;
    margin-left: 5px;
    margin-right: 5px;
    font-size: 30px;
    font-weight: 300;
    color: #fff;
    text-align: center;
    padding-left: 10px;
    padding-right: 10px;
}

.single-head-section .single-head-container .card .posts-links{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    height: 100%;
    width: 100%;
}

.single-head-section .single-head-container .card .posts-links .container {
    width: 90%;
    height: 100px;
    text-align: center;
    position: relative;
    cursor: pointer;
}

.single-head-section .single-head-container .card .posts-links .container img {
    width: 100%;
    height: 100px;
}

.single-head-section .single-head-container .card .posts-links .container .overlay {
    position: absolute;
    z-index: 1;
    height: 100%;
    width: 100%;
    text-decoration: none;
    background-color: #666;
    bottom: 0;
    left: 0;
    border-radius: 8px;
    opacity: 0.5;
    transition: all 0.3s ease;
}

.single-head-section .single-head-container .card .posts-links .container .overlay:hover {
    opacity: 0.8;
    transition: all 0.3s ease;
}

.single-head-section .single-head-container .card .posts-links .container a {
    position: absolute;
    z-index: 2;
    text-decoration: none;
    color: #fff;
    bottom: 5px;
    left: 10px;
    padding-right: 10px;
}

.single-head-section .single-head-container .card .posts-links .container h3 {
    font-size: 15px;
    color: white;
}

.single-body .adjacent-link{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 15px;
    margin-bottom: 30px;
    margin-left: 30px;
    margin-right: 30px;
    max-width: 1100px;
}
.single-body .adjacent-link .adjacent-link-container{
    width: 60%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.single-body .adjacent-link .adjacent-link-container a{
    display: flex;
    align-items: center;
    text-decoration: none;
    color: white;
    font-size: 18px;
    margin-right: 10px;
    margin-left: 10px;
    background-color: #2D4269;
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 15px 25px rgba(0,0,0,0.2);
}


.single-body .adjacent-link .adjacent-link-container i{
    margin-left: 10px;
    margin-right: 10px;
    font-size: 25px;
}

.comment{
    background-color: white;
    padding: 15px;
    width: 80%;
    border-radius: 8px;
    border: 2px solid #dddddd;
    list-style: none;
    box-shadow: 6px 7px 14px 0px rgba(176,176,176,0.75);
    margin-bottom: 5px;
    max-width: 1100px;
}

.comment-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.comment-modify i{
    color: #b4b4b4;
}

.comment-modify a{
    color: #b4b4b4;
    text-decoration: none;
}

.comment-body{
    margin-bottom: 15px;
}

.comment-details{
    justify-self: flex-end;
    display: flex;
    justify-content: space-between;
}

.comment-author{
    color: #666;
    display: flex;
    align-items: center;
    font-size: 18px;
}

.comment-author .fn{
    margin-left: 10px;
    color: #6180BB;
}

.comment-author .url{
    text-decoration: none;
    font-size: 18px;
    color: #6180BB;
}


.comment-text{
    margin-top: 15px;
    margin-left: 50px;
    margin-right: 50px;
    margin-bottom: 15px;
    color: #999999;
}

.comment-meta{
    margin-left: 50px;
}

.comment-meta a{
    color: #6180BB;
    font-size: 12px;
    text-decoration: none;
}

.reply i{
    color: #6180BB;
}

.reply a{
    color: #6180BB;
    text-decoration: none;
}

.children{
    margin-left: 10%;
    width: 100%;
}

.avatar{
    border-radius: 50%;
}


.comment-respond{
    display: flex;
    flex-direction: column;
    width: 80%;
    background-color: #f3f3f3;
    padding: 15px;
    border-radius: 8px;
    border: 2px solid #b1b1b1;
    box-shadow: 6px 7px 14px 0px rgba(176,176,176,0.75);
    margin-bottom: 20px;
    margin-top: 20px;
    max-width: 1100px;
}

.comment-reply-title{
    color: #6180BB;
    text-align: center;
    margin-bottom: 15px;
}

.comment-notes{
    color: #6180BB;
    margin-bottom: 10px;
    font-weight: 200;
}

.comment-form-comment{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.comment-form-comment label{
    color: #6180BB;
    font-size: 15px;
    margin-bottom: 10px;
    font-weight: 500;
}

.comment-form-comment textarea{
    border-radius: 8px;
    margin-bottom: 15px;
    resize: none;
    width: 80%;
}


.comment-form-author{
    display: flex;
    flex-direction: column;
}

.comment-form-author label{
    color: #6180BB;
    font-size: 15px;
    margin-bottom: 10px;
    font-weight: 500;
}

.comment-form-author input{
    border-radius: 8px;
    margin-bottom: 10px;
    width: 80%;
    outline: none;
    padding: 3px 0px 3px 3px;
    border: 1px solid #DDDDDD;
}

.comment-form-author input:focus{
    box-shadow: 0 0 5px #2D4269;
    border: 2px solid #2D4269;
}

.comment-form-email{
    display: flex;
    flex-direction: column;
}

.comment-form-email label{
    color: #6180BB;
    font-size: 15px;
    margin-bottom: 10px;
    font-weight: 500;
}

.comment-form-email input{
    border-radius: 8px;
    margin-bottom: 10px;
    width: 80%;
    outline: none;
    padding: 3px 0px 3px 3px;
    border: 1px solid #DDDDDD;
}

.comment-form-email input:focus{
    box-shadow: 0 0 5px #2D4269;
    border: 2px solid #2D4269;
}

.comment-form-url{
    display: flex;
    flex-direction: column;
}

.comment-form-url label{
    color: #6180BB;
    font-size: 15px;
    margin-bottom: 10px;
    font-weight: 500;
}

.comment-form-url input{
    border-radius: 8px;
    margin-bottom: 10px;
    width: 80%;
    outline: none;
    padding: 3px 0px 3px 3px;
    border: 1px solid #DDDDDD;
}

.comment-form-url input:focus{
    box-shadow: 0 0 5px #2D4269;
    border: 2px solid #2D4269;
}

.comment-form-cookies-consent{
    color: #6180BB;
    margin-bottom: 10px;
    font-weight: 200;
}

.form-submit .submit{
    padding: 10px;
    background-color: transparent;
    border-radius: 8px;
    color: #6180BB;
    border: 2px solid #6180BB;
    cursor: pointer;
}

.form-submit .submit:hover{
    background-color: #6180BB;
    color: white;
    transition: all 0.3s ease;
}

.logged-in-as{
    margin-bottom: 10px;
}







@media (max-width: 1050px){
    
    .single-head-section .single-head-container{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        height: 30%;
    }

    .single-head-section .single-head-container img{
        object-fit: cover;
        width: 100%;
        height: 200px;
        margin-bottom: 15px;
    }

    .single-head-section .single-head-container .categories{
        bottom: 230px;
        right: 15%;
    }

    .single-head-section .single-head-container .card{
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 85%;
        height: 200px;
    }

    .single-head-section .single-head-container .card .posts-links{
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        height: 100%;
        width: 100%;
    }

    .single-head-section .single-head-container .card .posts-links .container {
        width: 30%;
        height: 100px;
    }

    .single-head-section .single-head-container .card .posts-links .container a {
        position: absolute;
        z-index: 2;
        text-decoration: none;
        color: #fff;
        bottom: 5px;
        left: 7px;
        padding-left: 0px;
        padding-bottom: 0px;
    }
    
    .single-head-section .single-head-container .card .posts-links .container h3 {
        font-size: 12px;
        color: white;
        text-align: center;
        text-align: start;
    }

}
    


@media (max-width: 480px){
    
    .single-head-section .single-head-container .card{
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 80%;
        height: 440px;
        background-color: #EF7289;
        border-radius: 8px;
        box-shadow: 0 15px 25px rgba(0,0,0,0.2);
    }
    .single-head-section .single-head-container .categories{
        bottom: 460px;
        right: 15%;
    }
    
    
   
    .single-head-section .single-head-container .card .posts-links .container h3 {
        font-size: 12px;
    }
    
    .single-head-section .single-head-container .card .posts-links{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
        height: 100%;
        width: 100%;
    }

    .single-head-section .single-head-container .card .posts-links .container {
        width: 90%;
        height: 100px;
        text-align: center;
        position: relative;
        cursor: pointer;
    }
   
}

/* archive file */

.archive-body{
    min-height: 100%;
    margin-left: 40px;
    margin-right: 40px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}



.breadcrumb-archive {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 150px;
}

.breadcrumb-archive a {
    font-size: 18px;
    font-weight: 400;
    color: grey;
}

.breadcrumb-archive p {
    font-weight: 300;
    font-size: 18px;
    color: grey;
}

.archive-body .title-section {
    width: 100%;
    max-width: 1200px;
    align-self: center;
}

.archive-body .title-section h1 {
    margin-bottom: 10px;
    text-align: center;
    font-size: 40px;
    font-weight: 300;
    color: #b58b62;
}

.archive-body .title-section .section-divider{
    min-height: 8px;
    width: 100%;
    background-color: #2D4269;
    border-radius: 8px;
}

.archive-body .post-list-section{
    padding-top: 20px;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.archive-body .post-list-section .container{
    display: flex;
    width: 100%;
    background-color: #e7e7e7;
    height: 30%;
    border-radius: 8px;
    box-shadow: 0 15px 25px rgba(0,0,0,0.2);
    margin-top: 15px;
    margin-bottom: 15px;
    cursor: pointer;
    transition: all 0.3s ease;
    max-width: 1200px;
}

.archive-body .post-list-section .container:hover{
    display: flex;
    width: 100%;
    background-color: #e7e7e7;
    height: 30%;
    border-radius: 8px;
    box-shadow: 0 25px 25px rgba(0,0,0,0.2);
    margin-top: 15px;
    margin-bottom: 15px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.archive-body .post-list-section .container img{
    width: 200px;
    height: 200px;
    object-fit: cover;
    margin: 10px;
    border-radius: 8px;
    box-shadow: 0 15px 45px rgba(0,0,0,0.2);
}

.archive-body .post-list-section .container .content{
   display: flex;
   flex-direction: column;
   align-items: flex-start;
}

.archive-body .post-list-section .container .content h2{
    color: #6180BB;
    font-size: 30px;
    font-weight: 500;
    padding-top: 15px;
    padding-left: 25px;
 }

 .archive-body .post-list-section .container .content p{
    color: #6180BB;
    font-size: 15px;
    font-weight: 200;
    padding-top: 15px;
    padding-left: 25px;
    padding-right: 15px;
 }

 .archive-body .post-list-section .container .content .info{
    display: flex;
    width: 40%;
    padding-left: 25px;
    padding-top: 20px;
    margin-bottom: 10px;
 }

 .archive-body .post-list-section .container .content .info .date {
    display: flex;
    align-items: center;
    margin-right: 20px;
    margin-left: 10px;
 }

 .archive-body .post-list-section .container .content .info .author {
    display: flex;
    align-items: center;
 }

 .archive-body .post-list-section .container .content .info .date i{
   margin-right: 8px;
   color: #6180BB;
 }

 .archive-body .post-list-section .container .content .info .author i{
    margin-right: 8px;
    color: #6180BB;
  }

 .archive-body .post-list-section .container .content .info .date p{
    padding: 0;
    font-weight:400;
    font-style: italic;
    min-width: 150px;
 }

 .archive-body .post-list-section .container .content .info .author p{
    padding: 0;
    font-weight:400;
    font-style: italic;
    white-space: nowrap;
 }

 .pagination{
     margin-top:15px;
     margin-bottom: 20px;
     font-size: 25px;
     color: #2D4269;
 }
 
 .pagination .page-numbers{
    color: #b58b62;
 }


 @media (max-width: 780px){
    
    .archive-body .post-list-section .container{
        display: flex;
        flex-direction: column;
    }

    .archive-body .post-list-section .container img{
        width: 90%;
        height: 200px;
        object-fit: cover;
        margin: 10px;
        border-radius: 8px;
        box-shadow: 0 15px 45px rgba(0,0,0,0.2);
        align-self: center;
    }

    .archive-body .post-list-section .container .content .info{
        flex-direction: column;
     }

     
     .archive-body .post-list-section .container .content .info .author {
        margin-top: 10px;
     }

     .archive-body .post-list-section .container .content .info .date {
        margin-top: 10px;
        margin-left: 0px;
     }
    
    
}

/* cart page */

.woocommerce-cart .return-to-shop a{
    color: #b58b62;
}

.woocommerce-cart .woocommerce-cart-form{
    border-radius: 8px;
    width: 100%;
}

.woocommerce-cart .woocommerce-cart-form .shop_table{
    padding: 10px;
    border-radius: 8px;
    background-color: white;
    border-collapse: separate;
}

.woocommerce-cart .woocommerce-cart-form .shop_table thead tr{
    color: #b58b62;
    background-color: #f0f0f0;
    padding-left: 10px;
    padding-right: 10px;
}

.woocommerce-cart .woocommerce-cart-form .shop_table tbody td{
    color: black;
    padding-right: 20px;
    border-bottom: 1px solid #ccc;
}

.woocommerce-cart .woocommerce-cart-form .shop_table .product-thumbnail{
    text-align: center;
    padding-top: 15px;
}

.woocommerce-cart .woocommerce-cart-form .shop_table .product-thumbnail img{
    width: 35%;
}

.woocommerce-cart .woocommerce-cart-form .shop_table .product-remove {
    margin-left: 19px;
}

.woocommerce-cart .woocommerce-cart-form .shop_table .product-remove .remove{
    text-decoration: none;
    background-color: #ff8d8d;
    color: white;
    font-size: 25px;
    border-radius: 70px;
    padding: 6px;
    transition: all 0.3s ease;
}

.woocommerce-cart .woocommerce-cart-form .shop_table .product-remove .remove:hover{
    background-color: #f94e4e;
    transition: all 0.3s ease;
}
.woocommerce-cart .woocommerce-cart-form .shop_table th{
    padding: 5px;
}

.woocommerce-cart .woocommerce-cart-form .shop_table .cart_item td{
    font-size: 15px;
    font-weight: 300;
    text-decoration: none;
    color: grey;
    width: 200px;
}

.woocommerce-cart .woocommerce-cart-form .shop_table .cart_item td a{
    font-size: 15px;
    font-weight: 300;
    text-decoration: none;
    color: grey;
}

.woocommerce-cart .woocommerce-cart-form .shop_table .cart_item .product-quantity .quantity input{
    width: 30px;
}

.woocommerce-cart .woocommerce-cart-form .shop_table tbody td {
    padding-top: 15px;
    padding-bottom: 15px;
}

.woocommerce-cart .woocommerce-cart-form .shop_table .cart_item .product-quantity .quantity label{
    display: none;
}

.woocommerce-cart .woocommerce-cart-form .actions{
    width: auto;
}

.woocommerce-cart .coupon{
    margin-bottom: 10px;
}

.woocommerce-cart .coupon label{
    display: none;
}

.woocommerce-cart .coupon input{
    padding: 5px;
    border-radius: 8px;
    border: 1px solid #EF7289;
    margin-bottom: 10px;
}



.woocommerce-cart .coupon input::placeholder{
    color: #EF7289;
}

.woocommerce-cart .coupon button{
    padding: 5px;
    background-color: #EF7289;
    color: white;
    border: solid 2px #EF7289;
    cursor: pointer;
    border-radius: 8px;
    margin-bottom: 10px;
}

.woocommerce-cart  .cart-collaterals{
    text-align: right;
    margin-top: 20px;
    margin-bottom: 20px;
    border-radius: 8px;
    padding: 10px;
    border-radius: 8px;
    background-color: white;
}

.woocommerce-shipping-totals {
    display: none;
}


.cart-subtotal th::after {
    content: ':';
    margin-right: 10px;

}


.order-total th::after {
    content: ':';
    margin-right: 10px;

}

.woocommerce-cart  .cart-collaterals .cart_totals h2{
    color: #b58b62;
    margin-bottom: 10px;
}

.woocommerce-cart  .cart-collaterals .cart_totals table{
    color: #737373;
    margin-bottom: 10px;
    text-align: right;
    margin-left: auto;
}

.woocommerce-cart  .cart-collaterals .cart_totals .wc-proceed-to-checkout{
    margin-bottom: 10px;
    margin-top: 20px;
}

.woocommerce-cart  .cart-collaterals .cart_totals a{
    background-color: #b58b62;
    color: white;
    border-radius: 8px;
    padding: 15px;
    text-decoration: none;
    box-shadow: 0 5px 5px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
}

.woocommerce-cart  .cart-collaterals .cart_totals a:hover{
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
}

@media (max-width: 700px){
    .woocommerce-cart .woocommerce-cart-form .shop_table thead {
        display: none;
    }

    .woocommerce-cart .woocommerce-cart-form .shop_table tr{
        display: block;
        margin-bottom: 30px;
    }

    .woocommerce-cart .woocommerce-cart-form .shop_table td:before {
        content: attr(data-title);
        float: left;
        font-weight: bold;
    }

    .woocommerce-cart .woocommerce-cart-form  {
        width: 100%;
    }

    .woocommerce-cart .woocommerce-cart-form .shop_table tbody td {
        display: block;
        padding-top: 15px;
        padding-bottom: 15px;
        text-align: right;
        padding-right: 0px;
    }
    
    .woocommerce-cart .woocommerce-cart-form .shop_table .product-remove {
        width: 100%;
        margin-left: 0px;
        text-align: center;
    }

    .woocommerce-cart  .cart-collaterals{
        width: auto;
    }
    
}
/* checkout page */

.woocommerce-checkout-review-order th {
    text-align: left;
}

.woocommerce-info {
    margin-bottom: 0px;
}

.woocommerce-info a{
    color: #b58b62;
}


.woocommerce .woocommerce-form-coupon-toggle{
    background-color: #b58b62;
    padding: 10px;
    border-radius: 10px;
    color: white;
    margin-bottom: 15px;
    width: calc(100% - 20px);
}

.woocommerce .woocommerce-form-coupon-toggle a{
    color: white;
}

.woocommerce .checkout_coupon {
    background-color: #b58b62;
    color: white;
    padding: 10px;
    border-radius: 8px;
    margin-bottom: 10px;
    width: 100%;
    max-width: 950px;
}

.woocommerce .checkout_coupon .form-row-first input {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 5px;
    border: 1px solid white;
    border-radius: 8px;
}

.woocommerce .checkout_coupon .form-row-last button {
    padding: 5px;
    background-color: #6180BB;
    color: white;
    border: solid 2px #6180BB;
    cursor: pointer;
    border-radius: 8px;
}

.woocommerce .checkout {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(100% - 100px);
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    margin-bottom: 35px;
    padding: 50px;
    max-width: 950px;
}


.woocommerce .checkout .col2-set {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
}

.woocommerce .checkout .col2-set .col-1 {
    width: 70%;
    margin-bottom: 25px;
}

.woocommerce .checkout .col2-set .col-2 {
    width: 80%;
}

.woocommerce .checkout .col2-set .col-2 .woocommerce-additional-fields  {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.woocommerce .checkout .col2-set .col-2 .woocommerce-additional-fields h3 {
    text-align: center;
}

.woocommerce .checkout .col2-set .col-2 .woocommerce-additional-fields textarea {
    width: 100%;
    resize: none;
}

.woocommerce .checkout .custom-order-review-wrapper {
    width: 100%;
    height: auto;
    padding: 10px;
    background-color: #f1f1f1;
    border-radius: 6px;
    margin-bottom: 20px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

.woocommerce .checkout .woocommerce-billing-fields {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.woocommerce .checkout .woocommerce-billing-fields h3{
    color: #666;
    margin-bottom: 15px;
    text-transform: uppercase;
    font-size: 25px;
    font-weight: 400;
}

.woocommerce .checkout .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper p{
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
}

.woocommerce .checkout .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper label{
    color: #bbbbbb;
    font-size: 15px;
    margin-bottom: 10px;
    max-width: 500px;
}

.woocommerce .checkout .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper input{
    padding: 10px;
    width: 90%;
    border-radius: 8px;
    background-color: rgb(255, 255, 255);
    border: solid 1px #999999;
    max-width: 500px;
}

.woocommerce .checkout .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper #billing_country_field{
    max-width: 500px;
}

.woocommerce .checkout .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper select{
    padding: 5px;
    border-radius: 8px;
    background-color: rgb(240, 240, 240);
    border: solid 2px #999999;
}

.woocommerce .checkout  .woocommerce-additional-fields h3{
    color: #666;
    margin-bottom: 15px;
    text-transform: uppercase;
    font-size: 25px;
    font-weight: 400;
    margin-top: 15px;
}

.woocommerce .checkout  .woocommerce-additional-fields .form-row{
    display: flex;
    flex-direction: column;
}

.woocommerce .checkout  .woocommerce-additional-fields .form-row{
    color: #999999;
    font-size: 15px;
}

.woocommerce .checkout  .woocommerce-additional-fields .form-row textarea{
    width :70%;
    height: 200px;
    padding: 5px;
}

.woocommerce .custom-order-review-wrapper h3{
    color: #b58b62;
    font-size: 30px;
    font-weight: 400;
}

.woocommerce .custom-order-review-wrapper .woocommerce-checkout-review-order{
    margin-top: 10px;
}

.woocommerce .woocommerce-checkout-review-order-table{
    border-collapse: separate;
    width: 100%;
    color: #737373;
    margin-bottom: 20px;
}

.woocommerce .woocommerce-checkout-review-order-table .cart_item{
    padding-left: 10%;
}

.woocommerce .woocommerce-checkout-review-order-table .cart-subtotal th{
   padding-top: 30px;
}

.woocommerce .woocommerce-checkout-review-order-table .cart-subtotal td{
    padding-top: 30px;
 }

 .woocommerce .woocommerce-checkout-review-order .woocommerce-terms-and-conditions-wrapper{
     color: rgb(223, 64, 64);
     margin-top: 10px;
 }

 .woocommerce .woocommerce-checkout-review-order .wc_payment_methods {
     list-style-type: none;
 }

 .woocommerce .woocommerce-checkout-review-order .wc_payment_methods li{
    margin-bottom: 15px;
}

.woocommerce .woocommerce-checkout-review-order .payment_method_paypal {
    display: flex;
}

.woocommerce .woocommerce-checkout-review-order .payment_method_paypal label{
    display: flex;
    flex-direction: column;
    margin-left: 5px;
}

.woocommerce .woocommerce-checkout-review-order .payment_method_paypal label img{
    width: 80%;
    margin-top: 15px;
    margin-bottom: 15px;
}

.woocommerce .woocommerce-checkout-review-order .payment_method_paypal a{
    color: #b58b62;
}

.woocommerce-privacy-policy-text  {
   margin-bottom: 15px;
}

.woocommerce-privacy-policy-text a {
    color: #b58b62;
}

.woocommerce-terms-and-conditions-checkbox-text a {
    color: #b58b62;
}

 .woocommerce .woocommerce-checkout-review-order  button{
    background-color: #b58b62;
    padding: 10px;
    border: solid 2px #b58b62;
    border-radius: 8px;
    color: white;
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 22px;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
    cursor: pointer;
}

.woocommerce .woocommerce-checkout-review-order  button:hover{
    box-shadow: 0 15px 25px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
}


/* Account page */
.woocommerce-message {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
}

.woocommerce-message a{
    margin-left: 15px;
    color: #b58b62;
}

.woocommerce-account .woocommerce{
    display: flex;
   
    width: 100%;
    margin-bottom: 50px;
}

.woocommerce-account .page-content{
    display: flex;
    max-width: 90%;
    width: 1197px;
    margin: auto;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation{
    justify-self: flex-start;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content table{
    border-spacing: 39px;
    opacity: 1;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation li{
    background-color: #b58b62;
    color: white;
    border-radius: 8px;
    margin-bottom: 5px;
    padding: 15px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation li:hover{
    background-color: #95a0b6;
    transition: all 0.3s ease;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation li a{
    text-decoration: none;
    color: white;
    display: inline-block;
    width: 200px;
    height: 20px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--dashboard a::before{
   font-family: "Font Awesome 5 Free";
   content: "\f3fd";
   display: inline-block;
   margin-right: 15px;
   vertical-align: middle;
   font-weight:900;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--orders a::before{
    font-family: "Font Awesome 5 Free";
    content: "\f07a";
    display: inline-block;
    margin-right: 15px;
    vertical-align: middle;
    font-weight:900;
 }

 .woocommerce-account .woocommerce .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--downloads a::before{
    font-family: "Font Awesome 5 Free";
    content: "\f56d";
    display: inline-block;
    margin-right: 15px;
    vertical-align: middle;
    font-weight:900;
 }

 .woocommerce-account .woocommerce .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--edit-address a::before{
    font-family: "Font Awesome 5 Free";
    content: "\e065";
    display: inline-block;
    margin-right: 15px;
    vertical-align: middle;
    font-weight:900;
 }

 .woocommerce-account .woocommerce .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--edit-account a::before{
    font-family: "Font Awesome 5 Free";
    content: "\f2bd";
    display: inline-block;
    margin-right: 15px;
    vertical-align: middle;
    font-weight:900;
 }

 .woocommerce-account .woocommerce .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--customer-logout a::before{
    font-family: "Font Awesome 5 Free";
    content: "\f2f5";
    display: inline-block;
    margin-right: 15px;
    vertical-align: middle;
    font-weight:900;
 }

.woocommerce-account .woocommerce .woocommerce-MyAccount-content{
    justify-self: center;
    margin-left: 17px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content p{
    margin-bottom: 15px;
    color: #757575;
    font-weight: 500;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content p a{
    color: #b58b62;
    text-decoration: none;
}


/* adresses settings */

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .col-1 h3{
    color: #2D4269;
    margin-bottom: 15px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .col-1 a{
    border-radius: 8px;
    background-color: #EF7289;
    border: 2px solid #EF7289;
    padding: 5px;
    color: white;
    text-decoration: none;
    margin: 10px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .col-1 address{
    margin-top: 20px;
    margin-bottom: 15px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .col-2 h3{
    color: #2D4269;
    margin-bottom: 15px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .col-2 a{
    border-radius: 8px;
    background-color: #EF7289;
    border: 2px solid #EF7289;
    padding: 5px;
    color: white;
    text-decoration: none;
    margin: 10px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .col-2 address{
    margin-top: 20px;
    margin-bottom: 30px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-address-fields .woocommerce-address-fields__field-wrapper p{
    display: flex;
    flex-direction: column;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-address-fields .woocommerce-address-fields__field-wrapper p label{
    color: #2D4269;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-address-fields .woocommerce-address-fields__field-wrapper p input{
    padding: 10px;
    border-radius: 8px;
    border: 2px solid #2D4269;
    width: 90%;
    margin-top: 5px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-address-fields button{
    padding: 10px;
    background-color: #EF7289;
    color: white;
    border-radius: 8px;
    border: none;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-error{
    margin-top: 20px;
    margin-bottom: 15px;
    color: red;
}

/* Account settings */
.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-EditAccountForm p{
    display: flex;
    flex-direction: column;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-EditAccountForm p input{
    padding: 10px;
    border-radius: 8px;
    border: 2px solid #2D4269;
    width: 90%;
    margin-top: 5px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-EditAccountForm p label{
    color: #2D4269;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-EditAccountForm fieldset{
    padding: 20px;
    border-radius: 8px;
    border: 2px solid #2D4269;
    width: 90%;
    margin-top: 5px;
    margin-bottom: 15px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-EditAccountForm fieldset legend{
    color: #2D4269;
    padding: 5px;
    font-weight: 700;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-EditAccountForm fieldset p label{
    color: #2D4269;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-EditAccountForm fieldset input{
    border: 2px solid #2D4269;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-EditAccountForm  p button{
   background-color: #2D4269;
   padding: 10px;
   color: white;
   border-radius: 8px;
   border : none;
}


@media (max-width: 800px){
    .woocommerce-account .woocommerce{
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
    }

    .woocommerce-account .woocommerce .woocommerce-MyAccount-content{
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
        margin-left: 0px;
        margin-top: 30px;
    }

    .woocommerce-account .woocommerce .woocommerce-MyAccount-content table{
        border-spacing: 0;
        opacity: 1;
    }
}


/* Product list */

.archive .site-main {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.woocommerce-breadcrumb{
    width: auto;
    color: white;
    background-color: transparent !important;
    border-radius: 8px;
    text-align: center;
    color: grey;
    margin-top: 100px;
}

.woocommerce-breadcrumb a{
    color: grey;
}

.woocommerce-products-header h1{
    padding-top: 20px;
    text-align: center;
    font-size: 40px;
    font-weight: 300;
    color: #b58b62;
}

.woocommerce-result-count{
    margin-left: 20px;
    margin-bottom: 10px;
}

.woocommerce-ordering{
    margin-left: 20px;
    margin-bottom: 10px;
}

.woocommerce-ordering select{
    padding: 10px;
    border-radius: 8px;
}

.products {
    margin-top: 30px;
    list-style-type: none;
    width: 90%;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.products li{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px;
    margin-left: 10px;
    margin-right: 10px;
    background-color: transparent;
    padding: 10px;
    border-radius: 8px;
    width: calc(30% - 60px);
}

@media (max-width: 900px){
    .products {
        flex-direction: column;
        align-items: center;
    }

    .products li{
        width: 80%;
    }
 }

.products li .woocommerce-LoopProduct-link{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
}

.products li a img{
    width: 200px;
    height: auto;
    border-radius: 8px;
    margin-right: 15px;
    object-fit: cover;
    margin-bottom: 20px;
}

.products li a h2{
    margin-right: 15px;
    text-decoration: none;
    color: #737373;
    text-align: center;
    font-size: 18px;
}

.products .price{
    background-color: #666;
    color: white;
    padding: 10px;
    border-radius: 8px;
    margin-right: 15px;
}

.products .add_to_cart_button{
    background-color: #2D4269;
    color: white;
    text-decoration: none;
    box-shadow: 0 5px 5px rgba(0,0,0,0.2);
    border-radius: 8px;
    padding: 10px;
    transition: all 0.3s ease;
    margin-right: 20px;
    text-align: center;
}

.products .add_to_cart_button:hover{
    box-shadow: 0 10px 5px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
}

.woocommerce-pagination .page-numbers{
    display: flex;
    list-style:none;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
    margin-top: 20px;
}

.woocommerce-pagination .page-numbers li{
    margin-left: 5px;
    margin-right: 5px;
    color: #2D4269;
    font-size: 20px;
}

.woocommerce-pagination .page-numbers li a{
    text-decoration: none;
}

.woocommerce-pagination .page-numbers .prev{
    text-decoration: none;
    background-color: #2D4269;
    color: white;
    border-radius: 8px;
    padding: 5px;
}


@media (max-width: 670px){
    
    .products{
        margin-right: 50px;
        margin-left: 50px;
    }

    .products li{
        flex-direction: column;
        align-items: center;
        padding: 20px;
    }

    .products li .woocommerce-LoopProduct-link{
        flex-direction: column;
        align-items: center;
        text-decoration: none;
        margin-bottom: 30px;
    }

    .products li a img{
        margin-right: 0px;
        margin-bottom: 15px;
    }

    .products .price{
        margin-top: 10px;
        margin-right: 0px;
    }

    .products .add_to_cart_button{
        margin-right: 0px;
    }

    .woocommerce-breadcrumb{
        width: 75%;
    }
	
	.woocommerce .checkout .col2-set {
		display:block!important;
	}
	
	.woocommerce .checkout .col2-set .col-2,
	.woocommerce .checkout .col2-set .col-1 {
		width: 100%!important;
	}
	
	.page-content {
		max-width: 90%;
	}
	
	.woocommerce-cart .woocommerce-cart-form .shop_table .cart_item td {
		width: 100%;
	}
}


/* account connexion */

.flexbox{
    width: 100%;
    display: flex;
    justify-content: center;
}

.flexbox .connexion-card{
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: white;
    border-radius: 8px;
    box-shadow: -1px 10px 29px 0px rgba(171,171,171,0.75);
    padding: 30px;
    width: 300px;
    max-width: 400px;
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 50px;
}

.flexbox .connexion-card h2{
    color: #b58b62;
    font-size: 30px;
    margin-bottom: 20px;
}

.flexbox .connexion-card .woocommerce-form-login p{
    display: flex;
    flex-direction: column;
    margin-bottom: 15px;
}

.flexbox .connexion-card .woocommerce-form-login p label{
    margin-bottom: 5px;
    color: #b58b62;
}

.flexbox .connexion-card .woocommerce-form-login p  input{
   border: 2px solid #b58b62;
   border-radius: 5px;
   padding: 10px;
   background-color: #f6f6f6;
}

.flexbox .connexion-card .woocommerce-form-login p  button{
    border: 2px solid #b58b62;
    border-radius: 5px;
    padding: 10px;
    background-color: #b58b62;
    color: white;
    font-size: 20px;
    margin-top: 10px;
    transition: 0.3s;
    cursor: pointer;
 }

 .flexbox .connexion-card .woocommerce-form-login p  button:hover{
    background-color: white;
    color: #b58b62;
    transition: 0.3s;
 }

 .flexbox .connexion-card .woocommerce-form-login .woocommerce-LostPassword a{
    text-decoration: none;
    color: #b58b62;
 }
 
 .u-columns {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.u-column1 {
    width: 400px;
}

.u-column2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: white;
    border-radius: 8px;
    box-shadow: -1px 10px 29px 0px rgba(171,171,171,0.75);
    padding: 30px;
    width: 300px;
    max-width: 400px;
}

.u-column2 h2{
    font-size: 30px;
    color: #b58b62;
    margin-bottom: 20px;
}

.u-column2 .woocommerce-form-row{
    display: flex;
    flex-direction: column;
    margin-bottom: 15px;
}

.u-column2 .woocommerce-form-row label{
    color: #b58b62;
    margin-bottom: 5px;
}

.u-column2 .woocommerce-form-row input{
    border: 2px solid #b58b62;
    border-radius: 5px;
    padding: 10px;
    background-color: #f6f6f6;
}

.u-column2 p{
    color: grey;
    margin-bottom: 5px;
}

.u-column2 a{
    color: #b58b62;
}

.u-column2 button{
    border: 2px solid #b58b62;
    border-radius: 5px;
    padding: 10px;
    background-color: #b58b62;
    color: white;
    font-size: 20px;
    margin-top: 10px;
    transition: 0.3s;
    cursor: pointer;
}

.u-column2 button:hover{
    border: 2px solid #b58b62;
    background-color: white;
    color: #b58b62;
    transition: 0.3s;
}





 .woocommerce-notices-wrapper ul{
    background-color: rgb(255, 87, 87);
    border-radius: 5px;
    color: white;
    padding: 15px;
    margin-bottom: 15px;
    max-height: 70px;
    list-style: none;
}

.woocommerce-notices-wrapper ul::before{
    font-family: "Font Awesome 5 Free";
    content: "\f00d";
    display: inline-block;
    margin-right: 15px;
    vertical-align: middle;
    font-weight:900;
    text-align: center;
 }



 .single-post .top_header {
    display: block;
    content: '';
    margin-top:120px;
}

.single-post .princ_title h1 {
    text-align: center;
    margin: 50px 0px;
    color: #b58b62;
    font-size: 40px; 
}

.single-post img {
    height: auto;
}

.single-post .princ_content a {
    color: #b58b62;
    transition-duration: 0.4s;
} 

.single-post .princ_content a:hover {
    opacity: 0.7;
} 

.single-post .container_single {
    width: 80%;
    max-width: 1200px;
    margin: 50px auto;
}

.single-post .princ_img {
    display: block;
    content : '';
    width: 100%;
    height: 350px;
    margin-bottom: 30px;
    border-radius: 20px;

}

.single-post .adjacent-link-container {
    display: flex;
    justify-content: space-between;
}

.single-post .adjacent-link-container a {
    display: flex;
    text-decoration: none;
    background: #b58b62;
    border: 1px solid #b58b62;
    width: fit-content;
    padding: 7px 15px;
    border-radius: 15px;
    color:#fff;
    transition-duration: 0.4s;
}

.single-post .adjacent-link-container a:hover {
    background: none;
    color: #b58b62;
}



.single-post i.fa-arrow-left {
    margin-right: 10px; 
    
}

.single-post i.fa-arrow-right {
    margin-left: 10px; 
}

.single-post .princi_comment {

    margin-top: 50px;
}

.single-post .princi_comment #respond {
    margin: 0!important;
    padding: 0!important;
    margin-top: 30px!important;
    width: 100%!important;
    padding: 20px 0px 20px 20px!important;
    max-width: 1200px;
}

.single-post .comment {
    width: 100%;
    max-width: 1200px;
}

.alignleft {
display: inline;
float: left;
margin-right: 1em;
padding: 20px;
}

.alignright {
display: inline;
float: right;
margin-left: 1em;
padding: 20px;
}


.single-post .princ_content p {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    margin-bottom: 30px;
    }

    @media screen and (max-width: 750px) {
        img.alignleft {
            display: block;
    float: none;
    margin: auto;
}

img.alignright {
    display:block;
    float: none;
    margin: auto;
}

.single-post .princ_img {
    height: 200px;
}

.single-post .princi_comment #respond {

    padding: 20px 0px 20px 20px!important;
    
}



    }