html, body{
    margin: 0;
    padding: 0;
    max-width: 100%;
    overflow-x: hidden;
    
   

}

html{
    position: relative;
    max-width: 100%;
}

.navbar{
    position: relative;
    z-index: 5;
}


.navbar-nav{
    display: flex;
    gap: 50px;
}




.img-logo{
    position: relative;
    left: 80px;
    top: 100px;
    padding-left: 60px;
   
    
   
    
}






h5{
    color: white;
}

.navbar-h6{
    font-size: 1.5rem;
}


.all-text{
    position: relative;
    
    
}


.logo-h3-text{
   
    font-family: "Indie Flower", cursive;
    font-weight: 400;
    font-style: normal;
    white-space: nowrap;

}

.h3-class{
    font-family: "Indie Flower", cursive;
    font-weight: 400;
    font-style: normal;
    font-size: 30pt;
    white-space: nowrap;
}

.paragraph-text{

    font-family: "Indie Flower", cursive;
    font-weight: 400;
    font-style: normal;
    font-size: 14pt;
    
   
   

}

.h1-text{
    font-family: "Indie Flower", cursive;
    font-weight: 400;
    font-style: normal;
    
    white-space: nowrap;
}

@media(max-width: 1200px){

    .img-logo{
        position: relative;
        margin-right: 50px;
    }
}



p{
  font-family: "Indie Flower", cursive;
  font-weight: 400;
  font-style: normal;
}


.lead{
    font-size: 25px;
    left: 50px;
}




.carousel-image{
    position: relative;
    left: 40px;
}




#section-1{
    height: 100vh;
    margin-bottom: 50px;
}

#section-2{
    height: 100vh;
    margin-bottom: 50px;
}

#section-3{
    height: 100vh;
    margin-bottom: 50px;
}

#section-4{
    height: 100vh;
    margin-bottom: 50px;
}

.animation{
    color: red;
}

.navbar-purple-1{
    background-color: #91AEFF;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    gap: 40px;
    

}

@media(min-width: 480px){

    .section-2{
        position: relative;
        top: 200px;
    }

}

.navbar-purple-2{
    background-color: #91AEFF;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    gap: 40px;
}

@media(min-width: 480px){

    .navbar-purple-2{
        position: relative;
        margin-top: 500px;
        
    }

}

.h1-text-hidden{
    position: relative;
    visibility: hidden;

    font-family: "Indie Flower", cursive;
    font-weight: 400;
    font-style: normal;

    white-space: nowrap;
}

.nav-bar-nav-gap{
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    gap: 40px;
}


.btn-custom-color{

    color: white;
    font-size: 20px;
    
}

.btn-custom-color:hover{
    background-color: #7A9CFC;
    color: white;
}

.btn-custom-color:focus{
    background-color: #7A9CFC;
    

}

.carousel-1{
    top: 100px;
}

.carousel-2{
    top: 100px;
}

.carousel-3{
    top: 100px;
}

.carousel-4{
    top: 100px;
}




.container-fotter{
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    align-content: center;
}

footer{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    background-color: black;
    color: white;
}

li{
    list-style: none;
}

.flex-txt-img{
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;

}

.footer-container{
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-content: center;
    align-items: center;
    gap: 70px;

}

.footer-svg{
    z-index: 6;
    position: relative;
    margin-left: -40px;
    width: 70px;
    height: 70px;
    filter: drop-shadow(-10px 10px 10px rgba(0,0,0,0.6));
    bottom: 20px;
    
    
    
   
}

.nav-size{
    width: 110px;
    height: 110px;
}

.footer-flex{
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
}

.footer-text{
    padding-top: 20px;
}

.paragraph-text-hidden{
    visibility: hidden;
}


@media(max-width: 1201px){
    .h1-text-hidden{
        position: relative;
        visibility: hidden;
    }
}

@media(min-width: 1200px){

    .all-text{
        position: relative;
        top: 300px;
    }

}




@media(min-width: 1280px) and (max-width: 1300px){

    .img-logo{
        position: relative;
        left: -0px;
        top: 40px;
    }

}



