body{
    font-family: 'Roboto', 'Noto Sans', sans-serif;
    margin:0;
    padding:0;
    background-color: #222222;
    overflow-x: 0;
}

body a{
    text-decoration: none !important;
}
body a:link {
    color:#d2d2d2;
}
body a:visited {
    color:#a9a7a7;

}
body a:hover{
    color:#f9fffa;
}
body a:active {
    color:#656565;

}
body li{
    list-style-type: none;
}
/*Navbar*/
.navbar{
    display:flex;
    background-color: #000000;
    border-bottom: 2px solid #44d62c;
}

.navbar img{
    width:35px;
    height:35px;
    padding-left:160px;
    margin-top:14px;
    margin-bottom: 11px;
}

.navbar li{
    display:inline-block;
    font-size:16px;
    margin-top:5px;
    line-height: 19.2px;
    margin-left:40px;
    margin-right:29px;

}
.navbar .right{
    font-size: 16px;
    margin-top:22px;

}
.search{
    margin-left:52px;
}
.cart{
    margin-left:61px;
    margin-right:0px;
}

/*Below navbar*/
.below-navbar p{
    color: #ffffff;
    background-color: #555555;
    padding:14px;
    font-family: 'Roboto', sans-serif !important;
    height:auto;
    font-size: 14px;
    margin-top:0px;
}


/*Hero image one*/
.hero-image-one-desktop {
    margin-top:-34px;
    color:#ffffff;
    width:100%;
    height:700px;
    font-family: 'Roboto', sans-serif !important;
    background-image: url('assets/back-to-school-homepage-desktop2x.webp');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;


}

.hero-image-one-desktop h1 {
    padding-top:4%;
    font-size:50px;
}
.hero-image-one-desktop h2{
    font-weight:lighter;
    margin-top:-25px;

}
.hero-image-one-desktop p{
    font-size: 21px;
    width:8%;
    
}

.hero-image-one-desktop p:hover{
    cursor:pointer;
    border-bottom:2px solid white;

}
.hero-image-one-desktop i{
    color: rgb(4, 191, 4);
    font-size: 12px;
    margin-left: 0.2%;
}

/*Hero image one mobile*/
.hero-image-one-mobile{
    display:none;
}


/*Hero image two*/
.hero-image-two-desktop {
    margin-top:-23px;
    color:#ffffff;
    width:100%;
    height:700px;
    font-family: 'Roboto', sans-serif !important;
    background-image: url('assets/razer-blade-14-2023-homepage-desktop2x.webp');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;


}

.hero-image-two-desktop h1 {
    padding-top:4%;
    font-size:50px;
}
.hero-image-two-desktop h2{
    font-weight:lighter;
    margin-top:-25px;

}
.hero-image-two-desktop p{
    font-size: 21px;
    width:8%;
    
}

.hero-image-two-desktop p:hover{
    cursor:pointer;
    border-bottom:2px solid white;

}
.hero-image-two-desktop i{
    color: rgb(4, 191, 4);
    font-size: 12px;
    margin-left: 0.2%;
}

.hero-image-two-desktop .inline-icon{
    text-align:center;
    align-items:center;
    display:flex;
    justify-content: center;
}
/*Hero image two mobile*/
.hero-image-two-mobile{
    display:none;
}



/*Hero image three*/
.hero-image-three-desktop {
    margin-top:-23px;
    color:#ffffff;
    width:100%;
    height:700px;
    font-family: 'Roboto', sans-serif !important;
    background-image: url('assets/razercon2023-homepage-large-2x.webp');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    margin-bottom:4px;

}

.hero-image-three-desktop h1 {
    padding-top:4%;
    font-size:50px;
}
.hero-image-three-desktop h2{
    font-weight:lighter;
    margin-top:-25px;

}
.hero-image-three-desktop p{
    font-size: 21px;
    width:9%;
    
}

.hero-image-three-desktop p:hover{
    cursor:pointer;
    border-bottom:2px solid white;

}
.hero-image-three-desktop i{
    color: rgb(4, 191, 4);
    font-size: 12px;
    margin-left: 0.2%;
}

/*Hero image three mobile*/
.hero-image-three-mobile{
    display:none;
}


