/*
 ######   ######  ########   #######  ##       ##
##    ## ##    ## ##     ## ##     ## ##       ##
##       ##       ##     ## ##     ## ##       ##
 ######  ##       ########  ##     ## ##       ##
      ## ##       ##   ##   ##     ## ##       ##
##    ## ##    ## ##    ##  ##     ## ##       ##
 ######   ######  ##     ##  #######  ######## ########
*/
/*Scroll bar decorada*/
.myBox
{
    border: none;
    padding: 5px;
    font: 24px/36px sans-serif;
    width: 200px;
    height: 200px;
    overflow: scroll;
}
/* Scrollbar styles */
::-webkit-scrollbar
{
    width: 14px;
    height: 8px;
}
::-webkit-scrollbar-thumb
{
    background: #abbd2b;
}
::-webkit-scrollbar-thumb:hover
{
	background-color: #8c9b1e;
}
/*Animacion scroll*//*boton abajo (Scroll)*/
html
{
    scroll-behavior: smooth;
}
/*Eliminar barra de navegacion, desplazamiento o scrollbar horizontal*/
main
{
    overflow-x:hidden;
    /**/
    background: white;
    position: relative;
    z-index: 2;
    margin-bottom: 270px;
    width: 100%;
}
/*
##    ##    ###    ##     ## ########     ###    ########
###   ##   ## ##   ##     ## ##     ##   ## ##   ##     ##
####  ##  ##   ##  ##     ## ##     ##  ##   ##  ##     ##
## ## ## ##     ## ##     ## ########  ##     ## ########
##  #### #########  ##   ##  ##     ## ######### ##   ##
##   ### ##     ##   ## ##   ##     ## ##     ## ##    ##
##    ## ##     ##    ###    ########  ##     ## ##     ##
*/
.navbar
{

    background: #002B3F;
    opacity: 0.8;
}
#ten
{
    font-family: 'Poppins', sans-serif;
    color: white;
    background: none;
    margin-left: 5px;
    margin-right: 5px;
    padding: 6px;
}
#ten:hover
{
    transition-duration: 0.4s;
    background-color: #024463;
    color: #ABBD2B;
}
#buscador
{
    display: block;
    width: 230px;
    padding: 5px;
    border-radius: .25rem;
    border: 0px;
    background-color: #abbd2b;
    color: white;
    font-family: 'Poppins', sans-serif;
}
#buscador::placeholder
{
	color: white;
	text-align: center;
}
#sal
{
  position: absolute;
  background: #002b3f;
  margin-top: 18.5px;
  z-index: 100;
  display: none;
  max-height: 300px;
  overflow-y: scroll;
  border-top: #abbd2b 0.5px solid;
  border-bottom: #abbd2b 0.5px solid;
  list-style-type: none;
  padding: 0;
}
#sal::-webkit-scrollbar
{
    width: 4px;
    height: 4px;
}
.sub
{
    margin-left: 20px;
    font-size: 12px;
    color:white;
}
.sub:hover
{
    font-size: 13px;
}
#COLA
{
    flex-grow: 0;
}
.position-social
{
    flex-grow: 0;
}
@media only screen and (max-width: 810px)
{
    #ten
    {
        font-size: 13px;
    }
}
@media only screen and (max-width: 767px)
{
    .position-social
    {
      margin-top: 10px;
    }
    #buscador
    {
        width: 100%;
        margin-top: 6px;
    }
    #ten
    {
        margin-top: 1px;
        text-align: center;
    }
    div#COLA
    {
        border-top: 0.5px solid #ccc;
        border-bottom: 0.5px solid #ccc;
    }
    main
    {
        margin-bottom: 250px;
    }
}
.Awe2
{
    font-size: 24px;
    margin-right: 5px;
    color: white;
}
#a
{
  display: block;
}
#b
{
  display: none;
}
/*
 ######  ##     ## ######## ########  ########   #######
##    ## ##     ## ##       ##     ## ##     ## ##     ##
##       ##     ## ##       ##     ## ##     ## ##     ##
##       ##     ## ######   ########  ########  ##     ##
##       ##     ## ##       ##   ##   ##        ##     ##
##    ## ##     ## ##       ##    ##  ##        ##     ##
 ######   #######  ######## ##     ## ##         #######
*/
.tit1
{
    font-family: 'Raleway', sans-serif;
    color:#093044;
    font-size: calc(.7em + .8vw);
    text-align: center;
    padding: 15px;
}
#tit2
{
    text-align: left;
    font-family: 'Raleway', sans-serif;
    font-size: calc(.7em + .8vw);
    text-align: center;
}
.p1
{
    font-family: 'Poppins', sans-serif;
    text-align: justify;
    font-size: 16px;
}
.p2
{
    font-family: 'Poppins', sans-serif;
    text-align: justify;
    font-size: 18px;
}
#yugi
{
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    text-align: center;
}
.btn-def
{
    font-family: 'Poppins', sans-serif;
}
#ach
{
    text-decoration: none;
}
#sol
{
    margin-left: 6px;
    margin-right: 7px;
    width: 36px;
    padding: 2.5px;
}
.poo
{
    margin-left: 100px;
    margin-right: 100px;
}
#ifa ,.ba-slider
{
    width:100%;
    height:100%;
    box-shadow: 0 5px 11px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15) !important;
    /*Load*/
    background-color: #002B3F;
    background-image: url('../img/lod.webp');
    background-repeat: no-repeat;
    background-size: 20%;
    background-position: center;
}
.card-group, .card
{
    box-shadow: 0 5px 11px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15) !important;
}
.divIfa
{
	position: relative;
	padding-bottom: 52.2%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.divIfa iframe
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#clover
{
    position: absolute;
    width: 100%;
    height: 100%;
    margin-top: -25px;
    /*background: red;*/
    z-index: 999999;
    /*opacity: 0.2;*/
}
/*
#pel
{
    position: absolute;
    width: 100%;
    height: 58px;
    margin-top: -25px;
    background: white;
    z-index: 1;
    
}
opacity: 0.2;*/
#ark
{
    border: 0;
    height: 3px;
    background-image: linear-gradient(to right, rgba(0, 225, 255, 0), rgba(171, 189, 43, 7.75), rgba(171, 189, 43, 0));
    color: rgb(157, 177, 6);
}
#bottom
{
  color: #002B3F;
  cursor: pointer;
  font-size: 70px;
}
#bottom:hover
{
    transition: 0.5s;
    color: #abbd2b;
}
#top
{
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    font-size: 50px;
    color: #abbd2b;
    cursor: pointer;
}
#top:hover
{
    animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
    transition-duration: 0.8s;
    color: #6e791d;
}
@keyframes shake
{
    10%, 90% {
        transform: translate3d(-1px, 0, 0);
    }

    20%, 80% {
        transform: translate3d(2px, 0, 0);
    }

    30%, 50%, 70% {
        transform: translate3d(-4px, 0, 0);
    }

    40%, 60% {
        transform: translate3d(4px, 0, 0);
    }
}
#bottom
{
  color: #abbd2b;
  cursor: pointer;
  font-size: 70px;
}
#bottom:hover
{
    transition: 0.5s;
    color: #002B3F;
}
#botF
{
    background-color: #dedfdb;
    border: 1px #bdbebb solid;
    overflow: hidden;
    font-family: 'Poppins', sans-serif;
    text-align: left;
    font-size: 18px;
    width: 100%;
    margin-top: 10px;
    padding: 2px;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15) !important;
}
#botF:hover
{
  transform-style: preserve-3d;
  transform: rotateX(370deg);
  transition: 1s;
}
#FoCa
{
    font-family: 'Raleway', sans-serif;
    font-size: 22px;
}
/*
 ######      ###    ##       ######## ########  ####    ###
##    ##    ## ##   ##       ##       ##     ##  ##    ## ##
##         ##   ##  ##       ##       ##     ##  ##   ##   ##
##   #### ##     ## ##       ######   ########   ##  ##     ##
##    ##  ######### ##       ##       ##   ##    ##  #########
##    ##  ##     ## ##       ##       ##    ##   ##  ##     ##
 ######   ##     ## ######## ######## ##     ## #### ##     ##
*/
/*GALERIA*/
.dav
{
    font-family: 'Poppins', sans-serif;
    border: 1px solid #ccc;
    padding: 2px;
    margin-top: 10px;
}
.dav:hover{
    border:1px solid black;
    box-shadow: 0 5px 11px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15) !important;
}
#moc
{
    margin-left:200px;
    margin-right:200px;
}
.paf
{
    text-align: center;
    padding: 5px;
    margin: 0;
}
@media only screen and (max-width: 1200px)
{
    #moc
    {
        margin-left:150px;
        margin-right:150px;
    }
    .poo
    {
        margin-left:85px;
        margin-right:85px;
    }
}
@media only screen and (max-width: 1036px)
{
    #moc
    {
        margin-left:100px;
        margin-right:100px;
    }
    .paf
    {
        font-size: 12px;
    }
    .poo
    {
        margin-left:50px;
        margin-right:50px;
    }
    #sol
    {
        width: 32px;
    }
    #botF
    {
        font-size: 12.9px;
    }
}
@media only screen and (max-width: 1000px)
{
    #moc
    {
        margin-left:50px;
        margin-right:50px;
    }
}
@media only screen and (max-width: 323px)
{
    .paf
    {
        font-size: 8px;
        overflow: hidden;
    }
    #moc
    {
        margin-left:0px;
        margin-right:0px;
    }
}
.but
{
    margin: 5px;
    text-align: left;
}
#lis
{
    font-family: 'Raleway', sans-serif;
    text-align: justify;
    font-size: 18px;
}
/*
########  #######   #######    ######## ######## ########
##       ##     ## ##     ##      ##    ##       ##     ##
##       ##     ## ##     ##      ##    ##       ##     ##
######   ##     ## ##     ##      ##    ######   ########
##       ##     ## ##     ##      ##    ##       ##   ##
##       ##     ## ##     ##      ##    ##       ##    ##
##        #######   #######       ##    ######## ##     ##
*/
footer
{
    background: #002B3F;
    color: white;
    padding: 5px;
    /**/
    position: fixed;
    bottom: 0;
    width: 100%;
}
#pie
{
    padding: 5px;
    padding-left: 0;
    text-decoration: none;
    margin: 0;
    padding: 0;
}
footer a
{
     color: #0f1101;
}
footer a:hover
{
    transition-duration: 0.5s;
    color: #687508;
}
#fan
{
    background: #002B3F;
    color: white;
    border-top: 0.5px rgb(0, 30, 44) solid;
    font-family: 'Poppins', sans-serif;
}
#h
{
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    margin: 0; padding: 0;
}
@media only screen and (max-width: 767px)
{
    #fan
    {
        font-size: 2vw;
    }
    .poo
    {
        margin-right: 1%;
        margin-left: 1%;
    }
    .p1
    {
        font-size: calc(.8em + .5vw);
    }
    #ifa
    {
        height: 300px;
        margin-top: 30px;
    }
    #sal
    {
      margin-top: 8.5px;
      margin-left: -10px;
    }
    .secb
    {
        width: 100%;
    }
    #a
    {
      display: none;
    }
    #b
    {
      display: block;
    }
    #botF
    {
        font-size: 16px;
    }
}
.Awe
{
    font-size: 35px;
    margin-left: 20px;
    color: white;
}
.Awe:hover, .Awe2:hover, #bottom:hover
{
    animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000px;
    transition: 0.5s;
    color: #abbd2b;
}
@keyframes shake
{
    10%, 90% {
        transform: translate3d(-1px, 0, 0);
    }

    20%, 80% {
        transform: translate3d(2px, 0, 0);
    }

    30%, 50%, 70% {
        transform: translate3d(-4px, 0, 0);
    }

    40%, 60% {
        transform: translate3d(4px, 0, 0);
    }
}
@media only screen and (max-width:500px)
{
    #pie
    {
        font-size:3vw;
        text-align: left;
    }
    .Awe
    {
        margin-left: 6px;
        font-size:5.5vw;
    }
    .sub
    {
        font-size: 3vw;
    }
}
/*
 ######  ######## ########  ##     ## ####  ######  ####  #######   ######
##    ## ##       ##     ## ##     ##  ##  ##    ##  ##  ##     ## ##    ##
##       ##       ##     ## ##     ##  ##  ##        ##  ##     ## ##
 ######  ######   ########  ##     ##  ##  ##        ##  ##     ##  ######
      ## ##       ##   ##    ##   ##   ##  ##        ##  ##     ##       ##
##    ## ##       ##    ##    ## ##    ##  ##    ##  ##  ##     ## ##    ##
 ######  ######## ##     ##    ###    ####  ######  ####  #######   ######
*/
/*Servicios MEDIA*/
#TrisTE
{
    font-family: 'Raleway', sans-serif;
    color: #ABBD2B;
    text-decoration: none;
    font-size: 22px;
}
#TrisTE:hover
{
    color: #8c9b1e;
}
#SaD
{
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
}
/*
 ######   #######  ##    ## ########    ###     ######  ######## ######## ##    ##  #######   ######
##    ## ##     ## ###   ##    ##      ## ##   ##    ##    ##    ##       ###   ## ##     ## ##    ##
##       ##     ## ####  ##    ##     ##   ##  ##          ##    ##       ####  ## ##     ## ##
##       ##     ## ## ## ##    ##    ##     ## ##          ##    ######   ## ## ## ##     ##  ######
##       ##     ## ##  ####    ##    ######### ##          ##    ##       ##  #### ##     ##       ##
##    ## ##     ## ##   ###    ##    ##     ## ##    ##    ##    ##       ##   ### ##     ## ##    ##
 ######   #######  ##    ##    ##    ##     ##  ######     ##    ######## ##    ##  #######   ######
*/
textarea
{
    resize: none;
}
#cen
{
    text-align:center;
    font-family: 'Raleway', sans-serif;
}
#temp
{
    border: 0.5px solid white;
}
#dat
{
    margin-top: 10px;
}
.get
{
    color: rgb(255, 255, 255);
    background-color:#abbd2b ;
    border-color:rgb(255, 255, 255);
    font-family:'Poppins', sans-serif;
}
.get:hover
{
    transition-duration: 0.5s;
    background-color: #859220;
    color: whitesmoke;
}
.van
{
    width: 100%;
    height: 512px;
    box-shadow: 0 5px 11px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15) !important;
}
#pie
{
  color: #abbd2b;
}
#pie:hover
{
  color:  #6e791d;
}
.rec
{
    -webkit-filter: brightness(600%) contrast(45%) hue-rotate(255deg) saturate(200%);
    filter: brightness(600%) contrast(45%) hue-rotate(255deg) saturate(200%);
    -moz-filter: brightness(600%) contrast(45%) hue-rotate(255deg) saturate(200%);
}
#solSea
{
    margin-left: 15px;
    margin-right: 10px;
    width: 24px;
    padding: 2.5px;


    -webkit-filter: brightness(600%) contrast(45%) hue-rotate(255deg) saturate(200%);
    filter: brightness(600%) contrast(45%) hue-rotate(255deg) saturate(200%);
    -moz-filter: brightness(600%) contrast(45%) hue-rotate(255deg) saturate(200%);
}
/*SECCIONES DE CONTACTENOS*/
.nav-link
{
  color: #abbd2b;
}
.nav-link:hover
{
  color: #8c9b1e;
}

