/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 */

   

::placeholder {
    color: #ffffff4d;
    opacity: 1;
}

::-webkit-input-placeholder {
    color: #ffffff4d;
}

::-moz-placeholder {
    color: #ffffff4d;
}

:-ms-input-placeholder {
    color: #ffffff4d;
}

::-ms-input-placeholder {
    color: #ffffff4d;
}
* {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    scrollbar-width: none; /* For Firefox */
}

*::-webkit-scrollbar {
    display: none; /* For Chrome, Safari, and Opera */
}  


#flash-container {
    position: fixed;
    bottom: 180px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    z-index: 1000;
    width: 100%;
    pointer-events: none;
    flex-direction: column;
    align-items: center;
}

.flash {
    background-color: #00b8038a;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    display: flex;
    justify-content: space-between;
    height: 70px;
    min-height: 70px;
    align-items: center;
    padding: 15px 20px;
    margin: 10px;
    border-radius: 100px;
    max-width: 90%;
    transition: border-radius 0.3s ease;
    pointer-events: auto;
    box-shadow: inset 0 0 25px 1px #ffffffa6;
    color: #fff;
}

.flash span {
    flex-grow: 1;
}

.flash-close {
    background: none;
    border: none;
    font-size: 20px;
    color: #fff;
    cursor: pointer;
    margin-left: 10px;
}

.flash.sucess {
    background-color: #00b8038a;
    font-size: 1.3rem;
    color: #ffffff;

}

.flash.error {
    background-color: #ff0000aa;
    font-size: 1.3rem;
    color: #ffffff;
}

.flash.alert {
    background-color: #ff0000aa;
    font-size: 1.3rem;
    color: #ffffff;
}

.flash-text{
    color: #fff;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 1.3rem;
    line-height: 25px;
}

textarea, input[type="text"], input[type="submit"], input[type="password"], [type="email"] {-webkit-appearance: none;}
.w-webflow-badge {
    display:none !important;
}
/* 'star-rating' component */
.starRate {position:relative; margin:20px; overflow:hidden; zoom:1;}
.starRate ul {width:160px; margin:0; padding:0;}
.starRate li {display:inline; list-style:none;}
.starRate a, .starRate b {background:url('https://uploads-ssl.webflow.com/60ecc32f6b6419582ccbdd96/60f0893021a8c36841e9df16_star.svg') left top repeat-x;}
.starRate a {float:right; margin:0 80px 0 -144px; width:80px; height:34px; background-position:left 16px; color:#000; text-decoration:none;}
.starRate a:hover {background-position:left -32px;}
.starRate b {position:absolute; z-index:-1; width:80px; height:34px; background-position:left -34px;}
.starRate div b {left:0px; bottom:0px; background-position:left top;}
.starRate a span {position:absolute; left:-300px;}
.starRate a:hover span {left:90px; width:100%;}
.rating {
    overflow: hidden;
    display: flex;
    flex-direction: row-reverse;
}
.rating-input {
    float: right;
    width: 42px;
    height: 40px;
    padding: 0;
    margin-left: -32px;
    opacity: 0;
}
.rating-star {
    position: relative;
    float: right;
    display: block;
    width: 42px;
    height: 40px;
    background: url('https://uploads-ssl.webflow.com/60ecc32f6b6419582ccbdd96/60f0893021a8c36841e9df16_star.svg') 0 -40px;
}
.rating:hover .rating-star:hover,
.rating:hover .rating-star:hover ~ .rating-star,
.rating-input:checked ~ .rating-star {
    background-position: 0 0;
}
.rating-star,
.rating:hover .rating-star {
    position: relative;
    float: right;
    display: block;
    width: 42px;
    height: 40px;
    background: url('https://uploads-ssl.webflow.com/60ecc32f6b6419582ccbdd96/60f0893021a8c36841e9df16_star.svg') 0 -40px;
}

@media (min-width: 768px) {
    .flash {
        border-radius: 40px;
    }
}

@media (max-width: 767px) {
    #flash-container {
        bottom: 10vh;
    }
    .flash-text {
        font-size: 1rem;
        line-height: 20px;
    }    
}