@charset "utf-8";
body{
     background-color: #fff;
    color: #333;
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    Font-size: 20px;
    font-style: normal; 
}
body.modal-open {overflow: visible !important;}
html{height:100vh;scroll-behavior: smooth; } 
 
header{} 
main{}
footer{}
img{width: 100%;}
strong{font-weight: bolder !important;}

a{text-decoration:none;cursor:pointer;}
a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:active {text-decoration:none;}
a:hover {text-decoration:none;}

#ui-datepicker-div{max-width: 300px!important}

h1,h2,h3,h4,h5,h6{font-weight: normal !important;}
ul {list-style: none;}
.view,html{height:100vh}

.cursor{cursor: pointer;}

.sticky-top{
	position: sticky !important;
	position: -webkit-sticky;
	position: -moz-sticky;
	position: -ms-sticky;
	position: -o-sticky;
}
/* ESTILOS BOOTSTRAP */
figure{
    margin:0px !important;
}
/*gestion contenido*/

.fancybox-slide--iframe .fancybox-content {
    width  : 90%;
    height : 90%;
    max-width  : 1200px;
    max-height : 900px;
    margin: 0;
}

.link,.photo,.map,.more,.visite:hover{
	opacity: 1;
	background-repeat: no-repeat;
    background-position: center center;
	background-size: 50px auto;
}
.link:hover {background-image: url(../iconos/link.png);}
.photo:hover {background-image: url(../iconos/photo.png);}
.map:hover{background-image: url("../iconos/map.png");}
.more:hover{background-image: url("../iconos/plus.png");}
.visite:hover{background-image: url("../iconos/360.png");}
.corner{width: 70px;height: 70px;}
.square{width: 50px !important;height: 50px !important;}

/*TEXTE */
.display-7{
    font-size:2rem ;
}
.display-8{
    font-size:1.5rem ;
}
.small-1{font-size: 12px !important}
.small-2{font-size: 10px !important}
.overline{text-decoration: overline}
.text_special1{font-family: "Roboto Light";}
.text_special2{font-family: "BalooChettan2 Regular";}
.text_special3{}
.text_shadow1{text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.74);}
.text-shadow2{}
.titre {
    background-color: #222;
    color: #fff;
    padding: 3px;
    text-align: center;
    width:auto;
    height:auto;
}
/*FIN TEXTE */

/* COULEURS */
/* COULEURS */
:root {
	--color-1: #494949;
	--color-2: #FFFFFF;
	--color-3: #944489;
	--color-4: #fc0255;
	--color-5: #177483;
	--color-6: #0089bf;
	--color-7: #518a70;
	--color-8: #999999;
	--color-9: rgba(0, 0, 0, 0.60);
	--color-10: rgba(255, 255, 255, 0.60);
}

.f1{background-color: var(--color-1) !important}
.f2{background-color: var(--color-2) !important}
.f3{background-color: var(--color-3) !important}
.f4{background-color: var(--color-4) !important}
.f5{background-color: var(--color-5) !important}
.f6{background-color: var(--color-6) !important}
.f7{background-color: var(--color-7) !important}
.f8{background-color: var(--color-8) !important}
.f9{background-color:var(--color-9) !important}
.f10{background-color: var(--color-10) !important}
.f11{background-color: hsl(308deg 37% 42% / 16%);}
.f12{background-color: hsl(187deg 80% 32% / 15%);;}
.f13{background-color: hsla(0,0%,0%,0.45);}
.f14{}

.c1{color: var(--color-1) !important}
.c2{color: var(--color-2) !important}
.c3{color: var(--color-3) !important}
.c4{color: var(--color-4) !important}
.c5{color: var(--color-5) !important}
.c6{color: var(--color-6) !important}
.c7{color: var(--color-7) !important}
.c8{color: var(--color-8) !important}
.c9{color: var(--color-9) !important}
.c10{color: var(--color-10) !important}
.hc1:hover{color: var(--color-1) !important}
.hc2:hover{color: var(--color-2) !important}
.hc3:hover{color: var(--color-3) !important}
.hc4:hover{color: var(--color-4) !important}
.hc5:hover{color: var(--color-5) !important}
.hc6:hover{color: var(--color-6) !important}
.hc7:hover{color: var(--color-7) !important}
.hc8:hover{color: var(--color-8) !important}
.hc9:hover{color: var(--color-9) !important}
.hc10:hover{color: var(--color-10) !important}
/* FIN COULEURS */

/* BOTONES */
.border-dark{color: var(--color-1) !important;border-color: var(--color-1) !important}
.btn-dark{background-color: var(--color-1) !important;border-color:var(--color-1) !important;}
.btn-dark:hover{background-color: var(--color-2) !important;color:var(--color-1) !important;border-color:var(--color-1) !important;}
.btn-dark:hover > i{color:var(--color-1) !important;}
.btn-outline-dark{color: var(--color-1) !important;border-color: var(--color-1) !important}
.btn-outline-dark:focus{color: var(--color-1) !important;border-color: var(--color-1) !important;background-color:transparent !important;}
.btn-outline-dark:hover, .btn-outline-dark:active{color: var(--color-2) !important;border-color: var(--color-1) !important}
.btn-outline-dark:not(:disabled):not(.disabled).active, .btn-outline-dark:not(:disabled):not(.disabled):active, .show>.btn-outline-dark.dropdown-toggle {border-color: var(--color-1) !important}
.border-dark{border-color:var(--color-1) !important}

.border-light{color: var(--color-2) !important;border-color: var(--color-2) !important}
.btn-light{background-color: var(--color-2) !important;border-color:var(--color-2) !important;}
.btn-light:hover{background-color: var(--color-1) !important;color:var(--color-2) !important;border-color:var(--color-2) !important;}
.btn-light:hover > i{color:var(--color-2) !important;}
.btn-outline-light{color: var(--color-2) !important;border-color: var(--color-2) !important}
.btn-outline-light:focus{color: var(--color-2) !important;border-color: var(--color-2) !important;background-color:transparent !important;}
.btn-outline-light:hover, .btn-outline-light:active{color: var(--color-1) !important;border-color: var(--color-2) !important}
.btn-outline-light:not(:disabled):not(.disabled).active, .btn-outline-light:not(:disabled):not(.disabled):active, .show>.btn-outline-light.dropdown-toggle {border-color: var(--color-2) !important}
.border-light{border-color:var(--color-2) !important}

.border-danger{color: var(--color-4) !important;border-color: var(--color-4) !important}
.btn-danger{background-color: var(--color-4) !important;border-color:var(--color-4) !important;}
.btn-danger:hover{background-color: var(--color-2) !important;color:var(--color-4) !important;border-color:var(--color-4) !important;}
.btn-danger:hover > i{color:var(--color-4) !important;}
.btn-outline-danger{color: var(--color-4) !important;border-color: var(--color-4) !important}
.btn-outline-danger:focus{color: var(--color-4) !important;border-color: var(--color-4) !important;background-color:transparent !important;}
.btn-outline-danger:hover, .btn-outline-danger:active{color: var(--color-2) !important;border-color: var(--color-4) !important}
.btn-outline-danger:not(:disabled):not(.disabled).active, .btn-outline-danger:not(:disabled):not(.disabled):active, .show>.btn-outline-danger.dropdown-toggle {border-color: var(--color-4) !important}
.border-danger{border-color:var(--color-4) !important}

.border-warning{color: var(--color-3) !important;border-color: var(--color-3) !important}
.btn-warning{background-color: var(--color-3) !important;border-color:var(--color-3) !important;color: var(--color-2) !important}
.btn-warning:hover{background-color: var(--color-2) !important;color:var(--color-3) !important;border-color:var(--color-3) !important;}
.btn-warning:hover > i{color:var(--color-3) !important;}
.btn-outline-warning{color: var(--color-3) !important;border-color: var(--color-3) !important}
.btn-outline-warning:focus{color: var(--color-3) !important;border-color: var(--color-3) !important;background-color:transparent !important;}
.btn-outline-warning:hover, .btn-outline-warning:active{color: var(--color-2) !important;border-color: var(--color-3) !important}
.btn-outline-warning:not(:disabled):not(.disabled).active, .btn-outline-warning:not(:disabled):not(.disabled):active, .show>.btn-outline-warning.dropdown-toggle {border-color: var(--color-3) !important}
.border-warning{border-color:var(--color-3) !important}

