/* HCPRO.CSS 1.0 2020  a W3.css Modifcacion by Horacio Cuenca */
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;color:inherit;text-decoration:none}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}

/*--- ruler ---*/
hr{border:0;border-top:1px solid #eee;margin:1.25em 0}

/* End extract */
html{scroll-behavior: smooth}
html,body{font-family:Roboto,Verdana,sans-serif;font-size:16px;line-height:1.5}
body{overflow-x:hidden}

/*--- headers ---*/
h1{font-size:2.4em}
h2{font-size:2em}
h3{font-size:1.6em}
h4{font-size:1.33em}
h5{font-size:1.2em}
h6{font-size:1em}

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

/*--- font family ---*/
.font1 {font-family: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif !important}
.font2 {font-family: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif !important}
.sans  {font-family: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif !important}
.serif {font-family: serif}
.mono  {font-family: monospace !important}

/*--- font weight ---*/
.light  {font-weight: 300 !important}
.normal {font-weight: 400 !important}
.medium {font-weight: 500 !important}
.bold   {font-weight: 600 !important}
.bolder {font-weight: 700 !important}
.thick  {font-weight: 800 !important}
.thicker{font-weight: 900 !important}

/*--- font-size realive to body ---*/
.size-t  {font-size:0.67em !important} 
.size-s  {font-size:0.8em  !important}
.size-m  {font-size:1em    !important}
.size-l  {font-size:1.2em  !important}
.size-xl {font-size:1.6em  !important}  
.size-xxl{font-size:2.4em  !important}
.size-xxxl{font-size:3.2em !important}
.size-j  {font-size:4.27em !important}

/*--- font-size realive to parent ---*/
.size1{font-size:3rem   !important}
.size2{font-size:2.5rem !important}
.size3{font-size:2rem   !important}
.size4{font-size:1.5rem !important}
.size5{font-size:1.25rem!important}
.size6{font-size:1rem   !important}
.size7{font-size:0.75rem!important}

/*--- text align---*/
.align-l {text-align:left        !important}
.align-r {text-align:right       !important}
.align-j {text-align:justify     !important}
.align-c {text-align:center      !important}
.align-m {vertical-align: middle !important}

/*--- Text transformation ---*/ 
.lower {text-transform: lowercase}
.upper {text-transform: uppercase}
.italic{font-style:     italic}
.wide  {letter-spacing:0.25em !important}

.rot90{
   transform: rotate(-90deg)!important;
  -webkit-transform: rotate(-90deg); /* Safari */
  -moz-transform: rotate(-90deg);   /* Firefox */
  -ms-transform: rotate(-90deg);   /* IE */
  -o-transform: rotate(-90deg);   /* Opera */
   filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);   /* Internet Explorer */
}

/*--- title & sub ---*/
.title    {color: inherit;font-size: 2rem;   font-weight: 600;line-height: 1.125}
.subtitle {color: inherit;font-size: 1.25rem;font-weight: 400;line-height: 1.25}

/*--- link ---*/
.link{text-decoration: underline;cursor: pointer}

/*--- disabled ---*/
.disabled {cursor:not-allowed !important; opacity:0.5}
.disabled *,:disabled *{pointer-events:none}