@media(min-width: 1023px) and (max-width: 1220px){
    .header-info{
        position: relative;
        right: 280px;
        bottom: 170px;
        width: 500px;
        height: 500px;
    }

    .img-logo{
        position: relative;
        left: 300px;
        top: 150px;
    }

    .paragraph-text{
        visibility: hidden;
    }

    .paragraph-text-hidden{
        position: relative;
        visibility: visible;
        bottom: 200px;
        white-space: nowrap;

    }
}

@media(min-width: 1024px) and (max-width: 1026px){
    #section-1{
        position: relative;
        margin-bottom: 500px;
    }

    #section-4{
        position: relative;
        margin-bottom: 400px;
    }

    .header-info{
        position: relative;
    }

    .header-info{
        position: relative;
        
    }
}

@media(min-width: 765px) and (max-width: 1000px){



    .img-logo{

        position: relative;
        left: 110px;

    }

    .navbar-nav{
        position: relative;
        font-size: 50pt;
    }

    #section-1{
        position: relative;
        margin-bottom: 800px;
    }

    .carousel-image{
        position: relative;
        left: 150px;
    }

    #section-5{
        position: relative;
        margin-top: 300px;
    }
}

@media(min-width: 600px) and (max-width: 620px){
    .navbar{
        gap: 0px;
    }

    .navbar-nav{
        position: relative;
        display: flex;
        gap: 10px;
    }
}


@media(min-width: 539px) and (max-width: 600px){

    #section-1{
        position: relative;
        margin-bottom: 800px;

    }

    .img-logo{
        position: relative;
        left: 85px;
    }

    .header-info{
        position: relative;
        bottom: 120px;
    }


    #section-2{
        position: relative;
        margin-bottom: 800px;
    }

    #section-3{
        position: relative;
        margin-bottom: 800px;
    }

    #section-4{
        position: relative;
        margin-bottom: 800px;
    }

    

    .footer-text{
        position: relative;
        left: 15px;
    }
    
   
}

/*galaxy tab s4*/

@media(min-width: 711px) and (max-width: 715px){

    #section-1{
        position: relative;
        height: 100vh;
        margin-bottom: 400px;
    }

    .carousel-image{
        position: relative;
        left: 80px;
    }

    




}

/*selveris phone*/

@media(min-width: 320px) and (max-width: 350px){

    .navbar-nav{
        position: relative;
        gap: 10px;
    }

    .img-logo{
        position: relative;
        left: 93px;
    }

    #section-1{
        position: relative;
        margin-bottom: 200px;
        height: 100vh;
        margin-bottom: 600px;
       
    }

    .header-info{
        position: relative;
        bottom: 180px;
        right: 20px;
        
    }

    .carousel-image{
        position: relative;
        left: 20px;
    }

    .h1-text{
        visibility: hidden;
    }

    .h1-text-hidden{
        position: relative;
        visibility: visible;
        bottom: 400px;
        

    }

    .paragraph-text{
        position: relative;
        top: 60px;
    }

    #section-2{
        position: relative;
        margin-bottom: 700px;
    }

    #section-3{
        position: relative;
        margin-bottom: 700px;
    }

    #section-4{
        position: relative;
        margin-bottom: 700px;
    }

    .footer-text{
        position: relative;
        left: 5px;
    }

    .footer-container{
        gap: 20px;
        left: 8px;
    }

    .footer-svg{
        width: 80px;
        height: 80px;
    }

}
/*LG optimus L70*/




@media(min-width: 360px) and (max-width: 400px){

    .paragraph-text{
        visibility: hidden;
    }

    .paragraph-text-hidden{
        position: relative;
        visibility: visible;
        bottom: 155px;
        right: 5px;
        
        
    }

    .img-logo{
        position: relative;
        left: 81px;
    }


    .h3-class{
        position: relative;
        right: 5px;
    }

    .h1-text{
        position: relative;
        right: 5px;
    }

    .header-info{
        position: relative;
        bottom: 70px;
    }

    .footer-text{
        position: relative;
        left: 15px;
    }

    .footer-svg{
        position: relative;
        left: 8px;
    }

    .navbar-nav{
        display: flex;
        gap: 15px;
    }

    #section-1{
        height: 100vh;
        margin-bottom: 560px;
    }

    #section-2{
        position: relative;
        margin-top: 100px;
        margin-bottom: 700px;

    }

    #section-3{
        position: relative;
        
        margin-bottom: 800px;
    }

    #section-4{
        position: relative;

        margin-bottom: 800px;
    }

    #section-5{
        position: relative;
        top: 200px;
        margin-top: 400px;
    }




    .all-text{
        position: relative;
        right: 15px;
    }
}

