/* * {
    box-sizing: border-box;
} */
html{
    box-sizing:border-box
}
*,*:before,*:after{
    box-sizing:inherit
}

/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}
article,aside,details,figcaption,figure,footer,header,main,menu,nav,section{display:block}summary{display:list-item}
audio,canvas,progress,video{display:inline-block}progress{vertical-align:baseline}
audio:not([controls]){display:none;height:0}[hidden],template{display:none}
a{background-color:transparent}a:active,a:hover{outline-width:0}
abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
b,strong{font-weight:bolder}dfn{font-style:italic}mark{background:#ff0;color:#000}
small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-0.25em}sup{top:-0.5em}figure{margin:1em 40px}img{border-style:none}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}hr{box-sizing:content-box;height:0;overflow:visible}
button,input,select,textarea,optgroup{font:inherit;margin:0}optgroup{font-weight:bold}
button,input{overflow:visible}button,select{text-transform:none}
button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}
button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}
button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}
legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}
[type=checkbox],[type=radio]{padding:0}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
[type=search]{-webkit-appearance:textfield;outline-offset:-2px}
[type=search]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
/* End extract */

html,body{
    font-family:Verdana,sans-serif;font-size:15px;line-height:1.5;
}
html{
    overflow-x:hidden;
}
h1{
    font-size:36px
}
h2{
    font-size:30px
}
h3{
    font-size:24px
}
h4{
    font-size:20px
}
h5{
    font-size:18px
}
h6{
    font-size:16px
}

/*font families*/
.serif{
    font-family:serif
}
.sans-serif{
    font-family:sans-serif
}
.cursive{
    font-family:cursive
}
.monospace{
    font-family:monospace
}
/*End font families*/

/*font styles*/
.normal{
    font-style: normal;
}
.italic{
    font-style: italic;
}
.oblique{
    font-style: oblique;
}
/*End font styles*/

/*font weights*/
.fw100{
    font-weight: 100;
}
.fw200{
    font-weight: 200;
}
.fw800{
    font-weight: 800;
}
.fw900{
    font-weight: 900;
}
.fwBold{
    font-weight: bold;
}
.fwBolder{
    font-weight: bolder;
}
.fwLighter{
    font-weight: lighter;
}

/*font weights*/


h1,h2,h3,h4,h5,h6{
    font-family:"Segoe UI",Arial,sans-serif;font-weight:400;margin:10px 0
}

.wide{
    letter-spacing:4px
}
hr{
    border:0;border-top:1px solid #eee;margin:20px 0
}

/*Header responsive*/
body { 
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  background-color: #f1f1f1;
}

.header {
  overflow: hidden;
  background-color: #e3e3e3;
  /* padding: 20px 10px; */
  position: relative;
  display: block;
  text-align: center;

  margin-left:auto;
  margin-right:auto;
  max-width:980px;
}

.header a {
  float: left;
  color: black;
  text-align: center;
  padding: 12px;
  text-decoration: none;
  font-size: 18px; 
  line-height: 25px;
  border-radius: 4px;
}

.header a.logo {
  font-size: 25px;
  font-weight: bold;
}

.header a:hover {
  background-color: #ddd;
  color: black;

  display:inline-block;
}

.header a.active {
  background-color: dodgerblue;
  color: white;
}

.header-right {
  float: right;
}

/* .header img{
    vertical-align:middle;
}

.w3-content,.w3-auto{margin-left:auto;margin-right:auto}.w3-content{max-width:980px}.w3-auto{max-width:1140px} */
/*End header responsive*/

/*footer responsive*/
.footer {
    background-color: #c0c0c0;
    color: #ffffff;
    text-align: center;
    font-size: 12px;
    padding: 5px;
  }
/**/


/*******/
/*Add some values after "row" class has been created*/
.row::after {
    content: ""; /*this content will be added at the end of the text added in the HTML*/
    clear: both;
    display: table;
  }

/*For all classes starting with "col-" must have this values*/
[class*="col-"] {
    float: left;
    padding: 15px;
}

/*For labels <ul> of "menu" class, apply this values*/
.menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

/*For labels <li> of "menu" class, apply this values*/
.menu li {
    padding: 8px;
    margin-bottom: 7px;
    /* background-color: #33b5e5; */
    /* background-color: lightskyblue; */
    background-color: #c0c0c0;
    /* color: #ffffff; */
    color:#3a3a3a;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    font-size: 1.2em;
}

/*the event "hover" works like a mouseover for labels <li> of "menu" class, apply this values*/
.menu li:hover {
    background-color: #0099cc;
    
}

/*Apply this values for "imageh" class*/
.imageh {
    max-width:100%;
    height:auto;
    vertical-align: middle;
}

