*{padding: 0;
    margin: 0;
    box-sizing: border-box;
text-decoration: none;
max-width: 2000px;
font-family: 'Poppins', sans-serif;
}

html {scroll-behavior: smooth;
    scroll-padding: 5rem;}


    nav{height:80px;
        background-image: linear-gradient(to bottom,black,rgb(0, 129, 255));
    position: sticky;
    top: 0;
    z-index: 1;}

    .hamburger{display: none;}
    
    .navicon{color:white;
    width:150px;
    font-size: 30px;
    position: absolute;
    top:20px;
    left:30px;
    font-weight: bolder;
    text-transform: uppercase;}
    
    .navicon a{color:white}
    
    nav ul{float: right;
    margin-right: 50px;}
    
    nav ul li{display: inline-block;
    line-height: 80px;
    margin: 0 8px;}
    
    nav ul li a{position: relative;
    font-size: 14px;
    text-transform: uppercase;
    color: white;
    font-weight: 900;
    padding:5px 0;}
    
    nav ul li a:before{
        position: absolute;
        left: 0;
        bottom: 0;
        content:'';
        height: 3px;
        width: 100%;
        background: white;
        transform: scaleX(0);
        transform-origin: right;
        transition: transform .4s linear;}
    
    nav ul li a:hover:before{
        transform: scaleX(1);
        transform-origin:left;}

        .section{
            transform: translateY(10px);
            opacity: 0;
            transition: all 2s ease-in-out;
        }

