*{
    margin:0px;
    padding:0px;
}

body{
    width:100%;
    height: 100%;
    background-color: #F6F1F1;
    cursor:none;
}


ul{
    list-style-type: none;
    padding:0px;
    margin:0px;
}
#logo{
    width:10%;
    margin:1rem;
}

.cursor-inner{
    position: fixed;
    width:20px;
    height:20px;
    margin-left: -10px;
    margin-top: -10px;
    border-radius:50%;
    background:#353434;
    pointer-events: none;
    z-index:1000;
    opacity:0.6;
  } 

  
.cursor{
    position:fixed;
    width:40px;
    height:40px;
    margin-left: -20px;
    margin-top: -20px;
    border-radius:50%;
    border: 2px solid #c6c7ec;
    transition: transform .2s ease; 
    transition: all 0.1s ease; 
    transform-origin: center center;
    pointer-events: none;
    z-index:1000;
    background-color:#0e141a82;
    opacity:0.6;
}

.downloadBrochure{
    pointer-events: none;
}

.navbar{
    z-index:0;
    box-shadow:20px 5px 40px #146C94;
    background-color:#AFD3E2 ;
    padding:0.5rem 0px 0.5rem 0px !important;
}
.navbar-brand{
    width:70%;
}
.logo{
    width:18%;
}

#sections{
    margin-top:10rem;
}
.main-button{
    background: linear-gradient(to left, #146C94 50%, rgb(166, 1, 1) 50%) right;
    background-size: 200% 100%;
    background-position: right bottom;
    transition: all .5s ease-out;
    border:none;
    padding:0.6rem 2rem 0.6rem 2rem ;
    font-size:1.5rem;
    border-radius:0.5rem;
    margin:1rem 1rem 1rem 1rem !important;
    color:white;
}

.btn{
    cursor:none;
}
.main-button:hover{
    background-position: left bottom;
    color:white !important;
}

h1{
    text-align: center;
    letter-spacing: 0.5rem;
    word-spacing: 0.5rem;
    color:#19A7CE;
}

#prod_img{
    width:20%;
}

.gallery_img{
    width:30%;
}

.prod_desc{
    font-size:1.4rem;
    text-align: justify;
}

 
 #sections>li{
     background-color: #F6F1F1;
     color:#040521;
 }  

.gallery_img{
    border-radius:0.5rem;
    box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
    margin:1rem;
}

.points>li{
    font-size:1.3rem;
}
 @media only screen and (max-width: 1224px) {
    #logo{
        width:34%;
    }

    .points{
        width:95% !important;
    }
    #prod_img{
        width:60%;
    }
    #subSection1{
        flex-wrap: wrap;
    }
    .main-button{
        font-size: 1rem;
    }
    .gallery_img{
        width:100%;
        margin:1rem;
    }
    .logo{
        width:30%;
    }
 }

 @media only screen and (max-width: 1224px) {
    .main-button{
        font-size:0.9rem;
    }
    #sections{
        margin-top:5rem;
    }
    .prod_desc, .points>li{
        font-size:1rem !important;
    }
    .logo{
        width:50%;
    }
 }
