@charset "utf-8";

/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
   


/*terms page css*/
#terms_body{
max-width:1200px;
width:90%;
margin:auto;
padding:50px 20px;
}
.terms_heading{
font-size:42px;
font-family:'Roboto Condensed';
text-transform:uppercase;
color:#8b4b27;
text-align:center;
font-weight:700;
}
.content_terms{
margin-top:30px;
}
.content_terms ul{
margin-left:15px;
}
.content_terms ul li{
line-height:22px;
}
.sb-title{
color:#8b4b27;
font-weight:bold;
margin:10px 0px;
}
.sb-text{
margin:10px 0px;
line-height:22px;
}

/*Privacy page CSS*/
#privacy_body{
max-width:1200px;
width:90%;
margin:auto;
padding:50px 20px;
}
#privacy_body h2{
font-size:42px;
text-transform:uppercase;
font-weight:700;
text-align:center;
color:#8b4b27;
}
#privacy_body ul{
margin-left:15px;
}
.p-flex{
display:flex;
justify-content:space-between;
margin-bottom:10px;
}
.fl-title{
color:#8b4b27;
font-weight:bold;
margin:10px 0px;
}

/*New page*/
#intro-dcb{
padding:50px 20px;
text-align:center;
max-width:1200px;
width:90%;
margin:auto;

}
#intro-dcb h2{
text-align:center;
/*font-family:'Roboto Condensed';*/
}
.s-heading{
text-transform:uppercase;
font-size:42px;
color:#8b4b27;
margin-bottom:25px;
font-weight:300;
}
.b-heading{
font-weight:700;
}
.text-content{
font-size:16px;
text-align:justify;
font-weight:400;
line-height:21px;
}
.ca{
text-align:center!important;
}
.b-text{
font-weight:bold;
}

.section-wrapper{
background-color:#a3784d;
padding-bottom:125px;
}
.section-content{
max-width:1200px;
width:90%;
margin:auto;
padding:50px 20px;
}
.section-content h2{
color:white;
}
.section-content p{
color:white;
}
.pic-gallery{
display:flex;
justify-content:space-between;
max-width:1200px;
width:90%;
margin:-135px auto 0px auto;
padding:0px 20px;

}
.pic-container{
width:350px;
height:350px;
}
.pic-container img{
width:100%;
height:100%;
object-fit:contain;
}

#story-sec{
max-width:1200px;
width:90%;
margin:auto;
padding:100px 20px;
display:flex;
justify-content:space-between;
}
.pic-wrapper{
width:45%;
}
.pic-wrapper img{
height:100%;
width:100%;
object-fit:contain;
}
.story-text-wrapper{
width:50%;
}
.mt-15{
margin-top:15px;
}
#story2-sec{
max-width:1200px;
width:90%;
margin:auto;
padding:50px 20px;
display:flex;
flex-direction:row-reverse;
justify-content:space-between;
}
.col-db{
color:#442812!important;
}
.banner-wrapper{
max-width:1200px;
width:88%;
margin:auto;
padding:50px;
display:flex;
justify-content:space-between;
background-image:url("../images/dubai-chocolate-bar-banner-bg.png");
border-radius:25px;
}
.banner-wrapper h2{
width:30%;
}
.text-wrapper{
width:65%;
}
#description-sec{
padding-top:50px;
}
#description-sec a{
color:#422712;
text-decoration:underline;
}
#description-sec a:hover{
text-decoration:none!important;
}
.description-content-container{
max-width:1200px;
width:90%;
margin:auto;
padding:10px 20px;
display:flex;
justify-content:space-between;
}
.description2-content-container{
max-width:1200px;
width:90%;
margin:auto;
padding:70px 20px;
display:flex;
flex-direction:row-reverse;
justify-content:space-between;
}

#cta{
background-image:url('../images/dubai-chocolate-bar-banner-footer_cleanup.png');
background-position:center;
background-size:cover;
background-repeat:no-repeat;
padding:70px 20px 170px 20px;

}
#cta a{
text-decoration:underline;
color:#422712;
}
#cta a:hover{
text-decoration:none;
}
.cta-wrapper{
max-width:1200px;
width:90%;
margin:auto;
padding:30px;
background-color:#fbefdf;
border-radius:15px;
text-align:center;
}
.description-content-wrapper{
background-color:#fbefdf;
}
.m-t-15{
margin-top:-85px;
}
.footer_area_t{
background: url("../images/dubai-chocolate-bar-footer-area-bg.png") no-repeat 0 0;
    background-size: auto;
  background-size: cover;
  padding: 180px 0 0 0;
  text-align: center;
  }
