﻿*{
    margin:0;
    padding:0;
    font-family:'Josefin Sans' , sans-serif;
}

section{
    display:flex;
    position:absolute;
    z-index:4;
}

/* Section 1 */

.section1{
    width:27vw;
    margin-right:2%;
    margin-left:5%;
}

.logo{
    width:23vw;
    height:20vh;
}

.navigation{
    margin-top:2vh;
    width:100%;
    height:7vh;
    background-color:#19e5e5;
    border-radius:6px;
    display:flex;
    align-items:center;
}

.toggle{
    height:5vh;
    width:2vw;
    margin-left:3%;
}
.cgr{
    margin-left:3%;
}

.submenu{
    background-color:#ececfa;
    display:block;
    padding:4% 4%;
    border-bottom:1px solid #a7a7ad;
    padding-left:4%;
}

.submenu:hover{
    cursor:pointer;
    background-color:#ffffff;
}

.section1 .para1{
    padding:4% 4%;
    background-color:#ececfa;
    margin-top:10%;
    margin-bottom:2%;
}

.section1 .Special fieldset{
    background-color:#ececfa;
    border:1px solid #afafaf;
    margin-top:10%;
    height:23vh;
}

.section1 .Special .img1{
    width:5vw;
    height:17vh;
    padding-top:7%;
    padding-left:3%;
}

.section1 .Special .div1{
    display:inline-block;
    margin-left:5%;
}

.section1 .Special .div2{
    position:absolute;
    display:inline-block;
    margin-left:1%;
    width:10%;
    height:15%;
}

.Special h3{
    margin-bottom:2%;
    margin-top:7%;
    color:#04bfbf;
}
.Special strike{
    font-size:1vw;
    padding-left:4%;
}

.section1 .Special fieldset:nth-child(2) .img1{
    height:18vh;
    width:6vw;
    padding-left:3%;
}

.section1 .Special fieldset:nth-child(3) .img1{
    height:14vh;
    width:5vw;
    padding-left:3%;
}

.section1 .Special fieldset:nth-child(4) .img1{
    height:12vh;
    width:5vw;
}

.background{
    position:absolute;
    right:0;left:0;bottom:0;top:0;
    z-index:2;
    width:100vw;
    height:30vh;
    background-color:#ececfa;
}

/* ********* */


/* Section 2 */

.section2{
    width:68vw;
    display:inline-block;
}

.txtsrch{
    margin-left:18%;
    margin-top:5%;
    width:23vw;
    height:5vh;
    border:1px ridge #d5d5e6;
}

.txtsrch[placeholder]{
    padding-left:1%;
}

.btnsrch{
    width:5vw;
    height:5vh;
    background-color:#19e5e5;
    border:0px;
}

.call-icon{
    height:4.5vh;
    margin-left:12%;

}

.tel-no{
    font-size:1.5vw;
    font-family:fantasy;
}

nav{
    margin-top:10vh;
    width:100%;
    height:2%;
    background-color:white;
    border-radius:6px;
    display:flex;
    justify-content:center;
    align-items:center;
}

.menuitem{
    margin-top:1vh;
    padding:3% 3% 3% 3%;
    text-decoration:none;
    background-color:black;
    color:white;
    font-family:'Lobster Two';
    font-size:1.5vw;
    box-shadow:10px 15px 50px black;
}

.menuitem:hover{
    background-color:#1d9550;
    box-shadow:none;
}

.slider
{
    background-color:#ececfa;
    width:68vw;
    height:52vh;
    overflow:hidden;
    margin-top:7vh;
}

.slider .slides{
    width:200vw;
    height:52vh;
    display:flex;
}

.slide1{
    width:68vw;
    height:52vh;
}

.slide1 .img1{
    width:33vw;
    height:38vh;
    display:inline-block;
    margin-top:4%;
}
.slide1 .img2{
    width:38vw;
    height:50vh;
}
.slide1 .img3{
    width:38vw;
    height:52vh;
}

.constant{
    position:absolute;
    width:26vw;
    height:52vh;
    margin-left:36vw;
}
.constant h1{
    margin-top:10vh;
    color:#19e5e5;
}
.constant p{
    font-family:'Pacifico';
    margin-top:3vh;
    margin-bottom:3vh;
}

.constant .btnshopnow{
    padding:4%;
    color:white;
    background-color:#313030;
    border-radius:10px;
}

.content1{
    width:100%;
    height:30vh;
    margin-top:5vh;
    display:flex;
}

.content1 .inner1{
    width:50%;
    height:100%;
    text-align:right;
    border:1px solid #afafaf;
}
.content1 .inner1 .img1{
    width:20vw;
    height:35vh;
}
.content1 .inner2{
    width:50%;
    height:100%;
    text-align:right;
    border:1px solid #afafaf;
    border-left:none;
}

.content1 .inner2 .img2{
    width:15vw;
    height:35vh;
}

.innertitle1{
    position:absolute;
    width:16vw;
    height:30%;
    text-align:center;
    margin-left:1%;
}
.innertitle2{
    position:absolute;
    width:20vw;
    height:30%;
    margin-left:38%;
    text-align:center;
}

.innertitle1 , .innertitle2{
    margin-top:2%;
}

.content1 h3{
    color:#04bfbf;
}
.content1 .para1{
    font-family:'Pacifico';
}

.featuredpara{
    margin-top:7vh;
    margin-bottom:3vh;
    padding:2vh 66vw 1vw 4vh;
    background-color:#ececfa;
}

.products{
    width:68vw;
    height:58vh;
    display:flex;
}

.products fieldset{
    width:20vw;
    padding-left:2vw;
    padding-right:2vw;
    padding-top:4vh;
    border:1px solid #afafaf;
}

legend{
    padding:2% 2% 1% 2%;
    background-color:black;
    color:white;
}

.products .col1 , .col2 {
    margin-right:1vw;
}

.products .col1 .img1{
    width:17vw;
    height:20vh;
}
.products .col2 .img1{
    width:11vw;
    height:20vh;
    padding-left:14%;
}

.products .col3 .img1{
    width:13vw;
    height:20vh;
    padding-left:5%;
}

.products h3{
    padding-top:5vh;
    color:#04bfbf;
}
.products strike{
    font-size:1vw;
    padding-left:3%;
}

.footer{
    bottom:0px;
    width:100vw;
    height:30vh;
    padding-top:166%;
}

.footer .outer{
    background-color:#ececfa;
    width:100vw;
    height:40vh;
    display:flex;
    align-items:center;
}

.footer .inner{
    width:20%;
    height:50%;
    display:inline-block;
    margin-left:8%;
    border-right:1px solid #afafaf;
}

.footer .inner2{
    width:20%;
    height:50%;
    display:inline-block;
    margin-left:3%;
    border-right:1px solid #afafaf;

}

.footer a{
    display:block;
    padding:2%;
    color:#04bfbf;
}

.footer .copyright{
    background-color:#ececfa;
}

.footer .copyright span{
    margin-left:8vw;
}


/* ********* */