@charset "utf-8";
/* CSS Document */
#nav-bar{
    background-color:chocolate
}
#btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
    background-color: chocolate;
    color: white
}
  .caros-after{
        background: #fff;
        background: url(../images/pic21.jpg) no-repeat top;
        background-size: cover;
        -webkit-background-size: cover;
        -o-background-size: cover;
        -moz-background-size: cover;
        -ms-background-size: cover;
        position: relative;
        z-index: -1;
        background-attachment: fixed;
        color: white
    }
    
    .caros-after .caros-bg::before {
        content: "";
        background: rgba(21, 17, 17, 0.81);
        position: absolute;
        top: 0;
        min-height: 100%;
        left: 0;
        right: 0;
        z-index: -1;
}
  .middle-scroll{
        background: #fff;
        background: url(../images/pic24.jpg) no-repeat top;
        background-size: cover;
        -webkit-background-size: cover;
        -o-background-size: cover;
        -moz-background-size: cover;
        -ms-background-size: cover;
        position: relative;
        z-index: 1;
        background-attachment: fixed;
        color: white
    }
    
    .middle-scroll .scroll-inner::before {
        content: "";
        background: rgba(21, 17, 17, 0.81);
        position: absolute;
        top: 0;
        min-height: 100%;
        left: 0;
        right: 0;
        z-index: -1;
}

.image:hover .overlay {
  bottom: 0;
  height: 100%;
}
.bg-head{
    background-color: chocolate;
    padding-bottom: 0.5em
}
.scroll-sec{
  background: #fff;
  background: url(../images/pic24.jpg) no-repeat top;
  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  position: relative;
  z-index: 1;
  background-attachment: fixed
}
.scroll-sec .scroll-child::before {
  content: "";
  background: rgba(21, 17, 17, 0.81);
  position: absolute;
  top: 0;
  min-height: 100%;
  left: 0;
  right: 0;
  z-index: -1;
}
.blog-new1{
  background: #fff;
  background: url(../images/pic12.jpg) no-repeat top;
  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  position: relative;
  z-index: 1;
  background-attachment: fixed
}
.blog-new1 .blog-inner-1::before {
  content: "";
  background: rgba(21, 17, 17, 0.81);
  position: absolute;
  top: 0;
  min-height: 100%;
  left: 0;
  right: 0;
  z-index: -1;
}
.blog-new2{
  background: #fff;
  background: url(../images/pic8.jpeg) no-repeat top;
  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  position: relative;
  z-index: 1;
  background-attachment: fixed
}
.blog-new2 .blog-inner-2::before {
  content: "";
  background: rgba(21, 17, 17, 0.81);
  position: absolute;
  top: 0;
  min-height: 100%;
  left: 0;
  right: 0;
  z-index: -1;
}
.blog-new3{
  background: #fff;
  background: url(../images/pic9.jpg) no-repeat top;
  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  position: relative;
  z-index: 1;
  background-attachment: fixed
}
.blog-new3 .blog-inner-3::before {
  content: "";
  background: rgba(21, 17, 17, 0.81);
  position: absolute;
  top: 0;
  min-height: 100%;
  left: 0;
  right: 0;
  z-index: -1;
}
.card-alpha{
    outline-style: solid;
    outline-width: thin;
    outline-color: chocolate
}
.card-bravo{
    outline-style: solid;
    outline-width: thin;
    outline-color: chocolate
}
.card-charlie{
    outline-style: solid;
    outline-width: thin;
    outline-color: chocolate
}
 .caros-after1{
        background-image: url(../images/bg.jpg);
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover
    }

/* About us page */

.abt-hero{
  background: #fff;
  background: url(../images/pis18.jpg) no-repeat top;
  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  position: relative;
  z-index: 1;
  background-attachment: fixed
}
.abt-hero .heroimg-abt::before {
  content: "";
  background: rgba(21, 17, 17, 0.81);
  position: absolute;
  top: 0;
  min-height: 100%;
  left: 0;
  right: 0;
  z-index: -1;
}
.counter-sec{
  background: #fff;
  background: url(../images/pic20.jpg) no-repeat top;
  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  position: relative;
  z-index: 1;
  background-attachment: fixed
}
.counter-sec .counters::before {
  content: "";
  background: rgba(21, 17, 17, 0.81);
  position: absolute;
  top: 0;
  min-height: 100%;
  left: 0;
  right: 0;
  z-index: -1;
}
.counter{
	text-align: center
}
.icon_info{
	text-align: center
}
.card{
    outline-style: solid;
    outline-width: thin;
    outline-color: chocolate
}
.card-bg{
	background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../images/pic21.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover
}
.crd-text{
    color: white
}
.ctc-hero{
  background: #fff;
  background: url(../images/pic21.jpg) no-repeat top;
  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  position: relative;
  z-index: 1;
  background-attachment: fixed
}
.ctc-hero .heroimg-ctc::before {
  content: "";
  background: rgba(21, 17, 17, 0.81);
  position: absolute;
  top: 0;
  min-height: 100%;
  left: 0;
  right: 0;
  z-index: -1;
}
.contact-form-side{
    background-image:url(../images/bg.jpg);
    background-attachment: scroll;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
#fillbtn6{
    background-color: chocolate;
    color: white;
    width: 10em
}




@media screen and (min-width:1441px){
   html{
        font-size: 100%
    }
    #nav-link1{
        padding-left: 2em
    }
    .carousel-im{
        width: 10em;
        height: 35em
    }
 
    #shop-btn{
        border-radius: 3em;
        margin-top: 25em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .big-head1{
        font-size: 500%
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #navbardrop1, #navbardrop2, #nav-link2, #nav-link3{
        margin-left: 3em
    }
    #nav-link2{
        margin-right: 3em
    }
    
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 40%;
        margin-bottom: 1em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 60em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 690%
    }
    .section-1{
        margin-left: 1em;
        margin-right: 1em
    }
   
    .productive-img{
       margin-top: 4em
    }
    .caros-after{
        padding-top: 2em;
       height: 20em
    }
    .caros-bg{
        padding-left: 1em
    }
  
    .choc-head{
        margin-right: 60em
    }
    #choc-head1{
        margin-right: 24em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 11em
    }
    .caros-after1{
        padding-right: 1.5em;
        padding-top: 3em;
        padding-bottom: 2em;
        position: absolute;
        top: -3em;
        height: 23em;
        right: 0.7em;   
    }
    #btn-bg, #middle-btn2, #middle-btn1, .icons-btn, .bighead-btn{
        width: 11em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 3em;
        margin-right: 3em
    }
    .card-row1{
        margin-top: 2em;
        
    }
  
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
   
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        padding-left: 2em;
        padding-right: 2em;   
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;   
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:30%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
   
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 3em;
        padding-bottom: 1em;
        
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blg-top{
        margin-right: 39em
    }
    .blog-top1{
        margin-right: 30em
    }
    .values-sec{
        text-align: center;
        padding-left: 3em;
        padding-right: 3em
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 12em
    } 
   
    .footer{
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 2em;
        padding-right: 1em
    }
    .footer-nav-bar{
        text-align: center
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 5em;
        padding-left: 3em;
        
    }
    .footer-links{
        padding-left: 4em
    }
    .footer-address{
        margin-top: 4em;
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 10em
    }
    .img{
        width: 15em
    }
    #img1{
        height: 15em
    }
    .values-sec{
        margin-top: 5em;
    }
    
    /*  About us  */
    
    .counter-sec .experience-info {
    	display: grid;
    	grid-template-columns: 1fr 1fr 1fr 1fr;
    	align-items: center;
    	grid-gap: 20px;
    }
    .abt-hero{
        height: 55em;
        padding-top: 12em
    }
    .caption-head, .abt-hero-text{
        text-align: center;
        margin-bottom: 1em
    }
    .btn-1, .btn-2{
        width:12em;
        height: 3em
    }
    .clm-head{
        font-size: 290%;
        text-align: center
    }
    .herobg-sec{
        padding-top: 3em
    }
    .overlay{
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 2em;
        font-size: 170%;
        text-align: center
    }
    
    .about-sec{
        margin-top: 4em;
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
   
    .tablinks{
        outline-style: none;
        background-color: chocolate;
        color: white;
        width:10em;
        border-style:none;
        height: 2em
    }
    #sin-btn1, #sin-btn2{
        width: 9em;
        height: 3em
    }
    .sbottom-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .grp-btn{
        text-align: center
    }
    #sin-btn3, #sin-btn4{
        width: 11em;
        height: 3em
    }
    .card1{
        height: 20em
    }
    .crd-body:hover{
       background-color: chocolate;
        color: white
    }
   
    .sbottom-row{
        margin-bottom: 4em;
        margin-top: 2em
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 4em
    }
    .big-head{
        font-size: 490%
    }
  
    .counter-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 4em
    }
   
    .counter{
        font-size: 300%;
        font-weight: bold
    }
    .values-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 2em
    }
    .card-bg{
        height: 15em
    }
    .mid-cardrow{
        margin-bottom: 3em;
        margin-top: 2em
    }
    #sin-btn4, #sin-btn5{
        width: 12em;
        height: 3em
    }
    #nav-link3{
        margin-left: 1em
    }