/*For labels <a> of "link-style" class, apply this values*/
.link-style a{
    /*Link without underline */
    text-decoration: none;
}

/*Apply this values for "a" labels*/
a{
    color:inherit;
}



/*The "display-middle" class puts in the middle of its parent the object*/
.display-middle{
    position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);
}

.display-topmiddle{
    position:absolute;left:50%;top:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%);
}

.border{
    border:2px solid #ccc!important;
}

.padding-large{
    padding:12px 24px!important; /*!important applies changes always*/
}
.padding-middle{
    padding:6px 12px!important; /*!important applies changes always*/
}

.box-bgc{
    background-color: #c0c0c0;
}

/*For mobiles*/
@media screen and (max-width: 500px) {
  .header a {
    float: none;
    display: block;
    text-align: left;
  }
  
  .header-right {
    float: none;
  }

}

/* Extra small devices (phones, 550px and down) */
@media only screen and (max-width: 550px) {
    [class*="col-"] {
        width: 100%;
      }
  }

/* Small devices (portrait tablets and large phones, 551px and up) */
@media only screen and (min-width: 551px) {
    
    .col-sd1-1 {width: 8.33%;}
    .col-sd1-2 {width: 16.66%;}
    .col-sd1-3 {width: 25%;}
    .col-sd1-4 {width: 33.33%;}
    .col-sd1-5 {width: 41.66%;}
    .col-sd1-6 {width: 50%;}
    .col-sd1-7 {width: 58.33%;}
    .col-sd1-8 {width: 66.66%;}
    .col-sd1-9 {width: 75%;}
    .col-sd1-10 {width: 83.33%;}
    .col-sd1-11 {width: 91.66%;}
    .col-sd1-12 {width: 100%;}
    
}



/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
    
    .col-sd2-1 {width: 8.33%;}
    .col-sd2-2 {width: 16.66%;}
    .col-sd2-3 {width: 25%;}
    .col-sd2-4 {width: 33.33%;}
    .col-sd2-5 {width: 41.66%;}
    .col-sd2-6 {width: 50%;}
    .col-sd2-7 {width: 58.33%;}
    .col-sd2-8 {width: 66.66%;}
    .col-sd2-9 {width: 75%;}
    .col-sd2-10 {width: 83.33%;}
    .col-sd2-11 {width: 91.66%;}
    .col-sd2-12 {width: 100%;}
    
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
    
    .col-md-1 {width: 8.33%;}
    .col-md-2 {width: 16.66%;}
    .col-md-3 {width: 25%;}
    .col-md-4 {width: 33.33%;}
    .col-md-5 {width: 41.66%;}
    .col-md-6 {width: 50%;}
    .col-md-7 {width: 58.33%;}
    .col-md-8 {width: 66.66%;}
    .col-md-9 {width: 75%;}
    .col-md-10 {width: 83.33%;}
    .col-md-11 {width: 91.66%;}
    .col-md-12 {width: 100%;}

}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
    
    .col-ld-1 {width: 8.33%;}
    .col-ld-2 {width: 16.66%;}
    .col-ld-3 {width: 25%;}
    .col-ld-4 {width: 33.33%;}
    .col-ld-5 {width: 41.66%;}
    .col-ld-6 {width: 50%;}
    .col-ld-7 {width: 58.33%;}
    .col-ld-8 {width: 66.66%;}
    .col-ld-9 {width: 75%;}
    .col-ld-10 {width: 83.33%;}
    .col-ld-11 {width: 91.66%;}
    .col-ld-12 {width: 100%;}
    
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
    
    .col-eld-1 {width: 8.33%;}
    .col-eld-2 {width: 16.66%;}
    .col-eld-3 {width: 25%;}
    .col-eld-4 {width: 33.33%;}
    .col-eld-5 {width: 41.66%;}
    .col-eld-6 {width: 50%;}
    .col-eld-7 {width: 58.33%;}
    .col-eld-8 {width: 66.66%;}
    .col-eld-9 {width: 75%;}
    .col-eld-10 {width: 83.33%;}
    .col-eld-11 {width: 91.66%;}
    .col-eld-12 {width: 100%;}
    
}

/* @media only screen and (orientation: landscape) {
    .hide-big-text{display:none!important}
    .hide-rodo{display:none!important}
  } */

  @media screen and (max-width:550px){

    .hide-big-text{display:none!important}
    .hide-rodo{display:none!important}
}


@media screen and (min-width:551px) {
    .hide-small-text{display:none!important}
    .hide-sdo{display:none!important}
}
/* @media only screen and (orientation: landscape) {
    .hide-small-text{display:block!important}
    .hide-sdo{display:block!important}
} */



