body {
    
}

.smartnoter-gif {
    width: 80%
    
}

p{
	font-weight: 500;
}

.youtube-video{

     height:700px;
}

.smartnoter-banner{
    width: 94%;
    height: auto;
    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.66);
/*    border-radius: 28px !important;*/
}

.intro-div{
border-radius: 31px;
box-shadow: 0px 0px 29px rgba(0, 0, 0, 0.16);
}

.img-shadow{
    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.66);
    width: 100%;
    border-radius: 58px !important;
}

.stn-header-large{
    font-size: 40px;
    font-weight: 700;
    text-align: center;
}

.stn-paragraph{
    font-size: 20px;
    font-weight: 500;
    text-align: center;
}

.gene-profile-pic{
    width: 78%; 
    height: auto;
    box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.54);
}

.lrn-img-pic{
    width: 86%; 
    height: auto;
    box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.54);
}

.offer-img-style {
    position: absolute;
    left: 60px;
}


.div-text-align{
    position: absolute;
    color: white;
    font-size: 30px;
    font-weight: 600;
}

.div-box1{
    top: 130px;
    left: 58px;
    
}

.div-box2{
    top: 90px;
    left: 44px;    
}

.div-box3{
    top: 90px;
    left: 44px;    
}

.div-box2-pic {
    width: 100px; 
    left: 97px;
}

.div-box3-pic {
    width: 125px;
    left: 104px;
    top: 9px;
}

.div-box4-pic {
    width: 150px;
    left: 60px;
}

.learnmore-btn {
    background: white;
    font-weight: 600;
    font-size: 20px
}

.div-btn-align{
    position: absolute;
    top: 208px;
    left: 60px;
    padding: 10px 30px;
}

.div-btn-align-learnmore{
    position: absolute;
    top: 178px;
    left: 34px;
    padding: 10px 30px;
    font-size: 30px
}

.convergent-div-invitation{
/*    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.66);*/
    border-radius: 12px !important;
    background: #ffa5001f;
}

.con-div-sub-div{
    font-size: 20px;
    text-align: right;
}

.con-div-heading{
   font-size: 25px;
/*   border-bottom: 1px solid black;*/
    font-weight: 600;
}


.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
/*    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.66);*/
    padding: 0;
}

a {
    color: white;
}


.alink-style, .alink-style:hover{ 
    color: black !important;
    text-decoration: none !important;

}

.lrn-img-shadow{
    width: 100%;
}


.lrn-div{
    
}


/* cookies style here */
    .cookie-banner {
    position: fixed;
    bottom: 30px;
    left: 10%;
    right: 10%;
    width: 80%;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #ffdf43;
    border-radius: 5px;
    box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.2);
    font-weight: 500;
        color:black;
    }

    .close {
/*      height: 20px;*/
      background-color: #777;
      border: none;
      color: white;
      border-radius: 2px;
      cursor: pointer;
        float: right ;
        font-size: 1.5rem;
        font-weight: 800;
        line-height: 1;
        color: #000 !important;
        text-shadow: 0 1px 0 #fff;
        opacity: 1 !important;
    }


/* cookes style ends here */

.pointer {
    cursor: pointer;
}

button:focus {
    outline: 0px auto -webkit-focus-ring-color !important;
}

p{
    text-align: justify;
}

.footer{
/*    position: absolute;*/
    bottom: 0;
    width: 100%;
    height: 60px;
    line-height: 60px;
    background-color: black; 
    box-shadow: 0px 0px 29px rgba(0, 0, 0, 0.16);
    
}

@media only screen and (min-device-width: 900px) and (max-device-width: 1024px) {
    
    .offer-img-style {
        position: absolute;
        left: 116px;
    }
    
    
}


@media only screen and (min-device-width: 320px) and (max-device-width: 800px) {
    
    .smartnoter-banner{
        width: 100%; 
        height: auto;
    }
    .stn-header-large{
        font-size: 1.8rem;
        font-weight: 700;
        text-align: center;
    }

    .img-shadow {
        box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.66);
        width: 100%;
/*        border-radius: 72px !important;*/
    }
    
     .offer-img-style {
        position: absolute;
        left: 83px;
    }
        .smartnoter-banner{
    width: 94%;
    height: auto;
    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.66);
    border-radius: 20px !important;
    }
    
    .smartnoter-gif {
    width: 40%

    }
    
    .lrn-div{
        padding: 3px;
       
    }
    
    .youtube-video{   
        height: 56vw;
    }
    
        .copyrights{
            text-align: center;
            font-size: 12px;
    }
    
    .footer{
        height: auto;
    }
 
}

