::-webkit-scrollbar{
    display:none;
}

body{
    padding:0; margin:0; width:100%;
}

.danger-alert{
    background:red; color:white;
}

.top_bar{
    background:black; padding:5px; position:fixed; width:100%;
    font-size:13px; color:#edb31f;
}

header{
    background:white; padding:0px; position:fixed; width:100%; 
    height:65px; margin-top:27px;
}

.logo > a > img{
    height:40px; width:auto; margin-top:15px;
}

.nav{
    display:flex; justify-content:space-between;
}

.nav a{
    text-decoration:none; padding:15px; padding-top:25px;  
    margin-right:3px; color:rgb(210, 201, 172);
}

.nav a:hover{
    color:gold; 
    transition:color 1s; 
}

/* creating dropdown*/
.nav-icon{
    width:50px; height:auto; cursor:pointer; margin-top:5px; float:right;
}

/*new mobile nav*/

.dMobile-nav{
    background:yellow; margin-top:90px;
}

.dMobile-nav a{
    color:white; padding:10px; display:block; 
    text-decoration:none; transition:2s;
}

.dMobile-nav a:hover{
    color:gray;
}
/* action */
.action-btn{
    background:linear-gradient(#c28e14,#edb31f); color:black;  
    padding:8px 25px; border-radius:25px; border:none; margin-top:-10px;
}

.action-btn:hover{
    background:black; transition:background 2s; 
    color:rgb(255, 255, 255); transition:color 1s;
}

/*showcase */
.home-background{
    background-image: url('../images/background.jpg'); min-height:1200px; width:100%;
    position:absolute; z-index:-2; background-repeat: no-repeat;
}

@media(width < 700px){
    .home-background{
        background-position:center; min-height:800px;
    }
}

.background{
    background-image: url('../images/background.jpg'); min-height:600px; width:100%;
    position:absolute; z-index:-2; background-attachment: fixed; background-size:cover;
}

@media (max-width: 1100px){
    .background{
        background-position-x:center;
    }

    .backgroundb{
        background-position-x:center; background-size:cover; background-repeat:no-repeat;
    }
}

.showcase{
    min-height:800px; background:linear-gradient();
    background-size:cover; background-attachment:fixed; 
    text-align:center; align-items:center; padding:10px; 
    color:white;
}

.showcase h1{
    margin-top:300px; font-size:100px; font-family:Arial, Helvetica, sans-serif;
}

@media (max-width: 1000px){
    .showcase h1{
        font-size:70px;
    }
}

@media (max-width: 800px){
    .showcase h1{
        font-size:50px;
    }
}

@media (max-width: 750px){
    .showcase h1{
        font-size:40px;
    }
}

@media (max-width: 650px){
    .showcase h1{
        font-size:33px;
    }
}

@media (max-width: 500px){
    .showcase h1{
        font-size:30px;
    }
}


.backgroundb{
    background-image: url('../images/backgroundb.png'); min-height:600px; 
    position:absolute; width:100%; z-index:-2; background-attachment: fixed;
    background-size:cover;
}






/* My buttons */
.btn{
    background:none; border:none; color:#edb31f;
    padding:15px; transition:background 3s;
}

.btn:hover{
    background:linear-gradient(#c28e14,#edb31f); color:white; 
    cursor:pointer; delay:2s; 
}


.btn1off{
    background:none;  border-radius:15px; color:#edb31f;
    transition:background 1s; padding:15px; border: none;
}

.btn1off:hover{
    background:linear-gradient(#c28e14,#edb31f); color:white; 
    transition:background 1.5s; cursor:pointer; delay:2s; 
}

.btn2{
    background:linear-gradient(#c28e14,#edb31f); border-radius:15px; border:none;
    color:rgb(255, 255, 255); padding:15px; transition:background 1.5s;
}

.btn2:hover{
    background:rgb(255, 255, 255); color:#edb31f; cursor:pointer; delay:2s; 
    transition:background 0.5s; 
}

main h1{
    color:#edb31f;  text-align:center; font-family:Arial, Helvetica, sans-serif;
}

main h3{
    color:#edb31f;
}

.circle-img{
    width:260px; height:auto; 
}

.circle-img:hover{
    margin:-7px 0px 7px -7px; transition:margin 0.6s; cursor:pointer;
}

/* Newsletter */

.newsletter{
    background:#230000f7; color:white;
}

.newsletter .col-md-7{
    background-image:url('../images/newsb.jpg');
    min-height:300px; background-size:cover; padding:25px 15px 15px; 
}

.newsletter h2{
    color:white; text-align:center;
}

.newsletter form{
    background:rgba(8, 0, 0, 0.616); padding:25px 10px 15px; border:2px solid linear-gradient(#c28e14,#edb31f); border-radius:10px; 
    width:97%; margin:auto; margin-top:30px;
}

@media(max-width: < 500px){
    .newsletter form{
        width:95%;
    }
}

.newsletter-form{
    background:maroon; position:fixed;
}

@media(max-width: 700px){
    .newsletter-form{
        position:sticky;
    }
}

.newsletter-form h4{
    color:white; padding-top:5px;
}

input{
    padding:15px; margin-top:10px; width:99%; border:none; background:rgba(255, 255, 255, 0.788);
}

.newsletter form button{
    background:linear-gradient(#c28e14,#edb31f); color:white; width:99%; padding:15px; transition:background 2s; border:none;
}


.newsletter form button:hover{
    background:white; color:#edb31f; transition:background 2s; 
}

.newsletter .col-md-5 h2, .newsletter .col-5 p{
    color:black; 
}

#news-notice{
    background:green; color:white; padding:12px; transition:background 2s; 
    transition:2s; border:6px solid white; border-bottom:20px; 
}


/*styling for footer*/
.footer a{
    color:white; padding:10px; text-decoration: none;
    transition:1s; display:block; 
}

.footer a:hover{
    color:#eee; 
}

/* Registration Form */

#form2{
    background:rgba(19, 0, 0, 0.637); padding:25px; border-radius:10px;
    color:#edb31f; padding-top:35px; margin:auto;
}

#form2 input{
    margin-top:5px; 
}

#form2 button{
    width:85%; text-align:center;
}




/* Starting Store Page */

/* Serach bar */

.search-bar{
    background:rgba(0, 0, 0, 0.623); padding:18px; cursor:pointer;
    transition:background 1.5s; display:flex;
}

.search-bar:hover{
    background:rgba(0, 0, 0, 0.911); transition:background 1.5s;
}

.search-button{
    padding:15px; background:linear-gradient(#c28e14,#edb31f); transition:background 1.5s; display:flex;
}

.search-button:hover{
    background:white; transition:background 1.5s; 
}

.search-button img{
    height:30px; width:auto;
}

.search-button p{
    font-size:25px; color:black; margin:-2px 0px;
}

.products button{
    border-radius:0px; border:none; width:100%;
}

.special-promo{
    background:#eee;
}






/*mobile Menu real*/
.dmenu{
    background:black; padding:35px 0px 0px; height:500px; overflow:scroll; position:relative; 
    color:#edb31f; z-index:50; position:fixed; display:none;
}

.dmenu img{
    width:40px; height:auto; float:right; margin-bottom:-10px;
}

.dmenu button{
    background:none; padding:10px; color:#edb31f; transition:1s; border:none;
    width:100%; 
}

.dmenu button:hover{
    background:linear-gradient(#c28e14,#edb31f); color:black; 
}





/* working on the my account page*/
.db{
    background-image: url('../images/db.jpg');
    background-size:100%; background-position:center;
    width:100%; overflow-x:hidden; position:fixed;
}

.sidebar{
    background:black; height:100vh; position:absolute;
    width:40px; overflow-x:hidden; transition: 0.3s;
}

.sidebar:hover {
    width:200px; 
}

.sidebar button{
    width:100%; padding:12px 8px; border:none; color:white;
    background:none; transition:0.5s; text-align:left;
}

.sidebar button span{
    display:none;
}

.sidebar:hover span{
    display:inline-block;
}

.sidebar button i {
    color:#edb31f;
}

.sidebar button:hover i {
    color:black;
}

.sidebar button:hover{
    background: #edb31f; color:black;
}

.main{
    background:none; padding:10px; height:100vh;
    width:93%; margin-left:60px; margin-top:0px;
    height:100vh; overflow:scroll; color:white;
}

@media(width < 600px){
    .main{
        margin-left:30px; width:94%;
    }
}

.sidebar:hover .main{
    margin-left:200px;
}

.sidebar .logout-btn{
    background:gray; border-radius:20px; font-size:13px; 
    border-bottom:1px solid #edb31f; margin-top:50px; width:70%; 
    text-align:center; 
}

.main .bal{
    border-bottom:1px solid #edb31f;
}

.trends{
    background-image:url('../images/background.jpg');
}







/*new account stylings*/
.top_search_form{
      width:60%; 
}

.side-buttons button{
      background:none;color:white; padding:16px 0px;
      transition:1s; cursor:pointer; text-align:left;
}

.side-buttons button:hover{
      background:linear-gradient(#edb31f,rgb(208, 135, 0));
}

.side-buttons span{
      background:rgba(255, 179, 0, 0.815); padding:10px; 
      margin-right:6px; 
}

.side-buttons span:hover {
      background:none; 
}


.optionsBar{
    background:black; color:#edb31f; font-size:12px; width:120px;
    float:right; display:none;
}

.optionsBar button{
    background:none; color:#edb31f; transition:1s; 
    padding:10px; width:100%; cursor:pointer;
}

.optionsBar button:hover{
    background:#edb31f; color:black;   
}












.showcase-bg, .showcase-bg2, .showcase-bg3 {
      background: url('./images/back.jpg');
      background-size: cover; height: 100dvh;
      width: 100%; position: absolute;
}

.showcase-bg2{
      background: url('./images/manLaptop.jpg');
      background-position: center;
}


.showcase-bg3 {
      background: url('./images/amae.jpg');
      background-position:center;
}


#allSliders{
      height:100vh; overflow:hidden;
}


#slide2, #slide3{
      display:none;
}

.showcase-cover {
    background:linear-gradient(320deg, #edb31fb3, rgba(0, 0, 0, 0.653) ,rgba(0, 0, 0, 0.724));
    height: 100dvh; width:100%; position:relative;
}

.title{
      font-size:60px;
}





/*community stuffs*/
.comSideBar button{
    width:100%; padding:8px 10px;
}

.forOwner{
    background:rgba(117, 88, 0, 0.881); color:white; padding:10px; 
    margin-top:90dvh;
}