/*Nexus 10*/

@media(min-width: 799px) and (max-width: 820px){
    #section-1{
        margin-bottom: 500px;
    }
}

/*Microsoft Luminia*/

@media(min-width: 630px) and (max-width: 690px){
    #section-1{
        position: relative;
        margin-bottom: 1000px;
    }

    .header-info{
        position: relative;
        bottom: 230px;
    }

    .img-logo{
        position: relative;
        left: 190px;
        width: 40%;
        height: 40%;
    }

    #section-2{
        position: relative;
        margin-bottom: 1000px;
    }

    #section-3{
        position: relative;
        margin-bottom: 1000px;
    }

    #section-4{
        position: relative;
        margin-bottom: 1000px;
    }
}

/*Pixel 4*/

@media(min-width: 350px) and (max-width: 355px){

    .header-info{
        position: relative;
        right: 20px;
        bottom: 40px;
    }

    .h1-text{
        visibility: hidden;
    }

    .h1-text-hidden{
        visibility: visible;
        bottom: 380px;
    }

    .navbar-nav{
        position: relative;
        display: flex;
        gap: 10px;
    }

    .paragraph-text{
        position: relative;
        top: 40px;
    }

    #section-1{
        position: relative;
        margin-bottom: 500px;
        
    }

    #section-2{
        position: relative;
        margin-bottom: 500px;

    }

    #section-3{
        position: relative;
        margin-bottom: 500px;
    }

    #section-4{
        position: relative;
        margin-bottom: 500px;
    }

}





@media(min-width: 411px) and (max-width: 480px){

    #section-1{
        position: relative;
        margin-bottom: 500px;
    }


    .img-logo{
        position: relative;
        left: 70px;
    }
   
    .h1-text{
        position: relative;
        top: 6px;
    }

    .paragraph-text{
        position: relative;
        top: 13.5px;
    }

    .header-info{
        position: relative;
        bottom: 20px;
    }
    
    #section-5{
        position: relative;
        margin-top: 800px;
        
        bottom: 0px !important;
        
    }

    .navbar-nav{
        position: relative;
        gap: 10px;
    }


    .lead{
        position: relative;
        left: 5px;
    }


    .footer-container{
        position: relative;
        left: 10px;
    }
}

@media(min-width: 380px) and (max-width: 410px){

    .paragraph-text-hidden{
        position: relative;
        bottom: 120px;
    }

    .h1-text{
        position: relative;
        top: 3.5px;
    }


    #section-5{
        position: relative;
        bottom: 200px;
    }

    .lead{
        position: relative;
        left: 0px;
    }

    #section-1{
        position: relative;
        
        margin-bottom: 500px;
    }

    #section-2{
        position: relative;
        top: 100px;
        margin-bottom: 500px;
    }

    #section-3{
        position: relative;
        top: 100px;
        margin-bottom: 500px;
    }

    #section-4{
        position: relative;
        top: 100px;
        margin-bottom: 500px;
    }

    .img-logo{
        position: relative;
        left: 85px;
    }

    

    .footer-text{
        position: relative;
        left: 5px;
    }

    
}


@media(min-width: 279px) and (max-width: 290px){


    .header-info{
        position: relative;
        bottom: 50px;
    }

    .h1-text{
        position: relative;
        font-size: 20px;
    }

    .h3-class{
        position: relative;
        font-size: 30px;
    }

    .navbar-nav{
        display: flex;
        gap: 20px;
    }

    

    .img-logo{
        position: relative;
        left: 50px;
    }

    .carousel-image{
        position: relative;
        left: 20px;
    }

    .footer-text{
        position: relative;
        left: 10px;
    }

    #section-1{
        position: relative;
        margin-bottom: 500px;
    }

    #section-2{
        position: relative;
        margin-bottom: 600px;
    }

    #section-3{
        position: relative;
        margin-bottom: 600px;
    }

    #section-4{
        position: relative;
        margin-bottom: 600px;
    }

    #section-5{
        position: relative;
        bottom: 0px !important;
    }
    
    .footer-text{
        font-size: 10pt;
        
    }

    .footer-svg{
        width: 80px;
        height: 80px;
        
    }

    .footer-container{
        gap: 10px;
        left: 13px;
    }
}