@media only screen and (min-width: 411px) and (min-height: 731px) {
    .offer-img-style {
        position: absolute;
        left: 100px;
    }
    
    .div-box1 {
        top: 158px;
        left: 83px;
    }
    .div-btn-align {
        position: absolute;
        top: 260px;
        left: 91px;
        padding: 10px 30px;
}
    .div-box2-pic {
        width: 100px;
        left: 133px;
        top: 9px;
      }
    
    .div-box2 {
        top: 123px;
        left: 32px;
      }
    .div-box3-pic {
        width: 130px;
        left: 112px;
        top: 9px;
      }
        .div-box3 {
        top: 126px;
        left: 73px;
      }
    .div-box4-pic {
        width: 225px;
        left: 57px;
    }
    .con-div-sub-div {
        font-size: 20px;
        text-align: center;
    }
}

@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: portrait) {
    .offer-img-style {
        position: absolute;
        left: 76px;
    }
    .smartnoter-banner{
        width: 100%;
        height: auto;
        box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.66);
        border-radius: 10px !important;
    }
    .smartnoter-gif {
        width: 40%

    }
      
    .div-text-align {
        position: absolute;
        color: #fff;
        font-size: 30px;
        font-weight: 600;
      }

    .div-box1 {
        top: 146px;
        left: 63px;
    }
      
      .div-btn-align{
        position: absolute;
        top: 221px;
        left: 67px;
        padding: 10px 30px;
      }
      
      .div-box2-pic {
        width: 100px;
        left: 104px;
        top: 9px;
      }
      
      .div-box2 {
        top: 107px;
        left: 48px;
      }
      
      .div-box3-pic {
        width: 125px;
        left: 88px;
        top: 9px;
      }
      .div-box3 {
        top: 106px;
        left: 48px;
    }
      .div-box4-pic {
        width: 197px;
        left: 49px;
    }
      .con-div-sub-div {
        font-size: 20px;
        text-align: center;
    }
      .con-div-sub-div-btn {
        margin-left: auto !important;
        margin-right: auto !important;
      }
}


@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {
      
      .offer-img-style {
        position: absolute;
        left: 63px;
    }
      
      .smartnoter-gif {
        width: 87%;

    }

}

@media only screen 
  and (min-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) {
      
     .offer-img-style {
        position: absolute;
        left: 117px;
    } 
    .youtube-video{
    height: 53vw;
    height:700px;
}

}

@media only screen 
    and (min-device-width: 1200px)  { 
        
        .offer-img-style {
        position: absolute;
        left: 58px;
        width: 100px;
      
        
        }
}
        
@media only screen 
    and (min-device-width: 1366px)  { 
        
        .offer-img-style {
        position: absolute;
        left: 75px;
        width: 100px;
        
        
}
.youtube-video{
    height: 53vw;
     height:700px;
}
}
    
@media only screen 
    and (min-device-width: 1400px)  and (max-width: 1920px) {
        
       .offer-img-style {
            position: absolute;
            left: 80px;
            width: 125px;
        
        
        }
        .div-btn-align {
            position: absolute;
            top: 260px;
            left: 91px;
            padding: 10px 30px;
    }
        
        .smartnoter-banner{
            width: 94%;
            height: auto;
            box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.66);
            border-radius: 28px !important;
}
        .backbutton{
            position: absolute
        }
        
        .copyrights{
            float: right;
            text-align: right
        }
         .youtube-video{   
            height: 56vw;
        }
}

/*

@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) {
      
      .div-box1 {
        top: 150px;
        left: 68px;
}
      
      .con-div-sub-div {
        font-size: 20px;
        text-align: center;
}
      
      .div-btn-align {
        position: absolute;
        top: 216px;
        left: 72px;
        padding: 10px 30px;
}
      
      .div-box2-pic {
        width: 100px;
        left: 115px;
        top: 10px;
}
      
      .div-box2 {
       top: 106px;
        left: 54px;
}
      
      .div-box3-pic {
        width: 125px;
        left: 95px;
        top: 10px;
}
      
      .div-box3 {
        top: 108px;
        left: 60px;
}
      
      .div-box4-pic {
        width: 205px;
        left: 50px;
}     

}
*/




@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 

}