.section.active{
            transform:translateY(0);
            opacity: 1;
        }


        .anim{opacity:0;
            transform: translateY(10px);
            animation: moveup 1.5s linear forwards;}
            
            @keyframes moveup{100%{opacity: 1;
                transform: translateY(0px);
            }}
        
    
    .showcase{background-image: linear-gradient(to top,black,rgb(0, 129, 255));
    padding: 150px 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
width: 100%;}
    
    .showcasetext{color: white;
    font-size:20px;
    text-align: left;
    align-self: center;
    }
    
    .showhead{font-size: 40px;
    margin-bottom: 15px;
    line-height: 1.2em;}
    
    .trust{color: gold;}
    
    .showtext{margin-bottom: 10px;
    font-size: 30px;}
    .showcasetext>p{margin-bottom: 30px;}
    
    .showcasemail{
    font-size: 20px;}
    
    .showcasecont{font-weight:900;}
    
    
    
    .showcasetext>p>i{color:rgb(0, 129, 255);
    margin-right: 10px;
    display: none;}
    
    .showcasebtn{padding: 10px 30px;
    background-color:gold;
    font-size: 20px;
    border-radius: 6px 12px;
    margin-top: 20px;
border-color: transparent;}
    
    .showcasebtn1{color: white;
    text-decoration: none;
    }
    
    .newsletter{ background-color: rgb(0, 129, 255);
        padding: 5px 30px;
        display: flex;
    justify-content: space-between;
    animation-name: expand;
    animation-timing-function: ease-in-out;
    animation-duration: 1.5s;
    }
    .newsletter>form>input{
        width: 350px;
        height: 50px;
        padding-left: 15px;
        margin-right:-5px;
    }
    .submitbtn{width:100px;
    padding:16px;
    background-color: rgb(6, 11, 11);
    color: white;
    font-size: 15px;}
    
    .showcaseimg{width:100%;}
    
    .whychoose{padding: 20px 30px;}
    
    .choosehead{text-align: center;
    margin-bottom: 20px;
    font-size: 30px;}
    
    .reasons{display:grid;
    grid-template-columns: repeat(3,1fr);
    gap:10px;
    animation-name: expand;
    animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
    animation-duration: 1.5s;
    }
    
    
    .reason1{
    color:black;
    text-align: center;
    padding: 30px 20px;
    border-radius:14px;}
    
    .reason1>i{margin-bottom: 20px;
    color: black;}
    
    .services{
    padding: 20px 30px;}
    
    .servicetext{text-align: center;
    margin-bottom: 20px;}
    
    .ourservices{width: 100%;
        display: grid;
    grid-template-columns: repeat(4,1fr);
    gap:15px;}
    
    .service{background-color: transparent;
       width: 100%;
    text-align: center;
    padding: 20px 20px;
    color:black;
    border-radius: 15px;
    cursor: pointer;
    
    }
    
    .service>h3{font-size: 15px;
    font-weight: 2000;}
    
    .servicebtn{ border-radius: 10%;}
    
    .service>i{margin-bottom: 20px;
    color: rgb(6, 11, 11);}
    .servicetext>h2{font-size: 35px;
    margin-bottom: 15px;}
    
    .servicetext>p{font-size: 20px;}
    
    .cheating{background-image: linear-gradient(to bottom,black,rgb(0, 129, 255));
    padding:50px 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
    }
    
    .cheating>h2{color:white;
    text-align: center;
    font-size: 35px;
    margin-bottom: 15px;}
    
    .cheating>p{color: white;
    text-align: center;
    margin-bottom: 50px;}
    
    .cheating>img{
    width:50%;}
    
    .reviews{background-color: rgb(6, 11, 11);
        padding:10px 50px;
        color: black;
    }
    .reviewhead{text-align:center;
        margin-bottom: 20px;
        font-size: 30px;
        font-weight:900;
        color: white;
    }
    
    .peoplereview{display: flex;}
    
    .review1{background-color: white;
    text-align: center;
    margin-right: 15px;
    padding: 20px 20px;
    border-radius: 3%;
    }
    .review1>i{border-radius:100%;
        background-image: linear-gradient(to right,black,rgb(0, 129, 255));
    padding:15px;
    margin-bottom: 10px;
color: white;}
    
    .reviewname{font-size: 25px;}
    
    .discover{padding: 30px 30px;
    background-color: rgb(6, 11, 11);
    display: flex;
    justify-content: space-between;}
    
    .discovertext{margin-top:100px;
    color: white;
    font-size: 18px;}
    
    .discovertext>h1{margin-bottom: 15px;}
    .discoverbtn{padding: 10px 30px;
        background-image: linear-gradient(to right,black,rgb(0, 129, 255));
        border-radius: 6px;
    margin-top: 50px;}
        
        .discoverbtn1{color: white;
        text-decoration: none;
        }
        
    
    .contactform{background-image: linear-gradient(to top,black,rgb(0, 129, 255));
    padding:20px 30px;
    color: white;
text-align: center;}
    
    form{display: flex;
    flex-direction: column;
    align-items: center;}
    
    input{margin-bottom: 20px;
    width: 70%;
    padding: 25px 10px;
    height: 30px;
    outline: none;
    border-color:transparent;
  font-size: 16px;}

  input:focus{font-size: 16px;}
    
    textarea{margin-bottom: 20px;
        width: 70%;
        height: 150px;
        padding: 10px 10px;
        outline: none;
        border-color:transparent;
        font-size: 16px;}

        textarea:focus{font-size: 16px;}
        
     .contactbtn{width: 20%;
    background-color: gold;
    padding: 0 15px;
  border-radius:6px 12px;}
    
    form>h1 {margin-bottom: 15px;}
    
    form>p{margin-bottom: 15px;
    }
    
    .disclaim{font-weight: bolder;}
    
    footer{padding: 20px 30px;
    font-size: 12px;
margin-bottom: 80px;}
    footer>p {margin-bottom: 15px;}


    .thanks{background-image: linear-gradient(to top,black,rgb(0, 129, 255));
    text-align: center;
    font-size: 23px;
    min-height: 100vh;
    padding:30px 10px;
   color : white}
    .thanks>i{color: white}

.thanks>a{background-color:gold;
color:white;
position: relative;
top:20px;
padding:3px 10px;
border-radius: 6px 12px;}

.thanks>p{padding:8px 0}
.mail{color:white;
font-weight: 900;}