.cta-text-wrapper{
width:100%;
}
.section-divider img{
width:100%;
}

/*CSS for recipe page*/
.recipe-active{
background:#fbefdf;
}
#intro-melt{
padding:50px 20px;
text-align:center;
max-width:1200px;
width:90%;
margin:auto;
display:flex;
justify-content:space-between;
}
#intro-melt h2{
text-align:left;
}
.intro-text-wrapper{
width:50%;
}
.intro-melt-pic-wrapper{
width:45%;
}
.intro-melt-pic-wrapper img{
width:100%;
height:100%;
object-fit:contain;
}
#why-melt{
max-width:1200px;
width:90%;
padding:50px 20px;
margin:auto;
display:flex;
justify-content:space-between;
}
.f-34{
font-size:34px;
margin-top:15px;
}
#why-melt ul{
margin-left:15px;
}
#why-melt ul li{
line-height:21px;
font-weight:400;
}
#why-melt .pic-container{
width:45%;
}
#why-melt .pic-container img{
width:100%;
height:100%;
object-fit:contain;
}
#why-melt .content-wrapper{
width:50%;
}

#how-melt{
background-color:#fbefdf;
}
#how-melt .sec-wrapper{
max-width:1200px;
width:90%;
padding:50px 20px;
margin:auto;
}
#how-melt h2{
text-align:center;
}
.sub-heading{
font-size:25px;
color:#8b4b27;
font-weight:700;
}
.h-m-container{
display:flex;
justify-content:space-between;
margin-top:50px;
}
.h-m-container-r{
display:flex;
justify-content:space-between;
flex-direction:row-reverse;
margin-top:50px;
}
.h-m-container ol{
margin-left:15px;
}
.h-m-container-r ol{
margin-left:15px;
}
.h-m-container ol li{
line-height:25px;
font-weight:400;
font-size:16px;
}
.h-m-container-r ol li{
line-height:25px;
font-weight:400;
font-size:16px;
}
.h-m-container ul{
margin-left:15px;
}
.h-m-container-r ul{
margin-left:15px;
}
.h-m-container ul li{
font-size:16px;
line-height:25px;
font-weight:400;
}
.h-m-container-r ul li{
font-size:16px;
line-height:25px;
font-weight:400;
}
.l-content{
width:55%;
}
.r-content{
width:40%;
}
.r-content img{
height:100%;
width:100%;
object-fit:cover;
}

.single-row ul{
font-weight:16px;
font-weight:400;
margin-left:15px;
}
.single-row ul li{
margin:5px 0px;
}
.s-row{
max-width:1200px;
width:90%;
margin:auto;
padding:50px 20px;
}
.s-row ul{
margin-left:15px;
font-size:16px;
font-weight:400;
}
.s-row ul li{
font-size:16px;
font-weight:400;
}
.s-row ol{
margin-left:15px;
font-weight:400;
font-size:16px;
}
.s-row ol li{
margin:25px 0px;
}
.white-ch-list li{
margin:7px 0px;
line-height:25px;
}
.white-ch-list p{
line-height:25px;
}
.c-white{
color:white;
}
#c-m{
background-image:url('../images/melt-chocolate-chips.png');
background-size:cover;
background-position:center;
background-repeat:no-repeat;
padding:70px 0px;
}
.a-left{
text-align:left;
margin-left:15px;
font-size:16px;
font-weight:400;
line-height:22px;
}

.f-ans{
font-size:18px;
padding:0px 10px;
line-height:25px;
max-height:0px;
overflow:hidden;
}
.active-ans{
font-size:18px;
padding:10px 10px;
line-height:25px;
max-height:100vh;
overflow:auto;
transition:max-height 0.5s ease-out;
}
.f-que{
font-size:20px;
font-weight:700;
padding:20px 10px;
margin:5px 0px;
background-color:#fbefdf;
border-radius:5px;
}
.f-que:after{
content:'\002B';
font-weight:700;

float:right;
}
.faq-container{
max-width:1200px;
width:90%;
margin:auto;
padding:50px 20px;
display:flex;
justify-content:space-between;
}
.img-r{
border-radius:15px;
height:500px;
overflow:hidden;
}
.bg-white{
background-color:#fbefdf;
text-align:center;
}
#faq{
padding:20px 0px 50px 0px;
}

