@font-face {
  font-family: default-font;
  src: local("Barlow"), url("/css/font/Barlow-Light.ttf") format("opentype");
  }


 :root {
	
  --main-font-family: default-font ;
  --main-font-size: 16px;
	--main-font-size-sm: 12px;

	/*Cores  */
	--primary-color:#05354C;
	--primary-color-900:#02151E;
	--primary-color-800:#031D29;
	--primary-color-700:#042535;
	--primary-color-600:#042D40;
	--primary-color-500:#05354C;
	--primary-color-400:#1C556F;
	--primary-color-300:#417993;
	--primary-color-200:#73A1B7;
	--primary-color-100:#B3CEDB;
	
	--secondary-color:#0B6C99;
	--secondary-color-900:#052B3D;
	--secondary-color-800:#063B54;
	--secondary-color-700:#084C6B;
	--secondary-color-600:#0A5C82;
	--secondary-color-500:#0B6C99;
	--secondary-color-400:#2D85AD;
	--secondary-color-300:#569FC1;
	--secondary-color-200:#87BDD6;
	--secondary-color-100:#BFDCEA;
		
	--red:#E6435E;
	--red-900:#752230;
	--red-800:#972C3E;
	--red-700:#BA374D;
	--red-600:#DC415B;
	--red-500:#E6435E;
	--red-400:#FF6680;
	--red-300:#FF8196;
	--red-200:#FF9CAD;
	--red-100:#FAC5D1;

	--yellow: #E6AD50;
	--yellow-900:#755729;
	--yellow-800:#977035;
	--yellow-700:#BA8A41;
	--yellow-600:#DCA34D;
	--yellow-500:#E6AD50;
	--yellow-400:#FFC772;
	--yellow-300:#FFD18B;
	--yellow-200:#FFDBA4;
	--yellow-100:#FFE5BD;

	--gray: #7C7C7D;
	--gray-900:#323232;
	--gray-800:#434344;
	--gray-700:#565657;
	--gray-600:#69696A;
	--gray-500:#7C7C7D;
	--gray-400:#969697;
	--gray-300:#B0B0B1;
	--gray-200:#CBCBCB;
	--gray-100:#E5E5E5;

	--green: #0CA38A;
	--green-900:#065145;
	--green-800:#086555;
	--green-700:#097A67;
	--green-600:#0B8E78;
	--green-500:#0CA38A;
	--green-400:#21AE97;
	--green-300:#39BAA4;
	--green-200:#53C5B2;
	--green-100:#8AEDDE;


 }
	


 @keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes fade-in {

  0% { opacity: 0; }
  100% { opacity: 1; }
  
}

@keyframes fade-in-down {

  0% { opacity: 0; transform: scaleY(0);}

  50%{opacity: 0.5;}

  100% { opacity: 1; }
  
}


@keyframes fade-out {

  0% { opacity: 1;  }
  100% { opacity: 0;  }
  
}

.fade-out{

  transition: fade-out 1s;
}

.fade-in{
  animation: fade-in 1s ;
}

.fade-in-down{
  animation: fade-in-down 0.45s ease-out ;
}


*{
box-sizing: border-box;
 }

html
{
height:100%;
padding:0;
margin:0;
font-size: var(--main-font-size);
font-weight: normal;
font-family: var(--main-font-family) ;
color: var(--gray-900)
}

body
{
margin:0px;
padding:0px;
bottom:0px;

}

a
{
color:var(--gray-900);
text-decoration:none;
}

a:hover
{
text-decoration:underline;
color:var(--primary-color-900);
}

a:visited
{
color:var(--gray-900);
	text-decoration:none;
}

h1
{
font-size:2rem;
padding:0;
margin: 0;
font-weight: normal;
}
h2
{

padding:0;
margin: 0;
font-weight: normal;
}
h3
{
padding:0;
margin: 0;	
font-weight: normal;
}

h4
{
padding:0;
margin: 0;
font-weight: normal;
}

h4
{
padding:0;
margin: 0;
font-weight: normal;
}

