Atish.css

/* Start Slideshow */
.slideshow-container{
    max-width: 100%;
    position: relative;
    margin: 0;
    z-index: 2;
}
  
.slideshow-container img{
    filter: brightness(80%);
    vertical-align: bottom;
    margin-bottom:-40px;
}

/* Hide the images by default */
.slideshow-container .mySlides{
    display: none;
    margin: 0px;
}
  
/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover{
    background-color: rgba(0,0,0,0.8);
}
  
/* Caption text */
.slideshow-container .text{
    color: white;
    line-height: 50px;
    font-size: 2em;
    padding: 8px 12px;
    position: absolute;
    top: 20%;
    width: 100%;
    text-align: center;
    z-index:3;
}
  
/* Fading animation */
.slideshow-container .fade{
    -webkit-animation-name: fade;
    -webkit-animation-duration: 1.5s;
    animation-name: fade;
    animation-duration: 1.5s;
}
  
@-webkit-keyframes fade{
    from {opacity: .4}
    to {opacity: 1}
}
  
@keyframes fade{
    from {opacity: .4}
    to {opacity: 1}
}
/* End Slideshow */


/* Start What You Can Do */
.what-you-can-do{
    position:relative;
    background-color: white;
    margin:0;
    z-index: 3;
}

.what-you-can-do h2{
    padding-top: 28px;
    color: black;
    margin: 0px;
}

.what-you-can-do .column .what-you-can-do-subtitle{
    font-size: 30px;
    font-weight: bold;
    color: black;
}

.what-you-can-do .column .what-you-can-do-text{
    font-size: 25px;
    color: black;
}

.what-you-can-do .row{
    text-align: center;
    font-size: 80px;
    color:black;
    padding-bottom: 40px;
}

.what-you-can-do .row .column{
    display: block;
    padding-top: 30px;
    margin: 0;
}

.what-you-can-do .row .column span{
    display: block;
    padding: 0 30px;
    margin: 0;
}
/* End What You Can Do */


/* Start Special Offer */
.offer-section{
    z-index: 1;
    margin-bottom: 0;
}

.offer-bg {
    background:linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url("Assets/images/2.products/cupcake_bg2_cropped.jpg");
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
    text-align: center;
}

.offer-data{
    margin-bottom: 10px;
    padding: 0 10px;
    padding-top: 20px;
    padding-bottom: 55px;
}

.offer-data p{
    color: white;
    font-size: 20px;
}

.offer-section .subtitle h2{
    color: white;
}

.offer-description{
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 1rem;
    letter-spacing: .2rem;
}

/* == Shop Now Button == */
.offer-section .subscribe-button-container{
    display: inline-block;
}

.subscribe-button{
    border: none;
    background-color: #FF7380FF;
    color: white;
    padding: 1rem;
    font-size: 12pt;
    font-weight: 600;
    transition: .3s;
    text-decoration: none;
}

.subscribe-button:hover{
    background-color: black;
}

.subscribe-button {
    border-radius: 25px;
}

.subscribe-button-container{
    width: 150px;
}
/* End Special Offer */


/* Start How to Order*/
.how-to-order h2{
    padding-top: 40px;
    color:black;
    margin: 0px;
}

.how-to-order{
    position:relative;
    background-color: white;
}

.how-to-order .row{
    text-align: center;
    font-size:80px;
    color:black;
    padding-bottom: 40px;
}

.how-to-order .row .column{
    display: block;
    padding-top: 30px;
    margin:0;
}

.how-to-order .row .column p{
    font-size: 25px;
    color:black;
    margin:0;
}

.wave-image-group .how-to-order-wave{
    margin-bottom: -70px;
}
/* End How to Order*/


/* Start Our Baker */
.our-baker{
    background:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("./Assets/images/1.index/CupcakePattern_Darken.jpg");
    background-position: center;
    background-size:cover;
    text-align: center;
    padding-top: 50px;
    padding-bottom: 60px;
}

.our-baker .team-subtitle{
    font-size: 40px;
}

.our-baker .team-title{
    padding-bottom: 15px;
    font-size:25px;
}

.our-baker h2{
    padding: 0 20px;
    padding-top: 60px;
    padding-bottom: 25px;
    margin: 0;
    color: white;
}

.baker-info p{
    font-size: 20px;
}

.baker-more-about{
    background-color: white;
    margin-top:-10px;
    padding: 10px 0px;
}

.baker-profile-group p{
    text-align: center;
}

.baker-profile-group .name{
    font-size: 20px;
}

