/*
Theme Name:   	Juliette - A store front  theme
Author:       	Tool Ltd
Author URI:     http://stuartduff.com
Description:  	This is a  custom template for the Juliette Armand website
Version:      	1.0.0
License URI:  	http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  	ja_domain
*/


/*
 * Add your own custom css below this text.
 */

 .cat-responsive-bg {
    background-image: var(--mobile-bg);
}

@media (min-width: 992px) {
    .cat-responsive-bg {
        background-image: var(--desktop-bg);
    }
}

.modal {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Stay in place */
    z-index: 9999;
    /* Sit on top */
    left: 0;
    top: 0;
    width: 100%;
    /* Full width */
    height: 100%;
    /* Full height */
    overflow: auto;
    /* Enable scroll if needed */
    background-color: rgb(0, 0, 0);
    /* Fallback color */
    background-color: rgba(0, 0, 0, 0.4);
    /* Black w/ opacity */
}


/* Modal Content/Box */

.modal-content {
    background-color: #fefefe;
    margin: 5% auto;
    /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
    /* Could be more or less, depending on screen size */
}


/* The Close Button */

.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}



.ubermenu-icon.fas.fa-search {
    font-size: 16px!important;
}

div.product .price {
    text-decoration: none;
}

div.product .price .sep:before,
div.product .price span.price .sep:before,
.sep:before {
    content: "\2014";
    margin: 0 3px;
}

div.product .price del {
    opacity: 1!important;
    display: inline-block;
}

.woocommerce div.product .price del>.woocommerce-Size,
.woocommerce div.product .price del>.sep,
.woocommerce div.product .price span.price del>.woocommerce-Size,
.woocommerce div.product .price span.price del>.sep {
    opacity: 1;
    display: inline-block;
    text-decoration: none;
}

.woocommerce div.product .price del>.woocommerce-Price-amount {
    opacity: 0.5;
    display: inline-block;
    text-decoration: line-through;
}

.woocommerce div.product .price ins {
    text-decoration: none!important;
}

.woocommerce div.product .price ins>.woocommerce-Size {
    display: none;
}

.woocommerce div.product .price ins>.sep:before {
    content: none;
}

#navline {
    transition: all 0.2s linear;
}


.ubermenu-submenu-type-flyout {
    padding: 20px 15px!important;
}

.ubermenu-target-description.ubermenu-target-text {
    white-space: normal;
}

.hustle-ui.module_id_18 .hustle-main-wrapper {
    padding-top: 0!important;
}

.main-header form.search.open {
    z-index: 9999!important;
}

.main-header #main-nav-wrap2 .mini-cart,
.main-header #main-nav-wrap2 a.search {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.item .background p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    /* start showing ellipsis when 3rd line is reached */
    white-space: pre-wrap;
    /* let the text wrap preserving spaces */
    width: 100%;
    min-height: 45px;
}

#menu-item-38772 .ubermenu-item-level-2.ubermenu-column:not(:last-child) {
    border-right: 1px solid #ccc;
}

li.ubermenu-current-menu-item>a,
li.ubermenu-current-menu-ancestor>a {
    -webkit-text-stroke: 0.5px #000;
}

