body{
	margin: 10px;
	font-family: cursive;

}
.href{
	color: #333;
	text-decoration: none;
}
.loader{
    width:100%;
    height:100vh;
    position:fixed;
    z-index:9000;
    background-size:20%;
background:white;
        position:fixed;
        text-align: center;
        display: inline-block;
    }
    .loader::before{
        content: '';
        position: absolute;
        display: block;
        border: 8px solid orange;
        border-radius: 50%;
        border-top: 8px solid white;
        width: 50px;
        height: 50px;
        top: 0;
        left:0;
        right: 0;
        bottom: 0;
        margin: auto;
        z-index: 10;
        -webkit-animation:turn 2s linear infinite;
        animation:turn 2s linear infinite;
        
    }
    
    
    @keyframes turn{
        0%{
            transform: rotate(0deg);
        }
        100%{
            transform: rotate(360deg);
        }
    } 
.popup{
	position: fixed;
	bottom: 10px;
	right: 10px;
	background: var(--orange);
	color: white;
	padding: 10px;
	border-radius: 10px;
z-index: 500;
}
.title{
	font-family: cursive;
}
header div{
		display: inline-block;
		vertical-align: middle;
width: 30%;
	}
.leftnav{
	margin: 5px;
}
.leftnav i{
	font-size: 24px;
	margin: 20px;
}
.centernav{
	font-size: 25px;
	width: 35%;
	font-family: cursive;
	font-weight: bold;
	text-align: center;
}
.rightnav{
	text-align: right;
	font-size: 25px;
	width: 25%;
}

/*collections*/

.col_single{
font-family: cursive;
margin-top: 5px;
}
.col_single img{
	width: 100%;
	height: 350px;
	border-radius: 10px;
}
/*three*/
.clothingthree{
	display: flex;
	overflow-y: scroll;
}
/*single product*/

.single-product{
width: 45%;
display: inline-block;
vertical-align: top;
margin: 5px;
}
.single-product img{
	width: 100%;
	height: 200px;
}
.single-product a{
	text-decoration: none;
	color: black;
}
.randview{
	width: 200px;
}
.randview img{
	width: 200px;
}
/*menu*/
.menu{
	position: fixed;
	background: white;
	width: 100%;
	height: 90%;
	top: 80px;
	display: none;
	z-index: 10;
}
.menu ul{
	padding-left: 25px;
}
.menu li{
	list-style: none;
	padding: 10px;
	height: 50px;
	font-family: cursive;
	font-size: 25px;
}
.menu a{
	color: #333;
	text-decoration: none;

}
.menu li:hover{
border:1px solid #333;

}
.show{
	display: block;
}

.cl{
	content: '\F659';
}

/*single-category*/
.category_slide{
	overflow-y: scroll;
	display: flex;
	height: 95%;
}
.cat_store{
	height: 400px;

}
.single-category{
	width: 250px;
	height: 300px;
	margin: 5px;
}
.single-category img{
	width: 250px;
	height: 270px;
	border-radius: 10px;
}
.single-category a{
	color: black;
	text-decoration: none;

}


/*single page*/
.single_viewpage img{
	width: 100%;
	height: 450px;
}
.slick-dots {
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 10px 0;
    margin: 0;
    list-style: none;
}

.slick-dots li {
    margin: 0 10px;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 20px;
    height: 20px;
    padding: 5px;
    cursor: pointer;
    border: none;
    outline: none;
    background: transparent;
}

.slick-dots li button:before {
    font-size: 30px;
    line-height: 20px;
    display: block;
    content: '•';
    color: #ccc;
    opacity: 0.75;
}

.slick-dots li.slick-active button:before {
    color: #000;
    opacity: 1;
}

.switch-field input {
	position: absolute !important;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	width: 1px;
	border: 0;
	overflow: hidden;
}

.switch-field label {

	color: #333;
	font-size: 14px;
	line-height: 1;
	text-align: center;
	padding: 8px 16px;
	margin-right: -1px;
	border: 1px solid #333;
	box-shadow: #333;
	transition: all 0.1s ease-in-out;
}
.switch-field label:hover {
	cursor: pointer;
}

.switch-field input:checked + label {
	background-color: #333;
	box-shadow: none;
	color:navajowhite;
}



/*show cart*/
.car_list{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: scroll;
	background: white;
	z-index: 1;
}

.sicart{
	   
    margin: 10px;
    width: 100%;
    align-items: center;
    
}
.sicart div{
    display:inline-block;
    vertical-align:top;
    width:30%;
}
.sicart img{
	width: 100%;
	height: 200px;
}
.quantity{
	width: 50px;
	padding: 5px;
}

.plus{
    border-left: none!important;
    border-radius: inherit!important;
}
.minus{
    border-right: none!important;
    border-radius: none!important;
}

.quantity{
	border: 1px solid #333;
    border-left: none;
    border-right: none;
    vertical-align: middle;
    padding: 6px;
    margin: -6px;
}