/*  Contact us page  */
    
    .ctc-hero{
        height: 50em;
        padding-top: 10em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 2em;
        margin-right: 2em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em;
        height: 17em
    }
    .form-section{
        text-align: center;
        
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
    #contact-btn{
        width: 12em
    }
   
    #nav-link3{
        margin-left: 2em
    }
    
}
@media screen and (min-width:1367px) and (max-width:1440px){
     html{
        font-size: 100%
    }
    .carousel-im{
        width: 10em;
        height: 35em
    }
 
    #shop-btn{
        border-radius: 3em;
        margin-top: 25em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .big-head1{
        font-size: 500%
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #navbardrop1, #navbardrop2, #nav-link2, #nav-link3{
        margin-left: 3em
    }
    #nav-link2{
        margin-right: 3em
    }
    
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 40%;
        margin-bottom: 1em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 60em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 600%
    }
    .section-1{
        margin-left: 1em;
        margin-right: 1em
    }
   
    .productive-img{
       margin-top: 4em
    }
    .caros-after{
        padding-top: 2em;
       height: 20em
    }
    .caros-bg{
        padding-left: 1em
    }
  
    .choc-head{
        margin-right: 55em
    }
    #choc-head1{
        margin-right: 20em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 11em
    }
    .caros-after1{
        padding-right: 1.5em;
        padding-top: 3em;
        padding-bottom: 2em;
        position: absolute;
        top: -3em;
        height: 23em;
        right: 0.7em;   
    }
    #btn-bg, #middle-btn2, #middle-btn1, .icons-btn, .bighead-btn{
        width: 11em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 3em;
        margin-right: 3em
    }
    .card-row1{
        margin-top: 2em;
        
    }
  
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
   
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        padding-left: 2em;
        padding-right: 2em;   
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;   
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:30%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
   
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blg-top{
        margin-right: 39em
    }
    .blog-top1{
        margin-right: 30em
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        padding-right: 1em
    }
    .value-row{
        padding-left: 2em;
        margin-top: 2em
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 12em
    } 
   
    .footer{
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 1em;
        padding-right: 1em
    }
    .footer-nav-bar{
        text-align: center
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 5em;
        padding-left: 3em;
        
    }
    .footer-links{
        padding-left: 4em
    }
    .footer-address{
        margin-top: 4em;
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 10em
    }
    .img{
        width: 15em
    }
    #img1{
        height: 15em
    }
    .values-sec{
        margin-top: 5em;
    }
    
    /*  About us  */
    
    .counter-sec .experience-info {
    	display: grid;
    	grid-template-columns: 1fr 1fr 1fr 1fr;
    	align-items: center;
    	grid-gap: 20px;
    }
    .abt-hero{
        height: 45em;
        padding-top: 10em
    }
    .caption-head, .abt-hero-text{
        text-align: center;
        margin-bottom: 1em
    }
    .btn-1, .btn-2{
        width:12em
    }
    .clm-head{
        font-size: 290%;
        text-align: center
    }
    .herobg-sec{
        padding-top: 3em
    }
    .overlay{
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 2em;
        font-size: 170%
    }
    
    .about-sec{
        margin-top: 4em;
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
   
    .tablinks{
        outline-style: none;
        background-color: chocolate;
        color: white;
        width:6em;
        border-style:none;
        height: 2em
    }
    #sin-btn1, #sin-btn2{
        width: 9em;
        height: 3em
    }
    .sbottom-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .grp-btn{
        text-align: center
    }
    #sin-btn3, #sin-btn4{
        width: 11em;
        height: 3em
    }
    .card1{
        height: 20em
    }
    .crd-body:hover{
       background-color: chocolate;
        color: white
    }
   
    .sbottom-row{
        margin-bottom: 4em;
        margin-top: 2em
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 4em
    }
    .big-head{
        font-size: 490%
    }
  
    .counter-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 4em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 300%;
        font-weight: bold
    }
    .values-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 2em
    }
    .card-bg{
        height: 15em
    }
    .mid-cardrow{
        margin-bottom: 3em
    }
    #sin-btn4, #sin-btn5{
        width: 12em;
        height: 3em
    }
    #nav-link3{
        margin-left: 1em
    }
    
/*  Contact us page  */
    
    .ctc-hero{
        height: 50em;
        padding-top: 10em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1.5em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em;
        height: 17em
    }
    .form-section{
        text-align: center;
        
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
    #contact-btn{
        width: 12em
    }
    #nav-link1{
        margin-left: 2em
    }
    #nav-link3{
        margin-left: 2em
    }
    
}
@media screen and (min-width:1281px) and (max-width:1366px){
   html{
        font-size: 95%
    }
    .carousel-im{
        width: 10em;
        height: 35em
    }
    .rights{
        text-align: left
    }
    .credit{
        text-align: right
    }
    #shop-btn{
        border-radius: 3em;
        margin-top: 25em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .big-head1{
        font-size: 500%
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #navbardrop1, #navbardrop2, #nav-link2, #nav-link3{
        margin-left: 3em
    }
    #nav-link2{
        margin-right: 3em
    }
    
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 45%;
        
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 60em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 600%
    }
    .section-1{
        margin-left: 1em;
        margin-right: 1em
    }
   
    .productive-img{
       margin-top: 4em
    }
    .caros-after{
        padding-top: 2em;
       height: 20em;
        
    }
    .caros-bg{
        padding-left: 1em
    }
  
    .choc-head{
        margin-right: 55em
    }
    #choc-head1{
        margin-right: 20em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 11em
    }
    .caros-after1{
        padding-right: 1.5em;
        padding-top: 3em;
        padding-bottom: 2em;
        position: absolute;
        top: -3em;
        height: 23em;
        right: 0.7em;   
    }
    #btn-bg, #middle-btn2, #middle-btn1, .icons-btn, .bighead-btn{
        width: 11em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 2em;
        margin-right: 2em
    }
    .card-row1{
        margin-top: 2em;
        
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
   
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        padding-left: 2em;
        padding-right: 2em;   
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;   
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:30%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
   
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 3em;
        padding-bottom: 1em;
        
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blg-top{
        margin-right: 39em
    }
    .blog-top1{
        margin-right: 30em
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        padding-right: 1em
    }
    .values-sec{
        padding-left: 2em
    }
    .value-row{
        margin-top: 2em
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 12em
    } 
   
    .footer{
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 2em;
        padding-right: 1em
    }
    .footer-nav-bar{
        text-align: center
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 5em;
        padding-left: 3em;
        
    }
    .footer-links{
        padding-left: 4em
    }
    .footer-address{
        margin-top: 4em;
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5, #fillbtn6{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 10em
    }
    .img{
        width: 15em
    }
    #img1{
        height: 15em
    }
    .values-sec{
        margin-top: 5em;
    }
   
       
/*  About us  */
    
    .counter-sec .experience-info {
    	display: grid;
    	grid-template-columns: 1fr 1fr 1fr 1fr;
    	align-items: center;
    	grid-gap: 20px;
    }
    .abt-hero{
        height: 45em;
        padding-top: 10em
    }
    .caption-head, .abt-hero-text{
        text-align: center;
        margin-bottom: 1em
    }
    .btn-1, .btn-2{
        width:12em
    }
    .clm-head{
        font-size: 290%;
        text-align: center
    }
    .herobg-sec{
        padding-top: 3em
    }
    .overlay{
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 2em;
        font-size: 170%
    }
    
    .about-sec{
        margin-top: 4em;
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
   
    .tablinks{
        outline-style: none;
        background-color: chocolate;
        color: white;
        width:6em;
        border-style:none;
        height: 2em
    }
    #sin-btn1, #sin-btn2{
        width: 9em;
        height: 3em
    }
    .sbottom-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .grp-btn{
        text-align: center
    }
    #sin-btn3, #sin-btn4{
        width: 11em;
        height: 3em
    }
    .card1{
        height: 20em
    }
    .crd-body:hover{
       background-color: chocolate;
        color: white
    }
   
    .sbottom-row{
        margin-bottom: 4em;
        margin-top: 2em
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 4em
    }
    .big-head{
        font-size: 490%
    }
  
    .counter-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 4em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 300%;
        font-weight: bold
    }
    .values-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 2em
    }
    .card-bg{
        height: 15em
    }
    .mid-cardrow{
        margin-bottom: 3em
    }
    #sin-btn4, #sin-btn5{
        width: 12em;
        height: 3em
    }
    #nav-link3{
        margin-left: 1em
    }
    