.border-success{color: var(--color-7) !important;border-color: var(--color-7) !important}
.btn-success{background-color: var(--color-7) !important;border-color:var(--color-7) !important;}
.btn-success:hover{background-color: var(--color-2) !important;color:var(--color-7) !important;border-color:var(--color-7) !important;}
.btn-success:hover > i{color:var(--color-7) !important;}
.btn-outline-success{color: var(--color-7) !important;border-color: var(--color-7) !important}
.btn-outline-success:focus{color: var(--color-7) !important;border-color: var(--color-7) !important;background-color:transparent !important;}
.btn-outline-success:hover, .btn-outline-success:active{color: var(--color-2) !important;border-color: var(--color-7) !important}
.btn-outline-success:not(:disabled):not(.disabled).active, .btn-outline-success:not(:disabled):not(.disabled):active, .show>.btn-outline-success.dropdown-toggle {border-color: var(--color-7) !important}
.border-success{border-color:var(--color-7) !important}

.border-primary{color: var(--color-6) !important;border-color: var(--color-6) !important}
.btn-primary{background-color: var(--color-6) !important;border-color:var(--color-6) !important;}
.btn-primary:hover{background-color: var(--color-2) !important;color:var(--color-6) !important;border-color:var(--color-6) !important;}
.btn-primary:hover > i{color:var(--color-6) !important;}
.btn-outline-primary{color: var(--color-6) !important;border-color: var(--color-6) !important}
.btn-outline-primary:focus{color: var(--color-6) !important;border-color: var(--color-6) !important;background-color:transparent !important;}
.btn-outline-primary:hover, .btn-outline-primary:active{color: var(--color-2) !important;border-color: var(--color-6) !important}
.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show>.btn-outline-primary.dropdown-toggle {border-color: var(--color-6) !important}
.border-primary{border-color:var(--color-6) !important}

.border-info{color: var(--color-5) !important;border-color: var(--color-5) !important}
.btn-info{background-color: var(--color-5) !important;border-color:var(--color-5) !important;color: var(--color-2) !important;}
.btn-info:hover{background-color: var(--color-2) !important;color:var(--color-5) !important;border-color:var(--color-5) !important;}
.btn-info:hover > i{color:var(--color-5) !important;}
.btn-outline-info{color: var(--color-5) !important;border-color: var(--color-5) !important}
.btn-outline-info:focus{color: var(--color-5) !important;border-color: var(--color-5) !important;background-color:transparent !important;}
.btn-outline-info:hover, .btn-outline-info:active{color: var(--color-2) !important;border-color: var(--color-5) !important}
.btn-outline-info:not(:disabled):not(.disabled).active, .btn-outline-info:not(:disabled):not(.disabled):active, .show>.btn-outline-info.dropdown-toggle {border-color: var(--color-5) !important}
.border-info{border-color:var(--color-5) !important}

.border-secondary{color: var(--color-10) !important;border-color: var(--color-10) !important}
.btn-secondary{background-color: var(--color-10) !important;border-color:var(--color-10) !important;}
.btn-secondary:hover{background-color: var(--color-2) !important;color:var(--color-10) !important;border-color:var(--color-10) !important;}
.btn-secondary:hover > i{color:var(--color-10) !important;}
.btn-outline-secondary{color: var(--color-10) !important;border-color: var(--color-10) !important}
.btn-outline-secondary:focus{color: var(--color-10) !important;border-color: var(--color-10) !important;background-color:transparent !important;}
.btn-outline-secondary:hover, .btn-outline-secondary:active{color: var(--color-2) !important;border-color: var(--color-10) !important}
.btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, .show>.btn-outline-secondary.dropdown-toggle {border-color: var(--color-10) !important}
.border-secondary{border-color:var(--color-10) !important}


.tsunami {
    background-size: 201% auto;
    background-position: 100% 0%;
    transition: background-position 0.5s;
}
.tsunamiDark {
    background-image: linear-gradient(90deg, var(--color-1) 0%, var(--color-1) 50%, transparent 50%, transparent 100%);
}
.tsunamiLight {
    background-image: linear-gradient(90deg, var(--color-2) 0%, var(--color-2) 50%, transparent 50%, transparent 100%);
}
.tsunamiWarning {
    background-image: linear-gradient(90deg, var(--color-3) 0%, var(--color-3) 50%, transparent 50%, transparent 100%);
}
.tsunamiDanger {
    background-image: linear-gradient(90deg, var(--color-4) 0%, var(--color-4) 50%, transparent 50%, transparent 100%);
}
.tsunamiInfo {
    background-image: linear-gradient(90deg, var(--color-5) 0%, var(--color-5) 50%, transparent 50%, transparent 100%);
}
.tsunamiPrimary {
    background-image: linear-gradient(90deg, var(--color-6) 0%, var(--color-6) 50%, transparent 50%, transparent 100%);
}
.tsunamiSuccess {
    background-image: linear-gradient(90deg, var(--color-7) 0%, var(--color-7) 50%, transparent 50%, transparent 100%);
}
.tsunamiSecondary {
    background-image: linear-gradient(90deg, var(--color-8) 0%, var(--color-8) 50%, transparent 50%, transparent 100%);
}
.tsunamiShadowDark {
    background-image: linear-gradient(90deg, var(--color-9) 0%, var(--color-9) 50%, transparent 50%, transparent 100%);
}
.tsunamiShadowLight {
    background-image: linear-gradient(90deg, var(--color-10) 0%, var(--color-10) 50%, transparent 50%, transparent 100%);
}

.tsunami:hover{
    background-position: 0 0;
    color:var(--color-2) !important;
    transition: background-position 0.5s,color 0.3s linear 0.2s, background-color 0s linear 0.5s;
 
}
.tsunami:hover >i, .tsunami:hover >span, .tsunami:hover >span > i, .tsunami:hover >p    {
    color:var(--color-2) !important;
  transition:color 0.3s linear 0.2s;
}
.tsunamiShadowLight:hover >i, .tsunamiShadowLight:hover >span, .tsunamiShadowLight:hover >span > i, .tsunamiShadowLight:hover > p   {
    color:var(--color-1) !important;
  transition:color 0.3s linear 0.2s;
}
.tsunamiLight:hover >i, .tsunamiLight:hover >span, .tsunamiStsunamiLighthadowLight:hover >span > i, .tsunamiStsunamiLighthadowLight:hover > p {
    color:var(--color-1) !important;
  transition:color 0.3s linear 0.2s;
}

.hoverDark:hover{
    color:var(--color-1) !important;
 
}
.hoverLight:hover{
    color:var(--color-2) !important;
 
}
.hoverWarning:hover{
    color:var(--color-3) !important;
 
}
.hoverDanger:hover{
    color:var(--color-4) !important;
 
}
.hoverInfo:hover{
    color:var(--color-5) !important;
 
}
.hoverPrimary:hover{
    color:var(--color-6) !important;
 
}
.hoverSuccess:hover{
  
   
}
.hoverSecondary:hover{
    color:var(--color-8) !important;
 
}

.btn-cool:hover > i {color:rgb(255, 255, 255) !important; transition:0.75s;}