.baker-profile-group .description{
    font-size: 20px;
}

.baker-profile-group .hierarchy{
    color: #FF7380FF;
}
/* End Our Baker */


/*---------------------------------------------------------------------------------------------*/
/*START MEDIA QUERY FOR INDEX.HTML*/
/*---------------------------------------------------------------------------------------------*/

@media only screen and (min-width: 1200px){
    .subtitle h2{
        font-size: 50px;
    }

    /* Start Slideshow */
    .slideshow-container{
        max-width: 100%;
    }

    .slideshow-container .text{
        color: #f2f2f2;
        line-height: 125px;
        font-size: 100px;
        padding: 8px 12px;
        position: absolute;
        top: 30%;
        width: 100%;
        text-align: center;
        z-index:3;
    }
    /* End Slideshow */


    /* Start What You Can Do */
    .what-you-can-do h2{
        padding-top: 20px;
        color:black;
        margin: 0px;
    }

    .what-you-can-do .column .what-you-can-do-subtitle{
        font-size: 30px;
        font-weight: bold;
        color: black;
    }
    
    .what-you-can-do .column .what-you-can-do-text{
        font-size: 28px;
        color: black;
    }
    
    .what-you-can-do .row{
        display: flex;

    }
    /* End What You Can Do */


    /* Start Special Offer */
    .offer-data{
        margin-bottom: 0;
        padding: 0 10px;
        padding-top: 20px;
        padding-bottom: 60px;
    }

    .offer-data p{
        font-size: 25px;
    }

    .offer-section .subtitle h2{
        color: white;
    }
    /* End Special Offer */
    
    
    /* Start How to Order*/
    .how-to-order h2{
        padding-top: 20px;
        margin: 0px;
    }

    .how-to-order .row{
        display: flex;
        align-items: center;
        justify-content: center;
        flex-grow:1;
        flex-basis: 0;
        padding-top: 30px;
        overflow-x: auto;
        margin:0;
    }

    .how-to-order .column{
        padding: 0 50px;
        white-space: nowrap;
    }

    .how-to-order .row .column p{
        font-size: 25px;
        margin:0;
    }

    .wave-image-group .how-to-order-wave{
        margin-bottom: -70px;
    }
    /* End How to Order*/


    /* Start Our Baker */
    .helper-individual-index{
        padding:20px 15px;
    }

    .all-helper-info-index{
        margin: auto;
        width: 1300px;
        display: flex;
    }
    /* End Our Baker */
}
/*---------------------------------------------------------------------------------------------*/
/*END MEDIA QUERY FOR INDEX.HTML*/
/*---------------------------------------------------------------------------------------------*/


/*--------------------------------------------------------------------------*/
/*Start About Us Page*/
/*--------------------------------------------------------------------------*/

/* Start About Us Header */
.about-us-header .banner{
    background:linear-gradient(rgba(6, 0, 85, 0.3), rgba(6, 0, 85, 0.3)), url("./Assets/images/4.aboutus/Banner.jpg");
    padding-bottom: 150px;
    background-position: center;
    background-size: cover;
}

.about-us-header .about-us-subtitle{
    text-align: center;
    font-size: 50px;
    padding-top: 20px;
    padding-bottom: 60px;
    color:#FF7380FF;
}
/*End About Us Header*/


/* Start Baker Info */
.baker-info-group{
    text-align: center;
    padding-bottom: 50px;
}

.baker-info-group .baker-info-title span{
    font-size: 25px;
    font-family: Courgette;
    color:#FF7380FF;
}

.baker-info-group .baker-name{
    font-size: 40px;
    padding-top: 15px;
}

.baker-info-group .baker-description{
    padding: 0px 40px;
    padding-bottom: 15px;
}

.baker-signature{
    margin:auto;
    width: 150px;
    padding-bottom: 25px;
}

.baker-signature .signature-photo{
    background-image: url("./Assets/images/4.aboutus/Baker_Signature.png");
    padding-bottom: 50%;
    background-size:contain;
    background-repeat: no-repeat;
}

.baker-info-group .baker-position{
    padding-bottom: 20px;
}

.baker-info-group .baker-position span{
    font-size: 20px;
    font-family: Courgette;
    color:#FF7380FF;
}

.baker-photo-group .baker-photo{
    background-image: url("./Assets/images/4.aboutus/Baker.png");
    padding-bottom: 100%;
    background-size: cover;
}
/* End Baker Info */


/* Start Award Section */
.award-section{
    background-color: #F4F3EFFF;
    padding-top: 50px;
    padding-bottom: 80px;
    margin-top: -80px;
}