h5{
  padding: 0;
  margin: 0;
  font-weight: normal;
}




  .bg-primary{background-color: var(--primary-color);}
  .bg-primary-900{background-color: var(--primary-color-900);}
  .bg-primary-800{background-color: var(--primary-color-800);}
  .bg-primary-700{background-color: var(--primary-color-700);}
  .bg-primary-600{background-color: var(--primary-color-600);}
  .bg-primary-500{background-color: var(--primary-color-500);}
  .bg-primary-400{background-color: var(--primary-color-400);}
  .bg-primary-300{background-color: var(--primary-color-300);}
  .bg-primary-200{background-color: var(--primary-color-200);}
  .bg-primary-100{background-color: var(--primary-color-100);}
  .tx-primary{color:var(--primary-color)}
  .tx-primary-900{background-color: var(--primary-color-900);}
  .tx-primary-800{background-color: var(--primary-color-800);}
  .tx-primary-700{background-color: var(--primary-color-700);}
  .tx-primary-600{background-color: var(--primary-color-600);}
  .tx-primary-500{background-color: var(--primary-color-500);}
  .tx-primary-400{background-color: var(--primary-color-400);}
  .tx-primary-300{background-color: var(--primary-color-300);}
  .tx-primary-200{background-color: var(--primary-color-200);}
  .tx-primary-100{background-color: var(--primary-color-100);}

