/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
.custom-select-fields {

    display: flex;

    flex-direction: column;

    width: 100%;

}
.custom-select-fields {

    display: flex;

    flex-direction: column;

    width: 100%;

}
 
.custom-select-fields select {

    width: 100%;

    height: 40px;

    font-size: 14px;

    -webkit-appearance: auto;

    /* margin: 10px 0px 0 0; */

    margin-bottom: 20px;

    color: #000;

    border-radius: 4px;

}
 
.custom-select-fields label {

    color: #555;

}
.custom-select-fields select {

    width: 100%;

    height: 40px;

    font-size: 14px;

    -webkit-appearance: auto;

    /* margin: 10px 0px 0 0; */

    margin-bottom: 20px;

    color: #000;

    border-radius: 4px;

}
.select-fileds-inner
{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top:20px;
}

input#school-search-input {
    margin-bottom: 0;
}


div#school-suggestions .suggestion-item:hover{background-color:#4274ff; color:#fff; padding: 10px;}
div#school-suggestions .suggestion-item{ padding:10px;}
div#school-suggestions {
    background: #fff;
    border: 1px solid #e8e8e8;
    overflow-y: auto;
    padding: 0px;
    cursor: pointer;
    max-height: 420px;
}
.select-drops{ display:flex; flex-direction: column; flex:0 0 47%;}

form.cart {
    display: block !important;
}
 
button.single_add_to_cart_button {
    margin: 0 !important;
}
.custom-select-fields {
    width: 70%;
}
.single_variation_wrap .woocommerce-variation-add-to-cart.variations_button {
    display: block !important;
}
.select-drops {
    position: relative;
    display: inline-block;
}

.school_loader {
    border: 4px solid #f3f3f3;
    border-radius: 50%;
    border-top: 4px solid #000;
    width: 20px;
    height: 20px;
    animation: spin 1.5s linear infinite;
    position: absolute;
    top: 40%;
    right: 100px;
    /* transform: translateY(-50%); */
    pointer-events: none;
}
.logo-price
{
    margin-bottom:0!important;
}
#collapse-div
{
    cursor: pointer;
}
.input-div
{
margin-bottom:5px;
}
.input-label
{
   width:80%!important;
   margin-left: 5px;
   font-weight: 600;
    cursor: pointer;
}
#school-icon
{
    vertical-align: middle;
    
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
@media screen and (max-width: 768px) {
.custom-select-fields
{
width: 100%!important;
}
}