@charset "UTF-8";

/*@import url('https://fonts.gfootreoogleapis.com/css2?family=Arimo:wght@500'); */

@font-face {font-family: 'GOTHICB'; src: url('../fonts/GOTHICB.ttf')}
@font-face {font-family: 'GOTHIC'; src: url('../fonts/GOTHIC.ttf')}
@font-face {font-family: 'adelle-sans'; src: url('../fonts/adelle-sans.otf')}
@font-face {font-family: 'adelle-sans-bold'; src: url('../fonts/adelle-sans-bold.otf')}


/* Iconfont made with icomoon.com */
/*@import url(https://fonts.googleapis.com/css?family=Cabin+Sketch|Fredericka+the+Great|Roboto:400,700|Signika+Negative);*/

@font-face {font-family: 'cbp-tmicons'; src:url('../fonts/tmicons/cbp-tmicons.eot'); src:url('../fonts/tmicons/cbp-tmicons.eot?#iefix') format('embedded-opentype'), url('../fonts/tmicons/cbp-tmicons.woff') format('woff'), url('../fonts/tmicons/cbp-tmicons.ttf') format('truetype'), url('../fonts/tmicons/cbp-tmicons.svg#cbp-tmicons') format('svg')}



body {margin: 0; padding: 0}

.irfixeda, .irfixedb {position:fixed; z-index:1000; right:20px; filter: drop-shadow(2px 2px 2px black)}
.irfixeda {bottom:35px}
.irfixedb {bottom:95px}

.cbp-tm-menu, .cbp-tm-menu ul {list-style: none}/* reset  list style */

/* set menu position; change here to set to relative or float, etc. */
.cbp-tm-menu {background: white; margin: 0px auto; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center}

/* first level menu items */
.cbp-tm-menu > li {display: inline-block; position: relative; margin: 10px}

