/* Contains CSS extracted from Unify's shop.style.css, which can't be included in full because it messes up the theme. */

/*Filter By Block
------------------------------------*/
/*Panel Group*/
.filter-by-block h1 {
color: #fff;
width: 100%;
font-size: 24px;
padding: 7px 10px;
text-align: center;
margin-bottom: 5px;
background: #18ba9b;
text-transform: uppercase;
}

.filter-by-block .panel-default {
border-color: #dedede;
}

.filter-by-block .panel-heading {
padding: 0;
background: inherit;
}

.filter-by-block .panel-title {
overflow: hidden;
}

.filter-by-block .panel-group h2 a {
color: #687074;
display: block;
font-size: 20px;
padding: 10px 15px;
border-bottom: 1px solid #dedede;
}

.filter-by-block .panel-group h2 i {
float: right;
font-size: 18px;
margin-top: 8px;
}

.filter-by-block .panel-group h2 a:hover {
color: #687074;
text-decoration: none;
}

.filter-by-block .panel-body {
padding: 15px 20px;
border-top: none !important;
}


/*Checkbox List*/
.checkbox-list {
margin-bottom: 0;
}

.checkbox-list li {
margin-top: 10px;
}

.checkbox-list li:first-child {
margin-top: 0;
}

.checkbox-list .checkbox {
display: block;
overflow: hidden;
position: relative;
}

.checkbox-list .checkbox {
color: #999;
margin: 4px 0;
cursor: pointer;
font-size: 14px;
line-height: 25px;
padding-left: 27px;
}

.checkbox-list .checkbox input {
left: -9999px;
position: absolute;
}

.checkbox-list .checkbox i {
left: 0;
top: 5px;
width: 15px;
height: 15px;
outline: none;
display: block;
background: #fff;
border-width: 2px;
position: absolute;
border-style: solid;
}

/*.checkbox-list .checkbox input + i:after {
opacity: 0;
position: absolute;
}

.checkbox-list .checkbox input:checked + i:after {
opacity: 1;
}


*/
.checkbox-list .checkbox input + i svg {
opacity: 0;
}

.checkbox-list .checkbox input:checked + i svg {
opacity: 1;
display:block;
margin:auto;
}



.checkbox-list .checkbox input + i:after {
top: -3px;
left: -2px;
width: 15px;
height: 15px;
content: '\f00c';
text-align: center;
font-family: "Font Awesome 5 Light";
}


.checkbox-list .checkbox i {
border-color: #8bdccd;
-ms-transition: border-color 0.3s;
-moz-transition: border-color 0.3s;
-webkit-transition: border-color 0.3s;
}

.checkbox-list .checkbox:hover i {
border-color: #18ba9b;
}

.checkbox-list .checkbox input:focus + i {
border-color: #18ba9b;
}

.checkbox-list .checkbox input + i:after {
color: #18ba9b;
}
.checkbox-list .checkbox input:checked + i {
border-color: #18ba9b;
}

.checkbox-list .checkbox small {
float: right;
}

.checkbox-list .checkbox small a {
color: #18ba9b;
font-size: 12px;
}


/*Shopcart table*/
.shopping-cart .table {
font-family: 'Open Sans', sans-serif;
}

.shopping-cart .table > tbody > tr > td {
color: #888;
}

.shopping-cart .table > tbody > tr > td.shop-red {
color: #c9253c;
}

.shopping-cart .table > thead > tr > th,
.shopping-cart .table > tbody > tr > th,
.shopping-cart .table > tfoot > tr > th,
.shopping-cart .table > thead > tr > td,
.shopping-cart .table > tbody > tr > td,
.shopping-cart .table > tfoot > tr > td {
border-top: none;
vertical-align: middle;
}

.shopping-cart .table > thead > tr > th,
.shopping-cart .table > tbody > tr > td {
padding: 15px;
text-align: center;
}

.shopping-cart .table > thead > tr > th {
color: #687074;
font-size: 16px;
font-weight: 400;
padding-bottom: 20px;
text-transform: uppercase;
}

/*Quantity Field Form*/
.shopping-cart .quantity-button {
color: #888;
width: 45px;
height: 40px;
padding: 5px;
border: none;
outline: none;
cursor: pointer;
font-size: 18px;
background: #eee;
text-align: center;
font-weight: normal;
white-space: nowrap;
display: inline-block;
background-image: none;
}

.shopping-cart .quantity-field {
width: 45px;
height: 40px;
outline: none;
margin: 0 -4px;
font-size: 18px;
text-align: center;
display: inline-block;
border: 1px solid #eee;
}

/* Added to stop the spin box buttons from appearing in Firefox and Chrome */
input.quantity-field {
-moz-appearance: textfield;
}
input.quantity-field::-webkit-outer-spin-button,
input.quantity-field::-webkit-inner-spin-button {
-webkit-appearance: none;
}

/*Close*/
.shopping-cart .close {
opacity: 1;
color: #888;
font-size: 18px;
padding-right: 10px;
}

.shopping-cart .close:hover {
color: #555;
}
