html
{
   height: 100%;
}

body
{
   font-family: Ruda;
   background-color: #212e38;
   color: #87919a;
   height: 100%;
   overflow: hidden;
   margin: 0;
}

/*form
{
   display: flex;
   flex-direction: column;
   min-width: 350px;
}*/

input
{
   /*min-height: 20px;*/
   min-width: 200px;
   outline-border: 1px solid black;
   border: none;
   border-radius: 3px;
   /*margin: 7px;*/
   padding-left: 7px;
}

input[type="checkbox"]
{
   min-width: 0;
}

input:invalid
{
   outline-color: red;
}

button
{
   min-height: 20px;
   outline-border: 1px solid black;
   border: none;
   border-radius: 3px;
   margin: 7px;
   background-color: white;
}

p
{
   /*text-align: justify;*/
   margin: 5px;
}

.main
{
   display: flex;
   flex-direction: column;
   height: 100%;
}

.background
{
   background: url(../../images/site.jpg);
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   height: 68%;
}

.toolbox
{
   padding-left: 20px;
   padding-right: 20px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   height: 7%;
}

.link
{
   color: white;
   text-decoration: none;
}

.logo
{
   font-family: Pushkin;
   font-size: 48px;
   color: #007dcc;
   text-decoration: none;
}

/*.checkbox
{
   display: flex;
   flex-direction: row;
   align-items: flex-start;
}*/

.label
{
   padding-right: 7px;
   align-self: center;
   color: white;
}

#body
{
   padding-top: 10px;
   padding-bottom: 10px;
   padding-left: 20px;
   padding-right: 20px;
   display: flex;
   flex-direction: column;
   overflow: auto;
   font-size: 18px;
   height: 25%;
}

#login
{
   display: none;
   box-shadow: 0 15px 15px rgba(0,0,0,0.7);
   position: absolute;
   top: 0;
   left: 0;
   background-color: #212e38;
   padding: 20px;
}

#legend
{
   display: none;
   color: red;
   text-align: center;
}

/* ----- Styles for main page ----- */

.login-container{
   background-color: #1E2E39;
    width: 100%;
    height: 100%;
    padding-right: 0px;
    padding-left: 0px;
    min-height: 500px;
}

.wiscom-navbar{
   background-color: #1E2E39;
   border-color: #1E2E39;
   border-radius: 0px;
   height: 61px;
   margin-bottom: 0px;
   z-index: 10;
}

.wiscom-navbar>div>a{
    padding: 17px 27px !important;
}

.logimg {
    /*padding-left: 0px !important;
    height: 20px;
    width: 130px;*/
	height: 100%;
	width: auto;
	position: absolute;
	bottom: 0;
	left: 0;
	
}

.body-login{
   /*background:url("../../../resources/images/site.jpg");*/
   width: 100%;
   left: 0px;
   /*background-repeat: no-repeat;*/
   /*top: 61px;*/
   position: relative;
   /*bottom: 210px;*/
   /*background-size: 100% 100%;*/
}

.body-login img{
  width: 100%;
}

.footer-login{
   background-color: #1E2E39;
   border-color: #1E2E39;
   width: 100%;
   height: 210px;
   position: relative;
   display: block;
   bottom: 0px;
   left: 0px;
   padding-left: 1.5%;
   padding-right: 1.5%;
}

.footer-login p{
   color: #87919A;
   font-family: "Ruda";
   font-weight: 400;
   font-size: 14px;
   text-align: justify;
   margin: 0 0 0px !important;
   vertical-align: middle;
   padding-top: 20px;
}

.item{
   color: #fff !important;
    font-weight: 400;
    font-family: "Ruda";
    font-size: 14px;
    padding: 20px 27px !important;
}

.item:hover{
   color: #F02137 !important;
}

#nombre_top_menu{
	color: #000000;
	font-weight: 400;
    font-family: "Ruda";
    font-size: 14px;
	margin: 19px;
	
}

.etiqueta-juego{
	font-size: 20px;
}

.subtopbar{
   background-color: #4F606E;
   border-color: #4F606E;
   width: 100%;
   height: auto;
   padding-right: 20px;
   padding-left: 0px;
}

.subtopbar .name{
   color: #FFF;
   font-family: "Ruda";
   font-weight: 400;
   font-size: 14px;
   text-align: right;
   vertical-align: middle;
}

.main-body{
  overflow: auto;
}

#content-main{
  /*margin-top: 180px;*/
  margin-top: 10%;
}

#content-main2{
  /*margin-top: 180px;*/
  margin-top: 5%;
}

.num-field-advice{
  display: inline-block;
  width: 3%;
  background: #ccc;
  border: 1px solid black;
  border-right: 0px;
  color: #000;
  font-size: 12px;
  height: 20px;
  padding-top: 2px;
  vertical-align: middle;
  margin: 5px 0px;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}

.field-advice{
  display: inline-block;
  width: 97%;
  vertical-align: middle;
  margin: 5px 0px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}

.title-information-container {
  font-family: "Ruda";
  font-size: 25px;
  margin-top: 12%;
}

.body-information-container {
  font-family: "Ruda";
  font-size: 15px;
  text-align: justify;
  margin-bottom: 20px;
}



.client-logo{
  border: 1px solid black;
  height: 10%;
  margin: 0px 0px;
}

.col-client-logo{
  padding: 0px;
}

@media (max-width: 1520px) {
   .footer-login p{
      font-size: 13px;
   }
}

@media (max-width: 1500px) {
   .item{
       font-size: 14px;
       padding: 20px 20px !important;
   }
   #nombre_top_menu{
		font-size: 14px;
		margin: 19px;
   }
   .wiscom-navbar>div>a{
      padding: 17px 20px !important;
   }
   .footer-login p{
      font-size: 13px;
   }
}

@media (max-width: 1400px) {
   .item{
       font-size: 14px;
       padding: 20px 15px !important;
   }
   #nombre_top_menu{
		font-size: 14px;
		margin: 19px;
   }
   .wiscom-navbar>div>a{
      padding: 17px 15px !important;
   }
   .footer-login p{
      font-size: 12px;
   }
}

@media (max-width: 1300px) {
   .item{
       font-size: 14px;
       padding: 20px 12px !important;
   }
   #nombre_top_menu{
		font-size: 14px;
		margin: 19px;
   }
   .wiscom-navbar>div>a{
      padding: 17px 12px !important;
   }
   .footer-login p{
      font-size: 12px;
   }
}

@media (max-width: 1120px) {
   .item{
       font-size: 14px;
       padding: 20px 8px !important;
   }
   #nombre_top_menu{
		font-size: 14px;
		margin: 19px;
   }
   .wiscom-navbar>div>a{
      padding: 17px 8px !important;
   }
   .footer-login p{
      font-size: 10px;
   }
}

@media (max-width: 1000px) {
   .item{
       font-size: 10px;
       padding: 20px 6px !important;
   }
   #nombre_top_menu{
		font-size: 10px;
		margin: 19px;
   }
   .wiscom-navbar>div>a{
      padding: 17px 6px !important;
   }
   .footer-login p{
      font-size: 10px;
   }
}

@media (max-width: 767px) {
   .main-body{
      display: none;
   }
   .container{
		display:none;
   }
}