/*
 ######  ##       ####  ######  ########
##    ## ##        ##  ##    ## ##
##       ##        ##  ##       ##
 ######  ##        ##  ##       ######
      ## ##        ##  ##       ##
##    ## ##        ##  ##    ## ##
 ######  ######## ####  ######  ########
*/
.ba-slider
{
    width: 100%;
	position: relative;
	overflow: hidden;
}
.ba-slider img
{
	width: 100%;
	display:block;
}
.resize
{
	position: absolute;
	top:0;
	left: 0;
	height: 100%;
	width: 50%;
	overflow: hidden;
}
.handle
{
	position:absolute;
	left:50%;
	top:0;
	bottom:0;
	width:2px;
	background-color: #012b41;
	cursor: pointer;
}
.handle:after
{
	position: absolute;
	top: 50%;
	width: 48px;
	height: 48px;
	margin: -30px 0 0 -23px;
	content:'⇄';
	color: #012b41;
	font-size:22px;
	text-align:center;
	background: #ABBD2B;
	border:6px solid #012B41;
	border-radius: 50%;
	transition:all 0.3s ease;
	box-shadow:0 2px 6px rgba(0,0,0,.3),
	inset 0 2px 0 #ABBD2B,
	inset 0 60px 50px -30px #ABBD2B; /* lighten(@orange, 20%)*/
}
.draggable:after
{
	transition:all .8s ease;
	color: white;
}



#adap-img
{
    width: 100%;
}
@media only screen and (max-width: 575px)
{
    #adap-img
    {
        width: 50%;
        float: center;
    }
}