.btn-cool > span {
    overflow:hidden;
    opacity:0;
    font-size:0;
    transition:0.5s;
    
}
.btn-cool:hover > span {
    opacity:1 !important;
    font-size:16px;
    padding-left:5px;
    transition:0.5s !important;
}
.btn-cool-light:hover > i {color:#444 !important; transition:0.75s;}

.btn-cool-light > span {
    overflow:hidden;
    opacity:0;
    font-size:0;
    transition:0.5s;
    
}
.btn-cool-light:hover > span {
    opacity:1 !important;
    font-size:15px;
    padding-left:5px;
    transition:0.5s !important;
}


.btn-arrow-2 > om-icon-right-2  {
    position: absolute;
    left: 10px;
    bottom: -20px;
    padding: 0px;
    width: 30px;
    transition:0.5s;
} 
.btn-arrow-2 > om-icon-right-2 > svg  {
    border-radius: 50%;
    background-color: white;
} 
.btn-arrow-2:hover > om-icon-right-2 {
    left: calc(100% - 45px); 
    background-color:unset !important;
    transition:0.5s;
} 
.btn-arrow-2:hover:after {
    content: '';
    width: 100%;
    position: absolute;
    height: calc(100% + 22px);
    background-color: transparent;
    top: 0;
    left: 0;
}
.w-23-px {width:23px;}
 
/* FIN BOTONES */

/* BACKGROUND IMAGES */
.bck-img1{
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: center center;
}
.bck-img2{
    background-repeat: no-repeat;
    background-size: auto ;
    -webkit-background-size: auto ;
    -moz-background-size: auto ;
    -o-background-size: auto ;
    background-position: center top;
}
.bck-img3{}
.bck-img4{}
.anime-img {
    -webkit-transform: scale(1.25);
    -moz-transform: scale(1.25);
    -ms-transform: scale(1.25);
    transform: scale(1.25);
    z-index: 2;
    position: static;
    -webkit-animation: mymove 8s 1;
    animation: mymove 8s 1;
}

.bck_hover:hover{background-color: #4c4c4c;}
/* FIN - BACKGROUND IMAGES */

.z1{z-index:1;}
.z2{z-index:2;}
.z3{z-index:3;}
.z4{z-index:4;}
.z5{z-index:5;}
.z6{z-index:6;}
.z7{z-index:7;}
.z8{z-index:8;}
.z9{z-index:9;}
.z10{z-index:10;}

.container{}

.vertical-align-middle{
    vertical-align: middle;
}

.top{top: 0px}
.bottom{bottom: 0px}
.left{left:0px;}
.right{right:0px;}

.mt-n1{margin-top: -.25rem}
.mt-n2{margin-top: -.50rem}
.mt-n3{margin-top: 1rem}
.mt-n4{margin-top: -2rem}
.mt-n5{margin-top: -3rem}

.mr-n1{margin-right: -.25rem}
.mr-n2{margin-right: -.50rem}
.mr-n3{margin-right: 1rem}
.mr-n4{margin-right: -2rem}
.mr-n5{margin-right: -3rem}

.mb-n1{margin-right: -.25rem}
.mb-n2{margin-right: -.50rem}
.mb-n3{margin-right: 1rem}
.mb-n4{margin-right: -2rem}
.mb-n5{margin-right: -3rem}

.ml-n1{margin-right: -.25rem}
.ml-n2{margin-right: -.50rem}
.ml-n3{margin-right: 1rem}
.ml-n4{margin-right: -2rem}
.ml-n5{margin-right: -3rem}

.w-90{width:90% !important;}
.w-80{width:80% !important;}
.w-70{width:70% !important;}
.w-60{width:60% !important;}
.w-50{width:50% !important;}
.w-40{width:40% !important;}
.w-30{width:30% !important;}
.w-20{width:20% !important;}
.w-15{width:15% !important;}
.w-10{width:10% !important;}

.h-1{height: 75vh}
.h-2{height:300px;}
.h-3{}
.h-4{}
.h-100vh{height:100vh;}
.min-height1{min-height:350px;}
.min-height2{min-height:400px !important;}
.min-height3{min-height:450px !important;}
.min-height4{}
.min-heightSlide{min-height:70vh !important;}
.min-heightSlide2{min-height:85vh !important;}
.min-heightGalerie2{min-height:200px !important;}
.min-heightMh{min-height:350px !important;}
.max-height1{}
.max-height2{}
.max-height3{}
.max-height4{}
.w-1{}
.w-2{}
.w-3{}
.w-4{}
.min-width1{}
.min-width2{}
.min-width3{}
.min-width4{}
.max-width1{max-width: 70px!important;}
.max-width2{max-width: 50px!important;}
.max-width3{max-width: 200px!important;}
.max-width4{}

.order-1{order: 1!important;}
.order-2{order: 2!important;}
.order-3{order: 3!important;}
.order-4{order: 4!important;}
.order-5{order: 5!important;}
.order-6{order: 6!important;}
.order-7{order: 7!important;}
.order-8{order: 8!important;}
.order-9{order: 9!important;}
.order-10{order: 10!important;}
.order-11{order: 11!important;}
.order-12{order: 12!important;}
.order-13{order: 13!important;}
.order-14{order: 14!important;}
.order-15{order: 15!important;}
.order-16{order: 16!important;}
.order-last{order: 17!important;}

.container{max-width: 1600px !important;}
.partenaires{}
.partenaires img{height: 80px !important; width:auto !important; margin:10px;}

.anchorContainer {
    position: relative;
}
.anchorContainer > div {
    position:absolute;
    top: -100px;
}

/* ICONOS */

/* FIN - ICONOS */

.offcanvas-end{
    width:100% !important;
}
.iconoesructura1 {
    position: absolute;
    top: -25px;
    left: 0px;
    height: 80px;
    width: auto;
    padding: 20px;
    padding-left: 0px;
}
.estructura-11 {
    padding-top: 200px;
    padding-bottom: 20px;
}

.estructura-11>div {
    background-color: white;
}

.separacion-2-bis { min-height:350px;position:relative;} 
.separation-2-bis-img { min-height:350px;width:100%;} 
.separation-2-bis-text { padding-top: 30px;padding-bottom: 20px;position:relative;width:100%;position:relative;} 

/* MENU */

   
   .bloquearScroll {
      overflow-y: hidden !important;
  }
  
  header {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 50px;
  }
.logoResabooking{
   height: auto;
   width:160px;
   position:fixed;
   top:0;
   left: calc(50% - 80px) !important;
   transition:0.5s;
}

     /* burger */
  .burger-container {
      background-color: #2c2c2c;
      width: 100%;
      height: 50px;
      
  }
  
  .burger {
      position: relative;
      width: 70px;
      height: 50px;
      cursor: pointer;
  }
  
  .burgerBar1 {
      position: absolute;
      top: 10px;
      left: 15px;
      background: rgb(4,4,4);
      background: linear-gradient(83deg, rgba(4, 4, 4, 0.552) 6%, rgba(4,4,4,1) 29%, rgba(4,4,4,1) 100%);
      width: 50px;
      height: 5px;
      transition:0.75s;
  }
  
  .burgerBar2 {
      position: absolute;
      top: 22px;
      left: 15px;
      background: rgb(4,4,4);
      background: linear-gradient(90deg, rgba(4,4,4,1) 0%, rgba(4, 4, 4, 0.315) 74%, rgba(4,4,4,1) 85%);
      width: 50px;
      height: 5px;
      transition:0.50s;
  }
  
  .burgerBar3 {
      position: absolute;
      top: 35px;
      left: 15px;
      background: rgb(4,4,4);
      background: linear-gradient(90deg, rgba(4,4,4,1) 0%, rgba(4,4,4,1) 29%, rgba(4, 4, 4, 0.25) 97%);
      width: 50px;
      height: 5px;
      transition:0.25s;
  }
  .burgerOn>.burgerBar1{
      transform: rotate(-40deg);
      top: 22px;
      transition: 0.75s;
   }
   .burgerOn>.burgerBar2{
      transform: rotate(40deg);
      transition:0.5s;
   }
   .burgerOn>.burgerBar3{
      width:0px;
      transition:0.25s;
   }
 /*   .burgerText{
      display: flex;
      position: absolute;
      right: 10px;
      font-size: 26px;
      height: 50px;
      align-items: center;
      
   } */
 
  /*  menu */
  
  #menu-container {
      background-color: white ;
      width: 0vw;
      height: calc(100vh - 50px) !important;
      transition: 0.5s;
  }
  
  .menuContainerOn {
      width: 100vw !important;
    /*   height: calc(100vh - 50px) !important; */
      overflow-y: auto;
      transition: width 1s ease;
  }
 
   .menuContainerOn::-webkit-scrollbar {
      -webkit-appearance: none;
  }
  
  .menu {
   
      margin: 0 !important;
      padding:0 !important;
      text-align:center;
      opacity: 0;
      width: 0%;
      height: 0%;
      display:none;
  }
  .menu>li{
      padding:0 !important;
    border-bottom: solid 1px #888; 
  }
   .menu > li a> span{
      display: block;
      font-size: 25px;
	   color: #177483;
	   font-weight: bolder;
   }   
   .menu li a> span:hover{
    color: #262626 !important;
	   /* font-weight: bold; */
   }  
   .menu > li > a > span:hover,.menu > li > span:hover{
    color: #177483 !important;
	   /* font-weight: bold; */
   }  
.textmenu1{color: #262626 !important;}
.textmenu1:hover{color: #177483 !important;}
  .menuOn {
      display:flex !important;
      justify-content:center;
      align-items:center;
      flex-flow:column;
      width: 100%;
      height: 100%;
      animation-name: menuOnAnimation;
      animation-fill-mode: forwards;
      animation-duration: 1s;
  }
  .menuOn > li {
     width: 100%;
  }
 
  
  @keyframes menuOnAnimation {
      0% {
          opacity: 0;
      }
      100% {
          opacity: 1;
      }
  } 

  /* opciones del menu */
  
  .subopcionTitre {
      display:block;
      cursor: pointer;
      color:rgb(4,4,4) ;
      font-size: 25px;
	  font-weight: bolder;
  }

  .subopcionTitre::after{
   display: inline-block;
   margin-left: 15px;
   
   content: "+";
  }
  
  .subopcionTitreOn::after{
   content: "-" !important;
   vertical-align: 3px;
  }

  .subopcionTitre:hover {
   color:#177483;
}
  .subopcionTitre+ul {
      display: none;
  }
  
  .subopcionTitreOn+ul {
      display: block;
  }

  .subopcionContainer{
   padding:0 !important;

   /* background-color:rgb(4,4,4); */
  }
  .subopcionContainer>li>a>span {
   display: block;
   /* color:white ; */
   font-size: 23px;
  }   
  .subopcionContainer>li>a>span:hover{   
   color:#177483;
  }  
.subopcionDescripcion{
   display:none;
}
   .menuIconos{
      border:none !important;
   }
 

.menuTextAux{
   display:none;
}
 

  .zoomEstructura2BisMenu {
   position: relative;
   /* top: 0px; */
   /* left: calc(50% - 100px); */
   border-radius: 50%;
   overflow: hidden;
   width: 200px;
   height: 200px;
   z-index: 1;
}

.zoomEstructura2BisMenu>a>img {
   border: solid 1px var(--color-4);
   border-radius: 50%;
   padding: 10px;
   height: 200px;
   width: 200px;
   transition: 0.5s;
}

.zoomEstructura2BisMenu:hover>a>img {
   padding: 0px !important;
   transition: 0.5s;
}

/* lang */
.container-lang{
position:absolute;
top: 10px;
right: 5px;
display:flex;
flex-direction: row;
z-index: 1;
}
.container-lang>a>div{
   width: 30px;
   height: 30px;  
   font-size: 14px;
   border-radius: 50%;
   padding: 5px 5px;
   margin-right: 5px;
   font-weight: bolder
}
  

.container-logo{
    position: absolute;
    width: 120px;
    top: 0px;
    left: calc(50% - 60px);
    padding-bottom:20px;
    padding-left:20px;
    padding-right:20px;
    background-color: #fff;
    border-radius: 0 0 50% 50%;

}
.container-logo2{
   display:none;
}
/* FIN - MENU */
 
/* GIROS */
.giro:hover {
    transition: all 1s ease;
    transform:rotate(-360deg);
}
.flip:hover{
    -webkit-animation:flip 1s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation:flip 1s; /* Firefox < 16 */
    -ms-animation:flip 1s; /* Internet Explorer */
    -o-animation:flip 1s; /* Opera < 12.1 */
    animation:flip 1s; 
}
@keyframes flip{
    0%{
        -webkit-animation-timing-function:ease-out;
        animation-timing-function:ease-out;
        -webkit-transform:perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);
        transform:perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn)
    }40%{
        -webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;
        -webkit-transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);
        transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg)
    }50%{-webkit-animation-timing-function:ease-in;
        animation-timing-function:ease-in;
        -webkit-transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);
        transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg)
    }80%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;
        -webkit-transform:perspective(400px) scale3d(.95,.95,.95) translateZ(0) rotateY(0deg);
        transform:perspective(400px) scale3d(.95,.95,.95) translateZ(0) rotateY(0deg)
    }to{
        -webkit-animation-timing-function:ease-in;
        animation-timing-function:ease-in;
        -webkit-transform:perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);
        transform:perspective(400px) scaleX(1) translateZ(0) rotateY(0deg)
    }
}
/* FIN - GIROS */
/* ROTATE */
.rotate{
    -ms-transform: rotate(1deg);
   -moz-transform: rotate(1deg);
   -webkit-transform: rotate(1deg);
   -o-transform: rotate(1deg);
   transform: rotate(1deg);
}
.rotate-1{
    -ms-transform: rotate(-2deg);
   -moz-transform: rotate(-2deg);
   -webkit-transform: rotate(-2deg);
   -o-transform: rotate(-2deg);
   transform: rotate(-2deg);
}
.rotate2{
    -ms-transform: rotate(2deg);
   -moz-transform: rotate(2deg);
   -webkit-transform: rotate(2deg);
   -o-transform: rotate(2deg);
   transform: rotate(2deg);
}
/* FIN - ROTATE */