.shrink-img{
height:250px;
}
.shrink-img img{
object-fit:cover;
width:100%;
height:100%;
}
#ps-c-m{
background-image:url('../images/pistachio-cream-3.jpg');
background-color:#5f605e;
background-blend-mode:overlay;
background-size:cover;
background-position:center;
background-repeat:no-repeat;
padding:70px 0px;
}
#pistachio-cm{
max-width:1200px;
width:90%;
margin:auto;
padding:50px 20px;
}
.a-i-center{
align-items:center;
}
.body-list{
margin-left:15px;
}
.body-list li{
font-size:16px;
font-weight:400;
line-height:25px;
}
#ps-butter-m{
background-image:url('../images/pistachio-butter-6.jpg');
background-color:#5f605e;
background-blend-mode:overlay;
background-size:cover;
background-position:center;
background-repeat:no-repeat;
padding:70px 0px;
}
.bg-s-strip{
background-color:#fbefdf;

}
.bg-s-strip-container{
max-width:1200px;
width:90%;
margin:auto;
padding:50px 15px;
}
.mt-0{
margin-top:0!important;
}

/*responsive css*/  


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

  #privacy_body h2{
  font-size:35px!important;
  }
  .p-flex{
  flex-direction:column;
  margin:10px 0px;
  }
  .fl-title{
color:#8b4b27;
font-weight:bold;
margin:5px 0px;
}
.terms_heading{
font-size:35px;
}
#intro-melt{
flex-direction:column;
}
.intro-text-wrapper{
width:100%;
}
.intro-melt-pic-wrapper{
width:100%;
margin-top:30px;
}
#why-melt{
flex-direction:column-reverse;
}
#why-melt .pic-container{
width:100%;
}
#why-melt .content-wrapper{
width:100%;
}
.h-m-container{
flex-direction:column;
}
.h-m-container-r{
flex-direction:column;
}
.l-content{
width:100%;
}
.r-content{
width:100%;
margin-top:25px;
}
.faq-container{
flex-direction:column;
}

}
@media screen and (max-width:767px){
/*viral-dubai-chocobar-page*/
.pic-gallery{
flex-direction:column;
align-items:center;
}
.pic-container{
margin:15px 0px;
width:72vw;
height:72vw;
}
#story-sec{
flex-direction:column-reverse;
padding-top:50px;
padding-bottom:50px;

}
.s-heading{
font-size:34px;
}
.story-text-wrapper{
width:100%;
}

.pic-wrapper{
width:100%;
margin-top:50px;

}
#story2-sec{
flex-direction:column-reverse;
}
.banner-wrapper{
flex-direction:column;

}
.banner-wrapper{
width:90%;
padding-left:28px;
padding-right:28px;
}
.banner-wrapper h2{
width:100%;
}
.text-wrapper{
width:100%;
}
.description-content-container{
flex-direction:column-reverse;
}
.description2-content-container{
flex-direction:column-reverse;
}

#intro-melt{
flex-direction:column;
}
.intro-text-wrapper{
width:100%;
}
.intro-melt-pic-wrapper{
width:100%;
margin-top:30px;
}
#why-melt{
flex-direction:column-reverse;
}
#why-melt .pic-container{
width:100%;
}
#why-melt .content-wrapper{
width:100%;
}
.h-m-container{
flex-direction:column;
}
.h-m-container-r{
flex-direction:column;
}
.l-content{
width:100%;
}
.r-content{
width:100%;
margin-top:25px;
}

}

@media (min-width:768px) and (max-width:960px){
.pic-gallery{
margin-top:-135px;
}
.pic-container{
width:27vw;
height:27vw;
}
.banner-wrapper{
padding:50px 30px;
}
.banner-wrapper h2{
width:40%;
}
}
@media only screen and (max-width: 360px) {

    #privacy_body h2{
  font-size:35px;
  }
  .p-flex{
  flex-direction:column;
  margin:10px 0px;
  }
}

@media only screen and (max-width: 320px) {
    #privacy_body h2{
  font-size:35px;
  }
   
}