/**********************SECTION tarif BANNER*/

.nos-tarifs{
    padding-top: 8rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    /*border-top: 1px solid lightgrey;*/
}

/******************TARIF CONTENT**************/
.nos-tarifs .content{ 
    padding: 0 1rem; 
    display: flex;
    flex-wrap: wrap;
    align-items: center;   
    gap: 2rem;
}
.nos-tarifs .content .text{  
    position: relative;
    flex:1 1 41rem;
    align-items: center;
    padding-top: 2rem;
    padding-left: 1rem;
    padding-right: 1rem;
    z-index: 1;   
}
.nos-tarifs .content .text .bg-img{
    background: url("/images/logo-linkoval-bg4.png")no-repeat center fixed;
    background-size: cover;
    background-position:left ;
    object-fit: contain;   
}

.nos-tarifs .content .text h1{
    font-family: "Montserrat", sans-serif;
    color: var(--peru);
    font-weight: 300;
    font-size:4.2rem;
    margin-bottom:2rem;
}
.nos-tarifs .content .text p{
    font-family: "Open Sans", sans-serif;
    font-size: 1.8rem;
    font-weight: 300;
    line-height: 2; 
    margin-bottom: 1rem;
    color: var(--light-black);
      padding: 1rem 0;
    line-height: 2;   
}
.nos-tarifs .content .text p strong {
    color: coral; 
}
.nos-tarifs .content .text p strong em{
    color: coral; 
}
.nos-tarifs .content .text ul{
    list-style-type: none;   
}
.nos-tarifs .content .image{
    flex: 1 1 41rem;
    position: relative;
    margin-top: 2rem;
    background-color: transparent;
}
.nos-tarifs .content .image::after{
    content: "";
    width: 100%;
    height:100%;
    background-color: rgb(144, 146, 146);
    position: absolute;
    top: 20px;
    left: -20px;
    z-index: -1;
}
.nos-tarifs .content .image img{
    width: 100%;
    border-left:2px solid var(--peru) ;  
    border-bottom:2px solid var(--peru) ;
}
 

/*************************section formules tarifs************************/
.formules{
    /*padding-top: 6rem;*/
    text-align:center;
    /* border-top: 1px solid lightgrey;*/
}
.formules  h1{
    font-family: "Montserrat", sans-serif;
    color: var(--peru);
    /*font-weight: 400;*/
    font-size:4.2rem;
    margin:3rem 0;
}