/* HOVER */
.hover_scale:hover{
	-webkit-transform: scale(1.1);
    transform: scale(1.1);
	transition-duration: 0.3s;
}
.hscale:hover{transform: scale(1.2);transition:1s;}

.hover {
    position: absolute !important;
    min-height: 100%;
	min-width: 100%;
    top: 0px;
    background-image: none;
    text-align: center;
	opacity: 0;
}
.hover:hover {background-color: rgba(0, 0, 0, 0.27); opacity: 1 !important;}
.hover2{
    position:absolute !important;
    width:100%;
    height:100%;
    top:0px;
}
.hover2 div {
    background-color: rgba(0, 0, 0, 0.60); 
    width:100%;
    height:auto;
    border-bottom:2px solid white;
}
.hover2 > div > p{
    display:none;
    transition:0.3s;
}
.hover2 > div > a > i{
    display:none;
    transition:0.3s;
}
.hover2:hover {background-color: rgba(0, 0, 0, 0.60); padding:20px; transition:0.3s;}
.hover2:hover > div {background-color: rgba(0, 0, 0, 0.00) !important; height:100%; border-left:2px solid white;border-right:2px solid white;border-top:2px solid white; transition:0.3s; vertical-align: middle !important;display: flex;flex-flow: column;justify-content: center;}
.hover2:hover > div > p  {display:block !important;transition:0.3s;}
.hover2:hover > div > a > i  {display:block !important;transition:0.3s;}

.hover3{
    position:absolute !important;
    width:100%;
    height:100%;
    top:0px;
}
.hover3 div {
    background-color: rgba(0, 0, 0, 0.60); 
    width:100%;
    height:50px;
    border-bottom:2px solid white;

    display:none;
    transition:0.3s;
}
.hover3 > a > i{
    width: 60px;
    height: 60px;
    border: solid 2px white;
    padding: 10px;
    position: absolute;
    bottom: 30px;
    right: 30px;
    border-radius: 50%;
    
    opacity: 0;
    display:none;
    transition:0.5s;
}
.hover3 > a > i:hover{
    transform: scale(1.1);
    transition:0.5s;
}
.hover3:hover {background-color: rgba(0, 0, 0, 0.60); padding:20px; transition:0.3s;}
.hover3:hover > div {
    background-color: rgba(0, 0, 0, 0.00) !important; 
    height:100%; 
    border-left:2px solid white;
    border-right:2px solid white;
    border-top:2px solid white; 
    
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    transition:0.3s;
    
}
.hover3:hover > a > i {display:block !important;opacity: 1;transition:0.5s;}