.bg-secondary{background-color: var(--secondary-color);}
.bg-secondary-900{background-color: var(--secondary-color-900);}
.bg-secondary-800{background-color: var(--secondary-color-800);}
.bg-secondary-700{background-color: var(--secondary-color-700);}
.bg-secondary-600{background-color: var(--secondary-color-600);}
.bg-secondary-500{background-color: var(--secondary-color-500);}
.bg-secondary-400{background-color: var(--secondary-color-400);}
.bg-secondary-300{background-color: var(--secondary-color-300);}
.bg-secondary-200{background-color: var(--secondary-color-200);}
.bg-secondary-100{background-color: var(--secondary-color-100);}
.tx-secondary{color:var(--secondary-color)}
.tx-secondary-900{background-color: var(--secondary-color-900);}
.tx-secondary-800{background-color: var(--secondary-color-800);}
.tx-secondary-700{background-color: var(--secondary-color-700);}
.tx-secondary-600{background-color: var(--secondary-color-600);}
.tx-secondary-500{background-color: var(--secondary-color-500);}
.tx-secondary-400{background-color: var(--secondary-color-400);}
.tx-secondary-300{background-color: var(--secondary-color-300);}
.tx-secondary-200{background-color: var(--secondary-color-200);}
.tx-secondary-100{background-color: var(--secondary-color-100);}

  .bg-red{background-color: var(--red);}
  .bg-red-900{background-color: var(--red-900);}
  .bg-red-800{background-color: var(--red-800);}
  .bg-red-700{background-color: var(--red-700);}
  .bg-red-600{background-color: var(--red-600);}
  .bg-red-500{background-color: var(--red-500);}
  .bg-red-400{background-color: var(--red-400);}
  .bg-red-300{background-color: var(--red-300);}
  .bg-red-200{background-color: var(--red-200);}
  .bg-red-100{background-color: var(--red-100);}
  .tx-red{color:var(--red)}
  .tx-red-900{background-color: var(--red-900);}
  .tx-red-800{background-color: var(--red-800);}
  .tx-red-700{background-color: var(--red-700);}
  .tx-red-600{background-color: var(--red-600);}
  .tx-red-500{background-color: var(--red-500);}
  .tx-red-400{background-color: var(--red-400);}
  .tx-red-300{background-color: var(--red-300);}
  .tx-red-200{background-color: var(--red-200);}
  .tx-red-100{background-color: var(--red-100);}
  
  .bg-yellow{background-color: var(--yellow);}
  .bg-yellow-900{background-color: var(--yellow-900);}
  .bg-yellow-800{background-color: var(--yellow-800);}
  .bg-yellow-700{background-color: var(--yellow-700);}
  .bg-yellow-600{background-color: var(--yellow-600);}
  .bg-yellow-500{background-color: var(--yellow-500);}
  .bg-yellow-400{background-color: var(--yellow-400);}
  .bg-yellow-300{background-color: var(--yellow-300);}
  .bg-yellow-200{background-color: var(--yellow-200);}
  .bg-yellow-100{background-color: var(--yellow-100);}
  .tx-yellow{color:var(--yellow)}
  .tx-yellow-900{background-color: var(--yellow-900);}
  .tx-yellow-800{background-color: var(--yellow-800);}
  .tx-yellow-700{background-color: var(--yellow-700);}
  .tx-yellow-600{background-color: var(--yellow-600);}
  .tx-yellow-500{background-color: var(--yellow-500);}
  .tx-yellow-400{background-color: var(--yellow-400);}
  .tx-yellow-300{background-color: var(--yellow-300);}
  .tx-yellow-200{background-color: var(--yellow-200);}
  .tx-yellow-100{background-color: var(--yellow-100);}
  
  .bg-green{background-color: var(--green);}
  .bg-green-900{background-color: var(--green-900);}
  .bg-green-800{background-color: var(--green-800);}
  .bg-green-700{background-color: var(--green-700);}
  .bg-green-600{background-color: var(--green-600);}
  .bg-green-500{background-color: var(--green-500);}
  .bg-green-400{background-color: var(--green-400);}
  .bg-green-300{background-color: var(--green-300);}
  .bg-green-200{background-color: var(--green-200);}
  .bg-green-100{background-color: var(--green-100);}
  .tx-green{color:var(--green)}
  .tx-green-900{background-color: var(--green-900);}
  .tx-green-800{background-color: var(--green-800);}
  .tx-green-700{background-color: var(--green-700);}
  .tx-green-600{background-color: var(--green-600);}
  .tx-green-500{background-color: var(--green-500);}
  .tx-green-400{background-color: var(--green-400);}
  .tx-green-300{background-color: var(--green-300);}
  .tx-green-200{background-color: var(--green-200);}
  .tx-green-100{background-color: var(--green-100);}
  
  .bg-gray{background-color: var(--gray);}
  .bg-gray-900{background-color: var(--gray-900);}
  .bg-gray-800{background-color: var(--gray-800);}
  .bg-gray-700{background-color: var(--gray-700);}
  .bg-gray-600{background-color: var(--gray-600);}
  .bg-gray-500{background-color: var(--gray-500);}
  .bg-gray-400{background-color: var(--gray-400);}
  .bg-gray-300{background-color: var(--gray-300);}
  .bg-gray-200{background-color: var(--gray-200);}
  .bg-gray-100{background-color: var(--gray-100);}
  .tx-gray{color:var(--gray)}
  .tx-gray-900{background-color: var(--gray-900);}
  .tx-gray-800{background-color: var(--gray-800);}
  .tx-gray-700{background-color: var(--gray-700);}
  .tx-gray-600{background-color: var(--gray-600);}
  .tx-gray-500{background-color: var(--gray-500);}
  .tx-gray-400{background-color: var(--gray-400);}
  .tx-gray-300{background-color: var(--gray-300);}
  .tx-gray-200{background-color: var(--gray-200);}
  .tx-gray-100{background-color: var(--gray-100);}
  
  .v-align{  vertical-align: middle;}
  .c-align{  text-align: center;}
  .r-align{  text-align: right;}
  .l-align{  text-align: left;}
  


  .button-main, .button-default, .button-green, .button-red, .button-yellow, .button-main-transparent, .button-default-transparent, .button-green-transparent, .button-red-transparent, .button-yellow-transparent 
  {
  font-family:  var(--main-font-family);
  font-size: var(--main-font-size);
  height:45px;
  -moz-border-radius: 20px; 
  -webkit-border-radius: 20px;
  border-radius: 20px;
  margin-right:0px;
  cursor:pointer;
  outline: none;
  min-width:100px;
  }


  .button-main:disabled, .button-default:disabled, .button-green:disabled, .button-yellow:disabled, .button-red:disabled {
    background-color:var(--gray-100);
    border: 1px solid var(--gray-100);    
  }
  
  .button-main:disabled:hover, .button-default:disabled:hover, .button-green:disabled:hover, .button-yellow:disabled:hover, .button-red:disabled:hover{
    background-color:var(--gray-100);
    border: 1px solid var(--gray-100);    
  }



  .button-main
  {
  background-color:var(--secondary-color);
  border: 1px solid var(--secondary-color);
  color:#FFFFFF;
   
  }
  
    .button-main:hover
  {
  background-color: var(--secondary-color-700);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
    }
      
  .button-default
  {
  background-color: var(--gray-100);
  border: 1px solid var(--gray-100); 
  color:var(--gray-900);
  }
  
  .button-default:hover
  {
  background-color: var(--gray-500);
  color: #FFFFFF;
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  }
  
  .button-green
  {
  background-color: var(--green);
  border: 1px solid var(--green);
  color:#FFFFFF;
  }
  
  .button-green:hover
  {
  background-color: var(--green-700);
  border: 1px solid var(--green);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
    }
  
  .button-yellow
  {
  background-color: var(--yellow);
  border: 1px solid var(--yellow);
  color:#FFFFFF;
  }
  
  .button-yellow:hover
  {
  background-color: var(--yellow-700);
  border: 1px solid var(--yellow-700);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  }
  
  .button-red
  {
  background-color: var(--red);
  border: 1px solid var(--red);
  color:#FFFFFF;
  }
  
  .button-red:hover
  {
  background-color: var(--red-700);
  border: 1px solid var(--red-700);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  }
  

  .button-main-transparent
  {
  background-color:transparent;
  border: 1px solid var(--secondary-color);
  color:var(--secondary-color);
   
  }
  
  .button-main-transparent:hover
  {
  border: 1px solid var(--secondary-color-700);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  
  }
  
    
  .button-default-transparent
  {
  background-color: transparent;
  border: 1px solid var(--gray-100); 
  color:var(--gray-100);
  }
  
  .button-default-transparent:hover
  {
  border: 1px solid var(--gray-500); 
  color: var(--gray-500); 
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  }

   .button-green-transparent
  {
  background-color: transparent;    
  border: 1px solid var(--green);
  color:var(--green);
  }
  
  .button-green-transparent:hover
  {
  border: 1px solid var(--green-700);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  color:var(--green-700);
  
  }
  
  .button-yellow-transparent
  {
  background-color: transparent;
  border: 1px solid var(--yellow);
  color:var(--yellow);
  }
  
  .button-yellow-transparent:hover
  {

  border: 1px solid var(--yellow-700);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
color: var(--yellow-700);
  }
  
  .button-red-transparent
  {
  background-color: transparent;
  border: 1px solid var(--red);
  color: var(--red);
  }
  
  .button-red-transparent:hover
  {
  border: 1px solid var(--red-700);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  color: var(--red-700);
  }

  
  .button-sm-main, .button-sm-default, .button-sm-green, .button-sm-red, .button-sm-yellow
  {
  font-family:  var(--main-font-family);
  font-size: var(--main-font-size-sm);
  height:25px;
  -moz-border-radius: 20px; 
  -webkit-border-radius: 20px;
  border-radius: 20px;
  margin-right:0px;
  cursor:pointer;
  outline: none;
  
  }
  
  .button-sm-main
  {
  background-color: var(--secondary-color);
  border: 1px solid var(--secondary-color);
  color:#FFFFFF;
  min-width:100px;
  
  }
  
  .button-sm-main:hover
  {
  background-color:var(--secondary-color-600);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  color: #FFFFFF;
  
  }
    
  .button-sm-default
  {
  background-color: var(--gray-100);
  border: 1px solid  #CCCCCC;
  color:#333;
  }
  
  .button-sm-default:hover
  {
  background-color: var(--gray-500);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  color: #FFFFFF;
  }
  
  .button-sm-green
  {
  background-color: var(--green);
  border: 1px solid var(--green);
  color:#FFFFFF;
  }
  
  .button-sm-green:hover
  {
  background-color: var(--green-700);
  border: 1px solid var(--green-700);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  }


  .button-sm-red
  {
  background-color: var(--red);
  border: 1px solid var(--red);
  color:#FFFFFF;
  }
  
  .button-sm-red:hover
  {
  background-color:var(--red-700);
  border: 1px solid var(--red-700);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  }

 
  .button-sm-yellow
  {
  background-color: var(--yellow);
  border: 1px solid var(--yellow);
  color:#FFFFFF;
  }
  
  .button-sm-yellow:hover
  {
  background-color: var(--yellow-700);
  border: 1px solid var(--yellow-700);
  -webkit-transition:	all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  }
  
     .switch{
	  position: relative;	
	  display: inline-block;
	  width: 50px;
	  height: 24px;
	  margin: 0 10px;
	   
  }
  
  .switch-slider-main, .switch-slider-red, .switch-slider-green, .switch-slider-yellow , .switch-slider-default{
	  position: absolute;
	  cursor: pointer;
	  top: 0;
	  left:0;
	  right: 0;
	  bottom: 0;
	  background-color: var(--gray-100 );
	  transition: 0.4s;
	  border-radius: 34px;
	  
  }
  
  .switch input{display: none;}
  
  .switch-slider-main:before, .switch-slider-red:before, .switch-slider-green:before, .switch-slider-yellow:before, .switch-slider-default:before{
	  position: absolute;
	  content: "";
	  height: 20px;
	  width: 20px;
	  left: 2.5px ;
	  bottom: 2.5px;
	  background-color: white;
	  transition: 0.4s;
	  border-radius: 20px;
  }
  
  input:checked + .switch-slider-main{
	  background-color: var(--secondary-color);
  }

  input:checked + .switch-slider-red{
	  background-color: var(--red);
  }
  input:checked + .switch-slider-green{
	  background-color: var(--green);
  }

  input:checked + .switch-slider-yellow{
	  background-color: var(--yellow);
  }

  input:checked + .switch-slider-default{
	  background-color: var(--gray-800);
  }
  
  input:checked +.switch-slider-main:before, input:checked +.switch-slider-red:before, input:checked +.switch-slider-green:before, input:checked +.switch-slider-yellow:before, input:checked +.switch-slider-default:before
  {
	  transform: translateX(25px);
  }
  


  .loader-main, .loader-main-sm, .loader-main-lg, .loader-green, .loader-red, .loader-yellow, .loader-default,
  .loader-green-sm, .loader-green-lg, .loader-red-sm, .loader-red-lg, .loader-yellow-sm, .loader-yellow-lg, .loader-default-sm, .loader-default-lg {

    border: 2px solid transparent;
    border-radius: 50%;
    -webkit-animation: spin 1.8s linear infinite;
    animation: spin 1.8s linear infinite;
    margin: 5px;
    
  }
  
    .loader-main{
    width: 40px;
    height: 40px;
    border-top: 2px solid var(--secondary-color);
    border-left: 2px solid var(--secondary-color);
  }
  .loader-main-sm{
  width: 20px;
  height: 20px;
  border-top: 2px solid var(--secondary-color);
  border-left: 2px solid var(--secondary-color);
  
  }