.award-section .subtitle h2{
    margin: 0;
    color:black;
}

.award-title{
    text-align: center;
    padding-bottom: 15px;
    color:#FF7380FF;
}

.award-title span{
    font-size: 25px;
    font-family: Courgette;
}

.badge-photo-group{
    margin: auto;
    width: 350px;
    padding-top: 25px;
    padding-bottom: 15px;
}

.badge1 .badge-photo{
    background-image: url("./Assets/images/4.aboutus/Badge1.png");
}

.badge2 .badge-photo{
    background-image: url("./Assets/images/4.aboutus/Badge2.png");
}

.badge3 .badge-photo{
    background-image: url("./Assets/images/4.aboutus/Badge3.png");
}

.badge-photo{
    padding-bottom: 150px;
    background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.badge-info span{
    font-weight: bold;
    text-align: center;
    display: block;
}

.badge-info p{
    text-align: center;
}

.badge-info .badge-title{
    font-size: 25px;
}

.badge-info .badge-date{
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 20px;
    font-family: Courgette;
    color:#A593C2FF;
}

.badge-info .badge-description{
    font-size: 20px;
}
/* End Award Section */


/* Start Team Info */
.team-section{
    background:linear-gradient(rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)), url("./Assets/images/4.aboutus/CakePattern.jpg");
    background-position: center;
    background-size:cover;
    text-align: center;
    padding-top: 50px;
    padding-bottom: 60px;
}

.team-section .subtitle h2{
    margin: 0;
    color: black;
}

.team-section .team-title{
    padding-bottom: 15px;
    font-size:25px;
}

.team-section .team-title span{
    font-family: Courgette;
    color:#FF7380FF;
}

.helper0 .helper-pic{
    background-image: url("./Assets/images/1.index/Baker.png");
    padding-bottom: 100%;
    background-size: cover;
}

.helper1 .helper-pic{
    background-image: url("./Assets/images/4.aboutus/Helper1.jpg");
    padding-bottom: 100%;
    background-size: cover;
}

.helper2 .helper-pic{
    background-image: url("./Assets/images/4.aboutus/Helper2.jpg");
    padding-bottom: 100%;
    background-size: cover;
}

.helper-group{
    background-color: white;
    padding-bottom: 25px;
}

.helper-individual{
    padding-top: 50px;
}

.helper-more-about{
    padding-top: 15px;
}

.helper-more-about .name{
    font-size: 20px;
}

.helper-more-about .description{
    font-size: 20px;
}


.helper-more-about .hierarchy{
    font-size: 20px;
    color: #FF7380FF;
}

.helper-social-media .social-media a{
    text-decoration: none;
    color: black;
}

.helper-social-media .social-media span{
    display: inline;
    letter-spacing: 8px;
    font-size: 25px;
}
/* End Team Info */


/*---------------------------------------------------------------------------------------------*/
/*START MEDIA QUERY FOR ABOUTUS.HTML*/
/*---------------------------------------------------------------------------------------------*/