.sr-only {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.visible-hidden {
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.visible-hidden:focus {
    clip: auto;
    height: auto;
    overflow: auto;
    position: absolute;
    width: auto;
}

.hustle-ui.hustle-inline:not(.hustle-size--small):first-child {
    margin-top: 0;
    margin-bottom: 0!important;
}

.woosb-products .woosb-product>div:last-child {
    text-align: start!important;
}

.woosb-wrap {
    margin-top: 20px;
    margin-bottom: 25px;
}

.wwp_wholesaler_registration input[type="submit"] {
    background-color: #622066 !important;
}


/***Custom Styles for WP-Country****/

.country_selector_modal_stay {
    background: none;
    color: #000;
    font-weight: normal;
    font-size: 100%;
}

.country_selector_modal_stay:hover {
    color: #57c9e8;
}

.country_selector_modal .wordpress-country-selector-modal-content {
    border-radius: 0px;
}

.country_selector_modal .wordpress-country-selector-modal-body {
    padding: 80px 20px;
}

p.country_selector_seems_text {
    font-size: 36px;
    line-height: 40px;
    margin-bottom: 70px!important;
}

.flag-icon-gr_en {
    background-image: url(https://www.juliettearmand.com/wp-content/uploads/flags/icon-gr-en-flag.png);
}

.flag-icon-gr {
    background-image: url(https://www.juliettearmand.com/wp-content/uploads/flags/icon-gr-flag.png);
}

.flag-icon-un {
    background-image: url(https://www.juliettearmand.com/wp-content/uploads/flags/icon-international-flag.png);
}

button.country_selector_modal_close {
    background-color: #fff;
    font-size: 200%;
    color: #585858;
}

button.country_selector_modal_close:hover {
    color: #000;
}

.country_selector_modal_goto {
    font-size: 125%;
    background-color: #0298d2;
    padding: .8em;
}

.country_selector_modal_goto:hover {
    color: #fff;
    background-color: #848484!important;
    text-decoration: underline;
}

.country_selector_modal p {
    margin-bottom: 40px;
}

@media (max-width: 576px) {
    .country_selector_modal_goto {
        display: block;
        margin-bottom: 25px;
    }
    .country_selector_modal_goto:nth-child(2) {
        margin-left: 0px;
        margin-top: 25px;
    }
}

@media (min-width: 768px) {
    .country_selector_modal_goto:nth-child(2) {
        margin-left: 10px;
    }
}


/****WPSL Custom Styles****/

.wpsl-input label,
#wpsl-radius label,
#wpsl-category label {
    width: auto!important;
}


/****WPSL Custom Styles****/

.wpsl-search {
    background: none;
    margin: 0 0;
    padding: 40px 0
}

.wpsl-input label,
#wpsl-radius label,
#wpsl-category label {
    width: auto!important;
}

.storecat {
    display: block;
    font-size: 85%;
    line-height: 85%;
    margin-bottom: 15px;
}

.storecat_809 .storecat {
    color: #622066;
}

.storecat_813 .storecat {
    color: #622066;
}

.storecat_810 .storecat {
    color: #ed6b08;
}

.storecat_812 .storecat {
    color: #ed6b08;
}

.storecat_811 .storecat {
    color: #57c9e8;
}

.storecat_814 .storecat {
    color: #57c9e8;
}

.wpsl-street,
.wpsl-city,
.wpsl-contact-details span {
    font-size: 1Rem;
    line-height: 110%;
}

.wpsl-store-details.wpsl-store-listing {
    color: #949494;
}

#wpsl-search-wrap div {
    margin-right: auto;
    margin-left: auto;
}

#wpsl-search-wrap div.row {
    width: 100%;
}

#wpsl-search-wrap div.container {
    overflow: auto;
    float: unset;
}

#wpsl-search-wrap div label {
    float: left;
    margin-right: 10px;
    line-height: 36px;
}

#wpsl-search-wrap div ul li label {
    line-height: 14px;
    font-size: 0.8em;
}

#wpsl-search-btn {
    background: #622066;
    color: #fff;
    font-size: 16px;
    padding: .4em .8em;
    height: 40px;
}

#wpsl-search-btn:hover {
    background: #100211;
    ;
}

.slresults {
    padding-bottom: 30px;
    overflow: auto;
}

#wpsl-result-list {
    float: right!important;
    margin-right: 0 !important;
    width: 33.5%!important;
}

#wpsl-result-list li p.storename {
    font-size: 1rem;
    margin-bottom: 5px;
}

#wpsl-result-list li.wpsl-preloader {
    position: relative;
    padding-left: 40px;
}

.wpsl-store-hours {
    font-size: 0.875rem;
    color: #2e2e2e;
}

#wpsl-result-list .wpsl-contact-details span {
    margin-bottom: 10px;
}

.wpsltop-formctrl {
    border-radius: 0px;
    width: 220px!important;
    min-width: 220px!important;
    display: inline-block;
    font-size: 16px;
    color: #000;
    line-height: 1.3;
    height: 40px!important;
    padding: .6em 1.4em .5em .8em;
    max-width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    border: 1px solid #aaa!important;
    border-right: 0px!important;
    border-radius: 0px!important;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
}

.wpsltop-formbtn {
    border-radius: 0px;
    width: 45px;
    display: inline-block;
    font-size: 16px;
    color: #000;
    line-height: 1.3;
    padding: .4em .8em;
    height: 40px!important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    border: 1px solid #622066;
    border-left: 0px;
    border-radius: 0px!important;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: #622066;
}

.wpsltop-formbtn:hover {
    color: #fff;
    background: #000
}

.banner--main.findUs {
    height: auto;
    min-height: 400px;
}