/*  Contact us page  */
    
    .ctc-hero{
        height: 50em;
        padding-top: 10em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1.5em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em;
        height: 17em
    }
    .form-section{
        text-align: center;
        
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
    #contact-btn{
        width: 12em
    }
    #nav-link1{
        margin-left: 2em
    }
    #nav-link3{
        margin-left: 2em
    }
    
}
@media screen and (min-width:1081px) and (max-width:1280px){
    html{
        font-size: 95%
    }
    .carousel-im{
        width: 10em;
        height: 25em
    }
 
    #shop-btn{
        border-radius: 3em;
        margin-top: 17em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .big-head1{
        font-size: 370%
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #navbardrop1, #navbardrop2, #nav-link2, #nav-link3{
        margin-left: 3em
    }
    #nav-link2{
        margin-right: 3em
    }
    
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 45%;
        margin-bottom: 1em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 55em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 550%
    }
    .section-1{
        margin-left: 1em;
        margin-right: 1em
    }
   
    .productive-img{
       margin-top: 4em
    }
    .caros-after{
        padding-top: 2em;
       height: 20em
    }
    .caros-bg{
        padding-left: 1em
    }
  
    .choc-head{
        margin-right: 42em
    }
    #choc-head1{
        margin-right: 13em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 11em
    }
    .caros-after1{
        padding-right: 1.5em;
        padding-top: 3em;
        padding-bottom: 2em;
        position: absolute;
        top: -3em;
        height: 23em;
        right: 0.7em;   
    }
    #btn-bg, #middle-btn2, #middle-btn1, .icons-btn, .bighead-btn{
        width: 11em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 2em;
        margin-right: 2em
    }
    .card-row1{
        margin-top: 2em;
        
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
   
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        padding-left: 2em;
        padding-right: 2em;   
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;   
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:30%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
   
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blg-top{
        margin-right: 29em
    }
    .blog-top1{
        margin-right: 22em
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        padding-right: 1em
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 12em
    } 
    .value-row{
        padding-left: 2em
    }
   
    .footer{
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 1em;
        padding-right: 1em
    }
    .footer-nav-bar{
        text-align: center
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 5em;
        padding-left: 3em;
        
    }
    .footer-links{
        padding-left: 4em
    }
    .footer-address{
        margin-top: 4em;
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5, #fillbtn6{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 10em
    }
    .img{
        width: 13em
    }
    #img1{
        height: 13em
    }
    .values-sec{
        margin-top: 5em;
    }
    
    
 /*  About us  */
    
    .counter-sec .experience-info {
    	display: grid;
    	grid-template-columns: 1fr 1fr 1fr 1fr;
    	align-items: center;
    	grid-gap: 20px;
    }
    .abt-hero{
        height: 45em;
        padding-top: 5em
    }
    .caption-head, .abt-hero-text{
        text-align: center
    }
    .btn-1, .btn-2{
        width:12em
    }
    .clm-head{
        font-size: 290%;
        text-align: center
    }
    .herobg-sec{
        padding-top: 3em
    }
    .overlay{
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 2em;
        font-size: 170%
    }
    
    .about-sec{
        margin-top: 4em;
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
   
  
    .tablinks{
        outline-style: none;
        background-color: chocolate;
        color: white;
        width:6em;
        border-style:none;
        height: 2em
    }
    #sin-btn1, #sin-btn2{
        width: 9em;
        height: 3em
    }
    .sbottom-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .grp-btn{
        text-align: center
    }
    #sin-btn3, #sin-btn4{
        width: 11em;
        height: 3em
    }
    .card1{
        height: 20em
    }
    .crd-body:hover{
       background-color: chocolate;
        color: white
    }
   
    .sbottom-row{
        margin-bottom: 4em;
        margin-top: 2em
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 4em
    }
    .big-head{
        font-size: 420%
    }
  
    .counter-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 4em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 300%;
        font-weight: bold
    }
    .values-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .card-bg{
        height: 15em
    }
    .mid-cardrow{
        margin-bottom: 3em
    }
    #sin-btn4, #sin-btn5{
        width: 12em;
        height: 3em
    }
    #nav-link3{
        margin-left: 1em
    }
    
    /*  Contact us page  */
    
    .ctc-hero{
        height: 50em;
        padding-top: 10em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1.5em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em;
        height: 17em
    }
    .form-section{
        text-align: center;
        
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
    #contact-btn{
        width: 12em
    }
    #nav-link1{
        margin-left: 2em
    }
    #nav-link3{
        margin-left: 2em
    }
    
    
}
@media screen and (min-width:1025px) and (max-width:1080px){
     html{
        font-size: 95%
    }
    .carousel-im{
        width: 10em;
        height: 25em
    }
 
    #shop-btn{
        border-radius: 3em;
        margin-top: 17em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .big-head1{
        font-size: 350%
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #navbardrop1, #navbardrop2, #nav-link2, #nav-link3{
        margin-left: 3em
    }
    #nav-link2{
        margin-right: 3em
    }
    
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 50%;
        margin-bottom: 1em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 45em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 450%
    }
    .section-1{
        margin-left: 1em;
        margin-right: 1em
    }
   
    .productive-img{
       margin-top: 4em
    }
    .caros-after{
        padding-top: 2em;
       height: 22em
    }
    .caros-bg{
        padding-left: 1em
    }
    
  
    .choc-head{
        margin-right: 42em
    }
    #choc-head1{
        margin-right: 13em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 11em
    }
    .caros-after1{
        padding-right: 1.5em;
        padding-top: 3em;
        padding-bottom: 2em;
        position: absolute;
        top: -3em;
        height: 25em;
        right: 0.7em;   
    }
    #btn-bg, #middle-btn2, #middle-btn1, .icons-btn, .bighead-btn{
        width: 11em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 2em;
        margin-right: 2em
    }
    .card-row1{
        margin-top: 2em;
        
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
   
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        padding-left: 2em;
        padding-right: 2em;   
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;   
    }
    #bighead-btn{
        margin-top: 1em
    }
    .value-row{
        padding-left: 2em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:30%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
   
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blg-top{
        margin-right: 29em
    }
    .blog-top1{
        margin-right: 22em
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        padding-right: 1em
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 12em
    } 
   
    .footer{
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 1em;
        padding-right: 1em
    }
    .footer-nav-bar{
        text-align: center
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 5em;
        padding-left: 3em;
        
    }
    .footer-links{
        padding-left: 4em
    }
    .footer-address{
        margin-top: 4em;
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 10em
    }
    .img{
        width: 13em
    }
    #img1{
        height: 13em
    }
    .values-sec{
        margin-top: 5em;
    }
    

    
 /*  About us  */
    
    .counter-sec .experience-info {
    	display: grid;
    	grid-template-columns: 1fr 1fr 1fr 1fr;
    	align-items: center;
    	grid-gap: 20px;
    }
    .abt-hero{
        height: 40em;
        padding-top: 5em
    }
    .caption-head, .abt-hero-text{
        text-align: center
    }
    .btn-1, .btn-2{
        width:12em
    }
    .clm-head{
        font-size: 240%;
        text-align: center
    }
    .herobg-sec{
        padding-top: 3em
    }
    .overlay{
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 2em;
        font-size: 120%
    }
    .side-main{
        margin-top: 3em
    }
    .about-sec{
        margin-top: 4em;
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    #tab-text1{
        font-size: 85%
    }
  
    .tablinks{
        outline-style: none;
        background-color: chocolate;
        color: white;
        width:6em;
        border-style:none;
        height: 2em
    }
    #sin-btn1, #sin-btn2{
        width: 9em
    }
    .sbottom-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .grp-btn{
        text-align: center
    }
    #sin-btn3, #sin-btn4{
        width: 11em
    }
    .card1{
        height: 22em
    }
    .crd-body:hover{
       background-color: chocolate;
        color: white
    }
    .bighead-img{
        margin-top: 2em
    }
    .sbottom-row{
        margin-bottom: 4em;
        margin-top: 2em
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 4em
    }
    .big-head{
        font-size: 300%
    }
  
    .counter-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 4em
    }
    .benefits-text{
        font-size: 80%
    }
    .counter{
        font-size: 300%;
        font-weight: bold
    }
    .values-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .card-bg{
        height: 15em
    }
    .mid-cardrow{
        margin-bottom: 3em
    }
    #sin-btn4, #sin-btn5{
        width: 12em
    }
    #nav-link3{
        margin-left: 1em
    }

/*  Contact us page  */
    
    .ctc-hero{
        height: 50em;
        padding-top: 10em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1.5em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em;
        height: 17em
    }
    .form-section{
        text-align: center;
        
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
    #contact-btn{
        width: 12em
    }
    #nav-link1{
        margin-left: 2em
    }
    #nav-link3{
        margin-left: 2em
    }
    
}
@media screen and (min-width:992px) and (max-width:1024px){
     html{
        font-size: 95%
    }
    .carousel-im{
        width: 10em;
        height: 25em
    }
 
    #shop-btn{
        border-radius: 3em;
        margin-top: 17em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .big-head1{
        font-size: 350%
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #navbardrop1, #navbardrop2, #nav-link2, #nav-link3{
        margin-left: 3em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 50%;
        margin-bottom: 1em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 45em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caros-bg{
        padding-left: 1em
    }
    .caption-head{
        font-size: 450%
    }
    .section-1{
        margin-left: 1em;
        margin-right: 1em
    }
   
    .productive-img{
       margin-top: 4em
    }
    .caros-after{
        padding-top: 2em;
       height: 24em
    }
  
    .choc-head{
        margin-right: 38em
    }
    #choc-head1{
        margin-right: 13em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 11em
    }
    .caros-after1{
        padding-right: 1.5em;
        padding-top: 3em;
        padding-bottom: 2em;
        position: absolute;
        top: -3em;
        height: 27em;
        right: 0.7em;   
    }
    #btn-bg, #middle-btn2, #middle-btn1, .icons-btn, .bighead-btn{
        width: 11em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 2em;
        margin-right: 2em
    }
    .card-row1{
        margin-top: 2em;
        
    }
   
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
   
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        padding-left: 2em;
        padding-right: 2em;   
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;   
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:30%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
   
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 2em;
        padding-bottom: 2em;
        
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blg-top{
        margin-right: 29em
    }
    .blog-top1{
        margin-right: 22em
    }
    .values-sec{
        text-align: center;
        padding-left: 2em;
        padding-right: 2em
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 12em
    } 
   
    .footer{
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 1em;
        padding-right: 1em
    }
    .footer-nav-bar{
        text-align: center
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 5em;
        padding-left: 3em;
        
    }
    .footer-links{
        padding-left: 4em
    }
    .footer-address{
        margin-top: 4em;
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 10em
    }
    .img{
        width: 13em
    }
    #img1{
        height: 13em
    }
    .values-sec{
        margin-top: 5em;
    }
    
    
/*  About us  */
    
    .counter-sec .experience-info {
    	display: grid;
    	grid-template-columns: 1fr 1fr 1fr 1fr;
    	align-items: center;
    	grid-gap: 20px;
    }
    .abt-hero{
        height: 40em;
        padding-top: 5em
    }
    .caption-head, .abt-hero-text{
        text-align: center
    }
    .btn-1, .btn-2{
        width:12em
    }
    .clm-head{
        font-size: 240%;
        text-align: center
    }
    .herobg-sec{
        padding-top: 3em
    }
    .overlay{
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 2em;
        font-size: 120%
    }
    .side-main{
        margin-top: 3em
    }
    .about-sec{
        margin-top: 4em;
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    #tab-text1{
        font-size: 85%
    }
  
    .tablinks{
        outline-style: none;
        background-color: chocolate;
        color: white;
        width:6em;
        border-style:none;
        height: 2em
    }
    #sin-btn1, #sin-btn2{
        width: 9em
    }
    .sbottom-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .grp-btn{
        text-align: center
    }
    #sin-btn3, #sin-btn4{
        width: 11em
    }
    .card1{
        height: 22em
    }
    .crd-body:hover{
       background-color: chocolate;
        color: white
    }
    .bighead-img{
        margin-top: 2em
    }
    .sbottom-row{
        margin-bottom: 4em;
        margin-top: 2em
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 4em
    }
    .big-head{
        font-size: 300%
    }
  
    .counter-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 4em
    }
    .benefits-text{
        font-size: 80%
    }
    .counter{
        font-size: 300%;
        font-weight: bold
    }
    .values-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .card-bg{
        height: 15em
    }
    .mid-cardrow{
        margin-bottom: 3em
    }
    #sin-btn4, #sin-btn5{
        width: 12em
    }
    #nav-link3{
        margin-left: 1em
    }
    