.loader-main-lg{
  width: 50px;
  height:50px;
  border-top: 2px solid var(--secondary-color);
  border-left: 2px solid var(--secondary-color);
}

.loader-green{
  width: 40px;
  height: 40px;
  border-top: 2px solid var(--green);
  border-left: 2px solid var(--green);
}
.loader-green-sm{
width: 20px;
height: 20px;
border-top: 2px solid var(--green);
border-left: 2px solid var(--green);
}
.loader-green-lg{
width: 60px;
height:60px;
border-top: 2px solid var(--green);
border-left: 2px solid var(--green);
}
.loader-red{
  width: 40px;
  height: 40px;
  border-top: 2px solid var(--red);
  border-left: 2px solid var(--red);
}
.loader-red-sm{
width: 20px;
height: 20px;
border-top: 2px solid var(--red);
border-left: 2px solid var(--red);
}
.loader-red-lg{
width: 60px;
height:60px;
border-top: 2px solid var(--red);
border-left: 2px solid var(--red);
}

.loader-yellow{
  width: 40px;
  height: 40px;
  border-top: 2px solid var(--yellow);
  border-left: 2px solid var(--yellow);
}
.loader-yellow-sm{
width: 20px;
height: 20px;
border-top: 2px solid var(--yellow);
border-left: 2px solid var(--yellow);
}
.loader-yellow-lg{
width: 60px;
height:60px;
border-top: 2px solid var(--yellow);
border-left: 2px solid var(--yellow);
}
  