/*JioPhone 2*/

@media(min-width: 230px) and (max-width: 250px){

    .navbar-nav{
        display: flex;
        gap: 10px;
        
    }

    .carousel-image{
        position: relative;
        left: 20px !important;
    }

    #section-1{
        position: relative;
        margin-bottom: 900px;
    }

    .header-info{
        position: relative;
        right: 20px;
        bottom: 200px;
    }

    .h1-text{
        visibility: hidden;
    }

    .h1-text-hidden{
        visibility: visible;
        font-size: 20pt;
        bottom: 500px;
    }

    .paragraph-text{
        position: relative;
        top: 40px;
    }

    #section-2{
        position: relative;
        margin-bottom: 800px;
    }

    #section-3{
        position: relative;
        margin-bottom: 800px;
    }

    #section-4{
        position: relative;
        margin-bottom: 800px;
    }

    .footer-svg{
        width: 87px;
        height: 87px;
    }
    
    .footer-container{
        position: relative;
        left: 10px;
    }

    .footer-text{
        position: relative;
        left: 5px;
    }

    


}


@media(min-width: 800px){
    #section-1{
        position: relative;
        margin-bottom: 50px;
    }
    #section-2{
        position: relative;
        margin-bottom: 650px;
    }
    #section-3{
        position: relative;
        margin-bottom: 650px;
    }
    #section-4{
        position: relative;
        margin-bottom: 650px;
    }
    
}


/*Kindle Fire HDX*/

@media(min-width: 799px) and (max-width: 801px){

    
    
    .navbar-nav{
        display: flex;
        gap: 10px;
    }
}

/*iPad Air*/

@media(min-width: 819px) and (max-width: 825px){
    .navbar-nav{
        position: relative;
        display: flex;
        gap: 20px;
    }

    #section-1{
        position: relative;
        margin-bottom: 400px;
    }
}


/*Anything less than 430px*/

@media(max-width: 420px){
    .footer-container{
        display: flex;
        justify-content: center;
        align-items: center;
        align-content: center;
        text-align: center;
        left: 0px;
        right: 0px;
    }

    footer{
        display: flex;
        justify-self: center;
        align-self: center;
        
        
        
    }

    .footer-text{
        position: relative;
        display: flex;
        justify-self: center;
        align-self: center;
        left: 8px;
    }
}

@media(max-width: 500px){

    #section-1{
        position: relative;
        margin-bottom: 500px;

    }

    #section-2{
        position: relative;
        margin-bottom: 500px;
    }

    #section-3{
        position: relative;
        margin-bottom: 500px;
    }

    #section-4{
        position: relative;
        margin-bottom: 500px;
    }

    .lead{
        z-index: 1;
        font-size: 21pt;
    }













    .carousel-flex{
        display: flex;
        justify-content: center;
        align-items: center;
        align-content: center;
        left: 0px;
        right: 0px;
    }

    .carousel-image{
        position: relative;
        left: 0px;
        right: 0px;
    }
}


/*Anything under 320px*/

@media(max-width: 320px){
    #section-1{
        position: relative;
        margin-bottom: 800px;
    }

    #section-2{
        position: relative;
        margin-bottom: 600px;
    }

    #section-3{
        position: relative;
        margin-bottom: 600px;
    }

    #section-4{
        position: relative;
        margin-bottom: 600px;
    }
}






/*from this piont on is the style.css for the aboutUs html procede whith cation*/

.section-1-ab{
    position: relative;
    margin-bottom: 150px;
}

.section-2-ab{
    position: relative;
    margin-bottom: 550px;
}



.ab-p-1{
    
    font-size: 50pt;
    color: #1FAE56;
}

.ab-p-2{
    font-size: 17pt;
    color: #284C96;
}

/*section 3 of About Us*/

.ab-rating-img{
    position: relative;
}