.cbp-tm-menu > li > a {display: block; color: grey; padding: 5px; font-size:1.2rem; font-family: 'GOTHIC'; text-align: left}
.cbp-tm-menu > li > a:hover {color: #966 !important}

li.cbp-tm-show > a span, li.cbp-tm-show > a:focus span  {color:black}

.activo {color:#051a21}

.mas {font-size: .9rem}

.cuerpo {margin: 50px auto; display: flex; flex-direction: column; align-items: center}
.consultin {text-align: center; font-size: 2.7rem; margin: 30px auto 40px auto}


/* sumbenu with transitions */
.cbp-tm-submenu {position: absolute; display: flex; visibility: hidden; opacity: 0; text-align: left; pointer-events: none; -webkit-transition: visibility 0s, opacity 0s; -moz-transition: visibility 0s, opacity 0s; transition: visibility 0s, opacity 0s; z-index:5000; min-width: max-content}

.cbp-tm-show .cbp-tm-submenu {display: flex; flex-direction: column; opacity: 1; visibility: visible; pointer-events: auto; -webkit-transition: visibility 0s, opacity 0.3s; -moz-transition: visibility 0s, opacity 0.3s; transition: visibility 0s, opacity 0.3s; width: auto; margin-left: -4vw; text-align: center/*font-family:'Signika Negative', Arial, Helvetica, sans-serif !important;*/; padding-top: 20px}

.cbp-tm-show-above .cbp-tm-submenu {padding-bottom: 10px}
.cbp-tm-show-below .cbp-tm-submenu {padding-top: 10px}

/* extreme cases: not enough space on the sides */
.cbp-tm-nospace-right .cbp-tm-submenu {right: 0; left: auto}
.cbp-tm-nospace-left .cbp-tm-submenu {left: 0}

/* last menu item has to fit on the screen */
.cbp-tm-menu > li:last-child .cbp-tm-submenu {right: 0}

/* arrow: depending on where the menu will be shown, we set the right position for the arrow*/
.cbp-tm-submenu:after {border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none}

.cbp-tm-show-above .cbp-tm-submenu:after {margin-top: -10px}
.cbp-tm-show-below .cbp-tm-submenu:after {bottom: 100%; margin-bottom: -10px}
.cbp-tm-submenu:after {border-color: transparent; border-width: 16px; margin-left: -15px; left: 50%; margin-top: 10px}
.cbp-tm-show-above .cbp-tm-submenu:after {border-bottom-color:white; position: absolute; top: 0px}
.cbp-tm-show-below .cbp-tm-submenu:after {border-bottom-color:white}

.cbp-tm-submenu > li {background: white; padding: 10px 5px; display: block; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; font-family: 'GOTHICB'; font-weight:100; font-size: 1.2rem; border-bottom: 1px solid black; text-align: left}
.cbp-tm-submenu > li > a:link, .cbp-tm-submenu > li > a:visited {color:black}
.cbp-tm-submenu > li > a:hover {color:#966 !important}
.cbp-tm-submenu > li:first-child {border-top-left-radius: 10px; border-top-right-radius: 10px}
.cbp-tm-submenu > li:last-child {border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; border-bottom: none}


/* the icons (main level menu icon and sublevel icons) */
.cbp-tm-submenu li a:before, .cbp-tm-menu > li > a:before {font-family: 'cbp-tmicons'; speak: none; text-transform: none; margin-right:5px; -webkit-font-smoothing: antialiased}

.cbp-tm-submenu li a:before {position: absolute; top: 50%; margin-top: -0.5em; right: 0.5em}

.cbp-tm-menu > li > a:not(:only-child):before {content: "\f0c9"; font-size: 1.5rem; margin:auto 5px auto auto; color: white}

.footer .cbp-tm-menu > li > a:not(:only-child):before {font-size: 1.2rem; color: #966 !important}

.cbp-tm-icon-archive:before {content: "\e002"}
.cbp-tm-icon-cog:before {content: "\e003"}
.cbp-tm-icon-users:before {content: "\e004"}
.cbp-tm-icon-earth:before {content: "\e005"}
.cbp-tm-icon-location:before {content: "\e006"}
.cbp-tm-icon-mobile:before {content: "\e007"}
.cbp-tm-icon-screen:before {content: "\e008"}
.cbp-tm-icon-mail:before {content: "\e009"}
.cbp-tm-icon-contract:before {content: "\e00a"}
.cbp-tm-icon-pencil:before {content: "\e00b"}
.cbp-tm-icon-article:before {content: "\e00c"}
.cbp-tm-icon-clock:before {content: "\e00d"}
.cbp-tm-icon-videos:before {content: "\e00e"}
.cbp-tm-icon-pictures:before {content: "\e00f"}
.cbp-tm-icon-link:before {content: "\e010"}
.cbp-tm-icon-refresh:before {content: "\e011"}
.cbp-tm-icon-help:before {content: "\e012"}

@media screen and (min-width: 700px) and (max-width: 1000px) {.cbp-tm-menu {justify-content: center}}

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

.cbp-tm-menu > li > a {padding: 20px; line-height: 100%}

.cbp-tm-menu {padding: 0; display: flex; flex-direction: column; align-items: center}
.cbp-tm-menu li {text-align: left}
.cbp-tm-menu > li {display: flex; border-bottom: 1px solid white; width: 100%; text-align: center; margin: auto; flex-direction: column}
.cbp-tm-menu > li:last-child {border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; border-bottom: none}

.cbp-tm-submenu {position: relative; display: none; width: 100%}
.cbp-tm-submenu > li > a:link, .cbp-tm-submenu > li > a:visited {padding-left: 10px}


.cbp-tm-submenu > li > a {padding:10px 5px}

.cbp-tm-submenu > li:first-child, .cbp-tm-submenu > li:last-child {border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px}

.cbp-tm-submenu:after {display: none}
.cbp-tm-menu .cbp-tm-show .cbp-tm-submenu {display: block; width: 100%; left: 0; margin: 0; padding: 0}
}

/* CSS Document */

*, *:before, *:after {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}

/* Mozilla based browsers */
::moz-selection {color: #F60}

/* Works in Safari */
::selection {background-color:#fff; color: #966}


.upps {margin:20px auto; padding: 10px; border-radius: 5px; max-width: 900px; vertical-align: middle; -webkit-box-shadow: -2px 2px 12px -9px rgba(0, 0, 0, 0.75); -moz-box-shadow: -2px 2px 12px -9px rgba(0, 0, 0, 0.75); box-shadow: -2px 2px 12px -9px rgba(0, 0, 0, 0.75); background-size: 101%}


.footerbot {width: 100%; max-width: 350px; overflow: hidden; margin: 10px; display: inline-block}

.footerbot p, .footerbot div, .footerbot a:link, .footerbot a:visited {font-size: .9rem; color: black; font-family: GOTHIC; margin: 15px auto; line-height: 150%}

/*.entrevista iframe {min-width: 600px; min-height: 400px}*/

.ppie {background:none !important; border:none !important; box-shadow:none; display: flex; margin: 0px auto; border-radius: 0px !important; padding-top: 20px; justify-content: space-around;}

.cbp-tm-submenu > li {width: auto}

@media screen and (max-width: 600px) {
.ppie {font-size:14px}
/*.cbp-tm-menu > li {display: inline-flex; margin: 0; border: none}
.cbp-tm-menu > li:first-child {border:none}*/
}

.footerbotexto {width: 100%; margin: 0px; padding: 0px 40px; display: inline-block; vertical-align: top; -webkit-hyphenate-character: auto; -ms-hyphens: auto; hyphens: auto; -moz-hyphens: auto; /*word-break: break-all; */ word-wrap: break-word; overflow-wrap: break-word}

.footerbotextofondogris {margin:30px auto; font-size: 18px; line-height: 120%; background: #959595; padding: 10px; border-radius: 5px}
.footerbotextofondogris p {color: white !important}

/*
@media screen and (min-width: 500px) and (max-width: 1400px) {
.footerbot {margin: 20px; width: 100%}
iframe {max-width: 800px; min-height: 400px}
}
*/


.g-recaptcha, .rc-imageselect {transform: scale(0.7); transform-origin: 0 0}

.recaptchapp {display: inline-block; padding: 10px}

.panel-wrapper {position: relative; display: flex; justify-content: space-between; flex-direction: column; width: 100%; font-family: 'GOTHICB'}
.panel-wrapper a:link, .panel-wrapper a:visited {color: #72BFC5; font-size: 1.1rem; margin: 0px auto}

.hidepp {display: none}
.showpp:target {display: none}
.showpp:target ~ .hidepp {display: block}
.showpp:target ~ .panel {max-height: 2000px}
.panel {width: 100%; max-height: 0px; overflow: hidden; transition: max-height .5s ease; margin: 5px auto}

.pperiodico p {text-align: justify}


@media screen and (max-width: 800px) {
.recaptchapp {display: block; padding: 10px; margin: 5px 0px}
#banderasgoogle {margin: 10px auto 0px auto}
}


a.gflag {vertical-align:middle; font-size:16px; padding:1px 0; background-repeat:no-repeat; background-image:url(//gtranslate.net/flags/16.png)}
a.gflag img {border:0}
a.gflag:hover {background-image:url(//gtranslate.net/flags/16a.png)}
#goog-gt-tt {display:none !important}
.goog-te-banner-frame {display:none !important}
.goog-te-menu-value:hover {text-decoration:none !important}

#goog-gt-tt {display:none !important}
.goog-te-banner-frame {display:none !important}
.goog-te-menu-value:hover {text-decoration:none !important}
#google_translate_element2, .skiptranslate {display:none!important}

.banderas img {width: 35px; padding: 0px 7px; filter: drop-shadow(0px 0px 2px black); opacity: 1; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out}
.banderas img:hover {opacity: 0.7; transform: scale(1.5); transition-property: transform, opacity}



.fade, .banderas img {opacity: 1; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out}
.fade:hover, .banderas img:hover {opacity: 0.7; transition-duration: .25s; box-sizing: border-box; transition-property: transform, opacity}

.fadep {opacity: 1; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out}
.fadep:hover {opacity: 0.7; transform: scale(1.5); transition-property: transform, opacity}


a:link {color:#3c8c93; text-decoration: none; outline:none}
a:hover {text-decoration: underline; opacity: .8}
a:active, a:focus {text-decoration: underline; color:#FF9933}
a:visited {color:#3c8c93}

ul a:link, li a:link {text-decoration: none}

#pagewrap {margin: 0 auto; width: 600px; padding-left: 150px; position: relative}


.tabla_center {font-size:16px; text-align:center; line-height:120%}

.button {color: #fff; background: #3c8c93; margin: 20px auto; padding: 10px; border: 1px solid #999; line-height:1em; text-align: center; text-decoration: none; border-radius:4px; outline:none; font-family: GOTHIC; font-size: 1rem}
.button:hover, .button:focus {background:#000; color:#ffffff}
.button:active {background:orangered; color:#fff}

.button_visitante {color: white; font-size:12px !important}

.button2 {color: #3c8c93; background: #fff; padding: 10px; border: 1px solid #999; line-height:1em; text-align: center; text-decoration: none; border-radius:4px; outline:none}

.button2:hover, .button:focus {background:#3c8c93; color: white}
.button2:active {background:#fff; color:orangered}

h1, h2, h3, h4, h5, h6 {color: #3c8c93; text-rendering: optimizeLegibility; line-height:1.2em; margin: 10px auto; font-family: 'GOTHICB'; font-weight: 100}

.cuadros {background: color(srgb 0.73 0.87 0.88 / 0.54); color: black; padding: 10% 0px; height: 500px}
.cuadros p {font-size: 1.5rem; font-family: adelle-sans; padding: 20px}

.cuadrostexto {background:color(srgb 0.13 0.29 0.31 / 0.75); font-family: adelle-sans; font-size: 3rem; margin: auto; color: white; padding: 20px; text-align: center; width: 100%; line-height: 100%; top: 30%; position: relative}
/*.cuadrospie {font-family: 'GOTHICB'; background: #badde1; font-size: 1.5rem; color: white; text-align: center; width: 100%}*/
.cuadrospie {background: #fff; font-size: 1.5rem; text-align: center; border-top: 1px solid color(srgb 0.8 0.8 0.8 / 0.47); display: flex; flex-direction: row; align-items: center; justify-content: center; padding: 10px 0px}
@media only screen and (max-width:1000px) {.cuadrospie {display: flex; flex-direction: column; align-items: center}}

p {font-family: 'GOTHIC'; font-size: 1rem; max-width: 1600px; margin: 10px auto; line-height: 130%; text-align: left; width: 90%; padding: 0px 20px}

.responsable {color:#edc583 !important; font-size:20px}

.biografia {display: flex; width: 80%; max-width: 1400px; margin: 40px auto 0px auto; flex-direction: row; align-items: center}

.error {margin-left:7px; border:0; padding:0!important; color:#966 !important; font-weight:700; font-size:16px !important; moz-user-select:moz-none; -khtml-user-select:none; -webkit-user-select:none; -ms-user-select:none; user-select:none; line-height:1em}

.alerta {margin-left:7px; border:0; padding:0!important; color:#966 !important; font-weight:700; font-size:16px !important; moz-user-select:moz-none; -khtml-user-select:none; -webkit-user-select:none; -ms-user-select:none; user-select:none; line-height:1em}


#fondo {margin: 0px auto 10px auto; text-align: center; display: flex; flex-direction: column; align-items: stretch; overflow: hidden; background:rgb(153 102 102 / 10%); width: 98%; max-width: 1900px}


.footer {background: #483131; z-index: 0; margin: auto; border-radius: 10px; -webkit-box-shadow: -2px 2px 12px -9px rgba(0, 0, 0, 0.75); -moz-box-shadow: -2px 2px 12px -9px rgba(0, 0, 0, 0.75); box-shadow: -2px 2px 12px -9px rgba(0, 0, 0, 0.75); text-align: center; padding-bottom: 20px; margin-bottom: 10px; width: 98%}

.footer p {text-decoration: none; font-size:14px; padding:0; margin:10px auto; color:white; text-align:center; border-radius:0; background: none}

.footer .cbp-tm-menu > li > a {color:white; font-size: 1.5rem}
.footer a:link {color:#966}
.footer a:hover {color:white !important}

/*.margen {margin-left:-50px; 
}

@media screen and (max-width: 450px) {
.margen {margin-left:0px}}*/

.fondotextos {color:#fff; padding:20px 50px; text-align:left; font-size:18px; background: #edc583; display:inline-block}

.pperiodico {column-gap:20px; column-rule-color:grey; column-rule-style:dashed; column-rule:thin; column-width:300px}

.pperiodico ul li {line-height: 150%}
.pperiodico ul li img {vertical-align: top; margin: 5px auto 0px auto}

.pperiodico2 {column-gap:10px; column-rule-color:grey; column-rule-style:dashed; column-rule:thin; column-width:200px}

.foodtruck p {padding:15px !important; color:white; background:#dd002b; text-align:center; margin: 0px auto 20px auto}

/*.fadeflecha {opacity: 0.7; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out}

.fadeflecha:hover {opacity: 1}*/

.boton a:link {font-size: 1em; color: #75bcbf; width:100px; background-color: #eca055; padding:5px; margin: 0px 5px !important; text-align:center; text-decoration: none}
.boton a:link {color: #75bcbf}
.boton a:hover {background:white; color: #09BDE7}
.boton a:visited {color: #75bcbf}
.boton a:active {color: #09BDE7}

hr {border:solid #000; border-width:1px 0 0; clear:both; margin:22px 0 21px; height:0}

.subheader {line-height:1.3em; color:#6f6f6f; font-weight:300; margin-bottom:17px}

em, i {font-style:italic; line-height:inherit}

strong, b {font-weight:bold !important; line-height:inherit}

small {font-size:60%; line-height:inherit}

code {font-weight:bold; background:#ff9}

ul, ol, dl {/*font-size:18px; */ -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; line-height:1.2em; margin-bottom:17px; list-style-position:outside; text-align: left}
ul li ul, ul li ol {margin-left:0px; margin-bottom:0}
ul.square, ul.circle, ul.disc {margin-left:17px}
ul.square {list-style-type:square}
ul.square li ul {list-style:inherit}
ul.circle {list-style-type:circle}
ul.circle li ul {list-style:inherit}
ul.disc {list-style-type:disc}
ul.disc li ul {list-style:inherit}
ul.no-bullet {list-style:none}
ul.large li {line-height:1.2em}
ol {margin-left:20px}
ol li ul, ol li ol {margin-left:20px; margin-bottom:0}

blockquote {margin: 0 0 17px; padding: 9px 20px 0 19px; border-left: 1px solid #966; font-style: italic}
blockquote p, blockquote p span {line-height:1.2; color:#6f6f6f; font-size:1.1rem !important; /*word-break: break-all; */ word-wrap: break-word; overflow-wrap: break-word; -webkit-hyphenate-character: auto; moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto}
blockquote cite {display:block; font-size:13px; color:#555}
blockquote cite:before {content:"\2014 \0020"}
blockquote cite a, blockquote cite a:visited {color:#555}

abbr, acronym {text-transform:uppercase; font-size:90%; color:#222; border-bottom:1px solid #ddd; cursor:help}
abbr {text-transform:none}

.print-only {display:none !important}

@media print {
* {background:transparent !important; color:#000 !important; box-shadow:none !important; text-shadow:none !important; /*filter:none !important; */-ms-filter:none !important}
a, a:visited {text-decoration:underline}
a[href]:after {content:" (" attr(href) ")"}
abbr[title]:after {content:" (" attr(title) ")"}
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {content:""}
pre, blockquote {border:1px solid #999; page-break-inside:avoid}
thead {display:table-header-group}
tr, img {page-break-inside:avoid}
img {max-width:100% !important}
/*@page {margin:0.5cm}*/
p, h2, h3 {orphans:3; widows:3}
h2, h3 {page-break-after:avoid}
.hide-on-print {display:none !important}
.print-only {display:block !important}
.hide-for-print {display:none !important}
.show-for-print {display:inherit !important}
}


input[type="text"]:focus, input[type="password"]:focus, input.button:focus, textarea:focus {box-shadow:0 0 5px 2px #966; outline:0}
input[type="text"]:required, input[type="password"]:required {border-color:#ddd !important}
input.placeholder, textarea.placeholder {color:#966 !important}


input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea {width: 100% !important}

input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea {
background: rgb(255 255 255 / 50%);  border:1px solid #ccc; border-radius:2px; box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1); display: block; font-size: 14px; padding: 5px 10px; transition:all 0.15s linear; -webkit-transition:all 0.15s linear; -moz-transition:all 0.15s linear; -o-transition:all 0.15s linear}

input[type="text"].oversize, input[type="password"].oversize, input[type="date"].oversize, input[type="datetime"].oversize, input[type="email"].oversize, input[type="number"].oversize, input[type="search"].oversize, input[type="tel"].oversize, input[type="time"].oversize, input[type="url"].oversize, textarea.oversize {font-size:17px; padding:4px 6px; background:red}

input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, textarea:focus {background:#fafafa; border-color:#b3b3b3}

input[type="text"][disabled], input[type="password"][disabled], input[type="date"][disabled], input[type="datetime"][disabled], input[type="email"][disabled], input[type="number"][disabled], input[type="search"][disabled], input[type="tel"][disabled], input[type="time"][disabled], input[type="url"][disabled], textarea[disabled] {background-color:#ddd}


textarea {height:auto}

select {width:100%; padding: 5px}

fieldset {border:solid 1px #ddd; -webkit-border-radius:3px; -moz-border-radius:3px; -ms-border-radius:3px; -o-border-radius:3px; border-radius:3px; padding:12px; margin:18px 0}

fieldset legend {font-weight:bold; background:#fff; padding:0 3px; margin:0; margin-left:-3px}

.error input, input.error, .error textarea, textarea.error, .error input:focus, input.error:focus, .error textarea:focus, textarea.error:focus {background-color:rgba(198, 15, 19, 0.1)}

.error input:focus, input.error:focus, .error textarea:focus, textarea.error:focus {outline-color:#f5797c}

.error label, label.error {color:#c60f13}

.error small, small.error {display:block; padding:6px 4px; margin-top:-13px; margin-bottom:12px; background:#c60f13; color:#fff; font-size:12px; font-weight:bold; moz-border-radius-bottomleft:2px; -webkit-border-bottom-left-radius:2px; border-bottom-left-radius:2px; moz-border-radius-bottomright:2px; -webkit-border-bottom-right-radius:2px; border-bottom-right-radius:2px}

form.custom span.custom {display:inline-block; width:16px; height:16px; position:relative; top:2px; border:solid 1px #ccc; background:#fff}
form.custom span.custom.radio {-webkit-border-radius:100px; -moz-border-radius:100px; -ms-border-radius:100px; -o-border-radius:100px; border-radius:100px}
form.custom span.custom.checkbox:before {content:""; display:block; line-height:0.8; height:14px; width:14px; text-align:center; position:absolute; top:0; left:0; font-size:14px; color:#fff}
form.custom span.custom.radio.checked:before {content:""; display:block; width:8px; height:8px; -webkit-border-radius:100px; -moz-border-radius:100px; -ms-border-radius:100px; -o-border-radius:100px; border-radius:100px; background:#222; position:relative; top:3px; left:3px}
form.custom span.custom.checkbox.checked:before {content:"\00d7"; color:#222}
form.custom div.custom.dropdown {display:block; position:relative; width:auto; height:28px; margin-bottom:9px; margin-top:2px}
form.custom div.custom.dropdown ul {overflow-y:auto; max-height:200px}
form.custom div.custom.dropdown a.current {display:block; width:auto; line-height:26px; min-height:28px; padding:0; padding-left:6px; padding-right:38px; border:solid 1px #ddd; color:#141414; background-color:#fff; white-space:nowrap}
form.custom div.custom.dropdown a.selector {position:absolute; width:27px; height:28px; display:block; right:0; top:0; border:solid 1px #ddd}
form.custom div.custom.dropdown a.selector:after {content:""; display:block; width:0; height:0; border:solid 5px; border-color:#aaa transparent transparent transparent; position:absolute; left:50%; top:50%; margin-top:-2px; margin-left:-5px}
form.custom div.custom.dropdown:hover a.selector:after, form.custom div.custom.dropdown.open a.selector:after {content:""; display:block; width:0; height:0; border:solid 5px; border-color:#222 transparent transparent transparent}
form.custom div.custom.dropdown.open ul {display:block; z-index:10}
form.custom div.custom.dropdown.small {width:134px !important}
form.custom div.custom.dropdown.medium {width:254px !important}
form.custom div.custom.dropdown.large {width:434px !important}
form.custom div.custom.dropdown.expand {width:100% !important}
form.custom div.custom.dropdown.open.small ul {width:134px !important}
form.custom div.custom.dropdown.open.medium ul {width:254px !important}
form.custom div.custom.dropdown.open.large ul {width:434px !important}
form.custom div.custom.dropdown.open.expand ul {width:100% !important}
form.custom div.custom.dropdown ul {position:absolute; width:auto; display:none; margin:0; left:0; top:27px; padding:0; background:#fff; border:solid 1px #ccc}
form.custom div.custom.dropdown ul li {color:#555; font-size:13px; cursor:pointer; padding:3px; padding-left:6px; padding-right:38px; min-height:18px; line-height:18px; margin:0; white-space:nowrap; list-style:none}
form.custom div.custom.dropdown ul li.selected {background:#cdebf5; color:red}
form.custom div.custom.dropdown ul li.selected:after {content:"\2013"; position:absolute; right:10px}
form.custom div.custom.dropdown ul li:hover {background-color:#cdebf5; color:#000}
form.custom div.custom.dropdown ul li:hover:after {content:"\2013"; position:absolute; right:10px; color:#a3dbec}
form.custom div.custom.dropdown ul li.selected:hover {background:#cdebf5; cursor:default; color:#000}
form.custom div.custom.dropdown ul li.selected:hover:after {color:#000}
form.custom div.custom.dropdown ul.show {display:block}
form.custom .custom.disabled {background-color:#ddd}
.lt-ie9 form.custom div.custom.dropdown a.selector {height: 28px}

.row {background:#eeeeeed6; margin: auto; border-radius: 10px; -webkit-box-shadow: -2px 2px 12px -9px rgba(0, 0, 0, 0.75); -moz-box-shadow: -2px 2px 12px -9px rgba(0, 0, 0, 0.75); box-shadow: -2px 2px 12px -9px rgba(0, 0, 0, 0.75); text-align: center; width:100%; max-width: 1700px}

.ppflex {display: flex !important; flex-direction: row !important; margin: auto; justify-content: center; flex-wrap: wrap; padding: 10px 20px !important; align-items: flex-start}

.medioflex {display: flex; align-items: center}


/*.ppflex p {text-align: justify}*/

@media only screen and (max-width: 1200px) {
.panel {flex-direction: column; align-items: center}
.ppflex {width: 95%; flex-direction: column !important; align-items: center; padding: 10px !important}
.ppflex p {width: 100%}
}

.row.collapse .column, .row.collapse .columns {padding: 0}
.row .row.collapse {margin: 0}

.rotulos {background-color:#1e4649; padding:20px; color:white; font-size:1.5rem; text-rendering: optimizeLegibility; line-height: 1.2em; margin: 20px; font-family: 'GOTHICB'; font-weight: 100}
.equipo {color:#3c8c93; text-align:center !important; font-size: 1.7rem}

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

.biografia {display: flex; flex-direction: column; width: 85%;}

}

/*@media only screen and (min-width: 800px) and (max-width: 1000px) {
#cuadrobusqueda, .cuadrobusqueda {padding:0px}
.busqueda {width:320px; padding:10px 20px}
.busquedapasado {width:150px; padding:0px}
.busqueda:hover, .busquedapasado:hover {transform: translateY(-10%) scale(1.3); ms-transform: translateY(-10%) scale(1.3)}
}*/

@media only screen and (min-width: 1000px) and (max-width: 1200px) {
#cuadrobusqueda, .cuadrobusqueda {padding:5px}
.busqueda, .busquedapasado {width:275px; margin: 5px}
.busquedapeque {width:140px; margin:5px}
.row {padding-top: 10px}}


@media only screen and (max-width:500px) {
.biografia p { width: 100%; padding: 0px}
.medioflex {display: flex; flex-direction: column}
.contenido {width: 90%; margin: 30px auto; overflow: hidden}
.cuadros {height: auto}
.cuadros p {padding: 30px}
.cuadrostexto {font-size: 2.5rem}
}
	
/*one.com*/
#mm, .mm, .mobile-show {display: none; visibility: hidden !important}

/*.extra {margin: 0px !important}
.self {padding: 10px 50px}*/

@media only screen and (max-width: 900px) {.self {padding: 0px}}
.self mobile-leaf contactFormContainer { width: 100% !important}



/*one.com*/

.column, .columns {float: left; min-height: 1px; padding:10px}

.column.centered, .columns.centered {float:none; margin:0 auto}

[class*="column"]+[class*="column"]:last-child {float:right}

[class*="column"]+[class*="column"].end {float:right; clear:both}

.one, .row .one {width:8.33333%}
.two, .row .two {width:16.66667%}
.three, .row .three {width:25%}
.four, .row .four {width:33.33333%}
.five, .row .five {width:41.66667%}
.six, .row .six {width:50%}
.seven, .row .seven {width:58.33333%}
.eight, .row .eight {width:66.66667%}
.nine, .row .nine {width:75%}
.ten, .row .ten {width:83.33333%}
.eleven, .row .eleven {width:91.66667%}
.twelve, .row .twelve {width:100%}
.row .offset-by-one {margin-left:8.33333%}
.row .offset-by-two {margin-left:16.66667%}
.row .offset-by-three {margin-left:25%}
.row .offset-by-four {margin-left:33.33333%}
.row .offset-by-five {margin-left:41.66667%}
.row .offset-by-six {margin-left:50%}
.row .offset-by-seven {margin-left:58.33333%}
.row .offset-by-eight {margin-left:66.66667%}
.row .offset-by-nine {margin-left:75%}
.row .offset-by-ten {margin-left:83.33333%}

.push-two {left:16.66667%}
.pull-two {right:16.66667%}
.push-three {left:25%}
.pull-three {right:25%}
.push-four {left:33.33333%}
.pull-four {right:33.33333%}
.push-five {left:41.66667%}
.pull-five {right:41.66667%}
.push-six {left:50%}
.pull-six {right:50%}
.push-seven {left:58.33333%}
.pull-seven {right:58.33333%}
.push-eight {left:66.66667%}
.pull-eight {right:66.66667%}
.push-nine {left:75%}
.pull-nine {right:75%}
.push-ten {left:83.33333%}
.pull-ten {right:83.33333%}

img {height:auto}

/*img, object, embed {max-width:100%}*/

img {-ms-interpolation-mode:bicubic}

#map_canvas img, .map_canvas img {max-width:none!important}

/*.row {*zoom:1}
*/
.rowpeque {font-size: 100%; margin:5px}
.row:before, .row:after {content:" "; display:table}
.row:after {clear:both}


.lt-ie9 .timer {display:none !important}
.lt-ie9 .orbit-caption {background:#000; /*filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000); zoom:1*/}
@media only screen and (max-width: 767px) {
.orbit.orbit-stack-on-small img.fluid-placeholder {visibility:visible}
.orbit.orbit-stack-on-small .orbit-slide {position:static; margin-bottom:10px}
}
.reveal-modal-bg {position:fixed; height:100%; width:100%; background:#fff; background:rgba(0, 0, 0, 0.45); z-index:40; display:none; top:0; left:0}
.reveal-modal {background:#fff; visibility:hidden; display:none; top:100px; left:50%; margin-left:-260px; width:520px; position:absolute; z-index:41; padding:30px; -webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.4); -moz-box-shadow:0 0 10px rgba(0, 0, 0, 0.4); box-shadow:0 0 10px rgba(0, 0, 0, 0.4)}
.reveal-modal .close-reveal-modal:not(.button) {font-size:22px; font-size:2.2rem; line-height:.5; position:absolute; top:8px; right:11px; color:#aaa; text-shadow:0 -1px 1px rgba(0, 0, 0, 0.6); font-weight:bold; cursor:pointer}
.reveal-modal.small {width:30%; margin-left:-15%}
.reveal-modal.medium {width:40%; margin-left:-20%}
.reveal-modal.large {width:60%; margin-left:-30%}
.reveal-modal.xlarge {width:70%; margin-left:-35%}
.reveal-modal.expand {width:90%; margin-left:-45%}
.reveal-modal .row {min-width:0; margin-bottom:10px}
.reveal-modal>:first-child {margin-top:0}
.reveal-modal>:last-child {margin-bottom:0}
@media print {
.reveal-modal {border:solid 1px #000; background:#fff}
}

.show-for-small, .show-for-medium, .show-for-medium-down, .hide-for-large, .hide-for-large-up, .show-for-xlarge, .show-for-print {display:none !important}
.hide-for-small, .hide-for-medium, .hide-for-medium-down, .show-for-large, .show-for-large-up, .hide-for-xlarge, .hide-for-print {display:inherit !important}

@media only screen and (min-width: 1441px) {
.hide-for-small, .hide-for-medium, .hide-for-medium-down, .hide-for-large, .show-for-large-up, .show-for-xlarge {display:inherit !important}
/*.show-for-small, .show-for-medium, .show-for-medium-down, .show-for-large, .hide-for-large-up, .hide-for-xlarge {display:none !important}*/
}

@media only screen and (max-width: 1279px) and (min-width: 768px) {
.logocomunicart {margin: 5px 0px; max-width:70%; float: left}
.top-bar ul > li a:not(.button) {margin-left: 0px}
.hide-for-small, .show-for-medium, .show-for-medium-down, .hide-for-large, .hide-for-large-up, .hide-for-xlarge {display:inherit !important}
.show-for-small, .hide-for-medium, .hide-for-medium-down, .show-for-large, .show-for-large-up, .show-for-xlarge {display:none !important}
}

@media only screen and (max-width: 767px) {
.show-for-small, .hide-for-medium, .show-for-medium-down, .hide-for-large, .hide-for-large-up, .hide-for-xlarge {display:inherit !important}
.hide-for-small, .show-for-medium, .hide-for-medium-down, .show-for-large, .show-for-large-up, .show-for-xlarge {display:none !important}
}

.show-for-landscape, .hide-for-portrait {display:inherit !important}
.hide-for-landscape, .show-for-portrait {display:none !important}

@media screen and (orientation: landscape) {
.show-for-landscape, .hide-for-portrait {display:inherit !important}
.hide-for-landscape, .show-for-portrait {display:none !important}
}

@media screen and (orientation: portrait) {
.show-for-portrait, .hide-for-landscape {display:inherit !important}
.hide-for-portrait, .show-for-landscape {display:none !important}
}

.show-for-touch {display:none !important}
.hide-for-touch {display:inherit !important}
.touch .show-for-touch {display:inherit !important}
.touch .hide-for-touch {display:none !important}
table.show-for-xlarge, table.show-for-large, table.hide-for-small, table.hide-for-medium {display:table !important}

 
/*
==============================================
CSS3 ANIMATION CHEAT SHEET
==============================================

Made by Justin Aguilar

www.justinaguilar.com/animations/

Questions, comments, concerns, love letters:
justin@justinaguilar.com
==============================================
*/

.hatchpp {
opacity: 1; 
transition: opacity .25s ease-in-out; 
moz-transition: opacity .25s ease-in-out; 
-webkit-transition: opacity .25s ease-in-out; 

visibility: visible !important; 	
}

.hatchpp:hover {
opacity: 0.7; 
animation-name: hatch; 
-webkit-animation-name: hatch; 

animation-duration: 2s; 
-webkit-animation-duration: 2s; 

animation-timing-function: ease-in-out; 
-webkit-animation-timing-function: ease-in-out; 

transform-origin: 50% 100%; 

visibility: visible !important; 	
}

@keyframes hatchpp {
0% {transform: rotate(0deg) scaleY(0.6)}
20% {transform: rotate(-2deg) scaleY(1.05)}
35% {transform: rotate(2deg) scaleY(1)}
50% {transform: rotate(-2deg)}	
65% {transform: rotate(1deg)}	
80% {transform: rotate(-1deg)}		
100% {transform: rotate(0deg)}									
}

/*
==============================================
slideDown
==============================================
*/
/*#object {background-color: #fe5652; 

visibility: hidden; 
}*/

.slideDown {
animation-name: slideDown; 
-webkit-animation-name: slideDown; 

animation-duration: 1s; 
-webkit-animation-duration: 1s; 

animation-timing-function: ease; 
-webkit-animation-timing-function: ease; 

visibility: visible !important; 					
}

@keyframes slideDown {
0% {transform: translateY(-100%)}
50% {transform: translateY(8%)}
65% {transform: translateY(-4%)}
80% {transform: translateY(4%)}
95% {transform: translateY(-2%)}			
100% {transform: translateY(0%)}		
}


/*
==============================================
slideUp
==============================================
*/


.slideUp {
animation-name: slideUp; 
-webkit-animation-name: slideUp; 

animation-duration: 1s; 
-webkit-animation-duration: 1s; 

animation-timing-function: ease; 
-webkit-animation-timing-function: ease; 

visibility: visible !important; 		
}

@keyframes slideUp {
0% {transform: translateY(100%)}
50% {transform: translateY(-8%)}
65% {transform: translateY(4%)}
80% {transform: translateY(-4%)}
95% {transform: translateY(2%)}			
100% {transform: translateY(0%)}	
}


/*
==============================================
slideLeft
==============================================
*/


.slideLeft {
animation-name: slideLeft; 
-webkit-animation-name: slideLeft; 

animation-duration: 1s; 
-webkit-animation-duration: 1s; 

animation-timing-function: ease-in-out; 
-webkit-animation-timing-function: ease-in-out; 	

visibility: visible !important; 
}


@keyframes slideLeft {
0% {transform: translateX(150%)}
50% {transform: translateX(-8%)}
65% {transform: translateX(4%)}
80% {transform: translateX(-4%)}
95% {transform: translateX(2%)}			
100% {transform: translateX(0%)}
}

/*
==============================================
slideRight
==============================================
*/

.slideRight {
animation-name: slideRight; 
-webkit-animation-name: slideRight; 
animation-duration: 4s; 
-webkit-animation-duration: 4s; 
animation-iteration-count: infinite; 
-webkit-animation-iteration-count: infinite; 

animation-timing-function: ease-in-out; 
-webkit-animation-timing-function: ease-in-out; 
}

@keyframes slideRight {
0% {transform: translateX(-200%)}
25% {transform: translateX(370%) rotate(10deg)}
50% {transform: translateX(350%) rotate(-10deg)}
75% {transform: translateX(370%) rotate(20deg)}
100% {transform: translateX(700%)}
}

@-webkit-keyframes slideRight {
0% {transform: translateX(-200%)}
25% {transform: translateX(370%) rotate(10deg)}
50% {transform: translateX(350%) rotate(-10deg)}
75% {transform: translateX(370%) rotate(20deg)}
100% {transform: translateX(700%)}
}


/*@media screen and (max-width: 500px) {.slideRight {animation-iteration-count: 1; -webkit-animation-iteration-count: 1}}*/

/*
==============================================
slideExpandUp
==============================================
*/


.slideExpandUp {	
animation-name: slideExpandUp; 
-webkit-animation-name: slideExpandUp; 

animation-duration: 1.6s; 
-webkit-animation-duration: 1.6s; 

animation-timing-function: ease-out; 
-webkit-animation-timing-function: ease -out; 

visibility: visible !important; 
}

@keyframes slideExpandUp {
0% {transform: translateY(100%) scaleX(0.9)}
30% {transform: translateY(-8%) scaleX(0.9)}	
40% {transform: translateY(2%) scaleX(0.9)}
50% {transform: translateY(0%) scaleX(1.1)}
60% {transform: translateY(0%) scaleX(0.9)}
70% {transform: translateY(0%) scaleX(1.05)}			
80% {transform: translateY(0%) scaleX(0.95)}
90% {transform: translateY(0%) scaleX(1.02)}	
100% {transform: translateY(0%) scaleX(1)}
}

/*
==============================================
expandUp
==============================================
*/


.expandUp {
animation-name: expandUp; 
-webkit-animation-name: expandUp; 

animation-duration: 0.7s; 
-webkit-animation-duration: 0.7s; 

animation-timing-function: ease; 
-webkit-animation-timing-function: ease; 	

visibility: visible !important; 
}

@keyframes expandUp {
0% {transform: translateY(100%) scale(0.6) scaleY(0.5)}
60% {transform: translateY(-7%) scaleY(1.12)}
75% {transform: translateY(3%)}	
100% {transform: translateY(0%) scale(1) scaleY(1)}	
}

/*
==============================================
fadeIn
==============================================
*/

/*.fadeInBlinkapp {color:#966; font-size:14px; line-height:100%; text-transform: uppercase}

.fadeIn, .fadeInBlinkapp {
animation-name: fadeIn; 
-webkit-animation-name: fadeIn;

animation-duration: 1.5s; 
-webkit-animation-duration: 1.5s; 

animation-timing-function: ease-in-out; 
-webkit-animation-timing-function: ease-in-out; 	

visibility: visible !important; 
}

.fadeInBlinkapp {animation-iteration-count: infinite; 
-webkit-animation-iteration-count: infinite; 

animation-duration: 3s; 
-webkit-animation-duration: 3s; 
}

@keyframes fadeIn {
0% {transform: scale(0); opacity: 0.0}
60% {transform: scale(1.1)}
80% {transform: scale(0.9); opacity: 1}	
100% {transform: scale(1); opacity: 1}		
}*/

/*
==============================================
expandOpen
==============================================
*/


.expandOpen {
animation-name: expandOpen; 
-webkit-animation-name: expandOpen; 

animation-duration: 1.2s; 
-webkit-animation-duration: 1.2s; 

animation-timing-function: ease-out; 
-webkit-animation-timing-function: ease-out; 

visibility: visible !important; 
}

@keyframes expandOpen {
0% {transform: scale(1.8)}
50% {transform: scale(0.95)}	
80% {transform: scale(1.05)}
90% {transform: scale(0.98)}	
100% {transform: scale(1)}			
}

/*
==============================================
bigEntrance
==============================================
*/


.bigEntrance {
animation-name: bigEntrance; 
-webkit-animation-name: bigEntrance; 

animation-duration: 1.6s; 
-webkit-animation-duration: 1.6s; 

animation-timing-function: ease-out; 
-webkit-animation-timing-function: ease-out; 

visibility: visible !important; 		
}

@keyframes bigEntrance {
0% {transform: scale(0.3) rotate(6deg) translateX(-30%) translateY(30%); opacity: 0.2}
30% {transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%); opacity: 1}
45% {transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%); opacity: 1}
60% {transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%); opacity: 1}	
75% {transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%); opacity: 1}
90% {transform: scale(1.01) rotate(0deg) translateX(0%) translateY(0%); opacity: 1}	
100% {transform: scale(1) rotate(0deg) translateX(0%) translateY(0%); opacity: 1}		
}

/*
==============================================
hatch
==============================================
*/

.hatch {
animation-name: hatch; 

-webkit-animation-name: hatch; 

animation-duration: 2s; 
-webkit-animation-duration: 2s; 

animation-timing-function: ease-in-out; 
-webkit-animation-timing-function: ease-in-out; 

transform-origin: 50% 100%; 

visibility: visible !important; 	
}

@keyframes hatch {
0% {transform: rotate(0deg) scaleY(0.6)}
20% {transform: rotate(-2deg) scaleY(1.05)}
35% {transform: rotate(2deg) scaleY(1)}
50% {transform: rotate(-2deg)}	
65% {transform: rotate(1deg)}	
80% {transform: rotate(-1deg)}		
100% {transform: rotate(0deg)}									
}


/*
==============================================
bounce (bote fuerte)
==============================================
*/


.bounce {
animation-name: bounce; 
-webkit-animation-name: bounce; 

animation-duration: 1.6s; 
-webkit-animation-duration: 1.6s; 

animation-timing-function: ease; 
-webkit-animation-timing-function: ease; 

transform-origin: 50% 100%; 
}

@-webkit-keyframes bounce {
0% {transform: translateY(0%) scaleY(0.6)}
60% {transform: translateY(-100%) scaleY(1.1)}
70% {transform: translateY(0%) scaleY(0.95) scaleX(1.05)}
80% {transform: translateY(0%) scaleY(1.05) scaleX(1)}	
90% {transform: translateY(0%) scaleY(0.95) scaleX(1)}			
100% {transform: translateY(0%) scaleY(1) scaleX(1)}		
}


/*
==============================================
pulse
==============================================
*/

.pulse {
animation-name: pulse; 
-webkit-animation-name: pulse; 

animation-duration: 5s; 
-webkit-animation-duration: 5s; 

animation-iteration-count: infinite; 
-webkit-animation-iteration-count: infinite; 
}

@keyframes pulse {
0% {transform: scale(0.9); opacity: 0.5}
50% {transform: scale(1.5); opacity: 0.8}	
100% {transform: scale(0.9); opacity: 0.5}			
}

/*
==============================================
floating
==============================================
*/

.floating {

visibility: visible !important; 
}
.floating:hover {
animation-name: floating; 
-webkit-animation-name: floating; 

animation-duration: 1.5s; 
-webkit-animation-duration: 1.5s; 

animation-iteration-count: 4; 
-webkit-animation-iteration-count: 4; 
}

@keyframes floating {
0% {transform: translateY(0%)}
50% {transform: translateY(8%)}	
100% {transform: translateY(0%)}			
}


/*
==============================================
tossing
==============================================
*/

.fade .tossing {text-align: center}

.tossing {
animation-name: tossing; 
-webkit-animation-name: tossing; 

animation-duration: 2.5s; 
-webkit-animation-duration: 2.5s; 

animation-iteration-count: 3; 
-webkit-animation-iteration-count: 3; 
}


.tossing:hover, tossing:active, tossing:focus {
animation-name: tossing; 
-webkit-animation-name: tossing; 

animation-duration: 2.5s; 
-webkit-animation-duration: 2.5s; 

animation-iteration-count: infinite; 
-webkit-animation-iteration-count: infinite; 
}

@keyframes tossing {
0% {transform: rotate(-4deg)}
50% {transform: rotate(4deg)}
100% {transform: rotate(-4deg)}						
}

/*
==============================================
tossingpp
==============================================
*/

.tossingpp {
animation-name: tossingpp; 
-webkit-animation-name: tossingpp; 

animation-duration: 20s; 
-webkit-animation-duration: 20s; 

animation-iteration-count: infinite; 
-webkit-animation-iteration-count: infinite; 
}

@keyframes tossingpp {
0% {transform: rotate(-360deg)}
100% {transform: rotate(360deg)}						
}

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

.tossingpp2 {
border-radius:200px; 
width:200px; 
margin:auto; 


-webkit-transition: width 10s, height 10s; 
transition: width 10s, height 10s, transform 10s; 

animation-name: tossingpp2; 
-webkit-animation-name: tossingpp2; 

animation-duration: 100s; 
-webkit-animation-duration: 100s; 

animation-iteration-count: 3; 
-webkit-animation-iteration-count: 3; 
}



.tossingpp2:hover {
animation-name: tossingpp2; 
-webkit-animation-name: tossingpp2; 

animation-duration: 100s; 
-webkit-animation-duration: 100s; 

animation-iteration-count: infinite; 
-webkit-animation-iteration-count: infinite; 

width:400px; 

}

@keyframes tossingpp2 {
0% {transform: rotate(-360deg)}
100% {transform: rotate(360deg)}						
}

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

/*
==============================================
pullUp
==============================================
*/

.pullUp {
animation-name: pullUp; 
-webkit-animation-name: pullUp; 

animation-duration: 1.1s; 
-webkit-animation-duration: 1.1s; 

animation-timing-function: ease-out; 
-webkit-animation-timing-function: ease-out; 

transform-origin: 50% 100%; 	
}

@keyframes pullUp {
0% {transform: scaleY(0.1)}
40% {transform: scaleY(1.02)}
60% {transform: scaleY(0.98)}
80% {transform: scaleY(1.01)}
100% {transform: scaleY(0.98)}				
80% {transform: scaleY(1.01)}
100% {transform: scaleY(1)}							
}

/*
==============================================
pullDown
==============================================
*/

.pullDown {
animation-name: pullDown; 
-webkit-animation-name: pullDown; 

animation-duration: 1.1s; 
-webkit-animation-duration: 1.1s; 

animation-timing-function: ease-out; 
-webkit-animation-timing-function: ease-out; 

transform-origin: 50% 0%; 
}

@keyframes pullDown {
0% {transform: scaleY(0.1)}
40% {transform: scaleY(1.02)}
60% {transform: scaleY(0.98)}
80% {transform: scaleY(1.01)}
100% {transform: scaleY(0.98)}				
80% {transform: scaleY(1.01)}
100% {transform: scaleY(1)}							
}


/*
==============================================
stretchLeft
==============================================
*/

.stretchLeft {
animation-name: stretchLeft; 
-webkit-animation-name: stretchLeft; 

animation-duration: 1.5s; 
-webkit-animation-duration: 1.5s; 

animation-timing-function: ease-out; 
-webkit-animation-timing-function: ease-out; 

transform-origin: 100% 0%; 
}

@keyframes stretchLeft {
0% {transform: scaleX(0.3)}
40% {transform: scaleX(1.02)}
60% {transform: scaleX(0.98)}
80% {transform: scaleX(1.01)}
100% {transform: scaleX(0.98)}				
80% {transform: scaleX(1.01)}
100% {transform: scaleX(1)}							
}


.moverLeft {
animation-iteration-count: infinite; 
-webkit-animation-iteration-count: infinite; 

animation-name: moverLeft; 
-webkit-animation-name: moverLeft; 

animation-duration: 3s; 
-webkit-animation-duration: 3s; 

transform-origin: 100% 0%; 
}

@keyframes moverLeft {
0% {transform: scaleX(0.3)}
40% {transform: scaleX(1.02)}
60% {transform: scaleX(0.98)}
80% {transform: scaleX(1.01)}
100% {transform: scaleX(0.98)}				
80% {transform: scaleX(1.01)}
100% {transform: scaleX(1)}								
}

/*
==============================================
stretchRight
==============================================
*/

.stretchRight {
animation-name: stretchRight; 
-webkit-animation-name: stretchRight; 

animation-duration: 1.5s; 
-webkit-animation-duration: 1.5s; 

animation-timing-function: ease-out; 
-webkit-animation-timing-function: ease-out; 

transform-origin: 0% 0%; 	
}

@keyframes stretchRight {
0% {transform: scaleX(0.3)}
40% {transform: scaleX(1.02)}
60% {transform: scaleX(0.98)}
80% {transform: scaleX(1.01)}
100% {transform: scaleX(0.98)}				
80% {transform: scaleX(1.01)}
100% {transform: scaleX(1)}							
}


ul.topnav {list-style-type: none; margin: 0; padding: 0; overflow: hidden; border-radius:10px; text-align:center}
ul.topnav li { display: inline-block}
ul.topnav li a {display: inline-block; padding: 5px; text-decoration: none; transition: 0s; font-size:25px}
ul.topnav li a:hover {color: red}
ul.topnav li.icon {display: none}


.ulmenu1 {text-align: center; padding:10px; margin: auto; width:100%; font-size:18px; background: black; clear:both}

.ulmenu1 li {padding:10px 5px; display: inline-table}
.ulmenu1 a {padding:4px; color:#fff; text-decoration:none}
.ulmenu1 a:hover {color: red; background: #fff}
.ulmenu1 a:focus {color: #fff; background: #000}
/*.ulmenu1 a:active {color: #fff; background: #7cb800}*/

.menu1active {background: red}

.video {width:100%; height:370px; border: none; margin: 20px auto}

.instagram {width:100%; height:44vh; border:none; overflow: hidden; margin: 30px auto}

@media screen and (max-width: 500px) {
.instagram {height:54vh}
}

@media screen and (min-width: 700px) and (max-width: 1400px) {
.instagram {height:45vh}
}


.videoinstagram {background: white none repeat scroll 0% 0%; max-width: 500px; width: calc(100% - 2px); border-radius: 3px; border: 1px solid rgb(219, 219, 219); box-shadow: none; display: block; margin: 0px 0px 12px; min-width: 230px; padding: 0px; max-height:730px}

.videoinstagramH400 {background: white none repeat scroll 0% 0%; max-width: 500px; width: calc(100% - 2px); border-radius: 3px; border: 1px solid rgb(219, 219, 219); box-shadow: none; display: block; margin: 0px 0px 12px; min-width: 230px; padding: 0px; max-height:380px}

.videoturistica {width:70% !important; height:300px; text-align:center; margin:auto; display:block; padding:20px}

.videofacebookv {width:80% !important; height:900px; margin:10px auto; display:inline-block; overflow:hidden; border:none}

.columnafacebookright {padding:0px 20px}

.videofacebook {width:100%; height:380px; margin: 20px auto !important; display:inline-block; overflow:hidden; border:none; scroll-behavior: smooth}

video.labnol, img.labnol {max-width:100%; width: 100% !important; height: auto !important}

.videncuesta {width:100%; height:170px; text-align:center; margin:0px auto 20px auto; display:inline-block}

/*Ordered list */
.ordered-list, .ordered-list-mod-1 {counter-reset: li}

.counter {font-size: 22px}

.ordered-list > li, .ordered-list-mod-1 > li {padding-top: 5px; padding-bottom: 5px}

.ordered-list > li:before, .ordered-list-mod-1 > li:before {content: counter(li, decimal) "."; counter-increment: li; margin-right: 15px}

.astronauta {position: absolute; top:10%; z-index: 5; -webkit-filter: drop-shadow(0px 0px 3px white); filter: drop-shadow(0px 0px 3px white)}
.astronauta img {width: 17vw; max-width: 300px}


@media only screen and (min-width: 700px) {
.cabecero_redes {width: 100%; z-index: 5; overflow: hidden; display: flex; justify-content: space-around; align-items: center; margin: 1px auto -1px auto; padding: 5px 10px; background: rgba(128, 125, 125, 0.65)}
}

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


#fondo {width: 95%}
.cabecero_redes {display: flex; flex-direction: column; align-items: center; width: 95%; margin: 0px auto; padding: 10px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px}

ul.topnav li:not(:first-child) {display: none; clear:both}
ul.topnav li.icon {display: inline-block}
ul.topnav.responsive {position: relative}
ul.topnav.responsive li.icon {position:relative; display:block; margin-bottom:5px !important}
ul.topnav.responsive li {display: inline-block}
ul.topnav.responsive li a {display: inline-block}
.menu {visibility:hidden}

.categoriastitulo {width:auto}
.upps {background-size:auto}
.footer {width: 95%; margin: 0px auto 30px auto}
.footerbot, .footerbot iframe {margin: 0px 0px 30px 0px; width:100%; /*; max-width:320px !important; overflow: hidden !important*/ padding: 0px !important}
.footerbotexto {padding: 0px 10px}
.footerbot p {padding: 0px 10px}
.informacionclave, .informacionclave2 {width:100% !important; margin: 30px auto}
iframe {width: 100%; min-height: 100px; /*max-height: 200px; */}
.videofacebook iframe {max-height: 250px}
.videofacebook {height:200px !important}
.videofacebookv {width:100% !important; height:400px !important; display:block}
.videoinstagramH400 {max-height:240px}
.videoinstagram {max-height:420px}
.videoturistica {width:100% !important; display:table; padding:10px 0px}
.video {max-height: 200px; overflow: hidden; padding: 0px 10px}
.column, .columns {/*float: left; */ min-height: 1px; padding:5px}
.columnafacebookright {width:100% !important; padding:0 !important; margin:0 auto !important}
.publicidad {margin:20px auto}

.left, .right {float:none}

.column, .columns {width:auto !important; float:none}
.column:last-child, .columns:last-child {float:none}
[class*="column"]+[class*="column"]:last-child {float:none}
.column:before, .columns:before, .column:after, .columns:after {content:""; display:table}
.column:after, .columns:after {clear:both}
.offset-by-one, .offset-by-two, .offset-by-three, .offset-by-four, .offset-by-five, .offset-by-six, .offset-by-seven, .offset-by-eight, .offset-by-nine, .offset-by-ten {margin-left:0 !important}
.push-two, .push-three, .push-four, .push-five, .push-six, .push-seven, .push-eight, .push-nine, .push-ten {left:auto}
.pull-two, .pull-three, .pull-four, .pull-five, .pull-six, .pull-seven, .pull-eight, .pull-nine, .pull-ten {right:auto}
.row .mobile-one {width:25% !important; float:left; padding:0 15px}
.row .mobile-one:last-child {float:right}
.row .mobile-one.end {float:left}
.row.collapse .mobile-one {padding:0}
.row .mobile-two {width:50% !important; float:left; padding:0 15px}
.row .mobile-two:last-child {float:right}
.row .mobile-two.end {float:left}
.row.collapse .mobile-two {padding:0}
.row .mobile-three {width:75% !important; float:left; padding:0 15px}
.row .mobile-three:last-child {float:right}
.row .mobile-three.end {float:left}
.row.collapse .mobile-three {padding:0}
.row .mobile-four {width:100% !important; float:left; padding:0 15px}
.row .mobile-four:last-child {float:right}
.row .mobile-four.end {float:left}
.row.collapse .mobile-four {padding:0}
.push-one-mobile {left:25%}
.pull-one-mobile {right:25%}
.push-two-mobile {left:50%}
.pull-two-mobile {right:50%}
.push-three-mobile {left:75%}
.pull-three-mobile {right:75%}

}

.between {display: flex; align-items: center; justify-content: space-around; border-bottom: 1px solid color(srgb 0.8 0.8 0.8 / 0.47)}
@media only screen and (max-width: 1000px) {
.between {display: block}

}

@media only screen and (min-width: 600px) and (max-width: 1000px) {
.videofacebook {height:400px !important}
.columnafacebookright {width:auto !important}
}

/* animation menu hamburger */
.menuppbtn {position: relative; display: none; justify-content: center; align-items: center; width: 2.5rem; height: 1.5rem; cursor: pointer; z-index: 2}

.cojonuda {background: #9d815f; padding: 20px; margin-top: 0px; position: sticky; display: table; width: 100%}
@media (max-width: 1023px) {
.menuppbtn {display: flex; margin: 0px auto 30px auto}
.cojonuda {margin:50px auto 20px auto; background: none}
}
.menuppbtn .menuppbtn__lines, .menuppbtn .menuppbtn__lines::before, .menuppbtn .menuppbtn__lines::after {width: 2.5rem; height: 0.2rem; background: #72BFC5; transition: all 0.4s ease-in-out; display: flex; text-shadow: 2px 2px 2px black !important; z-index: 9999999}
.menuppbtn .menuppbtn__lines::before, .menuppbtn .menuppbtn__lines::after {content: ""; position: absolute}
.menuppbtn .menuppbtn__lines::before {transform: translateY(-0.5rem)}
.menuppbtn .menuppbtn__lines::after {transform: translateY(0.5rem)}
.menuppbtn.open .menuppbtn__lines {transform: translateX(1rem); background: transparent}
.menuppbtn.open .menuppbtn__lines::before {transform: rotate(45deg) translate(-0.5rem, 0.5rem); background: #ffffff}
.menuppbtn.open .menuppbtn__lines::after {transform: rotate(-45deg) translate(-0.5rem, -0.5rem); background: #ffffff}

.expand-btn:after {content: "?"; opacity: 0.75; font-size: 2rem}
.expand-btn.open {color: #ff5722; background: white !important}
.expand-btn.open:after {transform: rotate(180deg)}

/* navppbar */
/*.navppbar {box-shadow: 0 20px 50px 0 rgba(255, 255, 255, 0.05); display: flex; align-items: center; justify-content: center; }*/
/*@media (max-width: 1023px) {
.navppbar {padding: 10px 20px; margin: auto; display: flex; align-items: center; flex-direction: column}
}*/
@media (max-width: 600px) {
.navppbar {border-bottom:  transparent !important}
}

/*.navppbar.ppsticky {position: relative; z-index: 9999; top: 0}*/
.navppbar .logo {color: #ffffff; font-size: 3rem; font-weight: 700; text-decoration: none; margin:auto}
.navppbar .menu-items {display: flex; align-items: center; justify-content: space-evenly}
.navppbar .menu-items::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5); box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5); border-radius: 10px; background-color: #222}
.navppbar .menu-items::-webkit-scrollbar {width: 6px; background-color: #222}
.navppbar .menu-items::-webkit-scrollbar-thumb {border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5); box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5); background-color: #fff}
@media (max-width: 1023px) {
.navppbar .menu-items {scrollbar-gutter: stable; position: fixed; top: 125px; left: 10%; display: flex; flex-direction: column; width:70%; padding: 30px; background: white; z-index: 9999999999; overflow-y: auto; transform: translateX(-100vh); transition: 0.3s ease-out; align-items: flex-start}
.navppbar .menu-items.open {transform: translateY(0)}
}
.navppbar .menu-items > li > .menu-item {display: flex; align-items: center; padding-left: 10px; margin-top: 10px}
/*@media (max-width: 1023px) {.navppbar .menu-items > li > .menu-item {padding: 1rem 1rem}
}*/
.navppbar .menu-items li:hover .mega-menu {opacity: 1; visibility: visible}
/*@media (max-width: 1023px) {
.navppbar .menu-items li a, .navppbar .content .col p {font-size:2rem}
}*/
.navppbar .droppdown {position: relative}
@media (min-width: 1024px) {
.navppbar .droppdown:hover > .droppdown-menu {opacity: 1; visibility: visible; color: white !important}
.navppbar .droppdown:hover > .expand-btn:after {transform: rotate(180deg)}
}
@media (min-width: 1024px) {
.navppbar .droppdown .droppdown-right .expand-btn:after, .navppbar .droppdown .droppdown-left .expand-btn:after {right: 0.625rem}
}
@media (min-width: 1024px) {
.navppbar .droppdown-menu {position: absolute; top: 45px; left: -5%; padding: 5px 0; background: red; color: white !important; border-radius: 0 0 5px 5px; opacity: 0; box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.05); visibility: hidden;
transition: all 0.4s ease; margin: auto; z-index: 99; min-width: 200px; display: table; text-align: left}
}
@media (max-width: 1023px) {
.navppbar .droppdown-menu {display: none; position: relative; top: 0; width: 100%; overflow: hidden}
}
.navppbar .menu-right {top: 0; left: 100%}
@media (max-width: 1023px) {
.navppbar .menu-right {top: 0; left: 0; right: auto; width: 100%; padding-left: 1.5rem}
.navppbar .menu-right:before {content: ""; position: absolute; z-index: 1; top: 50%; left: 20px; width: 1px; height: calc(100% - 25px); background-color: rgba(255, 255, 255, 0.25); transform: translateY(-50%)}
}
.navppbar .menu-left {top: 0; left: -100%}

@media (max-width: 1023px) {
.navppbar .menu-left {top: 0; left: 0; width: 100%; padding-left: 1.5rem}
.navppbar .menu-left:before {content: ""; position: absolute; z-index: 1; top: 50%; left: 20px; width: 1px; height: calc(100% - 25px); background-color: rgba(255, 255, 255, 0.25); transform: translateY(-50%)}
}
.navppbar .menu-item {display: flex; justify-content: space-between; width: 100%; font-size: 1rem; transition: 0.25s}
.navppbar .menu-item:hover {color: red}
.navppbar ul li {list-style: none; transition: 0.3s ease; margin: 10px; text-align: left; font-family: GOTHIC; width: max-content}
.navppbar ul li .arrow {transition: all 0.3s ease-out}
.navppbar ul li a {position: relative; text-decoration: none; color: grey; font-size: 1.1rem}
.navppbar ul li ul li a:hover {color: red}

@media (min-width: 1024px) {
.navppbar .droppdownMega {position: inherit !important}
.navppbar ul li ul li a:hover {color: black !important}
}
@media (min-width: 1024px) {
.navppbar .mega-menu {position: absolute; top: 65px; left: 0; width: 100vw; opacity: 0; visibility: hidden; transition: all 0.4s ease-out 0s, visibility 0.1s linear 0s}
}
@media (max-width: 1023px) {
.navppbar ul li {list-style: none; transition: 0.3s ease; margin: 15px 10px; text-align: left}
.navppbar .mega-menu {position: relative; display: none; padding-left: 0}
}
.navppbar .mega-menu .contentpp {display: grid; /*grid-template-columns: repeat(4, 1fr);*/ gap: 1rem; width: 100%; padding: 1rem; background: #171b27; box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.05)}
@media (max-width: 1023px) {
.navppbar .mega-menu .contentpp {grid-template-columns: auto}
}
@media (min-width: 1024px) {
.navppbar .mega-menu .contentpp {padding: 1.5rem 1rem}
}
@media (max-width: 1023px) {
.navppbar .mega-menu .contentpp .col {padding: 0; width: 100%}
}
.navppbar .category .contentpp .col .img-wrapper {margin: 1rem 0}
/*.navppbar .blog .contentpp {grid-template-columns: repeat(1, 1fr)}*/
@media (min-width: 1024px) {
/*.navppbar .blog .contentpp {grid-template-columns: repeat(4, 1fr)}*/
}
.navppbar .blog .contentpp .col .img-wrapper {margin-bottom: 1rem}
.navppbar .blog .contentpp .col .menu-title {font-weight: normal}
.navppbar .blog .contentpp .col .menu-title a {transition: 0.25s}
.navppbar .blog .contentpp .col .menu-title a:hover {color: #ff5722}
.navppbar .contentpp .col {display: flex; flex-direction: column}
.navppbar .contentpp .col .img-wrapper {display: block; position: relative; width: 100%; height: 20vw; overflow: hidden}
.navppbar .contentpp .col .img-wrapper:hover img {transform: scale(1.1)}
.navppbar .contentpp .col .img {position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; border-radius: 5px; overflow: hidden}
.navppbar .contentpp .col img {width: 100%; max-width: 100%; transition: transform 0.3s ease-in-out}
.navppbar .contentpp .col .menu-title {color: #fff; font-size: 1.125rem; line-height: 1.125rem; border-left: 2px solid #ff5722; padding-left: 0.625rem}
@media (max-width: 1023px) {
.navppbar .contentpp .col .menu-title {font-size: 0.875rem}
}
.navppbar .contentpp .col p {margin-top: 0.625rem; color: #ffffff}
.navppbar .contentpp .col .mega-links {padding-left: 1rem; border-left: 1px solid #3c3c3c}
@media (max-width: 1023px) {
.navppbar .contentpp .col .mega-links {border-left: 0; padding-left: 0}
.navppbar .contentpp .col .mega-links li {margin: 0}
.navppbar .contentpp .col .mega-links li a {padding: 0 0.5rem}
}
.navppbar .contentpp .col .mega-links li {margin: 1rem 0}
.navppbar .contentpp .col .mega-links li a {padding: 0}

@media (max-width: 1023px) {
.overflow {overflow: hidden}
}

@media (max-width: 1023px) {
.overpplay {position: fixed; z-index: 500; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, 0.2); opacity: 0; visibility: hidden; transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out}
.overpplay.overpplay--active {opacity: 1; visibility: visible}
.navppbar .logo {font-size: 4rem; margin: 20px}

}

/* containner */
.containner {margin: 200px auto auto; padding: 0 30px; max-width: 1200px; text-align: center}
.containner h1 {font-weight: 700; color: #ffffff; text-transform: uppercase}
.containner ul {list-style: none}
.containner ul li {text-align: center; padding: 0.625rem 0; color: #fff}



.header__nav-item li {list-style:none; margin: 0px 10px}


.banderas {height:20px; width:20px; margin: 0px 5px; vertical-align: middle}


.formulario {width: 95%; max-width: 1200px; display: table; margin: 20px auto 0px auto; text-align: center}
.textoformulario {color: #000 !important; font-size: 14px; font-weight: bold; text-align:center; padding:5px; margin:30px auto 0px auto; clear: both !important}

.services {margin: 50px auto; max-width:1900px; text-align:center; display: inline-flex; flex-wrap: wrap; justify-content: center}
.flippbox {background-color: transparent; width: 100%; max-width: 400px; min-width: 300px; height: 200px; /*border: 1px solid #f1f1f1;*/ perspective: 1000px}
.flippboxppinner {position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.8s; transform-style: preserve-3d}
.flippbox:hover .flippboxppinner {transform: rotateY(180deg)}
.flippboxdelante, .flippboxdetras {position: absolute; width: 100%; height: 100%; -webkit-backface-visibility: hidden; backface-visibility: hidden}
.flippboxdelante h2 {color: #1e4649}
.flippboxdetras {background-color: #1e4649; transform: rotateY(180deg); display: flex; align-items: center}
.flippboxdetras h2 {color: white; font-size: 1.2rem; padding: 20px 40px; line-height: 130% !important; text-align: left}

.flecha {border: solid black; border-width: 0 3px 3px 0; display: inline-block; padding: 3px}
.dcha {transform: rotate(-45deg); webkit-transform: rotate(-45deg)}
.izda {transform: rotate(135deg); webkit-transform: rotate(135deg)}
.arriba {transform: rotate(-135deg); webkit-transform: rotate(-135deg)}
.bajo {transform: rotate(45deg); webkit-transform: rotate(45deg)}