html, body, canvas{
    width: 100%;
    height: 100%;
}

canvas{position: absolute; background-color:#ddd ; }

a{ text-decoration: none; color: rgb(221, 162, 0); }
a:hover{ color: rgb(165, 121, 1);}
a::selection{ color: rgb(221, 162, 0); }

.container-fluid{ 
    background-color: rgba(255,255,255,0.96); 
    padding-left: 0; 
    padding-right: 0; 
    position: relative;
    height: 100%;
    overflow: auto;
}

header .cnt-flag{height: 50px; position: relative; }
header .cnt-flag .flag{ float: left; height: 58%; margin-top: 2%; margin-right: 10px; cursor: pointer;  }
header .cnt-flag .flag img{ height: 100%; padding-left: initial; padding-right: initial; width: auto; }
header .cnt-flag .flag:active{ opacity: 0.7; }

header .cnt-flag .btn-flag{ background: #ffffff; border-radius: 4px; border: 1px solid #bf9809; margin-top: 10px; width: 180px; }

header img{ width: 100%; padding-left: 20%; padding-right: 20%; }

header.row{ margin-left: 0; margin-right: 0; }

header .info-text{ 
    
}

header .info-text .cnt-txt{
    font-size: 16px; 
    border:2px solid #bf9809; 
    width: 100%;
    padding: 6px 10px;
    margin-bottom: 18px;
    text-align: center;
}

.es{ display: none; }

.show-language{ display: block; }
.hidden-language{ display: none; }

.body-data.row{ margin-left: 0; margin-right: 0; }
.body-data h3{ text-align: center; color: #bf9809; } 
.body-data .cnt-img{ text-align: center; margin-top: 20px; margin-bottom: 40px; }
.body-data .img-data{ width: 120px; }

.body-info{
    font-size: 20px; 
    margin-left: 15px;
    margin-right: 15px;
    width: calc(100% - 30px);
    width: -moz-calc(100% - 30px);
    margin-bottom: 18px;
}

.row-form{ margin-left: 0; margin-right: 0; }

.cnt-form{
    margin-left: 15px;
    margin-right: 15px;
    width: calc(100% - 30px);
    width: -moz-calc(100% - 30px);
    margin-bottom: 18px;
    text-align: center;
}

.form-element{  max-width: 320px;  margin-left: auto; margin-right: auto; }

.cnt-form label{ text-align: left; }
.cnt-form span{ font-size: 14px; }
.cnt-form h3 span{ font-size: inherit; } 
.cnt-form input[type="text"],.cnt-form input[type="number"]{
    width: 100%;
    margin-bottom: 2px;
    border-radius: 5px;
    height: 35px;
    border: 1px solid #bf9809;
    padding-left: 6px;
    padding-right: 6px;
}

.cnt-form .input{ display: none; }
.cnt-form .label-btn{ text-align: center; }
.cnt-form button{ 
    background: #ffffff; 
    border-radius: 4px;
    border: 1px solid #bf9809;
    margin-top: 10px;
    width: 120px;
}

.cnt-form button span{ font-size: 18px; }

.float-form{ position: fixed; top:60px; right: 0; left: 49%; }

.return-up{ position: fixed; bottom: 15px;  width: 50px; height: 50px; right: 100px; cursor: pointer; display: none;  }
.return-up img{ width: 100%;} 
.return-up:active{ opacity: 0.7; }
.return-up-show{ display: block; }

@media (min-width:576px){
    header .info-text{width: 64.5%; margin-top: 20px; margin-left: calc( 1.5rem * .5 ); padding-right:0 ; }
    header img{ width: 140px; padding-left: 25px; padding-right: 25px; }
}

@media (min-width:768px){
    header .info-text{ margin-top: 58px; }
    header .info-text .cnt-txt{ font-size: 24px;}
    header img{ width: 240px;}
    .body-info{ width: 50%;  font-size: 20px; padding-left: calc( 3.5rem * .5 ); margin-right: 0; margin-left: 0; }
    .cnt-form{ width: 50%; padding-right: calc( 3.5rem * .5 ); margin-right: 0; margin-left: 0; }

    header .cnt-btn-app{ margin-top: 1%; }
}