@charset "utf-8";
/* CSS Document version$ 3.0 Ever Ascencio - Designer (info@everascencio.com)*/
@font-face {
    font-family: 'ralewaylight';
    src: url('raleway-light-webfont.woff2') format('woff2'),
         url('raleway-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal; }
@font-face {
    font-family: 'social_shapesregular';
    src: url('social_shapes.woff2') format('woff2'),
         url('social_shapes.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

::-moz-selection { /* Code for Firefox */
  color: white;
  background: #934176;
}

::selection {
  color: white;
  background: #934176;
}

html {-webkit-text-size-adjust: 100%;}
body {background:#fff; overflow-y: scroll; scroll-behavior: smooth; margin:0px}
body, tr, td, p, input, select, textarea, button{font-family: Arial, Helvetica, Verdana, sans-serif;font-size: 16px; color: #444;}
h1, h2, h3, h4, h5 {font-family: 'ralewaylight', Arial, Helvetica, Verdana, sans-serif;}
h1 {font-size: 200%; color:#333;}
h2 {font-size: 130%; color:#333; font-family: 'ralewaylight', Arial, Helvetica, Verdana, sans-serif;}
h3 {font-size: 150%; color:#800069}
h4 {font-size: 130%;}
a  {color: #444; text-decoration:none; transition: 1s ease-in-out;}
    a:hover, a:focus { color: #666; text-decoration: none; outline: none; }
b, strong {font-family: Arial, Helvetica, Verdana, sans-serif; font-weight: bold} 
i, em {font-family: Arial, Helvetica, Verdana, sans-serif; font-style: italic} 
.big, big {font-size:150%;}
.small, small { font-size: 80%; margin-bottom: 1.727em; color:#666; }

.lnk {color:#800069; font-size:145%}
.lnk:hover {color:rgba(112,3,0,1)}
.lnk2 {background:#333;padding: 5px 10px;text-decoration:none;border-radius: 5px;line-height:2em;color:#fff;text-transform:uppercase;text-shadow:none;margin:0 1px}
.lnk2:hover {color:#ccc;text-shadow:#fff 0 1px 0;}
*, *::before, *::after { box-sizing: border-box; outline-color: #934176}

#preload, .search {position: fixed; left: 0; top: 0; bottom: 0; right: 0; float: left; display: flex; justify-content: center; align-items: center; padding: 20px; z-index: 99999; transition: .3s all ease;}
#smenu {font-size:250%; font-weight:lighter;}
header {position:fixed; width:100%;}
nav, section, header, footer, .clearfix {transition: 1s all ease;}
.section, .hddn {margin:auto;max-width: 1200px;overflow: hidden}
footer, section {display:block !important;}
hr {width:10%; text-align: center; border: solid 3px green;}
sup > small > b {color: #c08fa2 !important;}
nav {width:100%; height:500px; margin:auto; overflow: scroll; background:#E52456ba; backdrop-filter:saturate(200%) blur(20px); text-align:center;}
nav > a.selected{color: yellow;}
nav > a, nav > a:hover {margin:2px 0px; padding:10px 10px; font-size: 180%; display: block; color: #fff; text-align: center}
nav, .divHide {display: none}
#myDescrip {position:relative;background: rgba(0, 0, 0, 0.5);color: #f1f1f1; width: 100%; padding: 20px;}
#slider div {background-size:cover !important; transition: transform 6s ease-in !important;height: 400px}
#slider > div > div.spaced { margin:auto; width:100%; padding-top:200px;color: #fff !important;font-size:150%; font-weight:lighter}
#slider > div > div.spaced > big {font-size:200%; color:#000; line-height:51px}

.artitle, .tshade {text-shadow:2px 5px 5px #333}
.artitle {padding:250px 0 0 10px;color: #fff !important; font-weight:bold; font-size:275%; letter-spacing: -1px !important}
.spaced {padding:10px}
.spaced-top {margin:125px auto 0px auto}
.white, #preload {background: #fff;}

.pad20 {padding:20px; overflow: hidden;}
.twhite, .twhite p, .twhite h3 a, .twhite h2 {color: #fff;}
.twhite p b {color: #efa6a6}
.popup {position:fixed;top:0px;right:0;z-index:999; margin:0 6%; padding:0px;border-radius: 10px; width:88%; max-width: 350px; background: url(/images/bg001.jpg)}

.shade, .popup {box-shadow: 0 0 10px 1px #c9656526;}
.floatright {float:none; width: auto}

.imgfx {background-size: cover; background-repeat:no-repeat; background-attachment: scroll; background-position: 50% 50%;}
.imgfn {background-size: cover !important; background-repeat:no-repeat; background-position: 50% 50%; width:100%; min-height: 200px; display: block}
.ltiny > .imgfn {min-height:150px}
.borders {-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;}
.shadow-in{background:rgb(112,3,0); background: linear-gradient(51deg, rgba(112,3,0,1) 0%, rgba(240,25,0,1) 100%);}
.section, article {clear:both; min-height:400px; overflow:hidden}
.gallery {width: 100%; overflow: hidden}
.pictures {float:left; width: auto; height:70px; overflow: hidden}
.square     {background-color:#fff; height:600px;clear: both; text-align: center;overflow: visible}
.square pre {font-size: 130%;display:block; padding:10%;white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word; height:300px; max-height:300px; width: 100%; overflow-wrap: break-word}
.icons      {background-size:100% !important;width:36px; height: 36px; float:left}
.shaps      {background-size:100% !important;width:32px; height: 32px; display: inline-block; float:left;margin: 0 10px 2px 0}
.borderbottom {border-bottom: solid 3px #000; padding: 5px 0px}
.close   {background: url(/images/close.svg) no-repeat 50% 0%;}
.refre   {background: url(/images/refresh.svg) no-repeat 50% 0%;}
.print   {background: url(/images/print.svg) no-repeat 50% 0%;}
.circle {width: 150px; height: 150px; border-radius: 50%;display: inline-block}
.img {width:100%; height:auto; transform: translateY(0px); }

.col-15, .col-20, .col-25, .col-30, .col-35, .col-50, .col-65, .col-75, .col-40, .col-60, .col-100 { float: none; width: 100%; clear: both}

.alert {width: 100%; padding: 16px 30px 16px 16px;margin: auto; background: #ffdd5c url(images/alert.png) 95% center no-repeat; background-size: auto 50%;color: green !important; border-radius:10px; clear:both}

.badge{position:relative;}
.badge[data-badge]:after {content:attr(data-badge);position:absolute;top:-33px; left:18px; font-size: 65%; background:red;color:white;width:24px;height:24px;text-align:center;border-radius:50%;padding:4px}
.badge[data-badge]:after, .picblink {
    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:150px;height:auto; float:none}
[disabled] { border:solid 1px #a5acb2; color:#9d9da1 !important; background:#f7f7f7 !important; }
input, select, textarea { width: 100%; padding: 10px; border:none; border-bottom:solid 1px #000; resize: vertical; float:none; border-radius: 0px; margin:2px 0px;}
input:focus, select:focus, textarea:focus {outline-color: #666;} 
.tabs a {font-size:75%; color:#666 }
label {float:none; width: 100%; padding: 10px 0 }
select{-webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(//everascencio.com/images/arrow_down_512.png) 100% 0px no-repeat #fff; background-size: contain; }
select[multiple=multiple] {background-image:none}
img {border-radius:15px;}
input[type=button], input[type=reset], button[type=button], button[type=reset], button[type=submit], button, .btn{font-family:Arial, Helvetica, Verdana, sans-serif; font-size:95%; background-color: #ff005e; color: #fff; padding:14px 34px; border: none; border-radius: 6px; cursor: pointer; margin: 0 0 1px 0;transition: 1s all ease;}
input[type=submit]:hover, button:hover, button[type=submit]:hover {background: rgb(208,166,236); background: linear-gradient(90deg, rgba(208,166,236,1) 0%, rgba(255,146,146,1) 50%, rgba(255,166,166,1) 100%); }
button:hover {transform: scale(1.1); }

.submit {background-color: #0071BC !important; background:-webkit-linear-gradient(90deg, #9fb8ad 0%, #1fc8db 50%, #2cb5e8 75%) !important;background:linear-gradient(141deg, #0071BC 0%, #1B1464 51%, #2cb5e8 75%) !important;}
.btn {padding:3px !important;font-size:70% !important}
.boxes label {width:100%; float:none; display: block}
.boxes, .box, .lsmall, .ltiny{list-style: outside none; width:100%; margin:0px;padding:0px} 
.boxes ul {list-style: outside none; width:100%;display: none; margin:10px 5px}
.boxes li, .boxes ul li {padding:10px 5px; border-top: solid 1px #ddd}
.boxes li:hover {background:#f2f2f244}
.lsmall li {width:50%; height:250px; float:left; transition: 1s all ease;margin:0;text-align: right;margin:0;}
.lsmall li:hover, .ltiny li:hover {background-position:0px 50%; -webkit-filter: saturate(1.5); filter: saturate(1.5);}
.lsmall li a {display: block; padding:50px 0px}

.ltiny li {width:25%; height:150px; float:left; transition: 1s all ease;margin:0;text-align:center;}
.ltiny li a {display: inline-block; background:#252525; border-radius: 6px; padding:2px 4px; color:#fff; margin-top:70px}

.box {margin: 0px; -moz-column-gap: 0px; -webkit-column-gap: 0px; column-gap: 0px; padding:0 10px 0 0; }
.box li { min-height:40px; margin:20px; width:90%;-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px; display:inline-block; background:#fff;}

.pages {clear:both; display:block}

.tabs {padding: 0 0 10px 0; border-bottom: solid 1px #5cb85c}
.tabs a {padding:10px; -webkit-border-top-left-radius: 6px;-webkit-border-top-right-radius: 6px; -moz-border-radius-topleft: 6px;-moz-border-radius-topright: 6px; border-top-left-radius: 6px;
border-top-right-radius: 6px;margin-right:1px;font-size:125%}
.clk {background:#5cb85c; color:#fff !important}

table {width:100%}
table tr th {font-size:65%; font-weight: bold; text-transform: uppercase;border-bottom:solid 1px #ccc; background-color: transparent !important;text-align:center !important}
table tr td {padding:5px;border-bottom:dotted 1px #ccc;vertical-align: top}

/*table tr:nth-child(even) td { background-color: #fafafa !important}
table tr:nth-child(odd) td { background-color: #fff  !important}*/

.tdStyle{ display:none;padding: 10px;
    background: -moz-linear-gradient(bottom, #eee 0%, #fff 100%); background: -webkit-gradient(bottom top, top top, color-stop(0%, #eee), color-stop(100%, #fff));
    background: -webkit-linear-gradient(bottom, #eee 0%, #fff 100%); background: -o-linear-gradient(bottom, #eee 0%, #fff 100%);
    background: -ms-linear-gradient(bottom, #eee 0%, #fff 100%); background: linear-gradient(to bottom, #eee 0%, #fff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eee', endColorstr='#fff', GradientType=1 ); min-height: initial !important; }

#cimagen { cursor: pointer; }
.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: 170%}
.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 {}


#preload img {
    animation: blink 1s; animation-iteration-count: infinite;
    -webkit-animation: blink 1s; -webkit-animation-iteration-count: infinite;
    -moz-animation: blink 1s; -moz-animation-iteration-count: infinite;
    -o-animation: blink 1s; -o-animation-iteration-count: infinite;
}


.noTagShow {visibility:hidden; display:none !important}

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

@keyframes bounce {
    0%, 20%, 60%, 100% {-webkit-transform: translateY(0);transform: translateY(0);}
    40% {-webkit-transform: translateY(-20px);transform: translateY(-20px); }
    80% {-webkit-transform: translateY(-10px); transform: translateY(-10px);}
}

@keyframes blinked { 
   50% { border-bottom: 2px solid green; } 
}
@media (min-width: 768px) and (max-width: 1024px) { /*tablet*/
    h1 {font-size: 250%}                                                                    
    h2 {font-size: 130%;}

    .col-15, .col-20, .col-25, .col-30, .col-35, .col-50, .col-65, .col-75, .col-40, .col-60, .col-100 { clear: none }

    .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-75 { float: left; width: 75%; }
    .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}
    
    .imgfx {background-attachment:scroll;}
    
    .popup {width:350px}
    
    input, select, textarea { width: 70%;float:left}
    label {width: 30%; float:left;}
    .fieldForm50 {width:100%; min-width: 300px; height:auto; float: left;padding:5px}
    .fieldForm100 {width:100%;display:block; height:auto;float:none;padding:5px; overflow: hidden}
    .fieldForm100 input, .fieldForm100 select, .fieldForm100 textarea { width: 85%; }
    .fieldForm100 label { width: 15%; }
    button {width:auto;}    

    #smenu {display: none;}
    nav, .divHide {display: block}
    
    #slider {margin-top:30px}
    #slider > div > div, #slider > div {width:100%;}
    #slider > div {height: 550px}
    .section, article {min-height:550px;}
    
    nav {display: block; height:auto; margin:auto; padding:0px 10px; overflow: hidden}
    nav > a, nav > a:hover {display: inline-block; font-size: 80%; }
    .box {-moz-column-count: 2;-webkit-column-count: 2;column-count: 2;}
    
    .lsmall li {width:33%; height:250px; float:left; transition: 1s all ease;margin:0;}
    .ltiny li {width:10%; height:100px; float:left; transition: 1s all ease;margin:0;}

    .noTagShow {visibility:hidden; display:none !important}

}
@media all and (min-width: 1025px) {
    h1 {font-size: 300%}
    h2 {font-size: 150%;}
    
    .floatright {float:right; width: auto}
    .col-15, .col-25, .col-30, .col-35, .col-50, .col-65, .col-75, .col-40, .col-60, .col-100 { clear: none }

    .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-75 { float: left; width: 75%; }
    .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}

    .imgfx {background-attachment:fixed;}

    .popup {width:350px}

    input, select, textarea { width: 70%;float:left}
    label {width: 30%; float:left;}
    .fieldForm50 {width:50%; min-width: 300px; height:auto; float: left;padding:5px}
    .fieldForm100 {width:100%;display:block; height:auto;float:none;padding:5px; overflow: hidden}
    .fieldForm100 input, .fieldForm100 select, .fieldForm100 textarea { width: 85%; }
    .fieldForm100 label { width: 15%; }
    button {width:auto;}    

    #smenu {display: none;}
    nav, .divHide {display: block}

    #slider {margin-top:30px}
    #slider > div > div.spaced { margin:auto; width:1200px; float:none ; padding-top:400px;color: #fff !important;font-size:150%; font-weight:lighter}
    #slider > div {height: 800px}
    .section, article {min-height:800px;}

    nav {display: block; height:auto; margin:auto; padding:0px 10px; overflow: hidden}
    nav > a, nav > a:hover {display: inline-block; font-size: 80%}

    .lsmall li {width:25%; height:300px; float:left; transition: 1s all ease;margin:0;}
    .ltiny li {width:10%; height:100px; float:left; transition: 1s all ease;margin:0;}
    .box li {margin:15px 0; width:90%}
    .box {-moz-column-count: 3;-webkit-column-count: 3;column-count: 3;}
    
    .noTagShow {visibility:visible; display:block !important}
    .badge[data-badge]:after {font-size: 90%}
}

@media print {
    body {-webkit-print-color-adjust: exact;}
    *,
    *:before,
    *:after {
        text-shadow: none !important;
        background: transparent !important;
        -webkit-box-shadow: none !important;
                box-shadow: none !important;
    }
    body {width:100%;height:auto;}
    table, td, th {border-color:#ccc;}
    th {font-weight:bold;}
    body, tr, td, p, input, select, textarea, button, a, a:hover{color:#000 !important}
    /*h1, h2, h3, h4, p, a {color:#000 !important; font-size:100% !important; letter-spacing:0px }*/
    big {color:#000 !important; font-size:100% !important; letter-spacing:0px }
    .noShow, header, footer {visibility:hidden; display:none}
    @page {margin: 20px 20px 20px 10px;-webkit-print-color-adjust: exact;}
    .siguiente {PAGE-BREAK-AFTER: always}
}