/*FOURTH CONTAINER*/
.forth-container{
    height:auto;
    display:flex;
    flex-wrap: wrap;
    color:#ffffff;
    width:100%;
    font-family: 'Roboto', sans-serif !important;
  
}
.forth-container .img{
    height:570px;
    width:49%;
    margin: 4px;
}

.img .inline-icon{
    text-align:center;
    align-items:center;
    display:flex;
    justify-content: center;
}
.image-one {
    background-image: url('assets/dolce-gabbana-tease-b-950x580-desktop.webp');
    background-position: center;
}

.image-two {
    background-image: url('assets/razer-viper-v3-hyperspeed-b-950x580-desktop.webp');
    background-position: center;
}

.image-three {
    background-image: url('assets/razer-kitsune-950x580-desktop.webp');
    background-position: center;
}

.image-four {
    background-image: url('assets/mercury-blade16-blade18-b-950x580-desktop.webp');
    background-position: center;
}
.image-four p{
    width:18% !important;
}
.image-five {
    background-image: url('assets/razer-blackshark-v2-hyperspeed-b-950x580-desktop.webp');
    background-position: center;
}
.image-six {
    background-image: url('assets/razer-edge-b-950x580-desktop.webp');
    background-position: center;
}


.block-desktop h1 {
    padding-top:4%;
    font-size:38px;
}
.block-desktop h2{
    font-weight:lighter;
    margin-top:-15px;
    font-size: 18px;

}
.block-desktop p{
    font-size: 15px;
    width:14%;
    
}

.block-desktop p:hover{
    cursor:pointer;
    border-bottom:2px solid white;

}
.block-desktop i{
    color: rgb(4, 191, 4);
    font-size: 10px;
    margin-left: 0.2%;
}

/*FOOTER BEGINS */
.footer{
    height:371px;
    width:100%;
    background-color: #111111;
}
.containerwithsix{
    display: flex;
    flex-wrap: wrap;
}

.contain-1, .contain-2,.contain-3,.contain-4,.contain-5{
    width:179px;
    height:auto;
    margin-top:25px;
}
.contain-1{
    margin-left:148px;

}
.contain-6{
    margin-top:25px;
    width:289px;
    height:auto;

}

.contain-1, .contain-2,.contain-3,.contain-4,.contain-5 p{
    color:#ffffff;
    font-size: 12px;
    padding-left: 10px;
    padding-top:10px;
}

.containerwithsix li{
    color:#ffffff;
    font-size: 12px;
    margin-left: -40px ;
    padding-bottom: 15px;
}




.contain-5 i{
    font-size: 20px;
}
.contain-6{
    color:#44d62c;
    font-size: 14.4px;
}

.containerwithsix{
    border-bottom:1px solid #a9a7a78f;
    
}
.last-footer{
    margin-top:1%;
    background-color: #111111;
    height:auto;
    padding-bottom: 6px;
}
.last-footer p{
    color:#999999;
    font-size: 12px;
}
.last-left{
    display: flex;
}
.last-footer li{
    font-size: 12px;
    display: inline-block;
    padding:10px;
}