.loader-default{
  width: 40px;
  height: 40px;
  border-top: 2px solid var(--gray-600);
  border-left: 2px solid var(--gray-600);
}
.loader-default-sm{
width: 20px;
height: 20px;
border-top: 2px solid var(--gray-600);
border-left: 2px solid var(--gray-600);
}
.loader-default-lg{
width: 60px;
height:60px;
border-top: 2px solid var(--gray-600);
border-left: 2px solid var(--gray-600);
}

.progressbar-bg{
	background-color:var(--gray-100);
	border: 1px solid var(--gray-200); 
	height:8px;
  border-radius: 8px;
	}

.progressbar-main, .progressbar-green, .progressbar-yellow, .progressbar-red, .progressbar-default{
	width:0%;
	height:7px;
  border-radius: 8px;
}

.progressbar-main{
	background-color:var(--secondary-color);
	}
.progressbar-green{
  background-color:var(--green);
  }
 
.progressbar-yellow{
	background-color:var(--yellow);
	}

.progressbar-red{
	background-color:var(--red);
	}

.progressbar-default{
	background-color:var(--gray-500);
	
}



#bgalldiv
{
position: fixed;
top:0;
left:0;
height:100%;
width:100%;
background:rgba(0,0,0 ,0.8);
z-index: 1;
display:flex;
justify-content: center;
align-items: center;
}


