@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200&family=Lato:wght@100;300;400;700;900&family=Quicksand:wght@300;400;600');

/*
@font-face {
   font-family: myFirstFont;
   src: url(../fonts/lato-Regular.ttf);
}
*/

a {text-decoration: none!important;color: inherit!important;}
li {list-style: none;}
.fleft{float: left;}
.fright{float: right;}
.clear {clear: both;}
.ta-right {text-align: right;}
.ta-center {text-align: center;}
.ta-right {text-align: right;}
.no-over{overflow: hidden;}

textarea:focus, input:focus{
    outline: none;
    resize: none;
}

.wishlistheart.fa.fa-heart.favtrue {color: #fbd300}
.wishlistheart.fa.fa-heart {color: #ccc}

.modalo {position:fixed; top:0px; left:0px; width:100%; height:100%!important; z-index: 999999; display: none;background: rgba(255,255,255,.2);  
	  -webkit-backdrop-filter: blur(3px);
  -moz-backdrop-filter: blur(3px);
  -o-backdrop-filter: blur(3px);
  -ms-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px) grayscale(80%)!important;
}



.topline {width:100%; padding: 8px 0px; background:#000; color: #fff;z-index: 11;font-size: 0.75rem;}
.mobilmenu-container, #mobilmenu{display:none}
.desktop-hidden {display: none;}
.conformin {margin-top: 25px;}


.product-image {position: relative;transition: all .3s;transition: filter 0.5s ease-in-out}
.image-container {transition: all .3s;transition: filter 0.5s ease-in-out;}
.tile-image {min-height: 100%;object-fit: cover;filter: brightness(.90);object-position: center center}
.tile-image.bottom{object-fit: cover;filter: brightness(.9);object-position: center center}

.fa-heart-o.favfalse {color: #878686;}
.fa-heart.favtrue {color: #ffc107;text-shadow: 0px 0px 3px #fff;}



.user-login-area {display:none; position: fixed; padding:0px 0px; width:600px; top:15%; left: calc(50% - 275px); font-size:30px; color: #000; background:rgba(255,255,255,.8); border:1px solid #333; border-radius:0px; box-shadow:inset 0px 0px 2px #fff; text-align:center; font-weight: 900;z-index: 9999999}
.close-modal {position: absolute;border-radius: 100%;  padding: 10px;margin-left: 20px;cursor: pointer;color: #171717;font-size: 24px; background: #f5f5f5;padding: 0;right: 19px;  top: 10px;}
.close-panel{position:absolute;top:0px;right: 0px;padding: 0px 15px;cursor: pointer; color:#fff; font-size:34px; display: none;text-shadow: 0px 2px 2px #000;z-index: 3;}
.user_login {text-align:left;border-right:0px solid #ccc; height: 100%!important; padding: 40px; font-size: 18px; font-weight: normal}
.user_login .title {border-bottom:1px solid #ccc; height: 35px!important; font-size: 18px; font-weight: bold;margin-bottom:50px;}
.user_login_form {margin-top:20px; font-size: 14px; margin-bottom:15px;}
.user_login_form label {float:left; width:23%; margin-right:2; height:40px; line-height:40px; text-align: left; font-weight: normal!important}
.user_login_form label i {margin-right: 5px}
.user_login_form input {float:right; width:75%; padding:10px 20px; border:.55px solid #ccc;}
.user_login_form .login-btn {float:right; width:100%; height:50px; text-align: center; background:#000; color:#fff;margin:10px 0px;font-size:14px;font-weight:700;cursor:pointer;}
.user_login_form .login-btn:hover {background:#9e0000;}
.uye-ol .login-btn {float:right; width:250px; height:50px; line-height: 50px; text-align: center; background:#1779b5; color:#fff;margin:10px 0px;box-shadow: inset 0px 1px 1px 2px #fff;font-size:12px}
::placeholder {font-size:13px;color:#ccc;font-style: italic}
.uye-ol-btn {width:150px; height:40px; line-height: 40px; text-align: center; background:#1779b5; color:#fff;margin:10px 0px;box-shadow: inset 0px 1px 1px 2px #fff;font-size:11px;}
.user_login_form .forget-pass {float:left; height:50px; line-height: 50px; text-align: left; color:#000;margin:20px 0px}
.signin {padding:10px 30px; text-align: center; background:#29a5fd; color:#fff; font-size:11px; font-weight:bold; cursor: pointer;}
.girbtn {padding:10px 30px; text-align: center; background:#3b9213; color:#fff; font-size:11px; font-weight:bold; cursor: pointer;}
.menu-cont-height {width: 100%; height: 200px;}
.favcatfilt {font-size: 12px;padding-left: -10px}
.favfilterarea {background:#fff;display: flex;justify-content: space-between;border-bottom: .55px solid #fbd403;padding:2px 0px}
.desktop-hidden {display: hidden;}
.cat-filter-menu {position:fixed; top:83px; bottom: 0px ;width:100%; left:0px; ; background:#fff;;display:none; padding:10px;z-index:4}















.menucont {top: 0px; background: rgba(255,255,255, 1);width: 100%;z-index: 999999993;}
.logo-menu-cont {padding: 20px 0px;color:#fff; font: 700 14px Nunito; display: flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-items: center;}
.imenu i {font-size: 21px;font-weight: bold;margin: 0px 10px;cursor: pointer;}
.badge-cart {position: absolute;top: -20px;right: 0px;width: 20px;height: 20px; padding: 0;line-height: 20px;border-radius: 100%;background: #f10514;color: #fff;font-weight: 900;font-size: 12px;}
.topmenu {color: #000;font-size: 16px;font-family: Lato;font-weight: 700;display: flex;margin: auto;justify-content: space-between}
.topmenu div {padding: 10px;text-align: center;position: relative;cursor: pointer;}
.topmenu div span {position: relative;text-overflow: ellipsis;white-space: nowrap;height: 50px;}
.topmenu   a{color: #000!important;text-decoration: none;}
.topmenu  div:last-child:after{opacity: 0!important}
.topmenu div i{font-size: 21px;margin-right: 15px}
.brands ul {float: left; width: 100%;}
.brands ul li{float: left;}
.topmenu div span{position: relative;text-overflow: ellipsis;white-space: nowrap;height: 50px}
.topmenu div span:after{
    position: absolute;
    content: "";
    width: 1%;
    height: 3px;
    right: 48%;
    bottom: -10px;
    left: auto;
    z-index: -1;
    background: #fff;
    opacity: 0;
    transition: all .25s ease-in-out;
}


.topmenu div:hover span:after{
    width: 100%;
    right: 0%;
    left: auto;
    z-index: 1;
    background: #fbd300;
    opacity: 1;
}

.menucont.reflex {background: #000 url(../img/leafbck.png);}



.brandcont {position: relative;margin: 0px auto;margin-top: -120px}

    .brandcont .try {width: 40%; position: relative;min-height: 200px;}
    .brandcont .try img{width: 100%}
    .brandcont .try .title{font-size:26px;font-weight: bold;text-shadow:0px 1px 1px #fff;font-family:Condiment;letter-spacing: 1px!important}
    .brandcont .new-product{width: 100%; /*display: flex;align-items: bottom;justify-content: center*/;}
    .brandcont .new-product .item{float: left; overflow: hidden;;transition: all .3s ease-in-out;position: relative;border-radius: 13px;}
    .brandcont .new-product ul {width: 100%%;padding-inline-start: 0px!important;padding-top: 0px;}
    .brandcont .new-product ul li{float: left; width: 18%; margin-right:2.6%!important; min-height: 120px; margin-top: 3%;;color: #000;display: flex; background: #fff;   
                            /*
                            background: -webkit-linear-gradient(-135deg, #ccc 0%, #ccc 34%, #ccc 34%, #f1f1f1 34%, #f1f1f1 100%);
                            background: -moz-linear-gradient(-135deg, #ccc 0%, #ccc 34%, #ccc 34%, #f1f1f1 34%, #f1f1f1 100%);
                            background: linear-gradient(-135deg, #ccc 0%, #ccc 34%, #ccc 34%, #f1f1f1 34%, #f1f1f1 100%);*/
                            }
    
    .brandcont .new-product ul li:last-child{}   

    .shadow {box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important}
    .stats .wrapper:hover {color: #fff!important;background: #1f1f1f;transition: all .3s ease-in-out;}
    .content {position: relative;}
    .wrapper, .stats .wrapper {border-radius: 13px;}
    .stats .wrapper {height: 125px;width: 100%;overflow: hidden;transition: all .3s ease-in-out;position: relative;z-index: 0;cursor: pointer;}
    .stats .wrapper a{color: #000;}
    .stats .wrapper a:hover{color: #fff;}
    .p-3 {padding: 1rem!important;}
    .align-items-end {align-items: flex-end!important;}
    .d-flex {display: flex!important;}
    .stats .wrapper:hover::after {transition: all .15s ease-in-out;transform: scale(1);opacity: 1;}
    .wrapper .top-items {position: absolute; top: 10px; right: 10px;font-size: 18px;font-weight: bold;color: #fff; text-shadow: 0px 1px 1px #000;}
    .stats .wrapper:after {
        position: absolute;
        content: "";
        width: 150px;
        height: 150px;
        right: -57px;
        top: -56px;
        left: auto;
        z-index: -1;
        background: url(../img/stats_hover.png) no-repeat;
        background-size: contain;
        transform: scale(1.8);
        opacity: 0;
        transition: all .15s ease-in-out;
    }

    .brandcont .new-product ul li {
    float: left;
    width: 18%;
    margin-right: 2%!important;
    min-height: 120px;
    margin-top: 3%;
    color: #000;
    display: flex;
    background: #fff;
}






.topitem {z-index: 1;}
.subitem {position: absolute!important; top: 37px; left: -60px; width:200px; padding: 0px!important; background: rgb(148 147 146 / 49%);font-size: 15px;z-index: 2;color: #000;text-align: left!important;font-weight: 500;display: none;transition: all .3s;}
.subitem ul {padding-inline-start: 0px!important;margin-block-start: 0px;margin-block-end: 0px;}
.subitem ul li{padding:10px;transition: all .3s;}
.subitem ul li a{color: #000!important;}
.subitem ul li:hover{background: #fcd500;color: #000;}
.topitem:hover .subitem {display: block;}
.imenu a i.main-icon {color: #fff;text-decoration: none;transition: all .2s;}
.imenu a:hover i.main-icon {color: #ff4400;}
.lang-open-menu {position: absolute;top: 15px;left: -5px;width: 60px;z-index: 2;display: none;transition: all .3s;padding-left: 5px}
.lang-menu {margin-left:15px;;font-size: 12;font-weight: bold;position: relative;cursor: pointer;}
.lang-menu:hover .lang-open-menu {display: block;}
.lang-flag {height: 12px;margin-right: 5px;margin-top: -2px;border: 1px solid #fff;}





#panel {position: fixed;    right: -425px;    top: 0;bottom: 0; width: 100%;    height: 100%;    overflow-y: visible;    max-width: 425px; background: #fff!important;box-shadow: 0 0 5px 2px rgb(0 0 0 / 15%); z-index: 9999999999;}
#mobilmenu {    position: fixed;    left: -2850px;    top: 0;    width: 100%;    height: 100%;    overflow-y: visible;    background: #000!important; z-index: 9999999999;}
.user-login-area {display:none; position: fixed; padding:0px 0px; width:600px; top:15%; left: calc(50% - 275px); font-size:30px; color: #000; background:rgba(255,255,255,.8); border:1px solid #333; border-radius:0px; box-shadow:inset 0px 0px 2px #fff; text-align:center; font-weight: 900;z-index: 9999999}
.close-modal {position: absolute;border-radius: 100%;  padding: 10px;margin-left: 20px;cursor: pointer;color: #171717;font-size: 24px; background: #f5f5f5;padding: 0;right: 19px;  top: 10px;}
.close-panel{position:absolute;top:0px;right: 0px;padding: 0px 15px;cursor: pointer; color:#fff; font-size:34px; display: none;text-shadow: 0px 2px 2px #000;z-index: 3;}

.sidebar-close {padding: 0px 10px;position: absolute;right: 0;top: 0px;cursor: pointer;}



.plp-size-select-button-container {cursor: pointer;}



footer i {font-size:18px; margin-right:5px; margin-top: 10px; color: #ccc}
footer .footer-menu {float: left;width: 100%;}
footer .f-menu { float: left;  width: 100%;}
footer .f-menu, .right_menu, .nostyle {list-style-type: none;}
footer .f-menu ul li { float: left; width: 50%;}
footer .f-menu ul li:first-child ul { padding: 0;}
footer .f-menu ul li ul {float: left;width: 100%;padding: 0 30px;}
footer .f-menu ul li ul li.head {color: #fff;font: 900 15px "Nunito";margin-bottom: 20px;}
footer .f-menu ul li ul li {float: left;width: 100%;}
footer .f-menu ul li ul li a { -webkit-transition: 0.3s; -o-transition: 0.3s;transition: 0.3s;display: block;font: 14px "Nunito";color: #ccc; padding: 7px 0;float: left;}
footer ::placeholder {color:#fff!important;}


footer {
    position: relative;
    width: 100%;
    padding-top: 40px;
    background: #111 url(../img/abst.png);
    background-repeat: repeat-x;
    color: #fff;
    font-size: 13px;
    text-shadow: 0px 0px 0px #000;
    font-weight: normal;
    font-family: "Quicksand";
    margin-bottom: -4px;
    margin-top: 30px;
}

	.footer-corp {margin-top: 20px;background:#000; width: 100%; height:60px; line-height: 60px; color:#ccc; border-top:1px solid #333; font-size:12px; color:#888!important}
	.smicn i {font-size: 18px;margin-bottom: 20px}
	.bhtitle {font: 900 18px 'Nunito'; color: #fff}

.no-size {
    position: relative;
    cursor: default;
    color: #bbb!important;
}

.size-true {text-decoration: underline!important;}

.no-size:before {
    content: "";
    position: absolute;
    width: 25px;
    height: 1px;
    display: block;
    background: #d5d4ce;
    top: 50%;
    left: -7px;
    transform: rotate(133deg);
}


.brandline {padding:1px 5px; background:#000; border-radius: 0px;color: #fff;font-size:12px;font-weight: bold;  overflow: hidden;white-space: nowrap; text-overflow: ellipsis;}
.colum-ebulten {padding-left: 0px;}
.bottomlogo {width:98%}
.colorimage {max-height: 100%;object-fit: cover;}
.row {margin-right: -0.95rem;margin-left: -0.95rem;}




.variant-choose-container {width: 100%; height: auto; padding-bottom: 25%;position: relative}
.variant-choose-container .variant-label{position: absolute;top:0px;left: 0px;bottom: 0px; right: 0px;overflow: hidden;width: 100%;height: 100%;display: flex;flex-wrap: wrap;overflow: hidden;}
.variant-choose-container .variant-label .variant-choose{width: 15%; height: 75%;padding: 2px;cursor: pointer;}
.variant-choose-container .variant-label .variant-choose .choose{width:100%; height: 100%;border: 0px solid #ddd;overflow: hidden;display: flex;align-content: center;align-items: center;justify-content: center;justify-items: center;}
.variant-choose-container .variant-label .variant-choose .choose img{object-fit: cover;max-height: 100%;border-radius: 5px}
.morecolor {padding: 2px;background: #eee;border-radius: 0%;color: #000;height: 100%;margin-left: 5px;font-size: 12px;font-weight: bold;text-align: center;width: 20px;}


.filtre_title {font-weight: bold;border-bottom: .55px solid #fbd403;width: 100%;margin-bottom:15px; cursor: pointer;}
ul.main-list {width: 100;margin: 0px 0px 0px 0px;padding-inline-start: 40px!important;}
ul.main-list a li{width: 100%;text-decoration: none;color: #666;font-weight: 400;font-family: 'Arial';margin-bottom: 7px;list-style: square;position: relative;}
ul.main-list a li.true{font-weight: bold;color: #bf9d09;position: relative;list-style: none; cursor: pointer;}
ul.main-list a li.true::before{content: '-';position: absolute; left: -15px; top: 0px}

.login-btn {margin:5px auto; background:#000; color:#fff; text-align: center;width:100%;padding:10px;border-radius:25px;border:1px solid #000}
.new-user-btn {margin:5px auto; background:#fff; color:#000; text-align: center;width:100%;padding:10px;border-radius:25px;border:1px solid #000}
.tekrargir {margin:30px auto; width:250px; height: 50px; line-height: 50px; color:#fff; background:#000; text-align: center; font-weight:bold; font-size: 12px;padding:0px}



.adress-cont {position:absolute;top:2vw; right:-20%; height: 26vw;background: #000;width:70%;text-align: center; color: #fff;border:15px solid #fff;}
.contact-cont {background: #fff;width:90%;text-align: left; color: #000;}
.adress-cont i {font-size: 34px; color: ddbc09;margin-bottom: 10px;}
.contact-input {border: 0px; border-bottom: .55px solid #ddd; width: 100%;}
.contact-button {width: 100px; background: #000; color: #fff;padding: 5px 15px}
.contactform {margin-bottom: 30px;}
.cbtn-cont {width:100%;margin-top:30px}


.conformin textarea {
    height: 120px;
}


.contactadress {background: linear-gradient(90deg, #fff 0%, #fff 64%, #fff 64%, #ddbc09 54%, #ddbc09 100%);;position: relative;padding:40px 50px 40px 0px;margin-bottom:40px}
.contactadress .tbn{width:100%; ;background:#000 url(../img/leafbck.png) center center; border:10px solid #fff;z-index: 2;padding:40px 20px}
.contactadress .item {width:100%; text-align: center;color:#fff}
.contactadress .item .item1{width:100%;margin-top:10px}
.contactadress .item .item2{width:100%;font-size: 18px;}
.contactadress .item .item3{width:100%;text-align: center;}
.iletisim-title {font-size:41px; font-weight: bold;font-family:'Arial'}






::-webkit-input-placeholder { /* Edge */
  color: #333;
  font-size: 12px;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #333;
  font-size: 12px;}

::placeholder {
  color: #333;
  font-size: 12px;

}







.field-container input {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.field-container {
    position: relative;
    margin-bottom:25px;
}




.form-container {

    /*max-width: 400px;*/
    padding: 0px;
    color: #1f1c1c;
}



.inputkk {
    margin-top: 0px;
    padding: 10px;
    font-size: 14px;
    color: #000;
    font-weight: 500;
    font-family: Quicksand;    
    width: 100%;
    border-radius: 3px;
    border: 1px solid #dcdcdc;

    background-repeat: repeat-y;}


label {
    padding-bottom: 0px;
    font-size: 14px;
    font-weight: 700;
    font-family: Quicksand;
}


    .payment-choose-row {width: 100%; font-size: 14px; font-weight: bold;position: relative; padding:10px 10px 10px 55px; border-radius: 6px;transition: all .2s;cursor: pointer;margin-bottom: 5px}
    .payment-choose-row.active {background: #fff}
    .payment-choose-row:hover {background: #fff;}
    .payment-choose-row::after {content: "";display: inline-block;position: absolute;top: 10px;left: 10px;width: 44px;height: 22px;z-index: 10;}
    .payment-choose-row::before {content: "";display: inline-block;position: absolute;top: 10px;right: 0px;width: 44px;height: 22px;z-index: 10;background: url(../img/checkfalse.png) no-repeat left center;}
    .payment-choose-row.active::before {content: "";display: inline-block;position: absolute;top: 10px;right: 0px;width: 44px;height: 22px;z-index: 10;background: url(../img/checktrue.png) no-repeat left center;}
    .payment-choose-row.ideal::after {background: url(../img/ideal.svg) no-repeat left center;}
    .payment-choose-row.ccard::after {background: url(../img/creditcard.svg) no-repeat left center;}
    .payment-choose-row.klarna::after {background: url(../img/klarnapaylater.svg) no-repeat left center;}
    .

    hr {border-color: #fff;margin-top: 10px!important;;margin-top: 10px!important}

    .payment-choose-row .cpay {margin-right: 15px; }
    .bank-select {width: 100%;padding: 5px;}

    ul.bank-select {width: calc(100% + 25px);}
    ul.bank-select li{float: left; width: calc(25% - 10px);margin: 5px;text-align: left;padding: 5px; border-radius: 5px;border: .55px solid #eee;background: #fff;font-size: 12px;font-weight: bold;white-space: nowrap;transition: all .2s;}
    ul.bank-select li.active{border: .55px solid #9bb6dc;background: #edf7fb;}
    ul.bank-select li img{margin-right: 5px;}

    .pay-btn {width: 150px;padding:7px 0px; text-align:center; color:#fff; background:#000;font-weight: bold; margin-top: 20px;border-radius:5px;cursor: pointer;transition: all .2s;}
    .pay-btn:hover {background:#0f7aa2;}


.sozlesme-alani {
    display: none;
    position: fixed;
    padding: 30px;
    width: 60%;
    top: 10%;
    left: 20%;
    height: 80vh;
    color: #000;
    background: rgba(255,255,255,1);
    border: 1px solid #ccc;
    border-radius: 10px;
    box-shadow: inset 0px 0px 2px #fff;
    z-index: 9999999999999;
}

.sozlesme-aktif-alan {
    width: 100%;
    height: 100%;
    overflow: scroll;
}



.sozlesme-aktif-alan .title {
    font-size: 21px;
    font-weight: 700;
}


.close-modal-sz {
    font-size: 21px;
    font-weight: 700;
    cursor: pointer;
}


.menu-cont { color: #000;font-size: 15px;display: flex;margin: auto;justify-content: space-between;justify-content: center;padding:10px 0px;position: relative;margin-top:0px;z-index:12}
.menu-cont span {padding:10px 30px;}
.subitem {position: absolute; top: 0px; left: 60px; width:200px; padding: 0px!important;font-size: 15px;z-index: 2;color: #000!important;text-align: left!important;font-weight: 500;display: none;transition: all .3s;}
.topitem a span {position: relative;cursor: pointer;padding:10px 0px!important;margin:0px 30px;font-size: 18px;font-family: Assistant; font-weight: 400;color:#000}
.topitem a span:after {
    position: absolute;
    content: "";
    width: 1%;
    height: 3px;
    right: 48%;
    bottom: 0px;
    left: auto;
    z-index: -1;
    background: #fff;
    opacity: 0;
    transition: all .25s ease-in-out;
}

.topitem a:hover span:after{
    width: 100%;
    right: 0%;
    left: auto;
    z-index: 1;
    background: #fbd300;
    opacity: 1;
}

.topitem {z-index: 111;}
.subitem {
    position: absolute!important; top: 38px; left: 0px; width:100%; padding: 40px 20px!important;font-size: 15px;z-index: 2;justify-content: center;background: #fff;border-top:1px solid #fbd300;box-shadow: 0px 0px 5px #ddd;
    color: #000!important;text-align: left!important;font-weight: 500;display: none;transition: all .3s;
}
.subitem ul {padding-inline-start: 0px!important;margin-block-start: 0px;margin-block-end: 0px;}
.subitem ul li{transition: all .3s;}
.subitem ul li a{color: #000!important;}
.subitem ul li:hover{background: #fcd500;color: #000;}
.topitem:hover .subitem {display: flex;}
ul.subitemul  {margin-left:20px}
.subitemul li {padding:3px 20px!important;cursor: pointer;font-size:13px; font-weight: normal!important;font-style: italic;color: #444}

span.conceptlogo {
    position: relative;font-family: Avoda;color:#d5d5d5;font-size:96px;font-weight: bold
}
span.conceptlogo:after {
    content: 'CONCEPTSTORE';
    font-family: Avoda;
    position: absolute;
    top: 35px;
    left: -90px;
    font-size: 41px;
    color: #000;
    font-weight: bold;
}

.logo-cont {height:130px;text-align:center;position: relative;padding-top:0px;background:#fff;z-index: 1;}

ul.favcat {width:100%;padding-inline-start: 0px!important}
ul.favcat li.cat-item {float:left; width:20%; padding:2px; aspect-ratio: .6}
ul.favcat li.cat-item .catarea {width:100%; height: 100%; background: #fff;border-radius: 0%;display: flex;justify-content: center; align-items: center;flex-direction: column;}
ul.favcat li.cat-item .catarea .named{color:#fff; font-weight: bold; font-size: 21px;text-shadow: 0px 1px 1px #000}
ul.favcat li.cat-item .catarea .shopped{color:#fff; font-weight: bold; font-size: 12px;text-shadow: 0px 1px 1px #000}
ul.favcat li.cat-item .catarea .shopped span{color:#000; background: #fff; padding:4px 15px; font-size: 11px;text-shadow: 0px 1px 1px #fff;font-weight: normal;display: inline-block;width: 100%;cursor: pointer;transition: all .3s}
ul.favcat li.cat-item .catarea .shopped span:hover{color:#fff; background: #000;text-shadow: 0px 1px 1px #000}


@media (max-width: 33.98rem){
    .deskmenu-cont{display:none}
    .mainBanner{display:none}
    .favcat-cont{display:none}
}






    .usermenu{transform: scaley(0);position:absolute;top:-2px; left:-202px; width: 200px; padding: 10px;color: #3a3a3a; background:#fff;border:1px solid #ccc;text-align: left;z-index: 5;transition: all .3s;} 
    .usermenucont:hover .usermenu {transform: scaley(1);} 



.sec-center {
  max-width: 100%;
  text-align: center;
  z-index: 200;
  padding: 0px;
  z-index: 9;
}
[type="checkbox"]:checked,
[type="checkbox"]:not(:checked){
  position: absolute;
  left: -9999px;
  opacity: 0;
  pointer-events: none;
}
.dark-light:checked + label,
.dark-light:not(:checked) + label{
  position: fixed;
  top: 40px;
  right: 40px;
  z-index: 20000;
  display: block;
  border-radius: 50%;
  width: 46px;
  height: 46px;
  cursor: pointer;
  transition: all 200ms linear;
  box-shadow: 0 0 25px rgba(255,235,167,.45);
}
.dark-light:checked + label{
  transform: rotate(360deg);
}
.dark-light:checked + label:after,
.dark-light:not(:checked) + label:after{
  position: absolute;
  content: '';
  top: 1px;
  left: 1px;
  overflow: hidden;
  z-index: 2;
  display: block;
  border-radius: 50%;
  width: 44px;
  height: 44px;
  background-color: #102770;
  background-image: url('https://assets.codepen.io/1462889/moon.svg');
  background-size: 20px 20px;
  background-repeat: no-repeat;
  background-position: center;
  transition: all 200ms linear;
  opacity: 0;
}
.dark-light:checked + label:after {
  opacity: 1;
}
.dark-light:checked + label:before,
.dark-light:not(:checked) + label:before{
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: 1;
  display: block;
  border-radius: 50%;
  width: 46px;
  height: 46px;
  background-color: #48dbfb;
  background-image: url('https://assets.codepen.io/1462889/sun.svg');
  background-size: 25px 25px;
  background-repeat: no-repeat;
  background-position: center;
  transition: all 200ms linear;
}
.dark-light:checked + label:before{
  background-color: #000;
}
.light-back{
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  background-color: #fff;
  overflow: hidden;
  background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/1462889/pat-back.svg');
  background-position: center;
  background-repeat: repeat;
  background-size: 4%;
  height: 100%;
  width: 100%;
  transition: all 200ms linear;
  opacity: 0;
}
.dark-light:checked ~ .light-back{
  opacity: 1;
}
.dropdown:checked + label,
.dropdown:not(:checked) + label{
  position: relative;
  font-size: 16px;
  transition: all 200ms linear;
  letter-spacing: -.5px;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  text-align: center;
  cursor: pointer;
  color: #fff;
}
.dark-light:checked ~ .sec-center .for-dropdown{
  color: #fff;
}
.dropdown:checked + label:before,
.dropdown:not(:checked) + label:before{
  position: fixed;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 100%;
  z-index: -1;
  cursor: auto;
  pointer-events: none;
}
.dropdown:checked + label:before{
  pointer-events: auto;
}
.dropdown:not(:checked) + label .username-cont:after {
  transition: transform 200ms linear;
}
.dropdown:checked + label .username-cont:after {
  transform: rotate(180deg);
  transition: transform 200ms linear;
}
.section-dropdown {
  position: absolute;
  padding: 0px;
  background-color: #fff;
  top: 40px;
  left: 0;
  color: #000;
  text-align: left;
  width: 225px;
  border-radius: 4px;
  display: block;
  box-shadow: 0 14px 35px 0 rgba(9,9,12,0.4);
  z-index: 2;
  opacity: 0;
  pointer-events: none;
  transform: translateY(20px);
  transition: all 200ms linear;
}
.dark-light:checked ~ .sec-center .section-dropdown {
  background-color: #fff;
  box-shadow: 0 14px 35px 0 rgba(9,9,12,0.15);
}
.dropdown:checked ~ .section-dropdown{
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.section-dropdown:before {
  position: absolute;
  top: -20px;
  left: 0;
  width: 180px;
  height: 20px;
  content: '';
  display: block;
  z-index: 1;
}
.section-dropdown:after {
  position: absolute;
  top: -7px;
  left: 30px;
  width: 0; 
  height: 0; 
  border-left: 8px solid transparent;
  border-right: 8px solid transparent; 
  border-bottom: 8px solid #fff;
  content: '';
  display: block;
  z-index: 2;
  transition: all 200ms linear;
}
.dark-light:checked ~ .sec-center .section-dropdown:after {
  border-bottom: 8px solid #fff;
}

.dark-light:checked ~ .sec-center .section-dropdown a {
  color: #102770;
}

.dark-light:checked ~ .sec-center .section-dropdown a:hover {
  color: #ffeba7;
  background-color: #102770;
}

.dropdown-sub:checked + label,
.dropdown-sub:not(:checked) + label{
  position: relative;
  color: #fff;
  transition: all 200ms linear;
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  font-size: 15px;
  border-radius: 2px;
  padding: 5px 0;
  padding-left: 20px;
  padding-right: 15px;
  text-align: left;
  text-decoration: none;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  align-items: center;
  justify-content: space-between;
    -ms-flex-pack: distribute;
    cursor: pointer;
}
.dropdown-sub:checked + label .fa,
.dropdown-sub:not(:checked) + label .fa{
  font-size: 18px;
}
.dropdown-sub:not(:checked) + label .fa {
  transition: transform 200ms linear;
}
.dropdown-sub:checked + label .fa {
  transform: rotate(135deg);
  transition: transform 200ms linear;
}
.dropdown-sub:checked + label:hover,
.dropdown-sub:not(:checked) + label:hover{
  color: #102770;
  background-color: #ffeba7;
}
.dark-light:checked ~ .sec-center .section-dropdown .for-dropdown-sub{
  color: #102770;
}
.dark-light:checked ~ .sec-center .section-dropdown .for-dropdown-sub:hover{
  color: #ffeba7;
  background-color: #102770;
}

.section-dropdown-sub {
  position: relative;
  display: block;
  width: 100%;
  pointer-events: none;
  opacity: 0;
  max-height: 0;
  padding-left: 10px;
  padding-right: 3px;
  overflow: hidden;
  transition: all 200ms linear;
}
.dropdown-sub:checked ~ .section-dropdown-sub{
  pointer-events: auto;
  opacity: 1;
  max-height: 999px;
}
.section-dropdown-sub a {
  font-size: 14px;
}
.section-dropdown-sub a .fa {
  font-size: 18px;
}

.dark-light:checked ~ .logo img{
  filter: brightness(10%);
}

.hr {margin: 5px 0px}
.user-desktopmenu-item {margin: 3px 0px;padding: 3px 10px}

.imenu-cont {width:100%;margin-top:0px;}
.imenu-cont span{font-size:12px;margin-right:10px;cursor: pointer;transition: all .3s;color:#ccc;font-family: 'Nunito'}
.imenu-cont span:hover{color:#000;}