/*  Contact us page  */
    
    .ctc-hero{
        height: 40em;
        padding-top: 6em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1.5em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em;
        height: 17em
    }
    .form-section{
        text-align: center;
        
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
    #contact-btn{
        width: 12em
    }
    #nav-link1{
        margin-left: 2em
    }
    #nav-link3{
        margin-left: 3em
    }
}
@media screen and (min-width:900px) and (max-width:991px){
    html{
        font-size: 85%
    }
    .carousel-im{
        width: 10em;
        height: 25em
    }
 
    #shop-btn{
        border-radius: 3em;
        margin-top: 17em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .big-head1{
        font-size: 350%
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #navbardrop1, #navbardrop2, #nav-link2, #nav-link3{
        margin-left: 3em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 50%;
        margin-bottom: 1em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 45em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 450%
    }
    .section-1{
        margin-left: 1em;
        margin-right: 1em
    }
   
    .productive-img{
       margin-top: 4em
    }
    .caros-after{
       padding-top: 2em;
       height: 22em
    }
    .caros-bg{
        padding-left: 1em
    }
  
    .choc-head{
        margin-right: 42em
    }
    #choc-head1{
        margin-right: 13em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 11em
    }
    .caros-after1{
        padding-right: 1.5em;
        padding-top: 3em;
        padding-bottom: 2em;
        position: absolute;
        top: -3em;
        height: 25em;
        right: 0.7em;   
    }
    #btn-bg, #middle-btn2, #middle-btn1, .icons-btn, .bighead-btn{
        width: 11em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 2em;
        margin-right: 2em
    }
    .card-row1{
        margin-top: 2em;
        
    }

    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
   
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        padding-left: 2em;
        padding-right: 2em;   
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;   
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:30%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
   
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blg-top{
        margin-right: 29em
    }
    .blog-top1{
        margin-right: 22em
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        padding-right: 1em
    }
    .value-row{
        padding-left: 2em
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 15em
    } 
   
    .footer{
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 2em;
        padding-right: 1em
    }
    .footer-nav-bar{
        text-align: center
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 5em;
        padding-left: 3em;
        
    }
    .footer-links{
        padding-left: 4em
    }
    .footer-address{
        margin-top: 4em;
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 10em
    }
    .img{
        width: 13em
    }
    #img1{
        height: 13em
    }
    .values-sec{
        margin-top: 5em;
    }
    
    
/*  About us  */
    
    .counter-sec .experience-info {
    	display: grid;
    	grid-template-columns: 1fr 1fr 1fr 1fr;
    	align-items: center;
    	grid-gap: 20px;
    }
    .abt-hero{
        height: 40em;
        padding-top: 5em
    }
    .caption-head, .abt-hero-text{
        text-align: center
    }
    .btn-1, .btn-2{
        width:12em
    }
    .clm-head{
        font-size: 270%
    }
    .herobg-sec{
        padding-top: 3em
    }
    .overlay{
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 2em;
        font-size: 140%
    }
    .about-sec{
        margin-top: 4em;
        margin-bottom: 4em
    }
    #tab-text1{
        font-size: 85%
    }
  
    .tablinks{
        outline-style: none;
        background-color: chocolate;
        color: white;
        width:6em;
        border-style:none;
        height: 2em
    }
    #sin-btn1, #sin-btn2{
        width: 9em
    }
    .sbottom-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .grp-btn{
        text-align: center
    }
    #sin-btn3, #sin-btn4{
        width: 11em
    }
    .card1{
        height: 20em
    }
    .crd-body:hover{
       background-color: chocolate;
        color: white
    }
    .sbottom-row{
        margin-bottom: 4em;
        margin-top: 2em
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 4em
    }
    .big-head{
        font-size: 300%
    }
  
    .counter-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 4em
    }
    .benefits-text{
        font-size: 80%
    }
    .counter{
        font-size: 300%;
        font-weight: bold
    }
    .values-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .card-bg{
        height: 15em
    }
    .mid-cardrow{
        margin-bottom: 3em
    }
    #sin-btn4, #sin-btn5{
        width: 12em
    }
    #nav-link3{
        margin-left: 3em
    }
    
/*  Contact us page  */
    
    .ctc-hero{
        height: 40em;
        padding-top: 6em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1.5em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em;
        height: 17em
    }
    .form-section{
        text-align: center;
        
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
    #contact-btn{
        width: 12em
    }
    #nav-link1{
        margin-left: 2em
    }
}
@media screen and (min-width: 768px) and (max-width:899px){
    html{
        font-size: 80%
    }
    .carousel-im{
        width: 10em;
        height: 25em
    }
 
    #shop-btn{
        border-radius: 3em;
        margin-top: 17em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .big-head1{
        font-size: 700%
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #navbardrop1, #navbardrop2, #nav-link2, #nav-link3{
        margin-left: 3em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 50%;
        margin-bottom: 1em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 35em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 450%
    }
    .section-1{
        margin-left: 1em;
        margin-right: 1em
    }
   
    .productive-img{
       margin-top: 4em
    }
    .caros-after{
        padding-top: 2em;
       height: 26em
    }
  
    .choc-head{
        margin-right: 36em
    }
    #choc-head1{
        margin-right: 11em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 11em
    }
    .caros-after1{
       padding-right: 1.5em;
        padding-top: 3em;
      padding-bottom: 2em;
        position: absolute;
        top: -3em;
        height: 29em;
        right: 0.2em
        
    }
    #btn-bg, #middle-btn2, #middle-btn1, .icons-btn, .bighead-btn{
        width: 11em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 2em;
        margin-right: 2em
    }
    .card-row1{
        margin-top: 2em;
        
    }
    .caros-bg{
        padding-left: 1em
    }
    .big-head1{
        font-size: 200%
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
   
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;   
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;   
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:30%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
   
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    .blog-after{
        padding-left: 1em
    }
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blg-top{
        margin-right: 26em
    }
    .blog-top1{
        margin-right: 19em
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        padding-right: 1em
    }
    .value-row{
        padding-left: 1em
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 15em
    } 
   
    .footer{
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 1em;
        padding-right: 1em
    }
    .footer-nav-bar{
        text-align: center
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 5em;
        padding-left: 3em;
        
    }
    .footer-links{
        padding-left: 4em
    }
    .footer-address{
        margin-top: 4em;
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 10em
    }
    .img{
        width: 12em
    }
    #img1{
        height: 12em
    }
    .values-sec{
        margin-top: 4em;
    }
    
/*  About us  */
    
    .counter-sec .experience-info {
    	display: grid;
    	grid-template-columns: 1fr 1fr 1fr 1fr;
    	align-items: center;
    	grid-gap: 20px;
    }
    .abt-hero{
        height: 40em;
        padding-top: 4em
    }
    .caption-head, .abt-hero-text{
        text-align: center
    }
    .btn-1, .btn-2{
        width:12em
    }
    .clm-head{
        font-size: 200%
    }
    .herobg-sec{
        padding-top: 2em
    }
    .overlay{
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 2em
    }
    .about-sec{
        margin-top: 4em;
        margin-bottom: 4em
    }
    #tab-text1{
        font-size: 80%
    }
    .side-main{
        margin-top: 3em
    }
    .tablinks{
        outline-style: none;
        background-color: chocolate;
        color: white;
        width:6em;
        border-style:none;
        height: 2em
    }
    #sin-btn1, #sin-btn2{
        width: 9em
    }
    .sbottom-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .grp-btn{
        text-align: center
    }
    #sin-btn3, #sin-btn4{
        width: 11em
    }
    .card1{
        height: 25em
    }
    .crd-body:hover{
       background-color: chocolate;
        color: white
    }
    .sbottom-row{
        margin-bottom: 4em
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 4em
    }
    .big-head{
        font-size: 300%
    }
    .bighead-img{
        margin-top: 3em
    }
    .counter-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 4em
    }
    .benefits-text{
        font-size: 80%
    }
    .counter{
        font-size: 300%;
        font-weight: bold
    }
    .values-sec{
        margin-bottom: 4em;
        margin-left: 1em;
        margin-right: 1em
    }
    .card-bg{
        height: 15em
    }
    .mid-cardrow{
        margin-bottom: 3em
    }
    #sin-btn4, #sin-btn5{
        width: 12em
    }
    