.hoverLight{ transition:0.5s;}
.hoverLight:hover{color:white !important; transition:0.5s;}
.hoverDark{ color:white ;transition:0.5s;}
.hoverDark:hover{color:#464348 !important; transition:0.5s;}
.hoverDark2:hover{color:#464348 !important; transition:0.5s;}
/* FIN - HOVER */

/* ZOOM */
.zoom{
    overflow:hidden;
    position:relative;
}
.zoom > a > img{transition:0.75s;}
.zoom > a > .lazy-background{transition:0.75s; }
.zoom:hover > a > img{transform:scale(1.3); transition:0.75s;}
.zoom:hover  > a > .lazy-background{transform:scale(1.3); transition:0.75s;}

.zoom2 {
    position: relative;
    border-radius: 50%;
    overflow: hidden;
}

.zoom2>a>img,.zoom2>a>.lazy-background  {
    border-radius: 50%;
    padding: 5px;
    transition: 0.25s;
}

.zoom2:hover>a>img,.zoom2:hover>a>.lazy-background  {
    padding: 0px !important;
    transition: 0.25s;
}

/* FIN - ZOOM */

/* TRANSITION */
.transition{width: 100%;height: 100%;}
.transition:hover{background-color: rgba(255, 255, 255, 0.27);}
.transition h4{margin-bottom: 0px;}
.transition div{
    transform: scaleY(0);
    transform-origin: 100% 0;
    transition: transform 250ms ease;
    background-color: rgba(13, 171, 211,0.53 );
    height: 100%;
}
.transition:hover div{transform: scaleY(1);}
.transition2{width: 100%;height: 100%;}
.transition2 div{
    transform: scaleY(0);
    transform-origin: 100% 0;
    transition: transform 250ms ease;
    background-color: rgba(255, 255, 255, 0.75);
    height: 100%;
}
.transition2:hover div{transform: scaleY(1);}
/* FIN - TRANSITION */

/*HEXAGONO*/
/* generador de figuras geometricas :  http://brenna.github.io/csshexagon/ */
/*EFECTO  (alejandro)*/
.hexagon:hover {
    transition: all 1s ease;
    transform:rotate(-360deg);
}
/* FIN - EFECTO */

.hexagon {
    position: relative;
    width: 100px;
    height: 57.74px;
    /*background-color: #ffffff;*/
    margin: 28.87px 0;
    border-left: solid 3px #CDCDCD;
    border-right: 3px solid #CDCDCD;
}

.hexagon:before,
.hexagon:after {
  content: "";
  position: absolute;
  z-index: 1;
  width: 70.71px;
  height: 70.71px;
  -webkit-transform: scaleY(0.5774) rotate(-45deg);
  -ms-transform: scaleY(0.5774) rotate(-45deg);
  transform: scaleY(0.5774) rotate(-45deg);
  background-color: inherit;
  left: 11.6447px;
}
.hexagon:before {
  top: -35.3553px;
  border-top: solid 4.2426px #CDCDCD;
  border-right: solid 4.2426px #CDCDCD;
}
.hexagon:after {
  bottom: -35.3553px;
  border-bottom: solid 4.2426px #CDCDCD;
  border-left: solid 4.2426px #CDCDCD;
}
 /* HEXAGONO CON FONDO TRANSPARENTE */

/* TRIANGULO */
.triangle-tl{
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 120px 120px 0 0;
	border-color: rgba(0,0,0,0.5) transparent transparent transparent;
}	
.triangle-tl > a {
	position: absolute;
	bottom: 90px;
    left: 15px;				
}
.triangle-tr{
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 120px 120px 0;
	border-color: transparent rgba(0,0,0,0.5) transparent transparent;			
}	
.triangle-tr > a {
	position: absolute;
	top: 30px;
	left: 120px;		
}

.triangle-bl{
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 120px 0 0 120px;
	border-color: transparent transparent transparent rgba(0,0,0,0.5);		
}	
.triangle-br{
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 120px 120px;
	border-color: transparent transparent rgba(0,0,0,0.5) transparent;			
}	

.triangleImgLeft {

    width: 0;
    height: 0;
    border-bottom: 100px solid #518a70;
    border-left: 100px solid transparent;
    border-right: 100px solid transparent;
    position: absolute;
    right: calc(50% - 100px);
    bottom: 0px;
}

.triangleImgRight {
    width: 0;
    height: 0;
    border-bottom: 100px solid #0089bf;
    border-left: 100px solid transparent;
    border-right: 100px solid transparent;

    position: absolute;
    left: calc(50% - 100px);
    bottom: 0px;
}
/* FIN - TRIANGULO */
 




/* CARROUSEL BOOTSTRAP */
.carousel-item:not(.active){
    display:block !important;
    /* z-index: 0 !important; */
    opacity:0 !important;
    transition:opacity 2s !important;
 
    animation-name: slideDisplayNone;
    animation-fill-mode: forwards;
    animation-duration: 1s;
    animation-delay: 2s;
}

@keyframes slideDisplayNone {
    from {display: flex;}
    to {display: none;}
  }
.carousel-item.active{
    opacity:1 !important;
    transition:1s;
}


.carousel-item:not(.active)  .animationTextSlide{
    /* left: -100vw; */
    opacity: 0;

    transition:2s;
}

.carousel-item.active .animationTextSlide{

    animation-name: animationTextSlide;
    animation-fill-mode: forwards;
    animation-duration: 3s;
}  
  @keyframes animationTextSlide {
    0% {
        opacity: 0;
       /*  left: -100vw; */
    }
 
    100% {
        opacity: 1;
       /*  left: 0vw; */
    }
}  
.textSlide {
    width: 100%;
    position: absolute;
    bottom: 60px;
    left: 15px; 
    /* max-width: 100vw; */
}

.textSlide2 {
    position: absolute;
    top: 45%;
    width: 100%;
    text-align: center;
    /* max-width: 100vw; */
}

 .animationTextSlide2{

    animation-name: animationTextSlide;
    animation-fill-mode: forwards;
    animation-duration: 3s;
}  
  @keyframes animationTextSlide2 {
    0% {
        opacity: 0;
        /* left: -100vw; */
    }
 
    100% {
        opacity: 1;
       /*  left: 0vw; */
    }
}  

/* FIN - para hacer la transición mas suave  */
.gadjet-slide-right, .gadjet-slide-right div {display:none;}
/* FIN - CARROUSEL BOOTSTRAP */

/* social 8  */
.socialNetworks {
    position: absolute;
    top: 105px;
    right: -395px;
    width: 450px;
    /* max-width: 55px; */
    height: 490px;

    display: flex;
    align-items: start;

    transition: 0.5s;
}

.socialNetworksAnimation {
    animation-name: socialNetworksAnimationOn;
    animation-duration: 3s;
}

@keyframes socialNetworksAnimationOn {
    0% {
            right: -395px;
    }
    25% {
            right: 0px;
    }
    75% {
            right: 0px;
    }
    100% {
            right: -395px;
    }
}

.iconoSocialNetworks {
    width: 55px;
    padding: 10px;
    padding-right: 9px;
    border-radius: 50px 0px 0px 50px;
}

.iconoSocialNetworks>i {
    transform: scaleX(-1);
    font-size: 30px;
    border-radius: 50px 0px 0px 50px;
}


.iconoSocialNetworks>.fa-times{
    padding-left: 8px;
}

.borderlandSocialNetworks {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: none;
}

.iconosFooter3 {
    border-radius: 50%;
    width: 70px;
    height: 70px;
}
/* fin - social 8  */


/* WIDGET ACTU */
.actu-slide{
    border-radius: 50px 0px 0px 50px;
    width: 53px;
    padding: 10px;
    height: auto;
}
/* FIN - WIDGET ACTU */
 


/* Smartphones (portrait & landscape) */
@media only screen and (min-device-width : 320px)  and (max-device-width : 480px) {}

@media only screen and (min-width: 576px) {
body{}
html{}
header{}
main{}
footer{}

.container{}

.h-1{}
.h-2{}
.h-3{}
.h-4{}
.min-height1{}
.min-height2{}
.min-height3{}
.min-height4{}
.min-heightSlide{min-height:100vh !important;}
.min-heightGalerie2 {
    min-height: 300px !important;
}
.max-height1{}
.max-height2{}
.max-height3{}
.max-height4{}
.w-1{}
.w-2{}
.w-3{}
.w-4{}
.w-sm-90{width:90% !important;}
.w-sm-80{width:80% !important;}
.w-sm-70{width:70% !important;}
.w-sm-60{width:60% !important;}
.w-sm-50{width:50% !important;}
.w-sm-40{width:40% !important;}
.w-sm-30{width:30% !important;}
.w-sm-20{width:20% !important;}
.w-sm-15{width:15% !important;}
.w-sm-10{width:10% !important;}
.min-width1{}
.min-width2{}
.min-width3{}
.min-width4{}
.max-width1{}
.max-width2{}
.max-width3{}
.max-width4{}


.partenaires{}
.partenaires img{}

.offcanvas-end{
    max-width:500px !important;
}

.border-top-radius{
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
}

/* MENU */
 .logoResabooking{
      width: 180px !important;
    left: calc(50% - 90px) !important;
    transition: 0.5s;
   }
	.container-logo{
        width: 180px; 
        left: calc(50% - 90px);
   }


}

@media only screen and (min-width: 768px) {
body{}
html{}
header{}
main{}
footer{}

.h-1{height: 75vh}
.h-2{height:400px;}
.h-3{}
.h-4{}
.h-100
.min-height1{min-height:500px}
.min-height2{min-height:500px !important;}
.min-height3{}
.min-height4{}
.min-heightGalerie2 {
    min-height: 400px;
}
.max-height1{}
.max-height2{}
.max-height3{}
.max-height4{}
.w-1{}
.w-2{}
.w-3{}
.w-4{}
.w-md-90{width:90% !important;}
.w-md-80{width:80% !important;}
.w-md-70{width:70% !important;}
.w-md-60{width:60% !important;}
.w-md-50{width:50% !important;}
.w-md-40{width:40% !important;}
.w-md-30{width:30% !important;}
.w-md-20{width:20% !important;}
.w-md-15{width:15% !important;}
.w-md-10{width:10% !important;}
.min-width1{}
.min-width2{}
.min-width3{}
.min-width4{}
.max-width1{}
.max-width2{}
.max-width3{}
.max-width4{}

.order-md-1{order: 1 !important;}
.order-md-2{order: 2 !important;}
.order-md-3{order: 3 !important;}
.order-md-4{order: 4!important;}
.order-md-5{order: 5!important;}
.order-md-6{order: 6!important;}
.order-md-7{order: 7!important;}
.order-md-8{order: 8!important;}
.order-md-9{order: 9!important;}
.order-md-10{order: 10!important;}
.order-md-11{order: 11!important;}
.order-md-12{order: 12!important;}
.order-md-13{order: 13!important;}
.order-md-14{order: 14!important;}
.order-md-15{order: 15!important;}
.order-md-16{order: 16!important;}
.order-md-last{order: 17!important;}

.offcanvas-end{
    max-width:700px !important;
}
.estructura-11 {
    padding-top: 0px;
    padding-bottom: 0px;
}

.estructura-11>div {
    min-height: 500px;
    margin-left: 50%;
}

.textSlide { 
    bottom: 60px;
    left: 200px;  
}

.separacion-2-bis { min-height:500px;} 
.separation-2-bis-img { min-height:500px;} 
.separation-2-bis-text {
    padding-top: 0px;
    padding-bottom: 0px;
    margin-right: 15%;
    position: absolute;
    top: 0;left: 18%;       
     width: auto;
    }
.separation-2-bis-text>div {min-height: 350px;}

/* MENU */
   .container-logo2{
      display: block;
      width: 200px;
      height: 120px;
      position: absolute;
      bottom: 0px;
      left: 0px;
      -moz-border-radius: 0 100% 0 0;
      -webkit-border-radius: 0 100% 0 0;
      border-radius: 0 100% 0 0;
   }
   .container-logo2>img{
      position: absolute;
      bottom: 0;
      left: 0;
      width: 190px;
   }
/* FIN - MENU */
}

@media only screen and (min-width: 992px) {
body{}
html{}
header{}
main{}
footer{}
.h-1{height: 75vh}
.h-2{height:500px;}
.h-3{}
.h-4{}
.min-height1{}
.min-height2{min-height:600px !important;}
.min-height3{}
.min-height4{}
.min-heightMh{min-height:400px !important;}
.max-height1{}
.max-height2{}
.max-height3{}
.max-height4{}
.w-1{}
.w-2{}
.w-3{}
.w-4{}
.w-lg-90{width:90% !important;}
.w-lg-80{width:80% !important;}
.w-lg-70{width:70% !important;}
.w-lg-60{width:60% !important;}
.w-lg-50{width:50% !important;}
.w-lg-40{width:40% !important;}
.w-lg-30{width:30% !important;}
.w-lg-20{width:20% !important;}
.w-lg-15{width:15% !important;}
.w-lg-10{width:10% !important;}
.min-width1{}
.min-width2{}
.min-width3{}
.min-width4{}
.max-width1{}
.max-width2{max-width:60px !important;}
.max-width3{}
.max-width4{}.container{}
.order-lg-1{order: 1 !important;}
.order-lg-2{order: 2 !important;}
.order-lg-3{order: 3 !important;}
.order-lg-4{order: 4!important;}
.order-lg-5{order: 5!important;}
.order-lg-6{order: 6!important;}
.order-lg-7{order: 7!important;}
.order-lg-8{order: 8!important;}
.order-lg-9{order: 9!important;}
.order-lg-10{order: 10!important;}
.order-lg-11{order: 11!important;}
.order-lg-12{order: 12!important;}
.order-lg-13{order: 13!important;}
.order-lg-14{order: 14!important;}
.order-lg-15{order: 15!important;}
.order-lg-16{order: 16!important;}
.order-lg-last{order: 17!important;}
.container{}

.offcanvas-end{
    max-width:900px !important;
}

.estructura-12{
    max-width: unset !important;
    padding-left: 0 !important; 
} 
.estructura-12-bis{
    max-width: unset !important;
    padding-right: 0 !important;
} 
.ml-lg-n50px{margin-left: -50px}
.mr-lg-n50px{margin-right: -50px} 

/* MENU */
   header {
      height: 60px;
  }
 
   /* burger */
   .burger-container {
      height: 60px;
  }
   .burger {
      height: 60px;
      width: 80px;
   }

   .burgerBar1 {
      top: 13px;
   }

   .burgerBar2 {
      top: 26px;
      
   }

   .burgerBar3 {
      top: 40px;
      
   }

   .burgerOn>.burgerBar1{
      transform: rotate(-40deg);
      top: 25px;
      transition: 0.75s;
   }
   .burgerOn>.burgerBar2{
      transform: rotate(40deg);
      transition:0.5s;
   }
   .burgerOn>.burgerBar3{
      width:0px;
      transition:0.25s;
   }

/*    .burgerText{
      display: flex;
      position: absolute;
      right: 10px;
      font-size: 30px;
      height: 60px;
      align-items: center;
      
   } */
 

   /* lang */
   .container-lang{ 
      top: 17px;
    right: 10px;
   }
 
   .menu{
      border-right: solid 1px #888; 
   }
   .menuOn{
      width:50% !important;
      
   }
   .menu>li{
    border-bottom:inherit !important; 
    display:none;
  }
   .menuOn>li{
    border-bottom:inherit !important; 
    display:flex;
  }

  .subopcionContainer{
  /*  display: flex !important; */
  display:none !important;
   flex-flow: column;
   justify-content: center;
   position: absolute;
   top: 60px;
   left: 50%;
   /* width: 0%; */
   width: 50%;  
   height: calc(100% - 60px);
   overflow-y: auto;
  /*  opacity:0; */
   /* transition:width 0.75s,opacity 0.25s; */
   
  }
  .subopcionContainer::-webkit-scrollbar {
      -webkit-appearance: none;
   }
   
 
  .subopcionTitreOn+ul{
    display: flex !important;
  /*  flex-flow: column;
   justify-content: center;  */ 
   /* width: 50%; */
   /* opacity:1; */
 
   transition:width 0.5s,opacity 1s;
  }

  .menuIconos{
   border:none !important;
  }
  .menuIconos>div{
   border-top:solid 1px #888;
  }
  .container-logo{
     width: 220px; 
    left: calc(50% - 110px);
   }
/* FIN - MENU */

 .container-face{
        position: absolute;
        top: 90px;
        left:-380px;
        z-index: 2;
        width: 481px;
        height: 500px;
        
        display:flex;
        align-items: start;
    
        transition:1s;
    }
    .container-face:hover{
        left:0px;
        transition:1s;
    }
    .container-face-bottom{
        align-items: center;
        position: absolute;
        bottom:-284px;
        left:0px;
        z-index: 2;
        width: 481px;
        height: 384px;
        
        flex-direction: column;
        justify-content: start;
        align-items: center;
    
        transition:1s;
    }
    .container-face-bottom:hover{
        bottom:0px;
        transition:1s;
    }
    .face-slide{
        background-color: #3b5998;
        border-radius: 0px 50px 50px 0px;
        width: 100px;
        padding: 10px;
        height: auto;
    }
    .face-slide-bottom{
        background-color: #3b5998;
        border-radius: 50px 50px 0px 0px;
        width: 100px;
        padding: 10px;
        height: auto;
    }
    .gadjet-slide-right div{
        display:flex;
    }
    .gadjet-slide-right{
        overflow:hidden;
        display:flex;
        position:absolute;
        right:0px;
        top:90px;
        border-radius: 60px 0px 0px 60px;
        width:100px;
        z-index: 1;
        transition:0.25s;
    }
    .gadjet-slide-right:hover{
        width:400px;
        transition:0.25s linear;
    }
    .gadjet-slide-right:hover p{
        opacity:1;
        animation-delay: 0.25s;
        transition:0.4s linear;
    }
    .gadjet-slide-right img{
        width:80px;
        height:80px;
        border-radius:50%;
    }
    .gadjet-slide-right p{
        opacity:0;
    }

    /* WIDGET ACTU */
    .container-actu{
        position: absolute;
        top: 150px;
        right:-310px;
        z-index: 1;
        width: 366px;
        display:flex;
        align-items: start;

        transition:1s;
    }
    .container-actu:hover{
        right:0px;
        transition:1s;
    }
     
    /* FIN - WIDGET ACTU */

    /* TRIANGULO */
    .triangleImgLeft {

        width: 0;
        height: 0;
        border-right: 100px solid #518a70;
        border-left:inherit;
        border-top: 100px solid transparent;
        border-bottom: 100px solid transparent;
        position: absolute;
        right:0px; 
        bottom: calc(50% - 100px);
    }
    
    .triangleImgRight {
        width: 0;
        height: 0;
        border-left: 100px solid #0089bf;
        border-right: inherit;
        border-top: 100px solid transparent;
        border-bottom: 100px solid transparent;
        position: absolute;
        left: 0px;
        bottom: calc(50% - 100px); 
    }
     /* FIN - TRIANGULO */


}

@media only screen and (min-width: 1024px){
    .order-xl-1{order: 1 !important;}
    .order-xl-2{order: 2 !important;}
    .order-xl-3{order: 3 !important;}
    .order-xl-4{order: 4 !important;}
    .order-xl-5{order: 5 !important;}
    .order-xl-6{order: 6!important;}
    .order-xl-7{order: 7!important;}
    .order-xl-8{order: 8!important;}
    .order-xl-9{order: 9!important;}
    .order-xl-10{order: 10!important;}
    .order-xl-11{order: 11!important;}
    .order-xl-12{order: 12!important;}
    .order-xl-13{order: 13!important;}
    .order-xl-14{order: 14!important;}
    .order-xl-15{order: 15!important;}
    .order-xl-16{order: 16!important;}
    .order-xl-last{order: 17!important;}

    .border-top-radius{
        border-radius: 50px
}

.separation-2-bis-text { 
    left:15%;
} 

}

@media only screen and (min-width: 1200px) {
body{}
html{}
header{}
main{}
footer{}
.sticky1{
    position: -webkit-sticky;
    position: -moz-sticky;
    position: -ms-sticky;
    position: -o-sticky;
    position: sticky;
}
	
.h-1{height: 100vh}
.h-2{}
.h-3{}
.h-4{}
.min-height1{min-height:600px}
.min-height2{}
.min-height3{}
.min-height4{}

.max-height1{}
.max-height2{}
.max-height3{}
.max-height4{}
.w-1{}
.w-2{}
.w-3{}
.w-4{}
.w-xl-90{width:90% !important;}
.w-xl-80{width:80% !important;}
.w-xl-70{width:70% !important;}
.w-xl-60{width:60% !important;}
.w-xl-50{width:50% !important;}
.w-xl-40{width:40% !important;}
.w-xl-30{width:30% !important;}
.w-xl-20{width:20% !important;}
.w-xl-15{width:15% !important;}
.w-xl-10{width:10% !important;}
.min-width1{}
.min-width2{}
.min-width3{}
.min-width4{}
.max-width1{}
.max-width2{max-width:70px !important;}
.max-width3{}
.max-width4{}

.container{padding: 0% 5%;}
.order-xxl-1{order: 1 !important;}
.order-xxl-2{order: 2 !important;}
.order-xxl-3{order: 3 !important;}
.order-xxl-4{order: 4 !important;}
.order-xxl-5{order: 5 !important;}
.order-xxl-6{order: 6!important;}
.order-xxl-7{order: 7!important;}
.order-xxl-8{order: 8!important;}
.order-xxl-9{order: 9!important;}
.order-xxl-10{order: 10!important;}
.order-xxl-11{order: 11!important;}
.order-xxl-12{order: 12!important;}
.order-xxl-13{order: 13!important;}
.order-xxl-14{order: 14!important;}
.order-xxl-15{order: 15!important;}
.order-xxl-16{order: 16!important;}
.order-xxl-last{order: 17!important;}

/* MENU */
 .menuOn{
      width:34% !important;
   }
   .subopcionContainer{
      left: 34% !important;
      /* width:33% !important; */
      border-right: solid 1px #888; 
      background-color:white;
     }

     .subopcionTitreOn+ul{
      width: 33%; 
      transition:1s;
     }

     ul+.subopcionDescripcion{
      position: absolute;
      top: 60px;
      left: 67%;
      /* width:0% !important; */
      width:33% !important;
      height: calc(100% - 60px);
      overflow-y:auto;
      /* display: flex !important; */
      display:none!important;
      flex-flow: column;
      align-items: center;
      justify-content: center;
      background-color:white;
     /*  opacity:0; */
      /* transition:width 0.75s,opacity 0.25s; */
   }

     .subopcionTitreOn+ul+.subopcionDescripcion{
      /* width:33% !important;
      opacity:1; */
    /*   transition:width 0.5s,opacity 1s; */
    display: flex !important;
   }
   .subopcionTitreOn+ul+.subopcionDescripcion::-webkit-scrollbar {
      -webkit-appearance: none;
   }
   .subopcionTitreOn+ul+.subopcionDescripcion>p{
      color:#444;
      font-size: 16px;
   }
 .menuTextAux{
      position: absolute;
      top: 60px;
      left: 34%;
      display:block;
      width:66%;
      height: calc(100% - 60px);
      overflow-y:auto;
      display:flex;
      flex-flow:column;
      align-items: center;
      justify-content: center;
      opacity:0;
      transition:opacity 1s;
   }
   .menuContainerOn>.menuTextAux{
      opacity:1;
   }
   .desaparecer{
      display:none;
      transition:0.5s;
   }
/* FIN - MENU */

.textSlide { 
    bottom: 20px;
    left: 200px;  
}
}

@media only screen and (min-width: 1400px) {
body{}
html{}
header{}
main{}
footer{}

.h-1{height: 100vh}
.h-2{}
.h-3{}
.h-4{}
.min-height1{}
.min-height2{}
.min-height3{}
.min-height4{}
.max-height1{}
.max-height2{}
.max-height3{}
.max-height4{}
.w-1{}
.w-2{}
.w-3{}
.w-4{}
.w-xxl-90{width:90% !important;}
.w-xxl-80{width:80% !important;}
.w-xxl-70{width:70% !important;}
.w-xxl-60{width:60% !important;}
.w-xxl-50{width:50% !important;}
.w-xxl-40{width:40% !important;}
.w-xxl-30{width:30% !important;}
.w-xxl-20{width:20% !important;}
.w-xxl-15{width:15% !important;}
.w-xxl-10{width:10% !important;}
.min-width1{}
.min-width2{}
.min-width3{}
.min-width4{}
.max-width1{}
.max-width2{}
.max-width3{}
.max-width4{}

.container{}

.separation-2-bis-text {margin-right: 4%;left:40%;}
}

@media only screen and (min-width: 1600px) {
.separation-2-bis-text {
    padding-top: 0px;
    padding-bottom: 0px;
    margin-right: 5%;
    position: absolute;
    top: 0;
    left: 30%;
    width: auto;
}
.separation-2-bis-text { left:50%;} 
}

/* ANIMACIONES */
.fadeIn1{
    opacity:0;
    -webkit-animation: fadein 1.5s forwards; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1.5s forwards; /* Firefox < 16 */
    -ms-animation: fadein 1.5s forwards; /* Internet Explorer */
    -o-animation: fadein 1.5s forwards; /* Opera < 12.1 */
    animation: fadein 1.5s forwards;          
}
.fadeIn3{
    opacity:0;
    -webkit-animation: fadein 1s forwards; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1s forwards; /* Firefox < 16 */
    -ms-animation: fadein 1s forwards; /* Internet Explorer */
    -o-animation: fadein 1s forwards; /* Opera < 12.1 */
    animation: fadein 1s forwards;     
    animation-delay: 3s;     
}           
.fadeIn2{
    opacity:0;
    -webkit-animation: fadein 1s forwards; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1s forwards; /* Firefox < 16 */
    -ms-animation: fadein 1s forwards; /* Internet Explorer */
    -o-animation: fadein 1s forwards; /* Opera < 12.1 */
    animation: fadein 1s forwards; 
    animation-delay: 1s;

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

/* Firefox < 16 */
@-moz-keyframes fadein {
    0%   {opacity: 0;}
    25%   {opacity: 0;}
    100% {opacity: 1;}
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    0%   {opacity: 0;}
    25%   {opacity: 0;}
    100% {opacity: 1;}
}

/* Internet Explorer */
@-ms-keyframes fadein {
    0%   {opacity: 0;}
    25%   {opacity: 0;}
    100% {opacity: 1;}
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    0%   {opacity: 0;}
    25%   {opacity: 0;}
    100% {opacity: 1;}
}
.animationActu{
    -webkit-animation: animationActu 4s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: animationActu 4s; /* Firefox < 16 */
        -ms-animation: animationActu 4s; /* Internet Explorer */
            -o-animation: animationActu 4s; /* Opera < 12.1 */
            animation: animationActu 4s;   
            animation-delay: 2s;     
}
.animationFacebook2{
    -webkit-animation: animationActu 4s; /* Safari, Chrome and Opera > 12.1 */
            -moz-animation: animationActu 4s; /* Firefox < 16 */
            -ms-animation: animationActu 4s; /* Internet Explorer */
                -o-animation: animationActu 4s; /* Opera < 12.1 */
                animation: animationActu 4s; 
                animation-delay: 4s;      
    }
/* Firefox < 16 */
@-moz-keyframes animationActu { 
    0%   {right: -310px;}
    25%  {right: 0px;}
    75%  {right: 0px;}
    100% {right: -310px;}
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes animationActu {
    0%   {right: -310px;}
    25%  {right: 0px;}
    75%  {right: 0px;}
    100% {right: -310px;}
}

/* Internet Explorer */
@-ms-keyframes animationActu {
    0%   {right: -310px;}
    25%  {right: 0px;}
    75%  {right: 0px;}
    100% {right: -310px;}
}

/* Opera < 12.1 */
@-o-keyframes animationActu {
    0%   {right: -310px;}
    25%  {right: 0px;}
    75%  {right: 0px;}
    100% {right: -310px;}
}
.animationTop{
    -webkit-animation: animationtop 2s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: animationtop 2s; /* Firefox < 16 */
        -ms-animation: animationtop 2s; /* Internet Explorer */
            -o-animation: animationtop 2s; /* Opera < 12.1 */
            animation: animationtop 2s;       
}
@keyframes animationtop {
    from { opacity:0;top: -60px; }
    to   { opacity:1;top: 135px; }
}

/* Firefox < 16 */
@-moz-keyframes animationtop {
    from { opacity:0;top: -60px; }
    to   { opacity:1;top: 135px; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes animationtop {
    from { opacity:0;top: -60px; }
    to   { opacity:1;top: 135px; }
}

/* Internet Explorer */
@-ms-keyframes animationtop {
    from { opacity:0;top: -60px; }
    to   { opacity:1;top: 135px; }
}

/* Opera < 12.1 */
@-o-keyframes animationtop {
    from { opacity:0;top: -60px; }
    to   { opacity:1;top: 135px; }
}

.animationFacebook{
-webkit-animation: animationFacebook 4s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: animationFacebook 4s; /* Firefox < 16 */
        -ms-animation: animationFacebook 4s; /* Internet Explorer */
            -o-animation: animationFacebook 4s; /* Opera < 12.1 */
            animation: animationFacebook 4s;   
            animation-delay: 2s;     
}
.animationFacebook2{
    -webkit-animation: animationFacebook 4s; /* Safari, Chrome and Opera > 12.1 */
            -moz-animation: animationFacebook 4s; /* Firefox < 16 */
            -ms-animation: animationFacebook 4s; /* Internet Explorer */
                -o-animation: animationFacebook 4s; /* Opera < 12.1 */
                animation: animationFacebook 4s; 
                animation-delay: 4s;      
    }
/* Firefox < 16 */
@-moz-keyframes animationFacebook { 
    0%   {left: -380px;}
    25%  {left: 0px;}
    75%  {left: 0px;}
    100% {left: -380px;}
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes animationFacebook {
    0%   {left: -380px;}
    25%  {left: 0px;}
    75%  {left: 0px;}
    100% {left: -380px;}
}

/* Internet Explorer */
@-ms-keyframes animationFacebook {
    0%   {left: -380px;}
    25%  {left: 0px;}
    75%  {left: 0px;}
    100% {left: -380px;}
}

/* Opera < 12.1 */
@-o-keyframes animationFacebook {
    0%   {left: -380px;}
    25%  {left: 0px;}
    75%  {left: 0px;}
    100% {left: -380px;}
}

/* ANIMATION FACEBOOK BOTTOM */
.animationFacebook-bottom{
-webkit-animation: animationFacebook-bottom 4s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: animationFacebook-bottom 4s; /* Firefox < 16 */
    -ms-animation: animationFacebook-bottom 4s; /* Internet Explorer */
        -o-animation: animationFacebook-bottom 4s; /* Opera < 12.1 */
        animation: animationFacebook-bottom 4s;   
        animation-delay: 2s; 
}
/* Firefox < 16 */
@-moz-keyframes animationFacebook-bottom {
    0%   {bottom: -284px;}
    25%  {bottom: 0px;}
    75%  {bottom: 0px;}
    100% {bottom: -284px;}
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes animationFacebook-bottom {
    0%   {bottom: -284px;}
    25%  {bottom: 0px;}
    75%  {bottom: 0px;}
    100% {bottom: -284px;}
}

/* Internet Explorer */
@-ms-keyframes animationFacebook-bottom {
    0%   {bottom: -284px;}
    25%  {bottom: 0px;}
    75%  {bottom: 0px;}
    100% {bottom: -284px;}
}

/* Opera < 12.1 */
@-o-keyframes animationFacebook-bottom {
    0%   {bottom: -284px;}
    25%  {bottom: 0px;}
    75%  {bottom: 0px;}
    100% {bottom: -284px;}
} 

.fadeOut{
    -webkit-animation:fadeOut 3s forwards; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation:fadeOut 3s forwards; /* Firefox < 16 */
    -ms-animation:fadeOut 3s forwards; /* Internet Explorer */
    -o-animation:fadeOut 3s forwards; /* Opera < 12.1 */
    animation:fadeOut 3s forwards; 
    animation-delay: 1.5s;
}
    @keyframes fadeOut {
        0%   {opacity: 1;}
        99%{height: 100vh;}
        100%   {opacity: 0;height:0;}
    }
    
    /* Firefox < 16 */
    @-moz-keyframes fadeOut{
        0%   {opacity: 1;}
        99%{height: 100vh;}
        100%   {opacity: 0;height:0;}
    }
    
    /* Safari, Chrome and Opera > 12.1 */
    @-webkit-keyframes fadeOut {
        0%   {opacity: 1;}
        99%{height: 100vh;}
        100%   {opacity: 0;height:0;}
    }
    
    /* Internet Explorer */
    @-ms-keyframes fadeOut {
        0%   {opacity: 1;}
        99%{height: 100vh;}
        100%   {opacity: 0;height:0;}
    }
    
    /* Opera < 12.1 */
    @-o-keyframes fadeOut {
        0%   {opacity: 1;}
        99%{height: 100vh;}
        100%   {opacity: 0;height:0;}
    }
    
    .slideZoomEfect{
        -webkit-animation: slideZoom 4s forwards; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: slideZoom 4s forwards; /* Firefox < 16 */
        -ms-animation: slideZoom 4s forwards; /* Internet Explorer */
        -o-animation: slideZoom 4s forwards; /* Opera < 12.1 */
        animation: slideZoom 4s forwards; 
    }
        @keyframes slideZoom {
            0%   {transform: scale(1);}
            100% {transform: scale(1.2);}
        }
        
        /* Firefox < 16 */
        @-moz-keyframes slideZoom {
            0%   {transform: scale(1);}
            100% {transform: scale(1.2);}
        }
        
        /* Safari, Chrome and Opera > 12.1 */
        @-webkit-keyframes slideZoom {
            0%   {transform: scale(1);}
            100% {transform: scale(1.2);}
        }
        
        /* Internet Explorer */
        @-ms-keyframes slideZoom {
            0%   {transform: scale(1);}
            100% {transform: scale(1.2);}
        }
        
        /* Opera < 12.1 */
        @-o-keyframes slideZoom {
            0%   {transform: scale(1);}
            100% {transform: scale(1.2);}
        }