@media(min-width: 1440px){

    

    .ab-rating-img{

        position: relative;

        
        transform: rotateY(180deg);
        width: 85%;
        top: 640px;
        left: 450px;
    
        
    
        
        
    
    }

    .ab-rating-img{
        transform: rotateX(200deg);
    }

    .ab-rating-img{
        transform: rotate(270deg);

    }
    
}


@media(min-width:1800px){
    .section-3-ab{
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        align-content: center;
        left: 100px;
    }

    .ab-rating-img{

        position: relative;
        transform: rotate(90deg);
        width: 58%;
        top: 540px;
        left: 500px;
    
        
    
        
        
    
    }

    .footer-text-ab{
        position: relative;
        top: 10px;
    }


}



@media(min-width: 2200px){

    .ab-rating-img{

        position: relative;
        transform: rotate(90deg);
        width: 80%;
        top: 620px;
        left: 300px;
    
        
    
        
        
    
    }

}







@media(min-width: 2400px){
    .ab-rating-img{
        position: relative;
        transform: rotate(90deg);
        width: 55%;
        top: 550px;
        left: 500px;
    }
}




.section-3-ab{
    position: relative;
    margin-bottom: 550px;
}

.h1-ab{
    position: relative;
    font-size: 50px;
    font-family: "Indie Flower", cursive;;
    white-space: nowrap;
    color: #1FAE56;
}

.lead-2{
    position: relative;
    font-family: "Indie Flower", cursive;
    font-size: 50px;
    color: #284C96;
   

}

.lead-ab{
    position: relative;
   
    font-family: "Indie Flower", cursive;
    font-size: 23.5px;

    color: #284C96;
}








/*Samsung S21 Ultra*/

@media(min-width: 286px) and (max-width: 290px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;

    }

    .h1-ab{
        
        font-size: 28px;
        
    }

    
        
}


/*BlackBerry Z30*/

@media(min-width: 350px) and (max-width: 370px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;


    }

    .h1-ab{
        font-size: 27.5pt;
    }

    .footer-text-ab{
        position: relative;
        display: flex;
        justify-self: center;
        align-self: center;
        left: 12px;
        top: 6px;

    }

   
}

/*Blackberry PlayBook*/

@media(min-width: 600px) and (max-width: 605px){
    .ab-rating-img{
        transform: rotate( 360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 43.5pt;
    }

    .footer-text-ab{
        position: relative;
        left: 13px;
        top: 6px;
    }
}

/*Galaxy S9+*/

@media(min-width: 320px) and (max-width: 321px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;

    }

    .h1-ab{
        font-size: 24pt;
    }

    .footer-text-ab{
        position: relative;
        left: 4px;
        top: 6px;
    }
}

/*Galaxy Tab S4*/

@media(min-width: 712px) and (max-width: 713px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 44pt;
    }

    .footer-text-ab{
        position: relative;
        top: 7px;
    }
}

/*Kindle Fire HDX*/

@media(min-width: 799px) and (max-width: 801px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 60pt;
    }

    .footer-text-ab{
        position: relative;
        top: 7px;
    }
}

/*LG Optimus L70*/

@media(min-width: 384px) and (max-width: 385px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 30pt;
    }

    .footer-text-ab{
        position: relative;
        left: 20px;
        top: 7px;
    }


}

/*Microsoft Lumia 550*/

@media(min-width: 640px) and (max-width: 641px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 44pt;
    }

    .footer-text-ab{
        position: relative;
        
        top: 7px;
    }
}

/*Moto G Power*/

@media(min-width: 412px) and (max-width: 413px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 32.5pt;
    }

    .footer-text-ab{
        position: relative;
        left: 10px;
        top: 7px;
    }
}

/*Nokia N9*/

@media(min-width: 480px) and (max-width: 481px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        position: relative;
        font-size: 38.5pt;
    }

    .footer-text-ab{
        position: relative;
        left: 13px;
        top: 6px;
    }
}

/*Pixel 3*/

@media(min-width: 393px) and (max-width: 394px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;

    }

    .h1-ab{
        font-size: 31pt;
    }

    .footer-text-ab{
        position: relative;
        left: 30px;
        top: 7px;
    }
}

/*iPhone SE*/

@media(min-width: 375px) and (max-width: 376px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 29pt;
    }

    .footer-text-ab{
        position: relative;
        left: 20px;
        top: 7px;
    }
}