/*  Contact us page  */
    
    .ctc-hero{
        height: 40em;
        padding-top: 6em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1.5em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em;
        height: 17em
    }
    .form-section{
        text-align: center;
        
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
    
}
@media screen and (min-width:737px) and (max-width:767px){
    html{
        font-size: 85%
    }
    .carousel-im{
        width: 10em;
        height: 50em
    }
 
    #shop-btn{
        border-radius: 3em;
        margin-top: 39em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 60%;
        margin-bottom: 1em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 35em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 350%
    }
    .section-1{
        margin-top: 3em;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
   
    .productive-img{
       display: none
    }
    .caros-after{
        margin-bottom: 3em;
        padding-top: 3em;
        padding-bottom: 2em;
        margin-left: 1em;
        margin-right: 1em
    }
    .choc-head{
        margin-right: 53em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 9em
    }
    .caros-after1{
        padding-top: 2.5em;
        padding-bottom: 2.5em;
        margin-right: 1em;
        margin-left: 1em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 1em;
        margin-right: 2em
    }
    .card-row1{
        margin-top: 2em;
        
    }
    .big-head1{
        font-size: 290%
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
    .column-1, .column-2, .column-3{
        margin-left: 6em;
        margin-right: 6em
    }
    .column-2, .column-3{
        margin-top: 4em
    }
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        text-align: center
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;
        text-align: center;
       
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:15%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
    .column-b, .column-c{
        margin-top: 4em
    }
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    .blog-new1{
        margin-bottom: 1em
    }
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        height: 12em
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blog-top1, .blg-top{
        margin-right: 54em
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        margin-right: 1em
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        
    }

   
    .footer{
        text-align: center;
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 1em;
        padding-right: 1em
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 3em;
        margin-bottom: 3em
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 10em
    }
    .img{
        width: 12em
    }
    #img1{
        height: 13em
    }
    .values-sec{
        margin-top: 3em;
    }
    .slide-card{
        width: 15em;
        height: 17em
    }

    
    /*  About us page  */
    
    .abt-hero{
        height: 40em;
        text-align: center;
        padding-top: 8em
    }
    .abt-hero-text{
        margin-bottom: 2em
    }
    .caption-head{
        font-size: 500%
    }
    .btn{
        width: 9em
    }
    .clm-head{
        font-size: 250%
    }
    .herobg-sec{
        height: 11em;
        text-align: center;
        padding-top: 2em;
        border-bottom-style: solid;
        border-bottom-width: thin;
        border-bottom-color: chocolate;
    }
    #herobg-img{
        display: none
    }
    .about-sec{
        margin-top: 3em;
        margin-left: 2em;
        margin-right: 2em;
        margin-bottom: 3em
    }
    .brief-about{
        margin-top: 2em
    }
    .about-link, .mission-link, .vision-link{
        background-color: chocolate;
        color: white;
        width: 7em;
        border-style: none;
        height: 2.5em
    }
    .grp-btn, .tab-head{
        text-align: center
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        margin-right: 1em
    }
    .card{
        padding-left: 0.5em;
        padding-right: 0.5em;
        margin-top: 2em
    }
    .grp-btn1{
        margin-top: 2em
    }
    .values-sec{
        margin-bottom: 3em
    }
    .counter-sec{
        margin-bottom: 3em;
        padding-top: 2em;
        padding-bottom: 2em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 320%;
        font-weight: bold
    }
    .stats_left{
        margin-bottom: 3em
    }
    .sbottom-sec{
        margin-bottom: 3em;
        
    }
    .card{
       margin-left: 4em;
       margin-right: 4em 
    }
    .big-head-sec{
        margin-left: 0.5em;
        margin-right: 0.5em;
        margin-bottom: 3em;
        text-align: center
    }
    .coloumn-1{
        margin-bottom: 2em
    }
    .benefits-text{
        margin-left: 0.7em;
        margin-right: 0.7em
    }
    .sbottom-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    .big-head{
        font-size: 270%
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    
    /*  Contact us page  */
    
    .ctc-hero{
        height: 40em;
        padding-top: 6em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1.5em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em
    }
    .form-section{
        text-align: center;
        margin-left: 3em;
        margin-right: 3em
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
}
@media screen and (min-width:668px) and (max-width:736px){
   html{
        font-size: 85%
    }
    .carousel-im{
        width: 10em;
        height: 45em
    }
 
    #shop-btn{
        border-radius: 3em;
        margin-top: 33em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 60%;
        margin-bottom: 2em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 35em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 350%
    }
    .section-1{
        margin-top: 3em;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
   
    .productive-img{
       display: none
    }
    .caros-after{
        margin-bottom: 3em;
        padding-top: 3em;
        padding-bottom: 2em
    }
    .choc-head{
        margin-right: 48em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 9em
    }
    .caros-after1{
        padding-top: 2.5em;
        padding-bottom: 2.5em;
        margin-right: 1em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 1em;
        margin-right: 1em
    }
    .card-row1{
        margin-top: 2em;
        
    }
    .big-head1{
        font-size: 290%
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
    .column-1, .column-2, .column-3{
        margin-left: 6em;
        margin-right: 6em
    }
    .column-2, .column-3{
        margin-top: 4em
    }
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        text-align: center
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;
        text-align: center
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:15%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
    .column-b, .column-c{
        margin-top: 4em
    }
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    .blog-new1{
        margin-bottom: 1em
    }
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        height: 12em
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blog-top1, .blg-top{
        margin-right: 48em
    }
    .values-sec{
        text-align: center
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        
    }
    .card-alpha, .card-bravo, .card-charlie{
        margin-bottom: 1em
    }
    .juliet, .kilo, .linda{
        margin-left: 5em;
        margin-right: 5em
    }
    .footer{
        text-align: center;
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 2em;
        padding-right: 1em
    }
    .footer-logo{
        width:20%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 3em;
        margin-bottom: 3em
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 12em
    }
    .img{
        width: 12em
    }
    #img1{
        height: 13em
    }
    .values-sec{
        margin-top: 3em;
    }
    .slide-card{
        width: 15em;
        height: 17em
    }
    
    
/*  About us page  */
    
    .abt-hero{
        height: 30em;
        text-align: center;
        padding-top: 5em
    }
    .abt-hero-text{
        margin-bottom: 2em
    }
    .caption-head{
        font-size: 500%
    }
    .btn{
        width: 9em
    }
    .clm-head{
        font-size: 250%
    }
    .herobg-sec{
        height: 11em;
        text-align: center;
        padding-top: 2em;
        border-bottom-style: solid;
        border-bottom-width: thin;
        border-bottom-color: chocolate;
    }
    #herobg-img{
        display: none
    }
    .about-sec{
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .brief-about{
        margin-top: 2em
    }
    .about-link, .mission-link, .vision-link{
        background-color: chocolate;
        color: white;
        width: 7em;
        border-style: none;
        height: 2.5em
    }
    .grp-btn, .tab-head{
        text-align: center
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        margin-right: 1em
    }
    .card{
        padding-left: 0.5em;
        padding-right: 0.5em;
        margin-top: 2em
    }
    .grp-btn1{
        margin-top: 2em
    }
    .values-sec{
        margin-bottom: 3em
    }
    .counter-sec{
        margin-bottom: 3em;
        padding-top: 2em;
        padding-bottom: 2em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 320%;
        font-weight: bold
    }
    .stats_left{
        margin-bottom: 3em
    }
    .sbottom-sec{
        margin-bottom: 3em;
        
    }
    .card{
       margin-left: 4em;
       margin-right: 4em 
    }
    .big-head-sec{
        margin-left: 0.5em;
        margin-right: 0.5em;
        margin-bottom: 3em;
        text-align: center
    }
    .coloumn-1{
        margin-bottom: 2em
    }
    .benefits-text{
        margin-left: 0.7em;
        margin-right: 0.7em
    }
    .sbottom-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    .big-head{
        font-size: 270%
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em
    }

/*  Contact us page  */
    
    .ctc-hero{
        height: 40em;
        padding-top: 6em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em
    }
    .form-section{
        text-align: center;
        margin-left: 3em;
        margin-right: 3em
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
}
@media screen and (min-width:601px) and (max-width:667px){
   html{
        font-size: 85%
    }
    .carousel-im{
        width: 10em;
        height: 45em
    }
 
    #shop-btn{
        border-radius: 3em;
        margin-top: 33em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 60%;
        margin-bottom: 2em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 35em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 350%
    }
    .section-1{
        margin-top: 3em;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
   
    .productive-img{
       display: none
    }
    .caros-after{
        margin-bottom: 3em;
        padding-top: 3em;
        padding-bottom: 2em
    }
    .choc-head{
        margin-right: 40em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 9em
    }
    .caros-after1{
        padding-top: 2.5em;
        padding-bottom: 2.5em;
        margin-right: 1em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 1em;
        margin-right: 1em
    }
    .card-row1{
        margin-top: 2em;
        
    }
    .big-head1{
        font-size: 290%
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
    .column-1, .column-2, .column-3{
        margin-left: 5em;
        margin-right: 5em
    }
    .column-2, .column-3{
        margin-top: 4em
    }
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        text-align: center
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;
        text-align: center
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:20%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
    .column-b, .column-c{
        margin-top: 4em
    }
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 2em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    .blog-new1{
        margin-bottom: 1em
    }
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        height: 12em
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blog-top1, .blg-top{
        margin-right: 42em
    }
    .values-sec{
        text-align: center
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        
    }
    .card-alpha, .card-bravo, .card-charlie{
        margin-bottom: 1em
    }
    .juliet, .kilo, .linda{
        margin-left: 5em;
        margin-right: 5em
    }
    .footer{
        text-align: center;
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 1em;
        padding-right: 1em
    }
    .footer-logo{
        width:25%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 3em;
        margin-bottom: 3em
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 12em
    }
    .img{
        width: 12em
    }
    #img1{
        height: 13em
    }
    .values-sec{
        margin-top: 3em;
    }
    .slide-card{
        width: 15em;
        height: 17em
    }

/*  About us page  */
    
    .abt-hero{
        height: 30em;
        text-align: center;
        padding-top: 5em
    }
    .abt-hero-text{
        margin-bottom: 2em
    }
    .caption-head{
        font-size: 500%
    }
    .btn{
        width: 9em
    }
    .clm-head{
        font-size: 250%
    }
    .herobg-sec{
        height: 11em;
        text-align: center;
        padding-top: 2em;
        border-bottom-style: solid;
        border-bottom-width: thin;
        border-bottom-color: chocolate;
    }
    #herobg-img{
        display: none
    }
    .about-sec{
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .brief-about{
        margin-top: 2em
    }
    .about-link, .mission-link, .vision-link{
        background-color: chocolate;
        color: white;
        width: 7em;
        border-style: none;
        height: 2.5em
    }
    .grp-btn, .tab-head{
        text-align: center
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        margin-right: 1em
    }
    .card{
        padding-left: 0.5em;
        padding-right: 0.5em;
        margin-top: 2em
    }
    .grp-btn1{
        margin-top: 2em
    }
    .values-sec{
        margin-bottom: 3em
    }
    .counter-sec{
        margin-bottom: 3em;
        padding-top: 2em;
        padding-bottom: 2em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 320%;
        font-weight: bold
    }
    .stats_left{
        margin-bottom: 3em
    }
    .sbottom-sec{
        margin-bottom: 3em;
        
    }
    .card{
       margin-left: 2em;
       margin-right: 2em 
    }
    .big-head-sec{
        margin-left: 0.5em;
        margin-right: 0.5em;
        margin-bottom: 3em;
        text-align: center
    }
    .coloumn-1{
        margin-bottom: 2em
    }
    .benefits-text{
        margin-left: 0.7em;
        margin-right: 0.7em
    }
    .sbottom-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    .big-head{
        font-size: 270%
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    

/*  Contact us page  */
    
    .ctc-hero{
        height: 40em;
        padding-top: 6em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em
    }
    .form-section{
        text-align: center;
        margin-left: 3em;
        margin-right: 3em
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
}

@media screen and (min-width:576px) and (max-width:600px){
    html{
        font-size: 85%
    }
    .carousel-im{
        width: 10em;
        height: 45em
    }
    #shop-btn{
        border-radius: 3em;
        margin-top: 33em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate;
        text-align: right
    }
    .links-top{
        text-align: right;
        margin-top: 1em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 60%;
        margin-bottom: 2em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: right
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 35em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 350%
    }
    .section-1{
        margin-top: 3em;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
   
    .productive-img{
       display: none
    }
    .caros-after{
        margin-bottom: 3em;
        padding-top: 3em;
        padding-bottom: 2em
    }
    .choc-head{
        margin-right: 40em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 9em
    }
    .caros-after1{
        padding-top: 2.5em;
        padding-bottom: 2.5em;
        margin-right: 1em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 1em;
        margin-right: 1em
    }
    .card-row1{
        margin-top: 2em;
        
    }
    .big-head1{
        font-size: 290%
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
    .column-1, .column-2, .column-3{
        margin-left: 5em;
        margin-right: 5em
    }
    .column-2, .column-3{
        margin-top: 4em
    }
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        text-align: center
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;
        text-align: center
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:20%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
    .column-b, .column-c{
        margin-top: 4em
    }
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 2em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    .blog-new1{
        margin-bottom: 1em
    }
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        height: 12em
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blog-top1, .blg-top{
        margin-right: 40em
    }
    .values-sec{
        text-align: center
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        
    }
    .card-alpha, .card-bravo, .card-charlie{
        margin-bottom: 1em
    }
    .juliet, .kilo, .linda{
        margin-left: 5em;
        margin-right: 5em
    }
    .footer{
        text-align: center;
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 1em;
        padding-right: 1em
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 3em;
        margin-bottom: 3em
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5, #fillbtn6{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 12em
    }
    .img{
        width: 12em
    }
    #img1{
        height: 11em
    }
    .values-sec{
        margin-top: 3em;
    }
    .slide-card{
        width: 13em;
        height: 18em
    }
    .rights{
        text-align: left;
    }
    .credits{
        text-align: right
    }
    
    /*  About us page  */
    
    .abt-hero{
        height: 30em;
        text-align: center;
        padding-top: 5em
    }
    .abt-hero-text{
        margin-bottom: 2em
    }
    .caption-head{
        font-size: 350%
    }
    .btn{
        width: 9em
    }
    .herobg-sec{
        height: 9em;
        text-align: center;
        padding-top: 2em;
        border-bottom-style: solid;
        border-bottom-width: thin;
        border-bottom-color: chocolate
    }
    #herobg-img{
        display: none
    }
    .about-sec{
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .brief-about{
        margin-top: 2em
    }
    .about-link, .mission-link, .vision-link{
        background-color: chocolate;
        color: white;
        width: 7em;
        border-style: none;
        height: 2.5em
    }
    .grp-btn, .tab-head{
        text-align: center
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        margin-right: 1em
    }
    .card{
        padding-left: 0.5em;
        padding-right: 0.5em;
        margin-top: 2em
    }
    .grp-btn1{
        margin-top: 2em
    }
    .values-sec{
        margin-bottom: 3em
    }
    .counter-sec{
        margin-bottom: 3em;
        padding-top: 2em;
        padding-bottom: 2em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 320%;
        font-weight: bold
    }
    .stats_left{
        margin-bottom: 3em
    }
    .sbottom-sec{
        margin-bottom: 3em;
        
    }
    .card{
       margin-left: 2em;
       margin-right: 2em 
    }
    .big-head-sec{
        margin-left: 0.5em;
        margin-right: 0.5em;
        margin-bottom: 3em;
        text-align: center
    }
    .coloumn-1{
        margin-bottom: 2em
    }
    .benefits-text{
        margin-left: 0.7em;
        margin-right: 0.7em
    }
    .sbottom-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    .big-head{
        font-size: 270%
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    
    /*  Contact us page  */
    
    .ctc-hero{
        height: 35em;
        padding-top: 6em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em
    }
    .form-section{
        text-align: center;
        margin-left: 3em;
        margin-right: 3em
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
}
@media screen and (min-width:481px)and (max-width:575px){
    html{
        font-size: 80%
    }
    .carousel-im{
        width: 10em;
        height: 45em
    }
 
    #shop-btn{
        border-radius: 3em;
        margin-top: 33em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate
    }
    .links-top{
        text-align: center;
        margin-top: 1em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 35%;
        margin-bottom: 2em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: center
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 35em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 350%
    }
    .section-1{
        margin-top: 3em;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
   
    .btnrow-text, .productive-img{
       display: none
    }
    .caros-after{
        margin-bottom: 3em;
        padding-top: 3em;
        padding-bottom: 3em
    }
    .choc-head{
        margin-right: 34em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 9em
    }
    .caros-after1{
        padding-top: 2.5em;
        padding-bottom: 2.5em;
        margin-right: 1em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 1em;
        margin-right: 1em
    }
    .card-row1{
        margin-top: 2em;
        
    }
    .big-head1{
        font-size: 290%
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
    .column-1, .column-2, .column-3{
        margin-left: 3em;
        margin-right: 3em
    }
    .column-2, .column-3{
        margin-top: 4em
    }
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em;
        text-align: center
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;
        text-align: center
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:25%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
    .column-b, .column-c{
        margin-top: 4em
    }
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 2em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    .blog-new1{
        margin-bottom: 1em
    }
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        height: 12em
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blog-top1, .blg-top{
        margin-right: 33em
    }
    .values-sec{
        text-align: center
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover
    }
    .card-alpha, .card-bravo, .card-charlie{
        margin-bottom: 2em
    }
    .footer{
        text-align: center;
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 0.5em;
        padding-right: 0.5em
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 3em;
        margin-bottom: 3em
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 12em
    }
    .img{
        width: 12em
    }
    #img1{
        height: 11em
    }
    .values-sec{
        margin-top: 3em;
    }
    .slide-card{
        width: 13em;
        height: 18em
    }
    
/*  About us page  */
    
    .abt-hero{
        height: 30em;
        text-align: center;
        padding-top: 5em
    }
    .abt-hero-text{
        margin-bottom: 2em
    }
    .caption-head{
        font-size: 350%
    }
    .btn{
        width: 9em
    }
    .herobg-sec{
        height: 9em;
        text-align: center;
        padding-top: 2em;
        border-bottom-style: solid;
        border-bottom-width: thin;
        border-bottom-color: chocolate
    }
    #herobg-img{
        display: none
    }
    .about-sec{
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .brief-about{
        margin-top: 2em
    }
    .about-link, .mission-link, .vision-link{
        background-color: chocolate;
        color: white;
        width: 7em;
        border-style: none;
        height: 2.5em
    }
    .grp-btn, .tab-head{
        text-align: center
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        margin-right: 1em
    }
    .card{
        padding-left: 0.5em;
        padding-right: 0.5em;
        margin-top: 2em
    }
    .grp-btn1{
        margin-top: 2em
    }
    .values-sec{
        margin-bottom: 3em
    }
    .counter-sec{
        margin-bottom: 3em;
        padding-top: 2em;
        padding-bottom: 2em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 320%;
        font-weight: bold
    }
    .stats_left{
        margin-bottom: 3em
    }
    .sbottom-sec{
        margin-bottom: 3em;
        
    }
    .card{
       margin-left: 2em;
       margin-right: 2em 
    }
    .big-head-sec{
        margin-left: 0.5em;
        margin-right: 0.5em;
        margin-bottom: 3em;
        text-align: center
    }
    .coloumn-1{
        margin-bottom: 2em
    }
    .benefits-text{
        margin-left: 0.7em;
        margin-right: 0.7em
    }
    .sbottom-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    .big-head{
        font-size: 270%
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em
    }

    /*  Contact us page  */
    
    .ctc-hero{
        height: 35em;
        padding-top: 6em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em
    }
    .form-section{
        text-align: center
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
}
@media screen and (min-width:415px) and (max-width:480px){
     html{
        font-size: 80%
    }
    .carousel-im{
        width: 10em;
        height: 32em
    }
    #shop-btn{
        border-radius: 3em;
        margin-top: 21em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate
    }
    .links-top{
        text-align: center;
        margin-top: 1em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 35%;
        margin-bottom: 2em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: center
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 35em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 350%
    }
    .section-1{
        margin-top: 3em;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
   
    .btnrow-text, .productive-img{
       display: none
    }
    .caros-after{
        margin-bottom: 3em;
        padding-top: 3em;
        padding-bottom: 3em
    }
    .choc-head{
        margin-right: 33em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 9em
    }
    .caros-after1{
        padding-top: 2.5em;
        padding-bottom: 2.5em;
        margin-right: 1em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 1em;
        margin-right: 1em
    }
    .card-row1{
        margin-top: 2em;
        
    }
    .big-head1{
        font-size: 250%
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
    .column-1, .column-2, .column-3{
        margin-left: 3em;
        margin-right: 3em
    }
    .column-2, .column-3{
        margin-top: 4em
    }
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em;
        text-align: center
    }
    
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;
        text-align: center
    }
    #bighead-btn{
        margin-top: 1em
    }
  
    #Layer_1, #Layer_2, #Layer_3{
        width:25%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
    .column-b, .column-c{
        margin-top: 4em
    }
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1.5em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    .blog-new1{
        margin-bottom: 1em
    }
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        height: 12em
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blog-top1, .blg-top{
        margin-right: 26em
    }
    .values-sec{
        text-align: center
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover
    }
    .card-alpha, .card-bravo, .card-charlie{
        margin-bottom: 2em
    }
    .footer{
        text-align: center;
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 0.5em;
        padding-right: 0.5em
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 3em;
        margin-bottom: 3em
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5, #fillbtn6{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 12em
    }
    .img{
        width: 10em
    }
    #img1{
        height: 11em
    }
    .values-sec{
        margin-top: 3em;
    }
    .slide-card{
        width: 11em;
        height: 18em
    }
    
/*  About us page  */
    
    .abt-hero{
        height: 30em;
        text-align: center;
        padding-top: 5em
    }
    .abt-hero-text{
        margin-bottom: 2em
    }
    .caption-head{
        font-size: 350%
    }
    .btn{
        width: 9em
    }
    .herobg-sec{
        height: 9em;
        text-align: center;
        padding-top: 2em;
        border-bottom-style: solid;
        border-bottom-width: thin;
        border-bottom-color: chocolate
    }
    #herobg-img{
        display: none
    }
    .about-sec{
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .brief-about{
        margin-top: 2em
    }
    .about-link, .mission-link, .vision-link{
        background-color: chocolate;
        color: white;
        width: 7em;
        border-style: none;
        height: 2.5em
    }
    .grp-btn, .tab-head{
        text-align: center
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        margin-right: 1em
    }
    .card{
        padding-left: 0.5em;
        padding-right: 0.5em;
        margin-top: 2em
    }
    .grp-btn1{
        margin-top: 2em
    }
    .values-sec{
        margin-bottom: 3em
    }
    .counter-sec{
        margin-bottom: 3em;
        padding-top: 2em;
        padding-bottom: 2em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 320%;
        font-weight: bold
    }
    .stats_left{
        margin-bottom: 3em
    }
    .sbottom-sec{
        margin-bottom: 3em;
        
    }
    .card{
       margin-left: 2em;
       margin-right: 2em 
    }
    .big-head-sec{
        margin-left: 0.5em;
        margin-right: 0.5em;
        margin-bottom: 3em;
        text-align: center
    }
    .coloumn-1{
        margin-bottom: 2em
    }
    .benefits-text{
        margin-left: 0.7em;
        margin-right: 0.7em
    }
    .sbottom-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    .big-head{
        font-size: 270%
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    
/*  Contact us page  */
    
    .ctc-hero{
        height: 35em;
        padding-top: 3em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em
    }
    .form-section{
        text-align: center
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
}
@media screen and (min-width:385px) and (max-width:414px){
     html{
        font-size: 80%
    }
    .carousel-im{
        width: 10em;
        height: 28em
    }
    #shop-btn{
        border-radius: 3em;
        margin-top: 19em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate
    }
    .links-top{
        text-align: center;
        margin-top: 1em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 45%;
        margin-bottom: 2em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: center
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 25em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 290%
    }
    .section-1{
        margin-top: 3em;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
   
    .btnrow-text, .productive-img{
       display: none
    }
    .caros-after{
        margin-bottom: 3em;
        padding-top: 3em;
        padding-bottom: 3em
    }
    .choc-head{
        margin-right: 24em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 9em
    }
    .caros-after1{
        padding-top: 2.5em;
        padding-bottom: 2.5em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
    .card-row1{
        margin-top: 2em
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
    .column-2, .column-3{
        margin-top: 4em
    }
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em;
        text-align: center
    }
    .big-head1{
        font-size: 200%
    }
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;
        text-align: center
    }
    #bighead-btn{
        margin-top: 1em
    }
    .clm-div{
        margin-bottom: 3em
    }
    #Layer_1, #Layer_2, #Layer_3{
        width:30%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
    .column-b, .column-c{
        margin-top: 4em
    }
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    .blog-new1{
        margin-bottom: 1em
    }
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        height: 12em
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blog-top1, .blg-top{
        margin-right: 24em
    }
    .values-sec{
        text-align: center
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover
    }
    .card-alpha, .card-bravo, .card-charlie{
        margin-bottom: 2em
    }
    .footer{
        text-align: center;
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 0.5em;
        padding-right: 0.5em
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 3em;
        margin-bottom: 3em
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 12em
    }
    .img{
        width: 9em
    }
    #img1{
        height: 11em
    }
    .values-sec{
        margin-top: 2em;
    }
    .slide-card{
        width: 10em;
        height: 10em
    }
    .content{
        display: none;
    }

    
/*  About us page  */
    
    .abt-hero{
        height: 30em;
        text-align: center;
        padding-top: 5em
    }
    .abt-hero-text{
        margin-bottom: 2em
    }
    .caption-head{
        font-size: 350%
    }
    .btn{
        width: 9em
    }
    .herobg-sec{
        height: 9em;
        text-align: center;
        padding-top: 2em;
        border-bottom-style: solid;
        border-bottom-width: thin;
        border-bottom-color: chocolate
    }
    #herobg-img{
        display: none
    }
    .about-sec{
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .brief-about{
        margin-top: 2em
    }
    .about-link, .mission-link, .vision-link{
        background-color: chocolate;
        color: white;
        width: 7em;
        border-style: none;
        height: 2.5em
    }
    .grp-btn, .tab-head{
        text-align: center
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        margin-right: 1em
    }
    .card{
        padding-left: 0.5em;
        padding-right: 0.5em;
        margin-top: 2em
    }
    .grp-btn1{
        margin-top: 2em
    }
    .values-sec{
        margin-bottom: 3em
    }
    .counter-sec{
        margin-bottom: 3em;
        padding-top: 2em;
        padding-bottom: 2em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 320%;
        font-weight: bold
    }
    .stats_left{
        margin-bottom: 3em
    }
    .sbottom-sec{
        margin-bottom: 3em;
        
    }
    .card{
       margin-left: 2em;
       margin-right: 2em 
    }
    .big-head-sec{
        margin-left: 0.5em;
        margin-right: 0.5em;
        margin-bottom: 3em;
        text-align: center
    }
    .coloumn-1{
        margin-bottom: 2em
    }
    .benefits-text{
        margin-left: 0.7em;
        margin-right: 0.7em
    }
    .sbottom-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    .big-head{
        font-size: 270%
    }
    .big-head-sec{
        margin-left: 1em;
        margin-right: 1em
    }

    /*  Contact us page  */
    
    .ctc-hero{
        height: 35em;
        padding-top: 3em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em
    }
    .form-section{
        text-align: center
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
}
@media screen and (min-width:376px) and (max-width:384px){
      html{
        font-size: 80%
    }
    .carousel-im{
        width: 10em;
        height: 28em
    }
    #shop-btn{
        border-radius: 3em;
        margin-top: 17em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate
    }
    .links-top{
        text-align: center;
        margin-top: 1em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 45%;
        margin-bottom: 2em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: center
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 25em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 290%
    }
    .section-1{
        margin-top: 3em;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
   
    .btnrow-text, .productive-img{
       display: none
    }
    .caros-after{
        margin-bottom: 3em;
        padding-top: 3em;
        padding-bottom: 3em
    }
    .choc-head{
        margin-right: 24em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 9em
    }
    .caros-after1{
        padding-top: 2.5em;
        padding-bottom: 2.5em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
    .card-row1{
        margin-top: 2em
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
    .column-2, .column-3{
        margin-top: 4em
    }
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em;
        text-align: center
    }
    .big-head1{
        font-size: 200%
    }
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;
        text-align: center
    }
    #bighead-btn{
        margin-top: 1em
    }
    .clm-div{
        margin-bottom: 3em
    }
    #Layer_1, #Layer_2, #Layer_3{
        width:30%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
    .column-b, .column-c{
        margin-top: 4em
    }
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    .blog-new1{
        margin-bottom: 1em
    }
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        height: 12em
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blog-top1, .blg-top{
        margin-right: 23em
    }
    .values-sec{
        text-align: center
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover
    }
    .card-alpha, .card-bravo, .card-charlie{
        margin-bottom: 2em
    }
    .footer{
        text-align: center;
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 0.5em;
        padding-right: 0.5em
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 3em;
        margin-bottom: 3em
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5, #fillbtn6{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 12em
    }
    .img{
        width: 8em
    }
    #img1{
        height: 11em
    }
    .values-sec{
        margin-top: 3em;
    }
    .slide-card{
        width: 9em;
        height: 10em
    }
    .content{
        display: none;
    }
    
/*  About us page  */
    
    .abt-hero{
        height: 30em;
        text-align: center;
        padding-top: 5em
    }
    .abt-hero-text{
        margin-bottom: 2em
    }
    .caption-head{
        font-size: 350%
    }
    .btn{
        width: 9em
    }
    .herobg-sec{
        height: 9em;
        text-align: center;
        padding-top: 2em;
        border-bottom-style: solid;
        border-bottom-width: thin;
        border-bottom-color: chocolate
    }
    #herobg-img{
        display: none
    }
    .about-sec{
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .brief-about{
        margin-top: 2em
    }
    .about-link, .mission-link, .vision-link{
        background-color: chocolate;
        color: white;
        width: 7em;
        border-style: none;
        height: 2.5em
    }
    .grp-btn, .tab-head{
        text-align: center
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        margin-right: 1em
    }
    .card{
        padding-left: 0.5em;
        padding-right: 0.5em;
        margin-top: 2em
    }
    .grp-btn1{
        margin-top: 2em
    }
    .values-sec{
        margin-bottom: 3em
    }
    .counter-sec{
        margin-bottom: 3em;
        padding-top: 2em;
        padding-bottom: 2em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 220%;
        font-weight: bold
    }
    .stats_left{
        margin-bottom: 3em
    }
    .sbottom-sec{
        margin-bottom: 3em
    }
    .big-head-sec{
        margin-left: 0.5em;
        margin-right: 0.5em;
        margin-bottom: 3em;
        text-align: center
    }
    .coloumn-1{
        margin-bottom: 2em
    }
    .benefits-text{
        margin-left: 0.7em;
        margin-right: 0.7em
    }
    .sbottom-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    
/*  Contact us page  */
    
    .ctc-hero{
        height: 35em;
        padding-top: 3em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em
    }
    .form-section{
        text-align: center
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
}
@media screen and (min-width:321px) and (max-width:375px){
    html{
        font-size: 80%
    }
    .carousel-im{
        width: 10em;
        height: 28em
    }
    #shop-btn{
        border-radius: 3em;
        margin-top: 17em;
    }
    .int-carousel{
        margin-top: 2em;
    }
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate
    }
    .links-top{
        text-align: center;
        margin-top: 1em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 45%;
        margin-bottom: 2em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: center
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 3em
    }
    .carousel-img{
        height: 25em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 290%
    }
    .section-1{
        margin-top: 3em;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
   
    .btnrow-text, .productive-img{
       display: none
    }
    .caros-after{
        margin-bottom: 3em;
        padding-top: 3em;
        padding-bottom: 3em
    }
    .choc-head{
        margin-right: 24em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 9em
    }
    .caros-after1{
        padding-top: 2.5em;
        padding-bottom: 2.5em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
    .card-row1{
        margin-top: 2em
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
    .column-2, .column-3{
        margin-top: 4em
    }
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em;
        text-align: center
    }
    .big-head1{
        font-size: 200%
    }
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;
        text-align: center
    }
    #bighead-btn{
        margin-top: 1em
    }
    .clm-div{
        margin-bottom: 3em
    }
    #Layer_1, #Layer_2, #Layer_3{
        width:30%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
    .column-b, .column-c{
        margin-top: 4em
    }
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    .blog-new1{
        margin-bottom: 1em
    }
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        height: 12em
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blog-top1, .blg-top{
        margin-right: 23em
    }
    .values-sec{
        text-align: center
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover
    }
    .card-alpha, .card-bravo, .card-charlie{
        margin-bottom: 2em
    }
    .footer{
        text-align: center;
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 0.5em;
        padding-right: 0.5em
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 3em;
        margin-bottom: 3em
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 12em
    }
    .img{
        width: 8em
    }
    #img1{
        height: 11em
    }
    .values-sec{
        margin-top: 3em;
    }
    .slide-card{
        width: 9em;
        height: 10em
    }
    .content{
        display: none;
    }
    
/*  About us page  */
    
    .abt-hero{
        height: 30em;
        text-align: center;
        padding-top: 5em
    }
    .abt-hero-text{
        margin-bottom: 2em
    }
    .btn{
        width: 9em
    }
    .herobg-sec{
        height: 9em;
        text-align: center;
        padding-top: 2em;
        border-bottom-style: solid;
        border-bottom-width: thin;
        border-bottom-color: chocolate
    }
    #herobg-img{
        display: none
    }
    .about-sec{
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .brief-about{
        margin-top: 2em
    }
    .about-link, .mission-link, .vision-link{
        background-color: chocolate;
        color: white;
        width: 7em;
        border-style: none;
        height: 2.5em
    }
    .grp-btn, .tab-head{
        text-align: center
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        margin-right: 1em
    }
    .card{
        padding-left: 0.5em;
        padding-right: 0.5em;
        margin-top: 2em
    }
    .grp-btn1{
        margin-top: 2em
    }
    .values-sec{
        margin-bottom: 3em
    }
    .counter-sec{
        margin-bottom: 3em;
        padding-top: 2em;
        padding-bottom: 2em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 220%;
        font-weight: bold
    }
    .stats_left{
        margin-bottom: 3em
    }
    .sbottom-sec{
        margin-bottom: 3em
    }
    .big-head-sec{
        margin-left: 0.5em;
        margin-right: 0.5em;
        margin-bottom: 3em;
        text-align: center
    }
    .coloumn-1{
        margin-bottom: 2em
    }
    .benefits-text{
        margin-left: 0.7em;
        margin-right: 0.7em
    }
    .sbottom-sec{
        margin-left: 1em;
        margin-right: 1em
    }
    
/*  Contact us page  */
    
    .ctc-hero{
        height: 35em;
        padding-top: 3em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em
    }
    .form-section{
        text-align: center
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
    
}
@media screen and (min-width:300px) and (max-width:320px){
    html{
        font-size: 80%
    }
    .carousel-im{
        width: 10em;
        height: 25em
    }
    #shop-btn{
        border-radius: 3em;
        margin-top: 17em;
    }
    .int-carousel{
        margin-top: 2em;
    }
  
    .social-top{
        text-align: center;
        margin-top: 1em
    }
    .twitter, .fb, .ig{
        margin-right: 2em;
        
    }
    .twitter, .fb, .ig, .in{
        color: chocolate
    }
    .cname{
        color: chocolate
    }
    .links-top{
        text-align: center;
        margin-top: 1em
    }
    #nav-link8{
        margin-right: 2em
    }
    .logo-img{
        width: 50%;
        margin-bottom: 2em
    }
    .logo-column, .logo-side{
        text-align: center
    }
    .topbar-mail{
        margin-left: 1em
    }
     .topbar-phone{
        margin-left: 2em
    }
    .topbar-phone, .topbar-mail{
        color: black
    }
    .contacts-top{
        font-size: 90%;
        text-align: center
    }
    .links-top{
        font-size: 80%
    }
    #nav-link6, #nav-link10{
        margin-right: 1em
    }
    .carousel-img{
        height: 25em
    }
    .carousel-caption{
        position:absolute;
        top:12%
    }
    .caption-head{
        font-size: 290%
    }
    .section-1{
        margin-top: 3em;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
    .choc-head{
        margin-right: 10em
    }
    .btnrow-text, .productive-img{
       display: none
    }
    .caros-after{
        margin-bottom: 3em;
        padding-top: 3em;
        padding-bottom: 3em
    }
    .choc-head{
        margin-right: 18em
    }
    #btn-fill1, #btn-fill2, #btn-fill3, #btn-fill4{
        width: 9em
    }
    .caros-after1{
        padding-top: 2.5em;
        padding-bottom: 2.5em
    }
    .causes-sec{
        text-align: center;
        margin-bottom: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em
    }
    .card-row1{
        margin-top: 2em
    }
    .overlay1{
        padding-top: 3em;
        
    }
    .bg-head{
        margin-bottom: 0.5em
    }
    .column-2, .column-3{
        margin-top: 4em
    }
    .blog-after{
        margin-bottom: 3em;
        margin-top: 3em;
        margin-left: 0.5em;
        margin-right: 0.5em;
        text-align: center
    }
    .big-head1{
        font-size: 200%
    }
    .main-head{
        font-size: 220%
    }
    .middle-scroll{
        padding-top: 2em;
        padding-bottom: 2em;
        text-align: center
    }
    #bighead-btn{
        margin-top: 1em
    }
    .clm-div{
        margin-bottom: 3em
    }
    #Layer_1, #Layer_2, #Layer_3{
        width:40%;
    }
    .column-a, .column-b, .column-c{
        text-align: center
    }
    .column-b, .column-c{
        margin-top: 4em
    }
    .column-c{
        margin-bottom: 3em
    }
    .scroll-sec{
        padding-top: 3em;
        padding-bottom: 3em;
        margin-bottom: 3em
    }
    .blog-news{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .blog-new1, .blog-new2, .blog-new3{
        margin-left: 1em
    }
    .blog-new1{
        margin-bottom: 1em
    }
    .row-bravo{
        margin-top: 1em
    }
    .blog-new1, .blog-new2, .blog-new3{
        padding-top: 1em;
        padding-bottom: 1em;
        height: 12em
    }
    .blg-head{
        padding-top: 4em
    }
    #blg-text1, #blg-text2, #blg-text3{
        color: chocolate
    }
    .blog-top1, .blg-top{
        margin-right: 16.5em
    }
    .values-sec{
        text-align: center
    }
    .card-alpha, .card-bravo, .card-charlie{
        background-image: url(../images/bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover
    }
    .card-alpha, .card-bravo, .card-charlie{
        margin-bottom: 2em
    }
    .footer{
        text-align: center;
        padding-top: 2em;
        padding-bottom: 1em;
        padding-left: 0.5em;
        padding-right: 0.5em
    }
    .footer-logo{
        width:30%;
        margin-bottom: 1em
    }
    .footer-link{
        margin-top: 3em;
        margin-bottom: 3em
    }
    .icon{
        margin-left: 1.5em
    }
    .footer-nav1, .footer-nav2{
        margin-right: 2em
    }
    #fillbtn1, #fillbtn2, #fillbtn3, #fillbtn4, #fillbtn5{
        background-color: transparent;
        outline-style: solid;
        outline-width: thin;
        outline-color: chocolate;
        color: chocolate;
        width: 10em
    }
    .vibe{
        margin-top: 5em
    }
    #fillbtn6{
        background-color: chocolate;
        color: white;
        width: 12em
    }
    .img{
        width: 7em
    }
    #img1{
        height: 11em
    }
    .values-sec{
        margin-top: 3em;
    }
    .slide-card{
        width: 8em;
        height: 10em
    }
    .content{
        display: none;
    }
    
    
