html, body{
    margin: 0;
    padding: 5 8 0 8px;
}
.navigation{
    /* width: 100vw; */
    overflow: hidden;
    background-color: black;
    /* height: 100px; */
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 20px;
    padding-bottom: 20px;
}
.sticky {
    position: sticky;
    top: 0;
    width: 100%;
  }
.content{
    display: flex;
    flex-direction: column;
    align-items: center;
    /* width: 70vw; */
    background-color: rgb(255, 255, 255);
    height: fit-content;
    margin-top: 0px;
    padding: 8 10 5 10px;
    background: linear-gradient(0deg, black, white);
}
.Header {
    display: flex;
    align-items: center;
    flex-direction: column;
}
.Header h1 {
    font-family: 'Kalam';
    margin-bottom: -15px;
    font-size: 60px;
    margin-top: 50px;
}
.Header p {
    font-family: 'Ysabeau';
    margin-bottom: 20px;
    margin-top: 7px;
    font-size: 25px;
    font-weight: 600;
}
.footer{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    /* width: 70vw; */
    background-color: rgb(15, 15, 7);
    height: fit-content;
    padding: 8 10 5 10px;
    color: azure;
    max-width: 100vw;
    margin-top: -10px;
}
.margins{
    margin: auto;
}
.max-width1{
    max-width: 100vw;
}
.max-width2{
    max-width: 80vw;
}
.lcont {
    display: flex;
    align-items: center;
    margin-left: 10vw;
    color: aliceblue;
}
.lcont span{
    font-family: 'Dancing Script';
    font-size: 45px;
}
.lcont ul{
    font-weight: bold;
    list-style: none;
    display: flex;
    font-family: 'Ysabeau';
    font-size: 25px;
}
.lcont ul li{
    margin: 0 20px;
}
.lcont ul li a{
    text-decoration: none;
    color: aliceblue;
}
.lcont ul li a:hover{
    color: gray;
}
.rcont{
    margin-right: 10vw;
}
.btn{
    border-radius: 5px;
    width: 65x;
    height: 25px;
    color: black;
    border-color: whitesmoke;
    transition: transform 200ms;
}
.btn:hover{
    transform: scale(1.02);
    background-color: #e09456;
}
#search{
    width: 200px;
    height: 25px;
    border-radius: 15px;
}
.main-content{
    max-width: 80vw;
    display: flex;
    flex-direction: column;
    margin-left: 0px;
    margin-right:0px;
    font-family: 'Ysabeau';
}
.cont1{
    display: flex;
    flex-direction: row;
    background-color: rgb(244, 238, 210);
    background: linear-gradient(45deg, #f7f77c, #ced4d4);
    border-radius: 10px;
}
.cont2{
    display: flex;
    flex-direction: row;
    background-color: black;
    background: linear-gradient(180deg, rgb(86, 83, 83), rgb(193, 214, 220));
    border-radius: 10px;
    margin-top: 15px;
    color: aliceblue;
}
.cont3{
    display: flex;
    flex-direction: column;
    background-color: rgb(113, 0, 88);
    background: linear-gradient(120deg, rgb(159, 4, 4), rgb(248, 145, 197));
    border-radius: 10px;
    margin-top: 15px;
    color: aliceblue;
}
.cont4{
    display: flex;
    flex-direction: column;
    background-color: navy;
    background: linear-gradient(0deg, #10006c, #4ed6ed);
    border-radius: 10px;
    margin-top: 15px;
    color: aliceblue;
    font-family: 'Ysabeau';
    font-size: 30px;
    font-weight:600;
    text-align: justify;
    padding-left: 20px;
    padding-right: 20px;
}
.cont1-l{
    display: flex;
    margin: 20px;
    justify-content: space-around;
    flex-direction: column;
    font-size: 30px;
    font-weight: 600;
}
.cont2-r{
    display: flex;
    margin: 20px;
    justify-content: space-around;
    flex-direction: column;
    font-size: 30px;
    font-weight: 600;
    margin-top: -11px;
}
.cont3-u{
    display: flex;
    margin: 20px;
    justify-content: space-around;
    flex-direction: column;
    font-size: 30px;
    font-weight: 600;
    margin-top: -11px;
}
.cont3-d{
    display: flex;
    margin: 20px;
    justify-content: space-around;
    flex-direction: column;
    margin-top: -11px;
}
.l{
    display: flex;
    flex-direction: row;
}
.l1, .l2, .l3{
    margin-right: 5px;
    margin-left: -8px;
}
.l1 img{
    margin-right: 5px;
    border-radius: 5px;
}
.l2 img{
    margin-right: 5px;
    border-radius: 5px;
}
.l3 img{
    border-radius: 5px;
}
.left{
    display: flex;
    margin-left: 10vw;
    justify-content: space-around;
    flex-direction: column;
    font-size: 20px;
}
.right{
    display: flex;
    margin-left: 10vw;
    justify-content: space-around;
    flex-direction: column;
    font-size: 20px;
}
.left ul{
    list-style-type: none;
    padding-left: 7px;
    padding-top: 0px;
    margin-top: -8px;
}
.left span{
    text-align: center;
}
.cont1-l p{
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 8px;
    padding-right: 6px;
    align-content: space-around;
    margin-bottom: 17px;
    margin-top: -4px;
}
.cont2-r p{
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 8px;
    padding-right: 6px;
    align-content: space-around;
    margin-bottom: 17px;
    margin-top: -4px;
}
.cont2-r h3{
    text-align: center;
    margin-bottom: 13px;
    font-size: 35px;
}
.cont3-u h3{
    text-align: center;
    margin-bottom: 13px;
    font-size: 35px;
}
.cont3-u p{
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 8px;
    padding-right: 6px;
    align-content: space-around;
    margin-bottom: 17px;
    margin-top: -4px;
    font-size: 30px;
}
.cont1-r img{
    border-radius: 10px;
    height: 400px;
}
.cont2-l img{
    border-radius: 10px;
    margin-top: 50px;
    margin-bottom: 30px;
}
.cont4 h3{
    text-align: center;
    margin-bottom: 13px;
    font-size: 35px;
}
.cont4 p{
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 8px;
    padding-right: 6px;
    align-content: space-around;
    margin-bottom: 17px;
    margin-top: -4px;
    font-size: 30px;
}
.cont4 a{
    text-decoration: none;
    color: aliceblue;
}
.cont4 ul{
    list-style:square;
}
.cont4 a:hover{
    color: red;
}
.bn{
    display: flex;
    align-items: center;
}
.dnld{
    height: 55px;
    width: 180px;
    background: linear-gradient(0deg, rgb(255, 128, 0), rgb(224, 171, 111));
    color: #ffffff;
    border-radius: 10px;
    transition: transform 250ms;
    font-family: 'Ysabeau';
    font-size: 25px;
    font-weight: 400;
}
.dnld:hover{
    transform: translateY(-5px);
}
.cont4 h4{
    font-family: 'Kalam';
}
.icons{
    display: flex;
    flex-direction: column;
    color: #ffffff;
    align-items: center;
}
.icons h2{
    margin-right: 75px;
    font-family: 'Dancing Script';
    font-size: 40px;
    margin-bottom: 0px;
}
.icons ul{
    list-style: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    margin-right: 10vw;
    padding-right: 10px;
}
.icons ul li{
    padding: 15px;
}
.icons ul li a{
    color: white;
}
.icons ul li a:hover{
    color: rgb(154, 7, 154);
}
.mid{
    display: flex;
    flex-direction: row;
    align-items: center;
}
.mid h4{
    margin-left: 15px;
    margin-bottom: 45px;
    margin-right: -125px;
    font-size: 30px;
    padding-left: 10px;
}
.mid img{
    height: 30px;
    width: 100px;
}