/*iPhone XR*/

@media(min-width: 414px) and (max-width: 415px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 32.5pt;
    }

    .footer-text-ab{
        position: relative;
        left: 10px;
        top: 7px;
    }
}

/*iPhone 12 Pro*/

@media(min-width: 390px) and (max-width: 391px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 30.5pt;
    }

    .footer-text-ab{
        position: relative;
        left: 25px;
        top: 7px;
    }
}

/*iPhone 14 Pro Max*/

@media(min-width: 430px) and (max-width: 431px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 34pt;
    }

    .footer-text-ab{
        position: relative;
        left: 3px;
        top: 7px;
    }
    
}

/*iPad Mini*/

@media(min-width: 768px) and (max-width: 769px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 59.5pt;
    }

    .footer-text-ab{
        position: relative;
        
        top: 7px;
    }
}

/*iPad Air*/

@media(min-width: 819px) and (max-width: 820px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        font-size: 59.9pt;
    }

    .footer-text-ab{
        position: relative;
        
        top: 7px;
    }
}

/*iPad Pro*/

@media(min-width: 1023px) and (max-width: 1025px){
    .ab-rating-img{
        transform: rotate(90deg);
        width: 90%;
       
        top: 640px;
        left: 350px;
    }

    .footer-text-ab{
        position: relative;
        
        top: 7px;
    }
}

/*Surface Pro 7*/

@media(min-width: 912px) and (max-width: 913px){
    .ab-rating-img{
        transform: rotate(360deg);
        margin-bottom: -10px;
    }

    .h1-ab{
        position: relative;
        font-size: 38.5pt;
    }

    .footer-text-ab{
        position: relative;
        
        top: 7px;
    }
}

/*Surface Duo*/

@media(min-width: 540px) and (max-width: 541px){
    .ab-rating-img{
        transform: rotate(360deg);
        margin-bottom: -10px;
        width: 100%;
    }

    .h1-ab{
        position: relative;
        font-size: 43.5pt;
    }

    .footer-text-ab{
        position: relative;
        left: 13px;
        top: 7px;
    }



    
}


/*Galaxy Fold*/

@media(min-width: 280px) and (max-width: 281px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        position: relative;
        font-size: 20.5pt;
    }

    .footer-text-ab{
        position: relative;
        left: 1px;
        top: 7px;
    }
}

/*Asus Zenbook Fold*/

@media(min-width: 853px) and (max-width: 854px){
    .ab-rating-img{
        transform: rotate(360deg);
        margin-bottom: -10px;
        
    }

    .h1-ab{
        font-size: 38.5pt;
    }

    .footer-text-ab{
        position: relative;
       
        top: 7px;
    }

    
}

/*Samsung Galaxy A51/71*/


@media(min-width: 412px) and (max-width: 415px){
    .footer-text-ab{
        position: relative;
        left: 7px;
    }
}
 




/*Nest Hub Max*/

@media(min-width: 1280px) and (max-width: 1281px){
    .ab-rating-img{
        transform: rotate(90deg);
        width: 70%;
        top: 590px;
        left: 500px;
    }

    .footer-text-ab{
        position: relative;
        top: 7px;
    }
}

/*Pixel 2*/

@media(min-width: 411px) and (max-width: 412px){
    .ab-rating-img{
        transform: rotate(360deg);
        width: 100%;
        margin-bottom: -10px;
    }

    .h1-ab{
        position: relative;
        font-size: 32pt;
    }

    .footer-text-ab{
        position: relative;
        left: 6px;
        top: 7px;

    }
}













@media(max-width: 510px){


    .ab-logo{
        position: relative;
        display: flex;
        justify-self: left;
        align-self: left;
    }





}



/*section 4 ab*/

.section-4-ab{
    position: relative;
    margin-bottom: 550px;
}

.ab-p-4{
    color: #1FAE56;
    font-size: 27px;
}










/*anything beyond this point is the css for concatck Us, btw if this code gets copied, 47 will be on you back! 😂*/


.section-1-ct{
    position: relative;
    margin-bottom: 200px;
}

.section-2-ct{
    position: relative;
    display: flex;
    margin-bottom: 500px;
    justify-content: center;
    align-content: baseline;
    align-items: center;
    gap: 40px;
    
}