/*  About us page  */
    
    .abt-hero{
        height: 30em;
        text-align: center;
        padding-top: 5em
    }
    .abt-hero-text{
        margin-bottom: 2em
    }
    .btn{
        width: 9em
    }
    .herobg-sec{
        height: 9em;
        text-align: center;
        padding-top: 2em;
        border-bottom-style: solid;
        border-bottom-width: thin;
        border-bottom-color: chocolate
    }
    #herobg-img{
        display: none
    }
    .about-sec{
        margin-top: 3em;
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 3em
    }
    .brief-about{
        margin-top: 2em
    }
    .about-link, .mission-link, .vision-link{
        background-color: chocolate;
        color: white;
        width: 7em;
        border-style: none;
        height: 2.5em
    }
    .grp-btn, .tab-head{
        text-align: center
    }
    .values-sec{
        text-align: center;
        margin-left: 1em;
        margin-right: 1em
    }
    .card{
        padding-left: 0.5em;
        padding-right: 0.5em;
        margin-top: 2em
    }
    .grp-btn1{
        margin-top: 2em
    }
    .values-sec{
        margin-bottom: 3em
    }
    .counter-sec{
        margin-bottom: 3em;
        padding-top: 2em;
        padding-bottom: 2em
    }
    .benefits-text{
        font-size: 90%
    }
    .counter{
        font-size: 220%;
        font-weight: bold
    }
    .stats_left{
        margin-bottom: 3em
    }
    .sbottom-sec{
        margin-bottom: 3em
    }
    .big-head-sec{
        margin-left: 0.5em;
        margin-right: 0.5em;
        margin-bottom: 3em;
        text-align: center
    }
    .coloumn-1{
        margin-bottom: 2em
    }
    .benefits-text{
        margin-left: 0.7em;
        margin-right: 0.7em
    }
    
    
    
/*  Contact us page  */
    
    .ctc-hero{
        height: 35em;
        padding-top: 3em;
        margin-bottom: 3em
    }
    .contact-form{
        margin-left: 1em;
        margin-right: 1em;
        margin-bottom: 2em
    }
    .contact-form-side{
        text-align: center;
        margin-bottom: 2em
    }
    .form-section{
        text-align: center
    }
    .contact-name, .contact-phone, .contact-email{
        margin-bottom: 0.5em
    }
      
}
@media screen and (min-width: 576px) and (max-width:1600px){
    .rights{
        text-align: left;
    }
    .credits{
        text-align: right;
    }
}