/**FORMULES PACKAGES**/
.formules .box-container{
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}
.formules .box-container .box{
    flex: 1 1 30rem;
    overflow: hidden;
    height: 50rem;
    text-align: center;
  
    border-radius: .5rem;
    position: relative;
}
.formules .box-container .box:nth-child(4){
    display: none;
}
.formules .box-container .box .ecusson{
    position: absolute;
    left: 0;
    border: 1px solid rgb(225, 208, 18) ;
    text-align: center;
    padding: 5px 2px;
    background: rgb(67, 27, 27);
    border-radius: .5rem 0 .5rem 0;
    width: 100px;
    z-index: 1;
}
.formules .box-container .box .ecusson h3{    
    color:rgb(225, 208, 18) ;
    font-size: 1.3rem;
    font-weight: 700;
    text-transform: uppercase;    
}
.formules .box-container .box img{
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.formules .box-container .box .content{
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    text-align: center;
    background: rgb(192, 179, 179);
    opacity: .9;
    padding: 5rem;   
}
.formules .box-container .box .content .icon-pizza {
    width: 2.5rem;
    height: 2.5rem; 
}
.formules .box-container .box .content .price {
    font-size: 1.8rem;
    color: red; 
}
.formules .box-container .box .content h3{
    font-size: 2.2rem;
    color: #333;
    margin-bottom: 1rem;
}
.formules .box-container .box .content h4{
    font-size: 2rem;
    color: #333;
}
.formules .box-container .box .content .features {
    margin-bottom: 2rem;
}
.formules .box-container .box .content .features h3{
    font-size: 2.5rem;
    color: #333;
}
.formules .box-container .box .content p{
    font-size: 1.8rem;
    color: rgb(85, 90, 95);
    font-weight: 400;
    padding: .5rem 0;
}
.formules .box-container .box .bouton{ 
    margin-bottom: 0;
    width:100%;
}  
.formules .box-container .box .bouton .btn3{ 
    display: inline-block;
    /*margin-top: 1rem;*/
    background: rgb(67, 27, 27);
    color: #fff;
    font-weight: 700;
    padding: .8rem 3rem;
    /*border: .2rem solid var(--peru);*/
    cursor: pointer;
    font-size: 1.6rem;
    transition: all .2s ease-in-out;
    z-index: 1;
}
.formules .box-container .box .bouton .btn3:hover{
    background-color: #fff;
    color: rgb(67, 27, 27);
    border-radius: 25px;
}

/***FORMULES SERVICES COMPLEMENTAIRE***/
.formules .services-complémentaires{
    border-top: 1px solid var(--peru);
    margin-top: 3rem;
    padding:2rem 0;
    text-align: start;
    display: flex;
    flex-direction: column;
    height: auto;
}
.formules .services-complémentaires h2{
    font-size: 3.2rem;
    color: #667;
    border-bottom: 3rem;
}
.formules .services-complémentaires span{
    margin-top: 2rem;
    font-size: 1.8rem;
}
.formules .services-complémentaires p{
    font-size: 1.8rem;
}
.formules .services-complémentaires ul{
    /*border: 1px solid black;*/
    padding: 1rem 0;
    display: flex;
    flex-direction: column;
    align-items: left; 
}
.formules .services-complémentaires ul li{
    list-style-type: none;
    margin:1.2rem 0;
}
.formules .services-complémentaires ul li strong{
    color: rgb(150, 17, 17); 
    font-weight: 600; 
}
.formules .services-complémentaires ul li strong2{
    color:red;
    font-weight: 400; 
}
.formules .services-complémentaires .call-to-A{
    margin-top: 2rem;
    font-size: 2.4rem;
    color: var(--peru); 
    font-weight: 300;
    text-decoration: underline;
    display: flex;
    align-items: center;  
}
.formules .services-complémentaires .call-to-A:hover{
    color: #222;
    letter-spacing: .2rem;
}

/******************SECTION REFONTE SITE WEB*tarifs**************/
.refonte-site{
    padding-top: 6rem;
    background: url(/images/logo-linkoval4.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap:2rem;
    /*border-top: 1px solid lightgrey;*/
  /*height:100vh;*/
} 
.refonte-site .image-about {
    flex: 1 1 41rem; 
    position: relative;    
}
.refonte-site .image-about img{
    width:100%;
    border-right:2px solid var(--peru) ;  
    border-bottom:2px solid var(--peru) ;  
}
.refonte-site .contenu{
    flex: 1 1 41rem;
    z-index: 2;  
}
.refonte-site .contenu .title{
    font-size: 4.2rem;
    font-weight: 300;
    color:var(--peru);
    margin:3rem 0; 
}
.refonte-site .contenu p{
    font-size: 1.8rem;
    color: var(--light-black);
    padding: 1rem 0;
    line-height: 2; 
}
.refonte-site .contenu span{
    color: #667;
    font-size: 2.6rem;
    font-weight: 500;
}
.refonte-site .contenu ul{
    list-style-type: none;
}
.refonte-site .contenu ul li strong{
    color: coral; 
}
.refonte-site .contenu ul li strong2{
    color:red;
    font-weight: 500;
    font-size: 1.8rem; 
}
.refonte-site .contenu h3{
    font-size: 2.2rem;
    padding-top: 1rem;
    font-weight: 500;
    /*color:var(--light-black);*/ 
    color: #667;   
 }


/******************SECTION REFONTE SITE2 CALL TO ACTION ***************/
.refonte-site2{
   /* padding-top: 2rem;*/
    display: flex;
    align-items: center;
    flex-wrap: wrap;   
    gap:8rem;
}  
.refonte-site2 .contenu{
    flex: 1 1 41rem;
    z-index: 2;  
    /*border:1px solid red;*/
    /*width: 100%;*/
}
.refonte-site2 .contenu .title2{
    font-size: 4.2rem;
    color:#667;
    font-weight: 400;
    margin:3rem 0; 
}
.refonte-site2 .contenu p{
    font-size: 1.8rem;
    color: var(--light-black);
    padding: 1rem 0;
    line-height: 2; 
  }
.refonte-site2 .contenu p span{
    color:rgb(141, 132, 11);
    font-weight: 700;
    font-family: "Dancing Script",sans-serif;
    font-size: 2.3rem;
    letter-spacing: .2rem;
  }
.refonte-site2 .contenu span{
    color: #667;
    font-size: 2rem;
}
.refonte-site2 .contenu ul{
    list-style-type: none;
}
.refonte-site2 .contenu ul li strong{
    color: coral; 
}
.refonte-site2 .contenu .icons-container{
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    margin-top: 3rem;
    /*border: 1px solid blue;*/
    width: 100%; 
}
.refonte-site2 .contenu .icons-container .icons {
    flex: 1 1 16rem;
    background-color: var(--light-bg);
    text-align: center;
    padding: 2rem 3rem;
    position: relative;
}
.refonte-site2 .contenu .icons-container .icons img{
    position: absolute;
    top: 0;
    left:0;
    width: 4rem;   
    height: 4rem;  
}
.refonte-site2 .contenu .icons-container .icons h3{
    color: var(--peru);
    font-size: 1.8rem;
    padding-top: 1rem;
}
.refonte-site2 .contenu h3{
    font-size: 3.2rem;
    padding-top: 1rem;
    color:var(--light-black);    
 }
.refonte-site2 .contenu .btn4{
    margin-top: 1rem;
    display: inline-block;
    background: var(--peru);
    color: var(--white);
    font-size: 1.8rem;
    cursor: pointer;
    padding: 1rem 2rem;
 }

 .refonte-site2 .contenu .btn4:hover{
    border-radius: 25px;
    color:purple;
 } 
/******PARTIE PUBLICITE*icons-container-pub***/

/******PARTIE PUB**FIN*******/



 /************************************SECTION PUBLICITE*tarifs************************************/
 /******************S**************/
.publicité{
    /*padding-top: 2rem;*/
    /*padding-left:1rem;
    padding-right:1rem;*/
    background: url(/images/logo-linkoval-bg6.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap:2rem;
  /*height:100vh;*/
   border-top: 1px solid lightgrey;
  }
  
 
.publicité .image-about {
    flex: 1 1 41rem; 
    position: relative;    
}

.publicité .image-about img{
    width:100%;
    border-right:2px solid var(--peru) ;  
    border-bottom:2px solid var(--peru) ;  
}

.publicité .image-about::before{
    content: "";
    width: 100%;
    height:100%;
    /*background-color: rgb(146, 144, 144);*/
    background-color: rgb(139, 247, 247);
    opacity:.2;
    position: absolute;
    top: O;
    right:0;
    z-index: 1;      
}

.publicité .contenu{
    flex: 1 1 41rem;
    z-index: 2; 
   /* border:1px solid black; */
}

.publicité .contenu .title{
    font-size: 4.2rem;
    font-weight: 300;
    color:var(--peru);
    margin:3rem 0; 
}

.publicité .contenu p{
    font-size: 1.8rem;
    color: var(--light-black);
    padding: 1rem 0;
    line-height: 2; 
}

.publicité .contenu p span{
    color:rgb(141, 132, 11);
    font-weight: 700;
    font-family: "Dancing Script",sans-serif;
    letter-spacing: .2rem;
    font-size: 2rem;
}

.publicité .contenu h3{
    color: #667;
    font-size: 2.2rem;
    font-weight:400;
}
.publicité .contenu span{
    color: #667;
    font-size: 2.6rem;
}

.publicité .contenu ul{
    list-style-type: none;
}

.publicité .contenu ul li strong{
    color: coral; 
}

.publicité .contenu ul li strong2{
    color:red;
    font-weight: 500;
    font-size: 1.8rem; 
}
/*icons-container-pub*/

.publicité .refonte-site2 .contenu .icons-container-pub{
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    margin-top: 3rem; 
    /* border:1px solid red;*/
    width:100%;
}
.publicité .refonte-site2 .contenu .icons-container-pub .icons {
    flex: 1 1 16rem;
    background-color: var(--light-bg);
    text-align: center;
    padding: 2rem 3rem;
    position: relative;
}

.publicité .refonte-site2 .contenu .icons-container-pub .icons img{
    position: absolute;
    top: 0;
    left:0;   
}

.publicité .refonte-site2 .contenu .icons-container-pub .icons h3{
    color: var(--peru);
    font-size: 1.8rem;
    /*font-weight: 300;*/
    padding-top: 1rem;
}
.publicité .contenu .btn4{
    margin-top: 1rem;
    display: inline-block;
    background: var(--peru);
    color: var(--white);
    font-size: 1.8rem;
    cursor: pointer;
    padding: 1rem 3rem;
 }

 .publicité .contenu .btn4:hover{
    border-radius: 25px;
    color:purple;
 }


 /******************SECTION SEO*tarifs**************/
.seo{
    padding-top: 2rem;
    /*padding-left:1rem;
    padding-right:1rem;*/
    background: url(/images/logo-linkoval-bg6.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap:2rem;
    /*height:100vh;*/
    position: relative;
    border-top: 1px solid lightgrey;
    
  }
  .seo svg {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
  }
  .seo svg path{
    position: absolute;
    opacity: .3;
    color: aqua;
    z-index: 3;
  } 
.seo .image-about {
    flex: 1 1 41rem; 
    position: relative;    
}
.seo .image-about img{
    width:100%;
    border-right:2px solid var(--peru) ;  
    border-bottom:2px solid var(--peru) ;  
}
.seo .image-about::before{
    content: "";
    width: 100%;
    height:100%;
    /*background-color: rgb(146, 144, 144);*/
    background-color: rgb(139, 247, 247);
    opacity:.2;
    position: absolute;
    top: 0;
    right:0;
    z-index: 1;      
}
.seo .contenu{
    flex: 1 1 41rem;
    z-index: 2;  
}
.seo .contenu .title{
    font-size: 4.2rem;
    font-weight: 300;
    color:var(--peru);
    margin:3rem 0; 
}
.seo .contenu h3{
    color: #667;
    font-size: 2.2rem;
    font-weight:400;
 }
.seo .contenu p{
    font-size: 1.8rem;
    color: var(--light-black);
    padding: 1rem 0;
    line-height: 2; 
}
.seo .contenu span{
    color: #667;
    font-size: 2.6rem;
}
.seo .contenu ul{
    list-style-type: none;
}
.seo .contenu ul li strong{
    color: coral; 
}
.seo .contenu ul li strong2{
    color:red;
    font-weight: 500;
    font-size: 1.8rem; 
}


 /******************SECTION SEO2*Appel à action**************/
.seo2{
    /*padding-top: 2rem;*/
   /* width:100%;*/
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap:8rem;
   /* border:1px solid blue;*/
}
.seo2 .contenu{
    flex: 1 1 41rem;
    z-index: 2;  
}
.seo2 .contenu .title2{
    font-size: 4.2rem;
    color:#667;
    font-weight: 400;
    margin:3rem 0; 
}
.seo2 .contenu p{
    font-size: 1.8rem;
    color: var(--light-black);
    padding: 1rem 0;
    line-height: 2; 
  }
.seo2 .contenu span{
    color: #667;
    font-size: 2rem;
}
.seo2 .contenu ul{
    list-style-type: none;
}
.refonte-site2 .contenu ul li strong{
    color: coral; 
}
.seo2 .contenu .icons-container-seo{
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    margin-top: 3rem; 
    /* border:1px solid red;*/
    width:100%;
}
.seo2 .contenu .icons-container-seo .icons {
    flex: 1 1 16rem;
    background-color: var(--light-bg);
    text-align: center;
    padding: 2rem 3rem;
    position: relative;  
}
.seo2 .contenu .icons-container-seo .icons img{
    position: absolute;
    top: 0;
    left:0;   
}
.seo2 .contenu .icons-container-seo .icons h3{
    color: var(--peru);
    font-size: 1.8rem;
    padding-top: 1rem;
}
.seo2 .contenu h3{
    font-size: 2.2rem;
    font-weight: 400;
    padding-top: 1rem;
    color:var(--light-black);    
 }
 .seo2 .contenu p span{
    color:rgb(141, 132, 11);
    font-weight: 700;
    font-family: "Dancing Script",sans-serif;
    font-size: 2rem;
     letter-spacing: .2rem;
}
.seo2 .contenu .btn4{
    margin-top: 1rem;
    display: inline-block;
    background: var(--peru);
    color: var(--white);
    font-size: 1.8rem;
    cursor: pointer;
    padding: 1rem 2rem;
 }
 .seo2 .contenu .btn4:hover{
    border-radius: 25px;
    color:purple;
 } 
/******************************mAX-WIDTH 2559PX*******************************/
@media(max-width:2559px){
    html{
        scroll-padding-top:9rem
        
    }
    
}
/******************************mAX-WIDTH 1366PX*******************************/
@media(max-width:1366px){
   
}
/******************************mAX-WIDTH 1360PX*******************************/
@media(max-width:1360px){
   html{
    scroll-padding-top:10rem;
   }
}
  


 

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

}

/************MAX WIDTH 1200PX*********/
@media(max-width:1200px){
section{
        padding: 3rem 5%;
}

}

/*****************************MAX WIDTH 1024PX**********************/
@media(max-width:1024px){
 
  #scrollToTop{
    font-size:1.8rem;
 }

.contenu .title{
    font-size: 3.6rem;
    
}
.formules .box-container .box:nth-child(4){
    display: block;
}
.refonte-site2  .contenu .title2{
    font-size: 3rem;
    color:#667;
    font-weight: 400;
    margin:3rem 0; 
}
.seo2 .contenu .title2{
    font-size: 3rem;
    color:#667;
    font-weight: 400;
    margin:3rem 0; 
}

 html{
        scroll-padding-top:10.2rem ;
    }

}


 /***************************************RESPONSIVE 991PX START*tarifs*********************************/

@media(max-width:990px)  {

section{
    padding: 3rem 2rem;       
    }
html{
    font-size: 55%;
    }
/***nos-tarifs***/
.nos-tarifs{
    height:auto;
    }
/***formules packages*/
.formules .box-container .box:nth-child(4){
    display: none;
}
.formules .box-container .box .content .price {
    font-size: 20px;
    color: red;  
}
 
}
/************************************MAX WIDTH 870PX*tarifs*********************/
@media(max-width:870px)  {
/**nos tarifs**/
.nos-tarifs{
    padding-top: 10rem;
    height:auto;
    } 
/***fromules*packages**/  
.formules{
    height:auto;
 }
.formules .box-container .box:nth-child(4){
    display: block;
} 
.formules .box-container .box{
    height:50rem;
 }
.formules .box-container .box .ecusson{
    font-size: 1.1rem;
    width: 16rem;   
}
.contenu{
    width:100%;
}
.seo2 .contenu{
    width:100%;
}
.formules .box-container .box .content .price {
    font-size: 1.8rem;
    color: red; 
}
.formules .box-container .box .content h3{
    font-size: 2.4rem;   
}
.formules .box-container .box .content h4{
    font-size: 2rem;
    color: #333;
}
.formules .box-container .box .content .features {
    margin-bottom: 2rem;
}
.formules .box-container .box .content .features h3{
    font-size: 2.4rem;  
}
.formules .box-container .box .content p{
    font-size: 1.6rem;

}
.formules .box-container .box .bouton{ 
    margin-bottom: 0;
    width:100%;
}   
.formules .box-container .box .bouton .btn3{ 
    padding: .8rem 3rem;
    font-size: 1.6rem;
}
/*refonte site2*/
.refonte-site2 .contenu .icons-container .icons img{
    height:2.5rem;  
    width:2.5rem;  
}
}
@media(max-width:853px){
/***nos-tarifs***/
  .tarifs .title{
    margin-top:3rem;
  }
}
  
   /***************************************RESPONSIVE 791PX START*tarifs*****************************/

@media(max-width:790px)  {

/***nos-tarifs***/
.nos-tarifs {
    padding-top: 15rem;/***16rem quand la banner est present*/
   /* border-top: 1px solid black;*/
    }
.nos-tarifs h1{
    margin-top: 3rem;
    }
.nos-tarifs .content .image::after{
    display:none
}

/***refonte-site2***/
.refonte-site2 .contenu .icons-container .icons h3{ 
   font-size:1.8rem;
}
/***publicité**/
.publicité{    
    padding-top: 2rem;
    height:auto;
}
/***seo***/
.seo{
    padding-top: 4rem;
}
}


/*******************************************MAX WIDTH 700PX*tarifs******************************/
@media(max-width:768px) {

 #scrollToTop{
    font-size:1.4rem;
 }
 /***fromules*/
.formules .box-container .box{
    height:50rem;
    flex: 1 1 30rem;
 }
/***seo***/
.seo{
    height:auto;
}

  }
/****************************************MAX WIDTH 540PX*tarifs****************************************/
 @media(max-width:540px) 
 {
html{
    scroll-padding-top:2rem;
}
.formules .box-container .box:nth-child(4){
    display: none;
}
.nos-tarifs{
    padding-top: 10rem;
}
 }


   /******************************MAX-WIDTH 510PX**tarifs**************************/
@media(max-width:510px)  {
 

 
}
/**********************MAX WIDTH 450PX*tarifs****************/

@media(max-width:450px){

html{
    font-size: 50%;
    scroll-padding-top:9rem;
  }
    
}


/*******************************MAX-WIDTH 425PX****************/
@media(max-width:425px){
    .nos-tarifs{
        marging-top: 4rem;
        height:auto;
    }

}
@media(max-width:414px){
   .seo{
        padding-top:15rem;
}
}
/********************************MAX-WIDTH 375PX********************/
@media(max-width:375px){
     
    html{
        scroll-padding-top:9rem ;
    }
}

/********************************MAX WIDTH 320PX************/
@media(max-width:320px){
  
   
    .nos-tarifs{
          margin-top:3rem
    }
}