.office-adress{
    width: 400px;
    height: 400px;
    border-color:  rgb(222, 226, 230);
    border-style: solid;
    border-radius: 10px;
    box-shadow: 0px 3px 10px #00000029;
}

.contackt{
    width: 500px;
    height: 600px;


    border-color:  rgb(222, 226, 230);
    border-style: solid;
    border-radius: 10px;
    box-shadow: 0px 3px 10px #00000029;
}

.call-Us{
    width: 400px;
    height: 400px;
    
    border-color:  rgb(222, 226, 230);
    border-style: solid;
    border-radius: 10px;
    box-shadow: 0px 3px 10px #00000029;
}


.h1-2-ct{
    position: relative;
    color: #1C4497;
    font-family: "Indie Flower", cursive;
    margin-top: 101px;
    margin-bottom: 40px;
    
    
}

.h6-2-ct{
    position: relative;
    color: #1C4497;
    font-family: "Indie Flower", cursive;
    font-size: 27px;
    
}

#footer-map{
    position: relative;
    top: 200px;

}






.btn-ct{
    position: relative;
}

@media(max-width: 560px){
    .btn-ct{
        position: relative;
        display: flex;
        justify-self: center;
        align-self: center;
        
    }
}




.h1-ct{
    position: relative;
    margin-top: 101px;
    margin-bottom: 40px;
    font-family: "Indie Flower", cursive;
    color: #1C4497;

}

.h6-ct{
    position: relative;
    color: #1C4497;
    text-align: left;
    font-family: "Indie Flower", cursive;
    font-size: 27px;
    left: 55px;
}




.h1-l-ct{
    position: relative;
    font-family: "Indie Flower", cursive;
    color: #1C4497;
    margin-top: 84px;
}



.hr-ct{
    position: relative;
    width: 400px;
    border: 2px solid #707070;
    margin-left: 30px;
    bottom: 25px;

}

input::placeholder{
    position: absolute !important;
    color: #1C4497 !important;
    
}




.form-div{
    position: relative;
    font-family: "Indie Flower", cursive;
   
    
    
}


.textInput {
  font-size: 14px;
  width: 200px;
  height: 35px;
}

.btn-ct{
    position: relative;
    left: 192.5px;
}

textarea::placeholder{
    color: #1C4497;
    margin-left: 120px;
}

textarea{
    width: 100%;
    color: #1C4497;

    border-radius: 5px;
    border-color:  rgb(222, 226, 230);


    

}




/*whats app*/

.section-wa{
    position: relative;
    height: 100vh;
    bottom: 200px;
    
}


.wa-img{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    text-align: center;
    top: 500px;
    

}

.wa-2{
    position: relative;
    top: 0px;
    bottom: 0px;
}

.wa-img-whatsApp{
    position: relative;
    width: 400px;
    height: 400px;
}

.p-wa{
    position: relative;
    font-size: 34.5pt;
    justify-self: center;
    align-self: center;
}

@media(max-width: 500px){
    .section-wa{
        position: relative;
        margin-bottom: 200px;
    }


    .wa-img-whatsApp{
        position: relative;
        width: 300px;
        height: 300px;
    }



}

/*Viber*/

.viber-2{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    height: 100vh;
}

.viber-img{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    text-align: center;
    top: 0px;
    
}

.vb-p{
    position: relative;
    font-size: 34.5pt;
}

.viber-jpg{
    position: relative;
    width: 400px;
    height: 400px;
}


.viber-img{
    position: relative;
    width: 400px;
    height: 400px;
}

@media(max-width: 500px){

    .viber-jpg{
        position: relative;
        width: 300px;
        height: 300px;
    }





}







/*Overide section*/

@media(max-width: 900px){

    .footer-svg{
        position: relative;
        left: 35.5px !important;
        width: 60px;
        height: 60px;
    }

    .footer-container{
        margin-top: 200px;
        gap: 50px;
    }
    
}

@media(max-width: 420px){
    .footer-svg{
        position: relative;
        left: 20px !important;
    }
}






@media(max-width: 500px){
    .vb-p{
        font-size: 26pt;
    }

    .p-wa{
        font-size: 26pt;
    }

    .footer-text{
        position: relative;
        left: 5px;
    }

    
}