@import 'app.css';
@import '../build/assets/app-ea959e11.css';

html, body{
    background-color: white;
}

.gold-background{
    background-color: #d6b884;
    /* background: -webkit-linear-gradient(170deg, #d6b884 49.5%, #976600 50%);
    background: -o-linear-gradient(170deg, #d6b884 49.5%, #976600 50%);
    background: -moz-linear-gradient(170deg, #d6b884 49.5%, #976600 50%);
    background: linear-gradient(170deg, #d6b884 49.5%, #976600 50%); */
}

.black-background{
    background-color: black;
}

.brown-background{
    background-color: #976600;
}


.join-button{
    background-color: #976600;
    color: white;
}

.join-button:focus{
    box-shadow: 0px 0px 2px 2px #d6b884;
}

.join-button:active{
    box-shadow: 0px 0px 2px 2px #d6b884;
}

.nl-button{
    background-color: #d6b884;
    color: white;
}

.nl-button:focus{
    box-shadow: 0px 0px 2px 2px #d6b884;
}

.nl-button:active{
    box-shadow: 0px 0px 2px 2px #d6b884;
}


.form-fields-box-shadow:focus{
    border-color: #d6b884;
    box-shadow: 0px 0px 2px 2px #d6b884;
}

.form-fields-box-shadow:active{
    border-color: #d6b884;
    box-shadow: 0px 0px 2px 2px #d6b884;
}


.align-last-center{
    text-align-last: center;
}



.formst{
    margin-left:30%;
    margin-right:30%;
}

.formst .butd .btn{
    border: none;
    color: white;
    width: 80%;
    background-color: #d6b884;
    padding: 10px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 20px;
    margin: 4px 2px;
    cursor: pointer;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

.formst .butd .btn:hover{
    color: white;
    background-color: #d6b884;
}

.formst .butd .btn:focus{
    color: white;
    background: #d6b884;
}

.formst .butd .btn:active{
    color: white;
    background: #d6b884;
}

.formst .butd{
    margin-top: 40px;
    width: 100%;
    text-align: center;
}

@media (max-width: 1024px) {
    .formst{
        margin-left:25%;
        margin-right:25%;
    }
}

@media (max-width: 991px) {
    .formst{
        margin-left:20%;
        margin-right:20%;
    }
}

@media (max-width: 768px) {
    .formst{
        margin-left:15%;
        margin-right:15%;
    }
}

@media (max-width: 640px) {
    .formst{
        margin-left:5%;
        margin-right:5%;
    }
}

@media (min-width: 768px) {

    .formst .butd{
        padding-left: 80px;
        padding-right: 80px;
    }
}

@media (max-width: 1024px) {
    .formst .butd .btn{
        width: 80%;
    }
}

@media (max-width: 991px) {
    .formst .butd .btn{
        width: 80%;
    }
}

@media (max-width: 768px) {
    .formst .butd .btn{
        width: 60%;
    }
}

@media (max-width: 480px) {
    .formst .butd .btn{
        width: 80%;
    }
}

.border-white{
    border-color: white;
}


#disc-mess-cont{
    background-color: #d6b884; 
    color: white;
    border-radius: 10px 10px 10px 10px;
    border: 4px solid #976600;
    font-size: large;
}


.footer-links{
    color: white;
    list-style: none;
    text-align: center;
}

.footer-links li{
    margin-top: 10px;
}

.footer-lnk{
    color: white;
    text-decoration: none;
}

.footer-lnk:hover{
    color: white;
    text-decoration: none;
}

.instagram-link{
    width: 30px;
    height: 30px;
    background: url('../website_images/instagram-white.png') no-repeat 0 center;
    background-size: contain;
    /* margin: auto;
    position: relative; */
    margin-left: 10px;
    display: block;
    background-color: transparent;
}

.twitter-link{
    width: 30px;
    height: 30px;
    background: url('../website_images/twitter-white.png') no-repeat 0 center;
    background-size: contain;
    /* margin: auto;
    position: relative; */
    margin-left: 10px;
    display: block;
    background-color: transparent;
}

.youtube-link{
    width: 30px;
    height: 30px;
    background: url('../website_images/youtube-white.png') no-repeat 0 center;
    background-size: contain;
    /* margin: auto;
    position: relative; */
    margin-left: 10px;
    display: block;
    background-color: transparent;
}


.facebook-link{
    width: 30px;
    height: 30px;
    background: url('../website_images/facebook.png') no-repeat 0 center;
    background-size: contain;
    /* margin: auto;
    position: relative; */
    margin-left: 10px;
    display: block;
    background-color: transparent;
}


.android-link{
    width: 50px;
    height: 50px;
    background: url('../website_images/android-logo.png') no-repeat 0 center;
    background-size: contain;
    /* margin: auto;
    position: relative; */
    margin-left: 10px;
    display: block;
    background-color: transparent;
}

.apple-link{
    width: 50px;
    height: 50px;
    background: url('../website_images/apple-logo.png') no-repeat 0 center;
    background-size: contain;
    /* margin: auto;
    position: relative; */
    margin-left: 10px;
    display: block;
    background-color: transparent;
}