/*--- buttons ---*/
.button{border:none}
.button:hover{color:#000!important;background-color:#ccc!important}
.button{display:inline-block;padding:0.5em 1em;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap}
.button{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}   
.button:disabled{cursor:not-allowed;opacity:0.3}

/*--- border buttons ---*/
.btn {border: 2px solid black;background-color: white;color: black;padding: .5em 1em;font-size: 1em;cursor: pointer}
.btn:disabled{cursor:not-allowed;opacity:0.3}
.btn {
   -moz-border-radius: 0.5em;
   -webkit-border-radius: 0.5em;
   border-radius: 0.5em;
   -moz-background-clip:content-box;
   -webkit-background-clip: border;
}

/*--- button group ---*/
.group:after   {content: "";clear: both;display: table}
.group .button {text-align: center; display: inline-block;  cursor: pointer;  float: left}
.group .button:not(:last-child) {border-right: none}

/*--- badge, tag, chip ---*/
.badge{border-radius:50%}
.badge{background-color:#000;color:#fff;display:inline-block;padding-left:0.5em;padding-right:0.5em;text-align:center}

.tag{background-color:#000;color:#fff;display:inline-block;padding-left:0.5em;padding-right:0.5em;text-align:center}

.chip     {display: inline-block;padding: 0 25px;height: 50px;font-size: 1em;line-height: 50px;border-radius: 25px;background-color: #f1f1f1}
.chip img {float: left;margin: 0 10px 0 -25px;height: 50px;width: 50px;border-radius: 50%}

/*--- table ---*/
.table {border-collapse:collapse;border-spacing:0;width:100%;display:table}
.table .border {border:1px solid #ccc}
.table .divider tr{border-bottom:1px solid #ddd}
.table .center tr th, .table .center tr td{text-align:center}
.table .middle {vertical-align: middle}

.table .strip-even  tbody tr:nth-child(even){background-color:#f1f1f1}
.table .strip-odd   tbody tr:nth-child(even){background-color:#f1f1f1}
.table .strip-hover tbody tr:hover{background-color:#ccc}

.table td,.table th{padding:0.5em;display:table-cell;text-align:left;vertical-align:middle}
.table th:first-child,.table td:first-child{padding-left:1em}

.table-all {border-collapse:collapse;border-spacing:0;width:100%;display:table}
.table-all {border:1px solid #ccc}
.table-all thead tr{background-color:#fff}
.table-all tr{border-bottom:1px solid #ddd}
.table-all tbody tr:nth-child(odd){background-color:#fff}
.table-all tbody tr:nth-child(even){background-color:#f1f1f1}
.table-all tbodytr:hover{background-color:#ccc}
.table-all td:first-child{padding-left: 0.5em}

.table-all th, .table-all td{padding:0.5em 0.5em;display:table-cell;text-align:left;vertical-align:middle}
.table-all th:first-child,.table-all td:first-child{padding-left:1em}

.table-all td,.table-all th{text-overflow: ellipsis}

/*--- list ---*/
ol {padding: 0;margin: 0 0 1.25em 1.5em}

ul {padding: 0;margin: 0 0 1.25em 1.5em}
li {padding: 0.25em 0;margin: 0}

/*--- no bullet ---*/
.ul   {list-style-type: none;padding:0;margin:0}
.ul li{padding:0.5em 1em}
.ul .divider li:first-child{border-top:1px solid #ddd}
.ul .divider li  {border-bottom:1px solid #ddd}
.ul li.divider   {border-bottom:1px solid #ddd}
.ul li:hover     {background:#ccc}
.ul.arrow  li + li::before {content: "\0227B"}

/*--- breadcrumb ---*/
.path      {list-style-type: none;padding:0;margin:0}
.path li   {display: inline-block;padding: 0.7em 0;margin: 0;position: relative;line-height: 100%}
.path li a {padding: 0.5em 0.5em 0.5em 1em;margin: 0;font-size: 1em}
.path li + li::before {color: #b5b5b5;content: "\0002f "}
.path li a:hover      {background:#ccc}

.path.arrow  li + li::before {content: "\0227B"}
.path.dot    li + li::before {content: "\02022"}

/*--- form ---*/
.check   {width:1.5em;height:1.5em;position:relative;top:.5em}
.radio   {width:1.5em;height:1.5em;position:relative;top:.5em}
.input   {padding:0.5em;display:block;border:none;border-bottom:1px solid #ccc;width:100%}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0}

/* Firefox */
input[type=number] {-moz-appearance:textfield}

.textarea{width: 100%; height: 125px; resize: none}

::placeholder           {color: #999; opacity: 1}
:-ms-input-placeholder  {color: #999}
::-ms-input-placeholder {color: #999}

.select{padding:0.5em 0;width:100%;border:none;border-bottom:1px solid #ccc}
.select:required:invalid {
  color: #999;
}
.select option[value=""][disabled] {
  display: none;
}
.select option {
  color: black;
}

/* file upload */
.upload {
   width: 0.1px;
   height: 0.1px;
   opacity: 0;
   overflow: hidden;
   position: absolute;
   z-index: -1;
}

.upload + label {
   text-overflow: ellipsis;
   white-space: nowrap;
   display: inline-block;
   cursor: pointer;
}

/*--- VALIDATION ---*/
label.error {color:red !important}
input.error,select.error,textarea.error{border:1px solid red!important}
label.valid {color:green!important}
input.valid,select.valid,textarea.valid{border:1px solid green!important}

/*--- dropdown ---*/
.hoverdown{position:static;float: left;display:inline-block;cursor:pointer}
.hoverdown:hover .hoverdown-content{display:block}
.hoverdown:first-child{background-color:#ccc;color:#000}
.hoverdown:hover > .button:first-child{background-color:#ccc;color:#000}

.clickdown{position:relative;float: left;display:inline-block;cursor:pointer}
.clickdown:hover{background-color:#ccc;color:#000}
.clickdown:hover > .button:first-child{background-color:#ccc;color:#000}

.hoverdown-content{cursor:auto;color:#000;background-color:#fff;display:none;position:absolute;min-width:160px;margin:0;padding:0;z-index:1;box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);border: 1px solid #e7e7e7}
.dropright-content{cursor:auto;color:#000;background-color:#fff;position:absolute;top:2.5em;left: 100%;min-width:160px;margin:0;padding:0;z-index:1;box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);border: 1px solid #e7e7e7}

/*--- sidebar ---*/
.sidebar{height:100%;width:auto;background-color:#fff;position:fixed!important;top:0;z-index:3!important;overflow:auto}

/*--- sideops ---*/
.sideops{height:auto;width:auto;background-color:#fff;position:fixed!important;top:0;z-index:3!important;overflow:auto}

/*--- menu & bar ops ---*/
.menu .hoverdown,.menu .clickdown{width:100%}
.menu .hoverdown .hoverdown-content,.menu .clickdown .hoverdown-content{min-width:100%}
.menu .hoverdown .button,.menu .clickdown .button{width:100%;text-align:left;padding:0.5em 1em}

.bar:before,.bar:after{content:"";display:table;clear:both}
.bar{width:100%;overflow:hidden}.center .bar{display:inline-block;width:auto}
.bar .bar-item{padding:0.5em 1em;float:left;width:auto;border:none;display:block;outline:0}
.bar .hoverdown,.bar .clickdown{position:static;float:left}
.bar .button{white-space:normal}
.menu .menu-item{width:100%;display:block;padding:0.5em 1em;text-align:left;border:none;white-space:normal;float:none;outline:0}
.menu.center .menu-item{text-align:center}

/*--- modal ---*/
.modal{z-index:30;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)}
.modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:33%}

/*--- box & content ---*/
.box{padding:1em}
.box:after,.box:before{content:"";display:table;clear:both}

.content{margin-top:1em;margin-bottom:1em}
.content:after,.content:before{content:"";display:table;clear:both}
.content{margin-left:auto;margin-right:auto;background-color: transparent; padding: 1em}

/*--- section & panel ---*/
.section{margin-top:1em!important;margin-bottom:1em!important}
.panel{padding: 1em;margin: 1em}

/*--- code ---*/
.code{margin-top:16px!important;margin-bottom:16px!important}
.code,.codespan{font-family:Consolas,"courier new";font-size:16px}
.code{width:auto;background-color:#fff;padding:8px 12px;border-left:4px solid #4CAF50;word-wrap:break-word}
.codespan{color:crimson;background-color:#f1f1f1;padding-left:4px;padding-right:4px;font-size:110%}

/*--- card --- */
.card {
  background: #fff;
  box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);
  color: #4a4a4a;
  max-width: 100%;
  position: relative;
  padding:0; 
  border:1px solid #e7e7e7
}

.card img{width: 100%}

/*--- close ---*/
.delete, .close {
  -moz-appearance: none;
  -webkit-appearance: none;
  background-color: rgba(10, 10, 10, 0.2);
  border: none;
  border-radius: 290486px;
  cursor: pointer;
  pointer-events: auto;
  display: inline-block;
  height: 1.5em;
  max-height: 1.5em;
  max-width: 1.5em;
  min-height: 1.5em;
  min-width: 1.5em;
  outline: none;
  position: relative;
  vertical-align: top;
  text-align: center;
  width: 1.5em;
}

/*--- row & col ---*/
.row-pad,.row-pad > .col{padding:0 0.75em}
.row:after,.row:before,.row-pad:after,.row-pad:before{content:"";display:table;clear:both}
.col{float:left;width:100%}

/*--- row table like ---*/
.cell-row:before,.cell-row:after{content:"";display:table;clear:both}
.cell-row{display:table;width:100%}
.cell{display:table-cell}
.cell-top   {vertical-align:top}
.cell-middle{vertical-align:middle}
.cell-bottom{vertical-align:bottom}

/*--- hide & show ---*/
.hide{display:none!important}.
.hover-hide{display:none!important}.

.show{display:block!important}
.hover-show:hover{display: block!important}

.show:hover + .hide {display: block!important}

/*--- transparent & opacity---*/
.hover-trans:hover{background-color:transparent!important}

.view0  {opacity:0    !important}
.view25 {opacity:0.25 !important}
.view33 {opacity:0.33 !important}
.view50 {opacity:0.50 !important}
.view66 {opacity:0.66 !important}
.view75 {opacity:0.75 !important}
.view100{opacity:1    !important}

.hover-view0:hover  {opacity:0    !important}
.hover-view25:hover {opacity:0.25 !important}
.hover-view33:hover {opacity:0.33 !important}
.hover-view50:hover {opacity:0.50 !important}
.hover-view66:hover {opacity:0.66 !important}
.hover-view75:hover {opacity:0.75 !important}
.hover-view100:hover{opacity:1    !important}

.hover-trans:hover{background-color:transparent!important}

/*--- image ---*/
.image{vertical-align:middle}
.image{max-width:100%;height:auto}
.image-fit{object-fit: cover}

/*--- shadow ---*/
.text-shadow{text-shadow:1px 1px 0 #444}
.shadow1{box-shadow:0 1px 2px 0 rgba(0,0,0,0.16),0 2px 4px 0 rgba(0,0,0,0.12)}
.shadow2{box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)}
.shadow4{box-shadow:0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19)} 
.hover-shadow:hover{box-shadow:0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19)}
.hover-light:hover {box-shadow:none!important}

/*--- display ---*/
.block       {display:block;width:100%}
.inline      {display:inline      !important}
.inline-block{display:inline-block!important}

/*--- overflow ---*/
.clip     {overflow:  hidden !important}
.clip-x   {overflow-x:hidden !important}
.clip-y   {overflow-y:hidden !important}

.scroll   {overflow:  auto;display:block;height: 100vh!important;}}
.scroll-x {overflow-x:auto;display:block}
.scroll-y {overflow-y:auto;height: 100vh!important;}

.ellipsis {text-overflow: ellipsis}

/*--- clear ---*/
.clear:after,.clear:before{content:"";display:table;clear:both}

/*--- float---*/
.left {float:left !important}
.right{float:right!important}

/*--- fixed position ---*/
.top   {top:0   ;position:fixed;width:100%;z-index:1}
.bottom{bottom:0;position:fixed;width:100%;z-index:1}

.pos-abs{position:absolute}
.pos-fix{position:fixed}
.pos-rel{position:relative}

.stick-t{position: sticky;top: 0}
.stick-r{position: sticky;right: 0}
.stick-b{position: sticky;bottom: 0}
.stick-l{position: sticky;left: 0}

.overlay {
   background:rgba(0,0,0,0.5);
   
   position: absolute;
   top:0;
   bottom: 0;
   left: 0;
   right: 0;
   overflow: hidden;
   
   z-index:2;
   height: 100%;
   
   width: 0;
   transition: .5s ease;
}

:hover .overlay {
   width: 100%
}

/*--- display box ---*/
.pos-box{position:relative}
.pos-box:hover .box-show{display:block !important}
.pos-box:hover  span.box-hover{display:inline-block!important}
.pos-box:hover .box-hide{display:none!important}

/* modificacion mia */
.pos-tl{position:absolute;left:0;top:0}
.pos-tc{position:absolute;left:50%;top:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
.pos-tr{position:absolute;right:0;top:0}

.pos-l{position:absolute;top:50%;left:0%;transform:translate(0%,-50%);-ms-transform:translate(-0%,-50%)}
.pos-c{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%)}
.pos-r{position:absolute;top:50%;right:0%;transform:translate(0%,-50%);-ms-transform:translate(0%,-50%)}

.pos-bl{position:absolute;left:0;bottom:0}
.pos-bc{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
.pos-br{position:absolute;right:0;bottom:0}

/*--- border---*/
.border0  {border:0!important}

.border1  {border:1px solid #ccc       !important}
.border1-t{border-top:1px solid #ccc   !important}.border1-b{border-bottom:1px solid #ccc !important}
.border1-l{border-left:1px solid #ccc  !important}.border1-r{border-right:1px solid #ccc  !important}

.border2  {border:2px solid #ccc       !important}
.border2-t{border-top:2px solid #ccc   !important}.border2-b{border-bottom:2px solid #ccc !important}
.border2-l{border-left:2px solid #ccc  !important}.border2-r{border-right:2px solid #ccc  !important}

.border4  {border:4px solid #ccc       !important}
.border4-t{border-top:4px solid #ccc   !important}.border4-b{border-bottom:4px solid #ccc !important}
.border4-l{border-left:4px solid #ccc  !important}.border4-r{border-right:4px solid #ccc  !important}

.hover-border:hover{border: 1px solid #f44336!important} /* red */

/*--- circle & round ---*/
.circle{border-radius:50%}

.round{border-radius:5px}

.round0 {border-radius:0}
.round2 {border-radius:0.125em}
.round4 {border-radius:0.25em}
.round8 {border-radius:0.5em}
.round16{border-radius:1em}
.round24{border-radius:1.5em}
.round32{border-radius:2em}

/* agregado mio */
.round-first, .round-left {
   -moz-border-radius-bottomleft: 0.5em;
   -moz-border-radius-topleft: 0.5em;
   -webkit-border-bottom-left-radius: 0.5em;
   -webkit-border-top-left-radius: 0.5em;
   border-top-left-radius: 0.5em;
   border-bottom-left-radius: 0.5em;
   -moz-background-clip:content-box;
   -webkit-background-clip: border;
}

.round-last, .round-right {
   -moz-border-radius-bottomright: 0.5em;
   -moz-border-radius-topright: 0.5em;
   -webkit-border-bottom-right-radius: 0.5em;
   -webkit-border-top-right-radius: 0.5em;
   border-top-right-radius: 0.5em;
   border-bottom-right-radius: 0.5em;
   -moz-background-clip:content-box;
   -webkit-background-clip: border;
}

.round-tr {
   -moz-border-radius-topright: 0.5em;
   -webkit-border-top-right-radius: 0.5em;
   border-top-right-radius: 0.5em;
   -moz-background-clip:content-box;
   -webkit-background-clip: border;
}

.round-tl {
   -moz-border-radius-topleft: 0.5em;
   -webkit-border-top-left-radius: 0.5em;
   border-top-left-radius: 0.5em;
   -moz-background-clip:content-box;
   -webkit-background-clip: border;
}

.round-br {
   -moz-border-radius-bottomright: 0.5em;
   -webkit-border-bottom-right-radius: 0.5em;
   border-bottom-right-radius: 0.5em;
   -moz-background-clip:content-box;
   -webkit-background-clip: border;
}

.round-bl{
   -moz-border-radius-bottomleft: 0.5em;
   -webkit-border-bottom-left-radius: 0.5em;
   border-bottom-left-radius: 0.5em;
   -moz-background-clip:content-box;
   -webkit-background-clip: border;
}

/*--- responsive ---*/
.auto{margin-left:auto;margin-right:auto}
.w100{width: 100%  !important}
.h100{min-height: 100vh!important}

/*--- margins---*/
.marg    {margin:0.5em 1em!important}
.marg-t  {margin:0.125em   0.25em!important}
.marg-s  {margin:0.25em    0.5em !important}
.marg-m  {margin:0.5em     0.75em!important}
.marg-l  {margin:0.75em    1.5em !important}
.marg-xl {margin:1.5em     2m    !important}
.marg-xxl{margin:2em       3em   !important}

.marg0 {margin:0      !important}
.marg4 {margin:0.25em !important}
.marg8 {margin:0.5em  !important}
.marg16{margin:1em    !important}
.marg24{margin:1.5em  !important}
.marg32{margin:2em    !important}
.marg48{margin:3em    !important}

.marg0-t {margin-top:0       !important}.marg0-b{margin-bottom:0     !important}
.marg0-l {margin-left:0      !important}.marg0-r{margin-right:0      !important}
.marg4-t {margin-top:0.25em  !important}.marg4-b{margin-bottom:0.25em!important}
.marg4-l {margin-left:0.25em !important}.marg4-r{margin-right:0.25em !important}
.marg8-t {margin-top:0.5em   !important}.marg8-b{margin-bottom:0.5em !important}
.marg8-l {margin-left:0.5em  !important}.marg8-r{margin-right:0.5em  !important}
.marg16-t{margin-top:1em     !important}.marg16-b{margin-bottom:1em  !important}
.marg16-l{margin-left:1em    !important}.marg16-r{margin-right:1em   !important}
.marg24-t{margin-top:1.5em   !important}.marg24-b{margin-bottom:1.5em!important}
.marg24-l{margin-left:1.5em  !important}.marg24-r{margin-right:1.5em !important}
.marg32-t{margin-top:2em     !important}.marg32-b{margin-bottom:2em  !important}
.marg32-l{margin-left:2em    !important}.marg32-r{margin-right:2em   !important}
.marg48-t{margin-top:3em     !important}.marg48-b{margin-bottom:3em  !important}
.marg48-l{margin-left:3em    !important}.marg48-r{margin-right:3em   !important}

.marg0-h {margin-left:-1em;margin-right:-1em}
.marg0-v {margin-top:-1em;margin-bottom:-1em}

.marg0-tb {margin-top:0     !important;margin-bottom:0       !important}
.marg4-tb {margin-top:0.25em!important;margin-bottom:0.25em  !important}
.marg8-tb {margin-top:0.5em !important;margin-bottom:0.5em   !important}
.marg16-tb{margin-top:1em   !important;margin-bottom:1em     !important}
.marg24-tb{margin-top:1.5em !important;margin-bottom:1.5em   !important}
.marg32-tb{margin-top:2em   !important;margin-bottom:2em     !important}
.marg48-tb{margin-top:3em   !important;margin-bottom:3em     !important}

.marg0-rl {margin-left:0       !important;margin-right:0     !important}
.marg4-rl {margin-left:0.25em  !important;margin-right:0.25em!important}
.marg8-rl {margin-left:0.5em   !important;margin-right:0.5em !important}
.marg16-rl{margin-left:1em     !important;margin-right:1em   !important}
.marg24-rl{margin-left:1.5em   !important;margin-right:1.5em !important}
.marg32-rl{margin-left:2em     !important;margin-right:2em   !important}
.marg48-rl{margin-left:3em     !important;margin-right:3em   !important}

/*--- paddings---*/
.pad    {padding:0.5em     1em     !important}
.pad-t  {padding:0.125em   0.25em  !important}
.pad-s  {padding:0.25em    0.5em   !important}
.pad-m  {padding:0.5em     0.75em  !important}
.pad-l  {padding:0.75em    1.5em   !important}
.pad-xl {padding:1.5em     2m      !important}
.pad-xxl{padding:2em       3em     !important}

/* agregado mio */
.pad0 {padding:0        !important}
.pad4 {padding:0.125em  !important}
.pad8 {padding:0.5em    !important}
.pad16{padding:1em      !important}
.pad24{padding:1.5em    !important}
.pad32{padding:2em      !important}
.pad48{padding:3em      !important}

.pad0-t {padding-top:0      !important}.pad0-b{padding-bottom:0      !important}
.pad0-l {padding-left:0     !important}.pad0-r{padding-right:0       !important}
.pad4-t {padding-top:0.25em !important}.pad4-b{padding-bottom:0.25em !important}
.pad4-l {padding-left:0.25em!important}.pad4-r{padding-right:0.25em  !important}
.pad8-t {padding-top:0.5em  !important}.pad8-b{padding-bottom:0.5em  !important}
.pad8-l {padding-left:0.5em !important}.pad8-r{padding-right:0.5em   !important}
.pad16-t{padding-top:1em    !important}.pad16-b{padding-bottom:1em   !important}
.pad16-l{padding-left:1em   !important}.pad16-r{padding-right:1em    !important}
.pad24-t{padding-top:1.5em  !important}.pad24-b{padding-bottom:1.5em !important}
.pad24-l{padding-left:1.5em !important}.pad24-r{padding-right:1.5em  !important}
.pad32-t{padding-top:2em    !important}.pad32-b{padding-bottom:2em   !important}
.pad32-l{padding-left:2em   !important}.pad32-r{padding-right:2em    !important}
.pad48-t{padding-top:3em    !important}.pad48-b{padding-bottom:3em   !important}
.pad48-l{padding-left:3em   !important}.pad48-r{padding-right:3em    !important}

.pad0-tb {padding-top:0       !important;padding-bottom:0      !important}
.pad4-tb {padding-top:0.125em !important;padding-bottom:0.125  !important}
.pad8-tb {padding-top:0.5em   !important;padding-bottom:0.5em  !important}
.pad16-tb{padding-top:1em     !important;padding-bottom:1em    !important}
.pad24-tb{padding-top:1.5em   !important;padding-bottom:1.5em  !important}
.pad32-tb{padding-top:2em     !important;padding-bottom:2em    !important}
.pad48-tb{padding-top:3em     !important;padding-bottom:3em    !important}

.pad0-rl {padding-left:0      !important;padding-right:0       !important}
.pad4-rl {padding-left:0.125em!important;padding-right:0.125em !important}
.pad8-rl {padding-left:0.5em  !important;padding-right:0.5em   !important}
.pad16-rl{padding-left:1em    !important;padding-right:1em     !important}
.pad24-rl{padding-left:1.5em  !important;padding-right:1.5em   !important}
.pad32-rl{padding-left:2em    !important;padding-right:2em     !important}
.pad48-rl{padding-left:3em    !important;padding-right:3em     !important}

/*--- Max Media Query---*/

/* mobile */
@media (max-width:600px){
   body{font-size:80%}
   .modal-content{margin:0 10px;width:auto!important}.modal{padding-top:30px}
   .hoverdown.mobile .hoverdown-content,.clickdown.mobile .hoverdown-content{position:relative}	
   .menu-item.mobile,.hoverdown.mobile,.clickdown.mobile{text-align:center}
   .hoverdown.mobile,.hoverdown.mobile .btn,.hoverdown.mobile .button,.clickdown.mobile,.clickdown.mobile .btn,.clickdown.mobile .button{width:100%}
   
   .box{padding:0; display: block; width: 100%}
   
   .clickdown.mobile .dropright-content{position:static}	
   .clickdown.mobile .button{text-align: center}	
   .dropright-content{top: 2.5em;left: 0}
   
   .mobile{display:block!important}
}

/* mobile-landscape *//*@media (max-width:768px){*/
@media (max-width:800px){
   .modal{padding-top:50px}.modal-content{width:90%}
}

/* mobile-landscape *//*@media only screen and (max-width: 768px) {*/
@media only screen and (max-width:800px){   
   table.table-resp {width: 100%;border-collapse: collapse;border-spacing: 0;display: block; position: relative}
   table.table-resp td:empty:before {content: '\00a0'}
   table.table-resp th, table.table-resp td {margin: 0;vertical-align: top}
   table.table-resp thead {display: block;float: left}
   table.table-resp thead tr {display: block;padding: 0 10px 0 0}
   table.table-resp thead tr th::before {content: "\00a0"}
   table.table-resp tbody {display: block;width: auto;position: relative;overflow-x: auto}
   table.table-resp tbody tr {display: inline-block;vertical-align: top}
   table.table-resp th {display: block;text-align: right}
   table.table-resp td {display: block;min-height: 1.25em;text-align: center; background-color: transparent}
   table.table-resp tr {width: 100%;border-left:1px solid rgba(0, 0, 0, 0.12);  padding: 10px 0}
   table.table-resp thead {border: 0;border-right: 1px solid rgba(0, 0, 0, 0.12)}
   
   table.table-resp td * {width: 100%}
}

/* tablet *//*@media (max-width:992px){*/
@media (max-width:1024px){   
   .sidebar.collapse{display:none}
   .main{margin-left:0!important;margin-right:0!important}
   .auto{max-width:100%}
   
   .flow-x{overflow-x: auto;display:block}
   .flow-y{overflow-y: auto;height: 100vh!important}
}

/* desktop *//*@media (max-width:1025px){*/
@media (max-width:1200px){   
   .auto{max-width:95%}
}

/* tablet *//*@media (min-width:993px){*/
@media (max-width:1025px){  
   .modal-content{width:40%}
   .sidebar.collapse{display:block!important}
}


/*--- Min Media Query---*/

/* phone */
@media (min-width:481px){
   body{font-size:70%}
   .hide-phone{display:none!important} 
   .show-phone{display:block!important}  
   
   .col.p1{width:8.33333%} .col.p2{width:16.66666%} .col.p3{width:24.99999%} .col.p4{width:33.33333%}
   .col.p5{width:41.66666%}.col.p6{width:49.99999%} .col.p7{width:58.33333%} .col.p8{width:66.66666%}
   .col.p9{width:74.99999%}.col.p10{width:83.33333%}.col.p11{width:91.66666%}.col.p12{width:99.99999%}  
   
   .p1-4{width:24.99999%}.p1-3{width:33.33333%}.p1-2{width:49.99999%}.p2-3{width:66.66666%}.p3-4{width:74.99999%}
}

/* mobile */
@media (min-width:601px){
   body{font-size:80%}
   .hide-mobile{display:none!important}
   .show-mobile{display:block!important}
   
   .col.m1{width:8.33333%} .col.m2{width:16.66666%} .col.m3{width:24.99999%} .col.m4{width:33.33333%}
   .col.m5{width:41.66666%}.col.m6{width:49.99999%} .col.m7{width:58.33333%} .col.m8{width:66.66666%}
   .col.m9{width:74.99999%}.col.m10{width:83.33333%}.col.m11{width:91.66666%}.col.m12{width:99.99999%}
   
   .m1-4{width:24.99999%}.m1-3{width:33.33333%}.m1-2{width:49.99999%}.m2-3{width:66.66666%}.m3-4{width:74.99999%}
}

/* mobile-landscape*//*@media (min-width:769px){*/
@media (min-width:801px){
    body{font-size:90%}
   .hide-land{display:none!important}
   .show-land{display:block!important}   
   
   .col.l1{width:8.33333%} .col.l2{width:16.66666%} .col.l3{width:24.99999%} .col.l4{width:33.33333%}
   .col.l5{width:41.66666%}.col.l6{width:49.99999%} .col.l7{width:58.33333%} .col.l8{width:66.66666%}
   .col.l9{width:74.99999%}.col.l10{width:83.33333%}.col.l11{width:91.66666%}.col.l12{width:99.99999%}
   
   .l1-4{width:24.99999%}.l1-3{width:33.33333%}.l1-2{width:49.99999%}.l2-3{width:66.66666%}.l3-4{width:74.99999%}
} 

/* tablet *//*@media (min-width:993px){*/
@media (min-width:1025px){
   body{font-size:100%}
   .hide-tablet{display:none!important}
   .show-tablet{display:block!important}
   
   .col.t1{width:8.33333%} .col.t2{width:16.66666%} .col.t3{width:24.99999%} .col.t4{width:33.33333%}
   .col.t5{width:41.66666%}.col.t6{width:49.99999%} .col.t7{width:58.33333%} .col.t8{width:66.66666%}
   .col.t9{width:74.99999%}.col.t10{width:83.33333%}.col.t11{width:91.66666%}.col.t12{width:99.99999%}   
   
   .t1-4{width:24.99999%}.t1-3{width:33.33333%}.t1-2{width:49.99999%}.t2-3{width:66.66666%}.t3-4{width:74.99999%}
}

/* desktop *//*@media (min-width:1025px){*/
@media (min-width:1201px){
   body{font-size:100%}
   .hide-desk{display:none!important}
   .show-desk{display:block!important}
   
   .col.d1{width:8.33333%} .col.d2{width:16.66666%} .col.d3{width:24.99999%} .col.d4{width:33.33333%}
   .col.d5{width:41.66666%}.col.d6{width:49.99999%} .col.d7{width:58.33333%} .col.d8{width:66.66666%}
   .col.d9{width:74.99999%}.col.d10{width:83.33333%}.col.d11{width:91.66666%}.col.d12{width:99.99999%}
   
   .d1-4{width:24.99999%}.d1-3{width:33.33333%}.d1-2{width:49.99999%}.d2-3{width:66.66666%}.d3-4{width:74.99999%}
}

/* wide screen *//*@media (min-width:1280px){*/
@media (min-width:1441px){
   body{font-size:100%}
   .hide-wide{display:none!important}
   .show-wide{display:block!important}   
   
   .col.w1{width:8.33333%} .col.w2{width:16.66666%} .col.w3{width:24.99999%} .col.w4{width:33.33333%}
   .col.w5{width:41.66666%}.col.w6{width:49.99999%} .col.wl7{width:58.33333%}.col.w8{width:66.66666%}
   .col.w9{width:74.99999%}.col.w10{width:83.33333%}.col.w11{width:91.66666%}.col.w12{width:99.99999%}
   
   .w1-4{width:24.99999%}.w1-3{width:33.33333%}.w1-2{width:49.99999%}.w2-3{width:66.66666%}.w3-4{width:74.99999%}
}

/* full hd *//*@media (min-width:1408px){*/
@media (min-width:1681px){
   body{font-size:120%}
   .hide-full{display:none!important}
   .show-full{display:block!important}   

   .col.f1{width:8.33333%} .col.f2{width:16.66666%} .col.f3{width:24.99999%} .col.f4{width:33.33333%}
   .col.f5{width:41.66666%}.col.f6{width:49.99999%} .col.f7{width:58.33333%} .col.f8{width:66.66666%}
   .col.f9{width:74.99999%}.col.f10{width:83.33333%}.col.f11{width:91.66666%}.col.f12{width:99.99999%}

   .f1-4{width:24.99999%}.f1-3{width:33.33333%}.f1-2{width:49.99999%}.f2-3{width:66.66666%}.f3-4{width:74.99999%}
}