/*MEDIA QUERY*/
@media screen and (min-width:150px) and (max-width:980px){
    .navbar{
        text-align: center;
    }
    .navbar li{
        display: none;
    }
    .navbar img{
        margin-left:10%;
    }
    .search{
        display:none;
    }
    .cart{
        padding-left:20%;
    }
  
    
    .hero-image-one-desktop{
        display:none;
    }
    .hero-image-one-mobile{
        display:block;
    }
    .hero-image-one-mobile {
        margin-top:-20px;
        color:#ffffff;
        width:100%;
        height:500px;
        font-family: 'Roboto', sans-serif !important;
        background-image: url('assets/back-to-school-homepage-mobile2x.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    
    
    }
    
    .hero-image-one-mobile h1 {
        padding-top:15%;
        font-size:30px;
    }
    .hero-image-one-mobile h2{
        font-size:17px;
        font-weight:lighter;
        margin-top:-10px;
    
    }
    .hero-image-one-mobile p{
        font-size: 17px;
        width:20%;
        
    }
    
    .hero-image-one-mobile p:hover{
        cursor:pointer;
        border-bottom:1px solid white;
    
    }
    .hero-image-one-mobile i{
        color: rgb(4, 191, 4);
        font-size: 12px;
        margin-left: 0.2%;
    }
    
    /*iamge 2*/
    .hero-image-two-desktop{
        display:none;
    }
    .hero-image-two-mobile{
        display:block;
    }
    .hero-image-two-mobile {
        margin-top:-10px;
        color:#ffffff;
        width:100%;
        height:500px;
        font-family: 'Roboto', sans-serif !important;
        background-image: url('assets/razer-blade-14-2023-homepage-mobile2x.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    
    
    }
    
    .hero-image-two-mobile h1 {
        padding-top:15%;
        font-size:30px;
    }
    .hero-image-two-mobile h2{
        font-size:17px;
        font-weight:lighter;
        margin-top:-10px;
    
    }
    .hero-image-two-mobile p{
        font-size: 17px;
        width:21.5%;
        
    }
    
    .hero-image-two-mobile p:hover{
        cursor:pointer;
        border-bottom:1px solid white;
    
    }
    .hero-image-two-mobile .inline-icon{
        text-align:center;
    align-items:center;
    display:flex;
    justify-content: center;
    }
    .hero-image-two-mobile i{
        color: rgb(4, 191, 4);
        font-size: 12px;
        margin-left: 0.2%;
    }

    /*iamge 3*/
    .hero-image-three-desktop{
        display:none;
    }
    .hero-image-three-mobile{
        display:block;
    }
    .hero-image-three-mobile {
        margin-top:-10px;
        color:#ffffff;
        width:100%;
        height:500px;
        font-family: 'Roboto', sans-serif !important;
        background-image: url('assets/razercon2023-small-2x.webp');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        margin-bottom: 13px;
    
    }
    
    .hero-image-three-mobile h1 {
        padding-top:15%;
        font-size:30px;
    }
    .hero-image-three-mobile h2{
        font-size:17px;
        font-weight:lighter;
        margin-top:-10px;
    
    }
    .hero-image-three-mobile p{
        font-size: 17px;
        width:23%;
        
    }
    
    .hero-image-three-mobile p:hover{
        cursor:pointer;
        border-bottom:1px solid white;
    
    }
   
    .hero-image-three-mobile i{
        color: rgb(4, 191, 4);
        font-size: 12px;
        margin-left: 0.2%;
    }
    /*containe with 6 images*/
    .forth-container{
        height:auto;
        display:flex;
        flex-wrap: wrap;
        color:#ffffff;
        width:100%;
        font-family: 'Roboto', sans-serif !important;
      
    }
    .forth-container .img{
        height:570px;
        width:98%;
        margin: 4px;
    }
    
.block-desktop h1 {
    padding-top:4%;
    font-size:30px;
}

.block-desktop p{
    font-size: 14px;
    width:18%;
    
}

.block-desktop p:hover{
    cursor:pointer;
    border-bottom:2px solid white;

}
.image-four p{
    width:24% !important;
}
.block-desktop i{
    color: rgb(4, 191, 4);
    font-size: 10px;
    margin-left: 0.2%;
}
.image-one {
    background-image: url('assets/dolce-gabbana-tease-b-480x615-mobile.webp') !important;
    background-position: center;
}

.image-two {
    background-image: url('assets/razer-viper-v3-hyperspeed-b-480x615-mobile.webp') !important;
    background-position: center;
}

.image-three {
    background-image: url('assets/razer-kitsune-480x615-mobile.jpg') !important;
    background-position: center;
}

.image-four {
    background-image: url('assets/mercury-blade16-blade18-b-480x615-mobile.jpg') !important;
    background-position: center;
}

.image-five {
    background-image: url('assets/razer-blackshark-v2-hyperspeed-b-480x615-mobile.webp') !important;
    background-position: center;
}
.image-six {
    background-image: url('assets/razer-edge-b-480x615-mobile.jpg') !important;
    background-position: center;
}
    .footer{
        height:auto;
    }
    .containerwithsix{
        display:none;
    }
    .last-footer{
        margin-top:-10px;
    }
    .last-footer p{
        padding-top:20px;
    }
    body{
        overflow-x: 0;
    }
}