#modal-loader
{
min-height:130px;
min-width: 300px;
padding: 10px;
background-color:white;
z-index:3;
-moz-border-radius: 20px; 
-webkit-border-radius: 20px;
border-radius: 20px;
box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
display: flex;
align-items: center;
animation: fade-in 1s ;
}

#modal-loader div{
  flex-grow: 1;
  padding: 10px;
}
  

.panel-default
{
background-color:white;
z-index:3;
position:fixed;
left: 50%;
top:50%;
display:none;
-moz-border-radius: 20px; /* Para Firefox */
-webkit-border-radius: 20px; /*Para Safari e Chrome */
border-radius: 20px; /* Para Opera 10.5+*/
box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
padding: 20px;
}
  


#dlgbox
{
z-index:3;
position:fixed;
background-color:white;
left: 50%;
top:40%;
-moz-border-radius: 20px; /* Para Firefox */
-webkit-border-radius: 20px; /*Para Safari e Chrome */
border-radius: 20px; /* Para Opera 10.5+*/
box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
}

#dlgboxtitle
{
padding:20px;
border-bottom: 1px solid var(--gray-100);
font-weight: 700;
}

#dlgboxtext{
  max-width: 500px ;
}

#dlgboxbtn
{
padding:20px;
}


.warning-information, .warning-error, .warning-success, .warning-main , .warning-blank
{
-moz-border-radius: 20px; /* Para Firefox */
-webkit-border-radius: 20px; /*Para Safari e Chrome */
border-radius: 20px; /* Para Opera 10.5+*/
padding: 20px;
margin-bottom:10px;
margin-top:10px;
min-height: 20px;

}

.warning-main
{
border: 1px solid var(--secondary-color-200);
color: var(--secondary-color-700);
background-color:var(--secondary-color-100);
}

.warning-information
{
border: 1px solid var(--yellow-200);
color: var(--yellow-900);
background-color: var(--yellow-100);
}
.warning-error
{
border: 1px solid var(--red-200);
color: var(--red-900);
background-color: var(--red-100);
}
.warning-success
{
border: 1px solid var(--green-200);
color: var(--green-900);
background-color: var(--green-100);
}

.warning-blank
{
  border: 1px solid var(--gray-200);
  color: var(--gray);
  background-color: transparent;
}



.form-group{
	display: flex;
	flex-wrap: wrap;
	
}