@media only screen and (min-width: 1200px){
    /* Start About Us Header */
    .about-us-header .banner{
        padding-bottom: 300px;
    }
    /* End About Us Header */


    /* Start Baker Info */
    .baker-info-group{
        padding-bottom: 0px;
    }

    .baker-info-container{
        display: flex;
    }

    .baker-info-text{
        padding: 0 80px;
        width: 800px;
    }

    .baker-photo-group{
        float: right;
        width: 500px;
    }

    .baker-info-group .baker-info-title span{
        font-size: 25px;
        font-family: Courgette;
        color:#FF7380FF;
    }

    .baker-info-group .baker-name{
        font-size: 40px;
        padding-top: 15px;
    }

    .baker-info-group .baker-description{
        padding: 0px 40px;
        padding-bottom: 15px;
    }

    .baker-signature{
        width: 150px;
        padding-bottom: 25px;
    }

    .baker-signature .signature-photo{
        background-image: url("./Assets/images/4.aboutus/Baker_Signature.png");
        padding-bottom: 50%;
        background-size:contain;
        background-repeat: no-repeat;
    }

    .baker-info-group .baker-position{
        padding-bottom: 20px;
    }

    .baker-info-group .baker-position span{
        font-size: 20px;
        font-family: Courgette;
        color:#FF7380FF;
    }

    .baker-photo-group .baker-photo{
        background-image: url("./Assets/images/4.aboutus/Baker_Transparent.png");
        padding-bottom: 100%;
        background-size: 500px;
        background-size: cover;
    }
    /* End Baker Info */


    /* Start Award Section */
    .award-section{
        background-color: #F4F3EFFF;
        padding-top: 50px;
        padding-bottom: 80px;
        margin-top: 0px;
    }

    .award-title{
        text-align: center;
        color:#FF7380FF;
    }

    .award-title span{
        font-size: 25px;
        font-family: Courgette;
    }

    .badge-photo-group{
        width: 350px;
        padding-top: 25px;
        padding-bottom: 15px;
    }

    .badge1 .badge-photo{
        background-image: url("./Assets/images/4.aboutus/Badge1.png");
    }

    .badge2 .badge-photo{
        background-image: url("./Assets/images/4.aboutus/Badge2.png");
    }

    .badge3 .badge-photo{
        background-image: url("./Assets/images/4.aboutus/Badge3.png");
    }

    .badge-photo{
        padding-bottom: 150px;
        background-position: center;
        background-size:contain;
        background-repeat: no-repeat;
    }

    .badge-info span{
        font-weight: bold;
        text-align: center;
        display: block;
    }

    .badge-info p{
        text-align: center;
    }

    .badge-info .badge-title{
        font-size: 25px;
    }

    .badge-info .badge-date{
        padding-top: 15px;
        padding-bottom: 15px;
        font-size: 20px;
        font-family: Courgette;
        color:#A593C2FF;
    }

    .badge-info .badge-description{
        font-size: 20px;
    }
    /* End Award Section */


    /* Start Award Section */
    .award-badge-container{
        display:flex;
    }
    /* End Award Section */


    /* Start Team Info */
    .team-section{
        background:linear-gradient(rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)), url("./Assets/images/4.aboutus/CakePattern.jpg");
        background-position: center;
        background-size:cover;
        text-align: center;
        padding-top: 50px;
        padding-bottom: 60px;
    }

    .team-section .team-subtitle{
        font-size: 40px;
    }

    .team-section .team-title{
        padding-bottom: 15px;
        font-size:25px;
    }

    .team-section .team-title span{
        font-family: Courgette;
        color:#FF7380FF;
    }

    .all-helper-info{
        margin: auto;
        width: 1000px;
        display: flex;
    }

    .helper1 .helper-pic{
        background-image: url("./Assets/images/4.aboutus/Helper1.jpg");
        padding-bottom: 100%;
        background-size: cover;
    }

    .helper2 .helper-pic{
        background-image: url("./Assets/images/4.aboutus/Helper2.jpg");
        padding-bottom: 100%;
        background-size: cover;
    }

    .helper-group{
        width: 400px;
        background-color: white;
        padding-bottom: 25px;
    }

    .helper-individual{
        padding:20px 50px;
    }

    .helper-more-about{
        padding-top: 15px;
    }

    .helper-more-about .name{
        font-size: 20px;
    }

    .helper-more-about .description{
        font-size: 20px;
    }


    .helper-more-about .hierarchy{
        font-size: 20px;
        color: #FF7380FF;
    }

    .helper-social-media .social-media a{
        text-decoration: none;
        color: black;
    }

    .helper-social-media .social-media span{
        display: inline;
        letter-spacing: 8px;
        font-size: 25px;
    }
    /* End Team Info */

}

/*---------------------------------------------------------------------------------------------*/
/*END MEDIA QUERY FOR ABOUTUS.HTML*/
/*---------------------------------------------------------------------------------------------*/


/*--------------------------------------------------------------------------*/
/*Start Contact Us Page*/
/*--------------------------------------------------------------------------*/

/* Start Banner */
.contact-us-header .banner{
    background:linear-gradient(rgba(6, 0, 85, 0.3), rgba(6, 0, 85, 0.3)), url("./Assets/images/5.contactus/Banner.jpg");
    padding-bottom: 150px;
    background-position: bottom;
    background-size: cover;
}
/* End Banner */

/*--------------------------------------------------------------------------*/
/*End Contact Us Page*/
/*--------------------------------------------------------------------------*/


/*---------------------------------------------------------------------------------------------*/
/*START MEDIA QUERY FOR CONTACTUS.HTML*/
/*---------------------------------------------------------------------------------------------*/

@media only screen and (min-width: 1200px){

    .contact-us-header .banner{
        padding-bottom: 300px;

    }
}

/*---------------------------------------------------------------------------------------------*/
/*END MEDIA QUERY FOR CONTACTUS.HTML*/
/*---------------------------------------------------------------------------------------------*/