.wpsl-dropdown {
    height: 40px;
}

#wpsl-results-dropdown.wpsl-dropdown {
    width: 60px;
}

#wpsl-gmap {
    float: left!important;
}

#wpsl-wrap #wpsl-result-list li {
    border: none;
}

.wpsl-mobile #wpsl-gmap {
    height: 450px!important;
}

.wpsl-mobile #wpsl-result-list {
    height: auto!important;
}

@media only screen and (max-width:767px) {
    #wpsl-wrap #wpsl-result-list {
        width: 100%!important;
        margin-top: 30px;
    }
    div.storeslist {
        height: auto!important;
    }
    #wpsl-wrap #wpsl-result-list li {
        margin-bottom: 30px;
    }
    #wpsl-search-wrap div.row {
        margin-right: 15px;
        margin-left: 15px;
        width: unset;
    }
    #wpsl-category {
        width: 100%;
        margin-bottom: 15px;
    }
    #wpsl-search-btn {
        display: block;
        width: 100%;
    }
    #wpsl-radius,
    #wpsl-results {
        margin-bottom: 15px;
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .ml-30 {
        margin-left: 15px;
    }
    #wpsl-wrap #wpsl-result-list {
        float: right!important;
        margin-right: 0 !important;
        width: 40%!important;
    }
    #wpsl-gmap {
        width: 60%;
    }
    #wpsl-wrap #wpsl-result-list li {
        margin-bottom: 50px;
        margin-left: 20px;
        padding-left: 0px
    }
}

.icon.icon-refresh-inv::after {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background-image: url(dist/assets/images/arrows-ccw-white.svg);
    background-repeat: no-repeat
}

.icon.icon-magnifier-inv::after {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background-image: url(dist/assets/images/icon-magnifier-white.svg);
    background-repeat: no-repeat
}

button>.icon {
    margin-bottom: -2px;
}

.wpsl-directions {
    font-size: .85rem;
    color: #00a1df;
}

.landingbg {
    /* background-image: url(dist/assets/images/MG_4791-more-grey.jpg); */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 30% 50%;
    height: var(--height);
}

.langpgcontainer {
    padding-top: 20%;
    height: calc(100vh - 2px);
    position: relative;
    height: var(--height);
}

.langselect {
    width: 100%;
    display: block;
    font-size: 16px;
    line-height: 1.3;
    padding: .6em 1.4em .5em .8em;
    max-width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    border: 0px solid #aaa;
    border-radius: 0;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    color: #2e2d2c;
    background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%207.3%2016%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23706f6f%3Bfill-rule%3Aevenodd%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eicon-double-arrow%3C%2Ftitle%3E%3Cg%20id%3D%22Layer_2%22%20data-name%3D%22Layer%202%22%3E%3Cg%20id%3D%22Layer_1-2%22%20data-name%3D%22Layer%201%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%223.65%2016%207.3%2011%200%2011%203.65%2016%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%223.65%200%207.3%205%200%205%203.65%200%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E);
    background-repeat: no-repeat, repeat;
    background-position: right .7em top 50%, 0 0;
    background-size: .65em auto, 100%;
}

.langbutton {
    color: #fff;
    background-color: #000;
    font-size: 16px;
    line-height: 1.3;
    border: 0px;
    border-radius: 0;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    width: 100%!important;
    text-align: center;
    padding-top: .6em;
    padding-bottom: .7em;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.langbutton:hover {
    background-color: rgb(36, 36, 36);
}

.formrow {
    position: absolute;
    bottom: 40px;
    width: 100%;
}

@media only screen and (min-width: 992px) {
    .landingbg {
        background-position: left 14%;
        min-height: calc(100vh - 1px);
    }
    .langpgcontainer {
        padding-top: 8%;
        min-height: calc(100vh - 2px);
    }
    .langbutton {
        width: auto;
        padding: .6em .8em .5em .8em;
    }
    .formrow {
        position: unset;
        margin-top: 20%;
    }
    .langselect {
        width: 99%;
    }
}

@media only screen and (min-width: 992px) {
    .ml-30 {
        margin-left: 30px;
    }
    #wpsl-wrap #wpsl-result-list {
        float: right!important;
        margin-right: 0 !important;
        width: 33.5%!important;
    }
    #wpsl-wrap #wpsl-result-list li {
        margin-bottom: 50px;
        margin-left: 40px;
        padding-left: 0px
    }
}