.form-item{
	
	position: relative;
	height: 60px;
	display: flex;
	margin:10px;
	flex-grow: 1;
	
	}

  .label-name{
    position: absolute;
    left: 0px;
    top:33px;
    width: 100%;
    pointer-events: none;
    transition: all 0.5s ease;
    color:var(--gray-400);
    
    }


    .input-default
    {
    font-family:  var(--main-font-family);
    font-size: var(--main-font-size);
    outline: none;
    width: 100%;
    height: 100%;
    padding-top: 30px;
    border:none;
    border-bottom:1px solid var(--gray-200);
    background: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
                
    }

    .input-default[type=date]+ .label-name{transform:translateY(-33px);}
    
    
        
    .input-default:focus{border-bottom:1px solid var(--secondary-color-400);}
    .input-default:focus + .label-name{transform:translateY(-33px);}
    .input-default:placeholder-shown + .label-name {transform:translateY(-33px); }
    .input-default:not(:placeholder-shown) + .label-name {top:33px ;}
    .input-default:valid + .label-name {transform:translateY(-33px); }    
    
    

    .select-default 
    {
    font-family:  var(--main-font-family);
    font-size: var(--main-font-size);
    outline: none;
    width: 100%;
    height: 100%;
    padding-top: 30px;
    border:none;
    border-bottom:1px solid var(--gray-200);
    background: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-left: 5px;
    
    }

    .select-default:focus{border-bottom:1px solid var(--secondary-color-400);}
    .select-default:focus + .label-name{transform:translateY(-33px);}
    .select-default:valid ~ .label-name {transform:translateY(-33px);  }
    

    

    /*pare aqui */









fieldset
{
border:1px solid #CCCCCC; 
-moz-border-radius: 5px; 
-webkit-border-radius: 5px;
border-radius: 5px;
width: 100%;
box-sizing: border-box;
margin-bottom: 10px;
}

legend{

color: #0f1922;
font-size:medium;
}




.form-item-block{
	flex-basis: 100%;
}









.textarea-default 
{
font-family:  var(--main-font-family);
font-size: var(--main-font-size);
color:#333333;
box-sizing:border-box;
outline: none;
width: 100%;
height: 100%;
padding-top: 30px;
border:none;
border-bottom:1px solid #CCCCCC;
border-style: none;


}


.textarea-default:focus{border-bottom:1px solid var(--main-color-blue);}
.textarea-default:focus + .label-name{transform:translateY(-33px);}
.textarea-default:not(:placeholder-shown) + .label-name {transform:translateY(-33px);}
.textarea-default:placeholder-shown + .label-name {top:33px;}


input[type=file] { display: none;}








.margin-auto{
margin:auto;
}




.valign
{
vertical-align:middle;
}

.calign
{
text-align:center;
}

.ralign
{
text-align:right;
}

.lalign
{
text-align:left;
}


.hidden
{
display:none;
}

.visible
{
display:block;
}


.border-0
{
border:0px;
}




.table-default
{
border-collapse:collapse;
width: 100%;
}

.table-default th
{

height:35px;
border-bottom: 2px solid #E5E5E5;
}

.table-default tr
{
height:36px;
border:0px;
padding-left:10px;
padding-right:10px;
padding-top:5px;
padding-bottom:5px;

}

.table-default-tr-mouseover
{
background-color:#337AB7;
color:#FFFFFF;
}

.table-default-tr-mouseover a
{
color:#FFFFFF;
}


.table-default-tr-mouseout
{
background-color:#F5F5F5;
}

.table-default td
{
padding-left:10px;
padding-right:10px;
border-bottom:1px solid #E5E5E5; 
height:35px;
}






.table-main
{
width:100%;
border-collapse:collapse;

}

.table-main th
{
border:solid 1px #DDDDDD; 
height:35px;
background-color:#E5E5E5;
}

.table-main tr
{
height:36px;
border:0px;
padding-left:10px;
padding-right:10px;
padding-top:5px;
padding-bottom:5px;

}
.table-main td
{
padding-left:10px;
padding-right:10px;
border:1px solid #E5E5E5; 
height:35px;
}