/* @media screen and (max-width:550px), only screen and (orientation: landscape) {
    .hide-big-text{display:none!important}
    .hide-rodo{display:none!important}
}


@media screen and (min-width:551px)  {
    @media only screen and (orientation: portrait) {
    .hide-small-text{display:none!important}
    .hide-sdo{display:none!important}
    }
} */
    

/* @media only screen and (orientation: landscape) {
    .hide-small-text{display:inherit!important}
    .hide-sdo{display:inherit!important}
} */

/*********/


/*Font colors*/
.text-amber,.hover-text-amber:hover{color:#ffc107!important}
.text-aqua,.hover-text-aqua:hover{color:#00ffff!important}
.text-blue,.hover-text-blue:hover{color:#2196F3!important}
.text-light-blue,.hover-text-light-blue:hover{color:#87CEEB!important}
.text-brown,.hover-text-brown:hover{color:#795548!important}
.text-cyan,.hover-text-cyan:hover{color:#00bcd4!important}
.text-blue-grey,.hover-text-blue-grey:hover,.text-blue-gray,.hover-text-blue-gray:hover{color:#607d8b!important}
.text-green,.hover-text-green:hover{color:#4CAF50!important}
.text-light-green,.hover-text-light-green:hover{color:#8bc34a!important}
.text-indigo,.hover-text-indigo:hover{color:#3f51b5!important}
.text-khaki,.hover-text-khaki:hover{color:#b4aa50!important}
.text-lime,.hover-text-lime:hover{color:#cddc39!important}
.text-orange,.hover-text-orange:hover{color:#ff9800!important}
.text-deep-orange,.hover-text-deep-orange:hover{color:#ff5722!important}
.text-pink,.hover-text-pink:hover{color:#e91e63!important}
.text-purple,.hover-text-purple:hover{color:#9c27b0!important}
.text-deep-purple,.hover-text-deep-purple:hover{color:#673ab7!important}
.text-red,.hover-text-red:hover{color:#f44336!important}
.text-sand,.hover-text-sand:hover{color:#fdf5e6!important}
.text-teal,.hover-text-teal:hover{color:#009688!important}
.text-yellow,.hover-text-yellow:hover{color:#d2be0e!important}
.text-white,.hover-text-white:hover{color:#fff!important}
.text-black,.hover-text-black:hover{color:#000!important}
.text-grey,.hover-text-grey:hover,.text-gray,.hover-text-gray:hover{color:#757575!important}
.text-light-grey,.hover-text-light-grey:hover,.text-light-gray,.hover-text-light-gray:hover{color:#f1f1f1!important}
.text-dark-grey,.hover-text-dark-grey:hover,.text-dark-gray,.hover-text-dark-gray:hover{color:#3a3a3a!important}
.text-sienna,.hover-text-grey-ebebeb:hover,.text-gray-ebebeb,.hover-text-gray-ebebeb:hover{color:sienna!important}
.border-amber,.hover-border-amber:hover{border-color:#ffc107!important}
.border-aqua,.hover-border-aqua:hover{border-color:#00ffff!important}
.border-blue,.hover-border-blue:hover{border-color:#2196F3!important}
.border-light-blue,.hover-border-light-blue:hover{border-color:#87CEEB!important}
.border-brown,.hover-border-brown:hover{border-color:#795548!important}
.border-cyan,.hover-border-cyan:hover{border-color:#00bcd4!important}
.border-blue-grey,.hover-border-blue-grey:hover,.border-blue-gray,.hover-border-blue-gray:hover{border-color:#607d8b!important}
.border-green,.hover-border-green:hover{border-color:#4CAF50!important}
.border-light-green,.hover-border-light-green:hover{border-color:#8bc34a!important}
.border-indigo,.hover-border-indigo:hover{border-color:#3f51b5!important}
.border-khaki,.hover-border-khaki:hover{border-color:#f0e68c!important}
.border-lime,.hover-border-lime:hover{border-color:#cddc39!important}
.border-orange,.hover-border-orange:hover{border-color:#ff9800!important}
.border-deep-orange,.hover-border-deep-orange:hover{border-color:#ff5722!important}
.border-pink,.hover-border-pink:hover{border-color:#e91e63!important}
.border-purple,.hover-border-purple:hover{border-color:#9c27b0!important}
.border-deep-purple,.hover-border-deep-purple:hover{border-color:#673ab7!important}
.border-red,.hover-border-red:hover{border-color:#f44336!important}
.border-sand,.hover-border-sand:hover{border-color:#fdf5e6!important}
.border-teal,.hover-border-teal:hover{border-color:#009688!important}
.border-yellow,.hover-border-yellow:hover{border-color:#ffeb3b!important}
.border-white,.hover-border-white:hover{border-color:#fff!important}
.border-black,.hover-border-black:hover{border-color:#000!important}