body{
height: 100vh;
background: radial-gradient(#404040, #404040, #282828);
position:relative;
}
.logo_register{
display: block;
width: 40%;
margin: 0 auto;
margin-bottom:3rem;
max-width:18.75rem;
}
.formulary{
width:60%;
margin:auto;
padding-bottom: 2rem;
}
.input,
#gender_input{
border: 1px solid #000;
border-radius: 5px;
background: hsl(0, 0%, 100%, .1);
color: #fff;
max-height: 50px;
min-height: 40px;
font-size: 15px;
width:100%;
padding:0.5rem 1rem;
margin-bottom:1rem;
}
#country_selection,
.select_country{
color: #fff;
text-align:left;
margin-bottom:0.5rem;
}
#country_selection{
border-radius: 5px;
border: 2px solid rgb(248, 99, 14);
background-color: rgba(248, 100, 14, 0.52);
width: 15rem; 
text-align:center;
}

.locked{
width: 10px;
margin-right: 5px;
}
.register_input{
width: 100%;
}
.dropdown {
float: left;
overflow: hidden;
color:#000;
}
.dropdown .dropbtn {
cursor: pointer;
font-size: 1rem;  
border: none;
outline: none;
color: #fff;
padding: 0.5rem 1rem;
background-color: inherit;
width:100%;
margin: 0;
}
.dropdown-content {
display: none;
position: absolute;
background: hsl(0, 0%, 100%, .1);
min-width: 10rem;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
background-color:#232323;
z-index: 1;
}
.dropdown-content li {
float: none;
color: #fff;
padding: 0.8rem 1rem;
text-decoration: none;
display: block;
text-align: left;
}
.dropdown-content li:hover {
background-color: #fff;
color:#000;
}
.show {
display: block;
max-height: 200px;
overflow-x: hidden;

}
.select_country{
width:100%;
text-align:center;
}
.gender_block{
margin-bottom:0.5rem;
margin-top:0.5rem;
width:100%;
}
.register_option_gender{
text-align:left;
}
select option {
background-color:#232323;
color: #fff;
}
#error_box{
color: #721c24;
background-color: #f8d7da;
border-color: #f5c6cb;
font-size:1.1rem;
}
.page_button_block{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-pack: justify;
    -ms-flex-pack: justify;
        justify-content: space-between;
margin-bottom:20px;
}
.reset_text{
width:100%;
text-align:center;
margin-bottom:20px;
margin-top:20px 
}
/*temporary not used, don't delete untill same frase */
#location_popup{
 border-radius: 5px;
border: 2px solid rgb(248, 99, 14);
background-color: rgba(248, 100, 14, 0.52);
position:absolute;
right:1rem;  
top: 42%;
padding: 1rem 2rem;
max-width:20rem;
-webkit-transition: all 1s ease-out;
-o-transition: all 1s ease-out;
transition: all 1s ease-out;
}
#close_location_popup{
font-size:1.2rem;
font-weight:700;
color:#fff;
position:absolute;
top: 0.5rem;
right:0.5rem;
cursor:pointer;
opacity:0.6;
-webkit-transition: all 0.8s ease-out;
-o-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
}
#close_location_popup:hover{
opacity:1;
}
.location_popup_text{
 font-size:1rem;
font-weight:700;
color:#fff; 
text-align:center;  
}
/*temporary not used, don't delete same frase above */
.successfull_login{
font-size:1.2rem;
color:#fff;
}
.successfull_login_link{
font-size:1.2rem;
color:#fff;
font-weight:700;
text-decoration:none;
}
.successfull_login_link:hover{
color:#fff;
font-weight:700;
text-decoration:none;
}
@media only screen and (max-width:767px) {
#location_popup{
top: 12%;
padding: 0.5rem 1rem;
max-width:18rem;
-webkit-transition: all 1s ease-out;
-o-transition: all 1s ease-out;
transition: all 1s ease-out;
}
#location_popup_text{
font-size:0.9rem;
}
.btnCreate{
margin-bottom:1.5rem;
width:93%;
}
.formulary {
width: 93%;
padding-bottom: 1rem;
}
#country_selection {
width: 100%;
}
}