.tab{
	border: 1px solid #CCCCCC;
	clear: both;
	padding:10px;
        
        
-moz-border-bottom-left-radius: 5px; /* Para Firefox */
-webkit-border-bottom-left-radius: 5px; /*Para Safari e Chrome */
border-bottom-left-radius: 5px; /* Para Opera 10.5+*/
-moz-border-bottom-right-radius: 5px; /* Para Firefox */
-webkit-border-bottom-right-radius: 5px; /*Para Safari e Chrome */
border-bottom-right-radius: 5px; /* Para Opera 10.5+*/
}


.tooltip {
	position: relative;
	display: inline-block;
	
  }
  
  .tooltip .tooltiptext {
	visibility: hidden;
	width: 220px;
	background-color: var(--main-color-blue-dark);
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px ;
  
	/* Position the tooltip */
	position: absolute;
	left:20px;
	top:20px;
	z-index: 1;
  }
  
  .tooltip:hover .tooltiptext {
	visibility: visible;
  }




@media (max-width: 767px) 
{
	
	
#modal-loading{
	left:50%;
	width: 250px;
	margin-left:-125px;
}

#dlgbox{

width:80%;
margin-left: -40%;
margin-top: -70px;
overflow: hidden;
}

#dlgboxtext
{
padding:20px;
}

#dlgboxbtn
{
text-align:center;

}

	
.table-default{display:block; width:100%; overflow-x: auto; white-space: nowrap; margin:0 auto;}

.button-confirm, .button-default, .button-success, .button-main{
	width: 100%;
	margin-top: 10px;
}

.tab_off{
	
	float:left;
	padding:5px;
	padding-left: 10px;
    padding-right: 10px;
	margin-top: 10px;
	text-align: center;
    cursor: pointer;
        
}

.tab_on
{
	
	text-align: center;
	float:left;
	padding:5px;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 10px;
	border-top:1px solid #CCCCCC;
	border-right:0px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
background-color: #337AB7;

color:#FFFFFF;
cursor: pointer;
-moz-border-top-left-radius: 5px; /* Para Firefox */
-webkit-border-top-left-radius: 5px; /*Para Safari e Chrome */
border-top-left-radius: 5px; /* Para Opera 10.5+*/
-moz-border-top-right-radius: 5px; /* Para Firefox */
-webkit-border-top-right-radius: 5px; /*Para Safari e Chrome */
border-top-right-radius: 5px; /* Para Opera 10.5+*/

}

.tab_on:hover{
    background-color: #286090;
}

.form{
display: block;

}



}










@media (min-width: 768px) 
{

#dlgbox{

min-width:450px;
margin-left: -210px;
margin-top: -70px;
}

#dlgboxtext
{

box-sizing: border-box;
padding:20px;
}


#dlgboxbtn
{

text-align:right;
}

.form{
	
		max-width: 650px;
	
}

#modal-loading{
width:300px;
margin-left: -150px;
left: 50%;
}


.tab_off{
	width:120px;
	float:left;
	padding:5px;
	margin-top: 10px;
	text-align: center;
    cursor: pointer;
        

}

.tab_on
{
	width:120px;
	text-align: center;
	float:left;
	padding:5px;
    margin-top: 10px;
	border-top:1px solid #CCCCCC;
	border-right:0px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
background-color: #337AB7;
color:#FFFFFF;
cursor: pointer;
-moz-border-top-left-radius: 5px; /* Para Firefox */
-webkit-border-top-left-radius: 5px; /*Para Safari e Chrome */
border-top-left-radius: 5px; /* Para Opera 10.5+*/
-moz-border-top-right-radius: 5px; /* Para Firefox */
-webkit-border-top-right-radius: 5px; /*Para Safari e Chrome */
border-top-right-radius: 5px; /* Para Opera 10.5+*/

}

.tab_on:hover{
    background-color: #286090;
}

	 
}




@media (min-width: 992px) 
{

	.form{
	
	
		max-width: 800px;
		
	}
#modal-loading{
width:400px;
margin-left: -200px;
left: 50%;
}	
	
	
}
	



@media (min-width: 1200px) 
{ 


	.form{
	
		
		max-width: 1000px;
		box-sizing: border-box;
		
	}


#modal-loading{
width:450px;
margin-left: -225px;
left: 50%;
}
}