.mymail{background-image: linear-gradient(to right,black,rgb(0, 129, 255));
    color: white;
    border-radius: 16px;
    padding: 3px 6px;
    display: flex;
    gap: 5px;
    position: fixed;
        bottom: 20px;
        right: 15px;}

.spam-bold{font-weight:900}
        
    
    .mymail>a{color: white;
    font-size: 35px;
    align-self: center;}
    
    .mymail>.linker{align-self: center;
    }


    
    /*small phone */
    
    @media only screen and (max-width:300px){
        .ourservices{ display: grid;
            grid-template-columns: repeat(1,1fr);}
    
                .cheating>h2{font-size: 20px;}
    
    }
    
    
    /*  MOBILES */
    @media only screen and (max-width:480px){
          body{width: 100%;}

          .hamburger>i{font-size:30px;
            position: absolute;
            right:30px;
            top:25px;}
          
          .hamburger {display: block;}

          .navlist{position:fixed;
            width: 100%;
            height: 300px;
            background-image: linear-gradient(to right,black,rgb(0, 129, 255));
            top: 70px;
            text-align: center;
            transition: all .5s;
            display: none;
        }
        .navlist.anim-con{display: block;}
    
        nav ul li{display: block;
        margin: 20px 0;
    line-height: 30px;}
    
    nav ul li a {font-size:15px;}
    .navicon{color:white;
        width:150px;
        font-size: 20px;
        position: absolute;
        top:30px;
        left:30px;
        font-weight: bolder;}
    
         
    .thanks{background-image: linear-gradient(to top,black,rgb(0, 129, 255));
        text-align: center;
        font-size: 20px;
        min-height: 100vh;
        padding:30px 10px;
       color : white} 
    
        .showcaseimg{display: none;}

        .showcasetext{text-align: center;
        margin-bottom: 30px;
        font-size: 18px;}
         .showhead{
        font-size: 25px;}
        
        .showcasetext>p {margin-bottom: 20px;}
        .showcasemail{font-size: 17px;}
        .ourservices{ display: grid;
        grid-template-columns: repeat(1,1fr);}
    
        .service>h3{font-size: 20px;}
    
    
        .servicetext>p{font-size: 15px;
        margin-bottom: 20px;}
    
        .peoplereview{display: grid;
        grid-template-columns: repeat(1,1fr);
        gap:15px;
    font-size: 12px;}


    .reviewhead{font-size: 18px;}
    
        .discover{flex-direction: column;
        text-align: center;}
    
        .discovertext{margin-bottom: 30px;}
    
        .discovertext>h1 {font-size: 20px;}
        .reasons{display:grid;
            grid-template-columns: repeat(1,1fr);
            gap:10px;}
            
            .cheating>img{text-align: center;
                margin:0px 10px;
            width: 100%;}
    
            .cheating>h2{font-size: 30px;}
            input{width: 100%;}
            textarea{width:100%}

            .contactbtn {width: 50%;}

        
    }
    
    @media screen and (max-width:1000px) and (min-width:480px){
       
.hamburger{display: block;}

.hamburger>i{font-size:30px;
    position: absolute;
    right:30px;
    top:25px;}
  
  .hamburger {display: block;}

  .navlist{position:fixed;
    width: 100%;
    height: 300px;
    background-image: linear-gradient(to right,black,rgb(0, 129, 255));
    top: 70px;
    text-align: center;
    transition: all .5s;
    display: none;
}
.navlist.anim-con{display: block;}


      nav ul li{display: block;
      margin: 20px 0;
  line-height: 30px;}
  
  nav ul li a {font-size:20px;}
  

    
    .showcaseimg{display: none;}
        
    .ourservices{ display: grid;
        grid-template-columns: repeat(2,1fr);}
    
        .showcasetext{text-align: center;
        font-size: 18px;} 
        .discover{display: flex;
            flex-direction: column;
        justify-content: space-between;}
       .discoverimg{width:80%;
    align-items: center;} 
    
       .peoplereview{flex-direction: column;}
       .review1{margin-bottom: 20px;}
    
    }
