body {
    font-family: 'Tillana', cursive !important;
    background-position-x: 0%, 0%;
    background-position-y: 0%, 0%;
    background-repeat: repeat, repeat;
    background-attachment: scroll, scroll;
    background-size: auto, auto;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Tillana', cursive !important;
    font-weight: 800;
    color: #673500;
}

.h1title {
    color: rgb(227, 201, 157);
    font-size: 50px;
}

.h2title {
    font-size: 30px;
}

hr {
    background-color: rgba(160, 191, 62, 0.5);
    border-top: 2px solid rgba(0, 0, 0, .1);
    width: 250px;
    margin-top: -1rem;
    margin-bottom: 3rem;
}

p {
    font-family: 'Tillana', cursive !important;
    font-weight: 400;
    color: rgb(38, 38, 38);
    font-size: 20px;

}


/* Home*/
.h-100 {
    height: 100% !important;
}

.masthead {
    background: linear-gradient(to bottom, rgba(92, 77, 66, 0.8) 0%, rgba(92, 77, 66, 0.8) 100%);
    background-position-x: 0%, 0%;
    background-position-y: 0%, 0%;
    background-repeat: repeat, repeat;
    background-attachment: scroll, scroll;
    background-size: auto, auto;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;

}

.page-section {
    padding: 8rem 0;
    height: 700px !important;
}

.faverdeclaro {
    color: rgb(160, 191, 62);
}


.faverdeescuro {
    color: #0A6618 !important;
}

.faverdeescuro:hover {
    text-decoration: none !important;
    color: #673500 !important;
}


.arrow {
    text-align: center;
    margin: 8% 0;
    cursor: pointer;
    text-decoration: none;

}


.bounce {
    -webkit-animation: bounce 5s infinite;
    animation: bounce 5s infinite;
}

@-webkit-keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    40% {
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
    }

    60% {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
    }
}

@keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    40% {
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
    }

    60% {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
    }
}

.btnverde {
    background-color: #0A6618;
    width: 200px;
    border: none;
    box-shadow: 1px 1px 1px rgba(103, 53, 0, 0.5);
    color: white;
}

.btnverde:hover {
    background-color: #673500;
    color: white;
}


.btnverde:focus {
    outline: none !important;
    box-shadow: none !important;
}

.btnp {
    width: 200px;

}

.modal-header {
    border-bottom: none;
}

.cardp {
    background-color: transparent;
    border: solid 2px #0A6618;

}

/* Botão back to top */

#myBtn {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 99;
    border: none;
    outline: none;
    color: rgb(160, 191, 62);
    cursor: pointer;
    padding: 5px 12px 5px 12px;
    border-radius: 10px;
    font-size: 15px;
    background-color: transparent;
}

#myBtn:hover {
    color: #673500;

}



/* Login*/

.form-signin {
    width: 100%;
    max-width: 330px;
    padding: 15px;
    margin: auto;
}

.form-signin .checkbox {
    font-weight: 400;
}

.form-signin .form-control {
    position: relative;
    box-sizing: border-box;
    height: auto;
    padding: 10px;
    font-size: 16px;
}

.form-signin .form-control:focus {
    z-index: 2;
}

.form-signin input[type="email"] {
    margin-bottom: -1px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
    margin-bottom: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.form-control {
    color: rgb(38, 38, 38);
    background-color: transparent;
    border: solid 2px #0A6618;
}

.form-control:focus {
    color: rgb(38, 38, 38);
    background-color: transparent;
    border: solid 2px #673500;
    outline: 0;
    box-shadow: 1px 1px 5px rgba(103, 53, 0, 0.5);
}

label {
    font-family: 'Tillana', cursive !important;
    font-weight: 400;
    color: rgb(38, 38, 38);
    font-size: 20px;
}




/* Ranking */

.tablex {
    color: rgb(38, 38, 38);
    border: 1px solid #673500;
}

.theadx {

    color: rgb(38, 38, 38);
    border:2px solid #0A6618;

}

.table td,
.table th {
    border-top: 1px solid #673500;
    vertical-align: middle !important;
}

.table thead th {
    vertical-align: bottom;
    border-bottom: none !important;

}

.tdstatus{
    justify-content: center;
    display: grid;

}





/* Footer */
.footer{
position: static;
bottom: 0;
width: 100%;
height: 60px;
line-height: 60px;
}

.form-control-perfil{
    width:350px !important;
}

area{
    cursor: pointer;
}



/* Statusbar */

.btnsoundon{
background-color: transparent;
border: none;
color: #0A6618;
}


.btnsoundon:hover{
    color: #673500;
}



.btnsoundoff{
    background-color: transparent;
    border: none;
    color: #0A6618;
}

.btnsoundoff:hover{

 color: #673500;
}

.btnmagnify{
    background-color: transparent;
    border: none;
    color: #0A6618;
}


.btnmagnify:hover{
     color: #673500;
}




 .progressexcape {
    background-color: transparent;
    border: dashed 1px #673500;
}

.fa-size{
    font-size: 0.7em !important;
}

.close{
    text-shadow: none;
    color: #0A6618;
}

.close:hover{
    text-shadow: none;
    color: #673500;

}

.progressbarexcape{
    background-color: #0A6618 !important;
}


.modal-content-xcape{
    background-size: cover !important;
    display: flex !important;
    justify-content: center !important;
}

.magnify {
    position: relative;
    width: 100% !important;
    height: 100% !important;
    box-shadow: none;
    display: inline-block;
    z-index: inherit;
  }

/* Progressbar */
  .one, .two, .three{
    position:absolute;
	z-index:1;
	height:20px;
	width:20px;
    border-radius:25px;
    margin-top: -7px;

}
.one{
	left:25%;
}
.two{
	left:50%;
}
.three{
	left:75%;
}
.primary-color{
	background-color:#673500!important;
}
.success-color{
	background-color:#5cb85c;
}
.danger-color{
	background-color:#d9534f;
}
.warning-color{
	background-color:#f0ad4e;
}
.info-color{
	background-color:#3B7302;
}
.no-color{
	background-color:inherit;
}


.vermelho{
    color:#A61103;
}


.timerverde{
    color:#0A6618;
}

.timervermelho{
    color:#A61103;
}

.timeramarelo{
    color:#f0ad4e;
}