@charset "utf-8";
/* CSS Document version$ 2.1 Ever Ascencio - Designer (info@everascencio.com)*/

@font-face {
    font-family: 'colaborate-regularregular';
    src: url('ColabReg-webfont.eot');
    src: url('ColabReg-webfont.eot?#iefix') format('embedded-opentype'),
         url('ColabReg-webfont.woff') format('woff'),
         url('ColabReg-webfont.ttf') format('truetype'),
         url('ColabReg-webfont.svg#colaborate-regularregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'social_shapesregular';
    src: url('social_shapes-webfont.woff2') format('woff2'),
         url('social_shapes-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body {font-size:16px; font-family: Arial, Helvetica, Verdana, sans-serif; color: #444; margin: 0px; background: #fff; }

body, tr, td, p, input, select, textarea, button{font-family: Arial, Helvetica, Verdana, sans-serif;font-size: 16px}
h1, h2, h3 {font-family: 'colaborate-regularregular',Arial, Helvetica, Verdana, sans-serif;}
.home-title {position:relative; text-align:center}
.home-title::before {content: ""; background: url(/images/Title-icon.png) no-repeat center; left: 0; right: 0; width: 45px; height: 20px; display: block; text-align: center; margin: 0 auto; }
h1 {font-size: 200%; letter-spacing: -1px; margin:0px}
h2 {font-size:200%; color:#444;}
h3 {font-size:120%; color: #d5c341; font-weight:bold; text-transform:uppercase; margin:0px}
h4 {font-size:120%;}
a  {color: #111; text-decoration:none; transition: 300ms ease-in-out;}
a:hover, a:focus { color:#333;text-decoration: none;outline: none; }
.lnk {color:#444 }
.lnk:hover {color:#FE5000}
.lnk1 { color: #2a61fb; font-weight: bold}
.lnk2 { padding:5px; display:inline-block; margin: 0px 0px 2px 0px; color: #959595; text-transform: uppercase;}
.f32 {font-size:200%; letter-spacing: -1px; }
.big, big {font-size:150%; }
.small, small { font-size: 0.786em; margin:2px;color: #999 }

* { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; outline-color: #ccc}
::-moz-selection { color: #fff; background: #2a61fb;}
::selection { color: #fff; background: #2a61fb }

#preload {position: fixed; left: 0; top: 0; bottom: 0; right: 0; float: left; display: flex; justify-content: center; align-items: center; padding: 20px; z-index: 9999999; transition: .3s all ease; background: #fff}
#slider div {background-size:cover !important; transition: transform 6s ease-in !important;height: 300px}
#slider > div > div.spaced { margin:auto; width:100%; padding-top:400px;}
    #slider video {height: 100% !important}

header {margin:auto;width:100%; position:fixed;top:0px;z-index:100;} 
#send {min-height:400px}

footer {overflow: hidden; width: 100%; background: url(/images/foot.jpg); padding-top:100px}
    .basemenu {overflow:hidden; border-bottom:solid 1px #eae9e9}
        #menu {display:none;}
        #smenu {width:10%; padding:6px;display:block;float:left; position:relative; font-size:180%; font-weight:lighter; color:#72a603}
        .icons {display:none}
        .icons a {display: inline-block; width:65px; height: 65px; padding:3px; font-size:9px; text-transform: uppercase}
.pictures img {width:75px; height:auto}
.clearfix:after, .pictures { display:block; clear:both; }
nav { position:relative; padding:10px}
/*----- Menu Outline -----*/

.menu { width:100%; margin:auto; padding:5px; list-style:none outside;background: #737373; background: linear-gradient(45deg, #737373 20%, #73737340); animation-timing-function: cubic-bezier(.71,.55,.62,1.57); backdrop-filter: saturate(180%) blur(20px);}
.menu li { transition:all linear 0.15s; display:block; position:relative; margin: 0px 3px; vertical-align: middle}
.menu > li > a > b {color: #ecff1e;}
.menu li a {text-transform: uppercase; padding:25px;}
.sub-menu li a { padding:10px; text-transform: uppercase }
.sub-menu li {border-bottom:solid 1px #adadad}
.menu li a,
.sub-menu li a { font-size:75%; color:#fff; text-decoration:none; display:block;  }
/*----- Top Level -----*/
.menu > li:hover > a, 
.sub-menu li:hover a  { color: #ecff1e }
.menu > .current-item > a, .sub-menu .current-item a {background: #737373; background: linear-gradient(0deg, #737373 4%, #333 94%); color: #ffe70b; border-radius:6px}
/*----- Bottom Level -----*/
.sub-menu { margin:0px; padding: 10px; transition:opacity linear 0.15s; background:#1a1a1a;  list-style:none outside; -webkit-border-bottom-right-radius: 6px; -webkit-border-bottom-left-radius: 6px; -moz-border-radius-bottomright: 6px; -moz-border-radius-bottomleft: 6px; border-bottom-right-radius: 6px; border-bottom-left-radius: 6px; display:none;}
.sub-menu li { margin: 6px}
.whites {background:#fff}
.greens {background:#2a61fb}
article {background: #fff; overflow: hidden; }
label, .mini {font-size: 9px !important; text-transform: uppercase; color: #999}
.spaced, .pictures {padding:10px}
.floatright {float:right; width: auto}
.pad20, #send, .alert {padding:20px; overflow: hidden;}
.twhite, .twhite p, .twhite h3 a {color: #fff !important;}

.shade, .menu, .current-item {box-shadow: 0 0 15px rgb(0 0 0 / 10%); }
.scroll, .left, .right { border-style: solid;
    border-color:  #000;
    border-width: 0.25em 0.25em 0 0;
    content: '';
    display: block;
    height: 20px;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    width: 20px;
    margin: auto;
}
.left {-webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); transform: rotate(-135deg);display: inline-block;opacity: 0.3}
.right {-webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);display: inline-block;opacity: 0.3}
.blinks {animation: blink 1s infinite;}
a.blinks {display: inline-block;}
a.blinks .left, a.blinks .right { opacity: 1;}
.alert {background:#fdcc0c; color:#666;}
.notify {z-index:99999999;position:fixed;top:0;left:0; width:90%;padding:30px;margin:5%;}
.imgfn, .circle, .imgfl {background-size: cover !important; background-repeat:no-repeat; background-position: 50% 50% !important;}
.imgfx {background-size: cover; background-repeat:no-repeat; background-attachment: scroll; background-position: 50% 50%; background-color:#ffe70b;}
.imgfn { background-color:#f2f2f2; width:100%; display: block; height:200px }
.imgfl { background-color:#f2f2f2; width:100%; display: block; height:350px }
.square {background: #f2f2f2}
.h600 { height:600px !important}
.boxes {width:100%; overflow: hidden; margin: 0px; }
    .boxes > div, .boxesx > div {float:none; width: 100%; height: auto; background: #fff; margin-bottom:20px}
    .boxes > article {float:none; width: auto; height: auto; min-height: 350px;}
.boxesx {-moz-column-gap: 1.5%; -webkit-column-gap: 1.5%; column-gap: 1.5%; }
.borders, .alert, .menu {-webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px;}
.gallery {align-content: center; text-align: center; border:solid 1px #f2f3f24b}
.gallery, .lists{list-style: outside none; width:100%; float:none;margin:0;padding:4px 0 0 0; clear:both}
.gallery > div {width:auto; display: inline-block; vertical-align:middle; text-transform: uppercase; padding:10px; font-size:75%; color: #444}
.lists > li {width:100%; float:none; min-height:250px; height:auto}

.datainfo{list-style: outside none; width:100%; display: block ;margin:0;padding:0}
.datainfo div {width:100%;min-height:100px; display: inline-block; vertical-align: top; padding:15px}

.circle {border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; width:180px !important; height: 180px !important; margin: 5px; display: inline-block}

.section, .section_small, .hddn, nav {margin:auto;max-width: 1100px;}
    .section {clear:both; min-height:600px; height:auto} /*overflow:hidden*/
    .section_small {clear:both; min-height:300px; overflow:hidden} 
.col-15, .col-20, .col-25, .col-30, .col-35, .col-50, .col-65, .col-70, .col-75, .col-80, .col-85, .col-40, .col-60, .col-100 { float: none; width: 100%; }

.badge{position:relative;}
.badge[data-badge]:after {content:attr(data-badge);position:absolute;top:-10px;right:0px;font-size:12px !important;background:#72a603;color:#fff;width:20px;height:20px;text-align:center;line-height:20px;border-radius:50%; 
    animation: blink 1s; animation-iteration-count: 2;
    -webkit-animation: blink 1s; -webkit-animation-iteration-count: 2;
    -moz-animation: blink 1s; -moz-animation-iteration-count: 2;
    -o-animation: blink 1s; -o-animation-iteration-count: 2;
}
.fieldForm50, .fieldForm100 {width:100%;display:block; min-height:90px;height:auto; float:none}

[disabled] { border:solid 3px #9d9da1 !important; color:#9d9da1 !important; background:#f7f7f7 !important; }
input, select, textarea { width: 100%; padding: 12px; resize: vertical; float:none; border-radius: 6px; border:1px solid #ccc; }
input[type=number] { width: 70px}
label {float:none; width: 100%; padding: 12px 0 12px 0;}
select, input[type=date] {-webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(images/arrow_down_512.png) 100% 0px no-repeat; background-size: contain  }
select[multiple=multiple] {background-image:none}

input[type=button], input[type=reset], button[type=button], button[type=reset], button[type=submit], button{background: linear-gradient(0deg, #ccc, #979797); color: #fff;  border:none; padding: 12px 20px; cursor: pointer; margin: 0 0 1px 0; transition: 300ms ease-in-out; box-shadow: 0px 2px 4px #4a4848}
button:hover {background: linear-gradient(0deg, #737373, #333); color: #ccc; box-shadow: 0px 2px 8px #ccc}

.fb:before, .tw:before, .ins:before, .web:before, .mai:before, .utb:before, .in:before, .wa:before {display: inline-block; font-family: "social_shapesregular"; font-weight: normal; font-style: normal; text-align: center; -webkit-font-smoothing: antialiased;font-size: 130%}
.fb:before  {content: 'F';}
.tw:before  {content: 'Õ';}
.ins:before {content: 'd';}
.in:before  {content: 'j';}
.web:before {content: 'ó';}
.mai:before {content: 'Ã';}
.utb:before {content: 'ù';} 
.wa:before  {content: "í";} 
.fb:hover::before, .tw:hover::before, .ins:hover::before,  .in:hover::before, .web:hover::before, .mai:hover::before, .utb:hover::before, .in:hover::before, .wa:hover::before {color:#fdcc0c}

table {width:100%}
th {color: #72a603; text-transform: uppercase;border-bottom:solid 1px #444}
td {padding:10px;border-bottom:dotted 1px #ccc}

.usl-loading { opacity: 0.75; }

@keyframes blink {
    0%   {opacity: 1; transform: scale(1); }
    70%  {opacity: 0.9; transform: scale(0.9); }
    100% {opacity: 1; transform: scale(1); }
}

@keyframes blinking {
    0%   {opacity: 0; }
    25%  {opacity: 1; }
    50%  {opacity: 0; }
    100% {opacity: 1; }
}

@keyframes blinked { 
   50% { border-right: 2px solid #000; } 
}


@media (min-width: 750px) and (max-width: 1100px)  {
    .circle {width:230px !important; height:230px !important}
    .img {width:100% !important; height:auto; transform: translateY(10px) !important}
    .imgfx {background-attachment:scroll !important;}
    #slider > div > div, #slider > div {width:100%;}
    #slider > div {height: 550px}
    .icons {display: block}
    nav {padding:0px}
}

/* Diseño receptivo: cuando la pantalla tiene menos de 600 píxeles de ancho, haga que las dos columnas se apilen una encima de la otra en lugar de una al lado de la otra */
@media all and (min-width: 740px) {
    .col-15 { float: left; width: 15%; }
    .col-20 { float: left; width: 20%; }
    .col-25 { float: left; width: 25%; }
    .col-30 { float: left; width: 30%; }
    .col-35 { float: left; width: 35%; }
    .col-65 { float: left; width: 65%; }
    .col-70 { float: left; width: 70%; }
    .col-75 { float: left; width: 75%; }
    .col-80 { float: left; width: 80%; }
    .col-85 { float: left; width: 85%; }
    .col-50 { float: left; width: 50%; }
    .col-40 { float: left; width: 40%; }
    .col-60 { float: left; width: 60%;}
    .col-100 { float: none; width: 100%; clear:both; overflow: hidden}

    .imgfx {background-attachment:fixed;}
    .imgfn { height:200px}
    .imgfl { height:500px !important}
    .pictures img {width:100px; height:auto}

    button {width:auto;}
    article {margin:20px}
    .fieldForm50 label {width: 30%; float:left}
    .fieldForm50 {width:49%;display:block; min-height:90px; min-width: 300px; height:auto; display: inline-block;padding:1%}
    .fieldForm50 input, .fieldForm50 select, .fieldForm50 textarea { width: 65%;float:left}
    .fieldForm100 label {width: 15%; float:left}
    .fieldForm100 {width:100%;display:block; min-height:90px; height:auto;display: inline-block;padding:0px}
    .fieldForm100 input, .fieldForm100 select, .fieldForm100 textarea { width: 80%; }

    #smenu {display: none}
    #menu, .icons {display: block}
    
    .menu li { transition:all linear 0.15s; display:inline-block; position:relative; }
    .sub-menu li {display:block;}
    /*----- Bottom Level -----*/
    .menu li:hover .sub-menu { z-index:1; opacity:1; display:block}
    .sub-menu { width:auto; min-width: 200px; padding: 0px; position:absolute; top:100%; left:0px; z-index:-1; opacity:0; transition:opacity linear 0.15s; background:#737373;  list-style:none outside; display:none; box-shadow: 0 0 15px rgb(0 0 0 / 10%);}
    
    #slider > div > div, #slider > div {width:1200px;}
    #slider > div {height: 800px}
    #slider video {width: 100% !important}
    
    nav {padding:0px}

    h1 {font-size:300%; }
    h2 {font-size:200%; }
    h3 {font-size:100%; }
    h4 {font-size:110%; }
    
        .boxes > div {float:left; width: 30%; margin:2% 1%; height: auto; min-height: 650px;}
        .boxesx > div {display: inline-block; width: 100%; margin:2% 1%; height: auto; min-height: 500px;}
        .boxes > article {float:left; width: 29%; height: 600px;}
        .boxesx {
            -moz-column-count: 3;
            -webkit-column-count: 3;
            column-count: 3;
        }
        .lists > li {width:50%; float:left;}
       
        .datainfo div {width:50%;}
}

/*Fb Comments Width Fix*/
.fb_iframe_widget_fluid_desktop, .fb_iframe_widget_fluid_desktop span, .fb_iframe_widget_fluid_desktop iframe {
            max-width: 100% !important;
            width: 100% !important;
 }