/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 24/03/2019, 03:55:57 PM
    Author     : Cesar Maya
*/


.cuerpo{
    width: 100%;
    text-align: center;
    background-color: #49882C;
    margin-top: 80px;
    font-family: 'Open Sans', sans-serif;
    font-size: 14pt;
    padding-bottom: 1%;
}
.cajonMapaCampoGolf p{
        width: 100%;
        color: #FFF;
        text-align: center;
        font-size: 1em;
        -webkit-animation-name: tituloGolfCambio; /* Safari 4.0 - 8.0 */
        -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
        animation-name: tituloGolfCambio;
        animation-duration: 4s;
    }
    .cajonMapaCampoGolf p:hover{
        width: 100%;
        color: #F00;
        text-align: center;
        font-size: 1.2em;
        webkit-animation-name: tituloGolfCambio; /* Safari 4.0 - 8.0 */
        -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
        animation-name: tituloGolfCambio;
        animation-duration: 4s;
    }
    /* Safari 4.0 - 8.0 */
    @-webkit-keyframes tituloGolfCambio {
      0%   {color: #FFF;font-size: 1em;}
      50%  {color: #F00;font-size: 1.2em;}
      100% {color: #FFF;font-size: 1em;}
    }

    /* Standard syntax */
    @keyframes tituloGolfCambio {
      0%   {color: #FFF;font-size: 1em;}
      25%  {color: #F00;font-size: 1.2em;}
      100% {color: #FFF;font-size: 1em;}
    }


@media (max-width:767px){
    /* Modal Golf*/
modal-header{
    width: 100%;
}
.tituloModal{
    width: 100%;
    text-align: center;
}
.tituloModal h5{
    font-weight: bold;
    font-size: 2em;
    color: #6EA205;
}
.modal-body{
    width: 100%;
}
.contenidoModal{
    width: 100%;
}
.contenidoMapaModal{
    width: 100%;
    padding: 2%;
}
.mapaHoyo{
    width: 100%;
}
.mapaHoyo img{
    width: 100%;
}
.contenidoTextoModal{
    width: 100%;
    padding: 2%;
    display: flex;
    flex-direction: column;
}
.textosModal{
    width: 96%;
    margin: auto;
    padding-right: 2%;
}
.tablaModal{
    width: 96%;
    margin: auto;
    text-align: center;
    overflow-y: auto;
}
.tablaModal1{
    width: 96%;
    margin: auto;
    text-align: center;
    overflow: auto;
}
.mutimediaModal{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.videoModal{
    width: 96%;
    margin: auto;
    padding-top: 1%;
}
.sliderModal{
    width: 96%;
    margin: auto;
}
.imagenSli{
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    max-width: 100%;
    max-height: 100%;
}
    
/* Fin Modal Golf */
.rayaTitulo {
    width: 80%;
    margin: auto;
    text-align: center;
    border-top-style: solid;
    border-top-width: 1px;
    border-color: #FFF;
    opacity: 0.50;
}
/* fin modal*/
    
.cajonMapaCampoGolf{
    width: 100%;
    margin: auto;
    padding-top: 20px;
    padding-bottom: 30px;
}
.cajonMapaCampoGolf p{
    margin-top: 10px;
}
    
.tituloPaginaGolf{
    width: 100%;
    text-align: center; 
    padding-top: 5px;
}
.tituloPaginaGolf h1{
    font-weight: bold;
    font-size: 1.5em;
    color: #FFF;
}
.mapaHoyo{
    width: 100%;
    margin: auto;
}
    
.tituloPaginaGolf h2{
    font-weight: bold;
    font-size: 1.2em;
    color: #FFF;
}
    .image-map{
        width: 100%;
    }
    .image-map img{
        width: 100%;
    }
    .image-map {
        display: block;
        margin: 20px auto;
        position: relative;
        overflow: hidden;
    }
    .image-map__img {
        max-width: 100%;
    }
    .image-map__icons {
        height: 0px;
        overflow: visible;
        pointer-events: none;
        background: none !important;
        position: absolute;
        top: 0;
        left: 0;
    }
    .image-map__icons .icon {
        position: absolute;
        display: inline-block;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        box-sizing: border-box;
        
    }
    .contenedorCampoGolfInfantil{
        width: 95%;
        margin: auto;
        margin-bottom: 50px;
        display: flex;
        flex-direction: column;
        padding-top: 10px;
    }
    .campoGolfInfantil{
        width: 100%;
    }    
    .accordion {
        width: 50%;
        outline: none;
        transition: 0.4s;
        cursor: pointer;
        margin-left: 1%;
        margin-bottom: 0;
        text-shadow: 0 -2px 0 #4a8a65, 0 1px 1px #F9F9F9;
        box-sizing: border-box;
        font-size: 1.3em;
        font-family: Helvetica, Arial, Sans-Serif;
        text-decoration: none;
        font-weight: bold;
        color: #E7E7E7;
        height: 50px;
        line-height: 50px;
        padding: 0 32.5px;
        display: inline-block;
        background: linear-gradient(to bottom, #64C138 0%, #5EA73C 26%, #49882C 100%);
        border-radius: 5px;
        border-top: 1px solid #c8e2d3;
        border-bottom: 1px solid #c2dece;
        top: 0;
        transition: all 0.06s ease-out;
        position: relative; 
        
    }
    
    
    .accordion:visited{
        color: #5ea97d;
    }
    .active, .accordion:hover {
        background: linear-gradient(to bottom, #baf1d1 0%, #b7e4ca 26%, #96c7ab 100%);
        top: 6px;
        text-shadow: 0 -2px 0 #7fbb98, 0 1px 1px #c2dece, 0 0 4px white;
        color: white;
    }
    .accordion:active:before {
        top: 0;
        box-shadow: 0 3px 3px rgba(0, 0, 0, 0.7), 0 3px 9px rgba(0, 0, 0, 0.2);
    }

    .accordion:after {
        content: '\002B';
        font-weight: bold;
        float: right;
        margin-left: 5px;
    }
    
    .accordion:active{
        top: 6px;
        text-shadow: 0 -2px 0 #7fbb98, 0 1px 1px #c2dece, 0 0 4px white;
        color: white;
    }

    .active:after {
        content: "\2212";
    }

    .panel {
        padding: 0 18px;
        background-color: white;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.2s ease-out;
    }
    .tituloCampoInfantil h3{
        text-align: center;
        font-weight: bold;
        color: #49882C;
        font-size: 1em;
    }
    .contenidoCampoInfantil{
        width: 100%;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        flex-direction: column;
    }
    .mutimediaModalInfantil{
        width: 100%;
        display: flex;
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;
        justify-content: center;
        float: left;
    }
    .contenidoTextoModalInfantil{
        width: 100%;
        float: right;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;    
        justify-content: center;    
        padding-left: 10px;
    }
    .textosModalInfantil p{
        font-size: 0.7em;
    }
    
  
}
@media only screen and (min-width:768px) and (max-width:1068px){
    /* Modal Golf*/
modal-header{
    width: 100%;
}
.tituloModal{
    width: 100%;
    text-align: center;
}
.tituloModal h5{
    font-weight: bold;
    font-size: 2em;
    color: #6EA205;
}
.modal-body{
    width: 100%;
}
.contenidoModal{
    width: 100%;
}
.contenidoMapaModal{
    width: 100%;
    padding: 2%;
}
.mapaHoyo{
    width: 100%;
}
.mapaHoyo img{
    width: 100%;
}
.contenidoTextoModal{
    width: 100%;
    padding: 2%;
    display: flex;
    flex-direction: column;
}
.textosModal{
    width: 80%;
    margin: auto;
    padding-right: 2%;
}
.tablaModal{
    width: 80%;
    margin: auto;
    text-align: center;
    overflow-y: auto;
}
.tablaModal1{
    width: 80%;
    margin: auto;
    text-align: center;
    overflow: auto;
}
.mutimediaModal{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.videoModal{
    width: 70%;
    margin: auto;
    padding-top: 1%;
}
.sliderModal{
    width: 70%;
    margin: auto;
}
.imagenSli{
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    max-width: 100%;
    max-height: 100%;
}
    
/* Fin Modal Golf */
.rayaTitulo {
    width: 80%;
    margin: auto;
    text-align: center;
    border-top-style: solid;
    border-top-width: 1px;
    border-color: #FFF;
    opacity: 0.50;
}
/* fin modal*/
    
.cajonMapaCampoGolf{
    width: 90%;
    margin: auto;
    padding-top: 20px;
    padding-bottom: 30px;
}    
    
.tituloPaginaGolf{
    width: 100%;
    text-align: center; 
    padding-top: 5px;
}
.tituloPaginaGolf h1{
    font-weight: bold;
    font-size: 1.5em;
    color: #FFF;
}
.mapaHoyo{
    width: 100%;
    margin: auto;
}
    
.tituloPaginaGolf h2{
    font-weight: bold;
    font-size: 1.2em;
    color: #FFF;
}
    .image-map{
        width: 100%;
    }
    .image-map img{
        width: 100%;
    }
    .image-map {
        display: block;
        margin: 20px auto;
        position: relative;
        overflow: hidden;
    }
    .image-map__img {
        max-width: 100%;
    }
    .image-map__icons {
        height: 0px;
        overflow: visible;
        pointer-events: none;
        background: none !important;
        position: absolute;
        top: 0;
        left: 0;
    }
    .image-map__icons .icon {
        position: absolute;
        display: inline-block;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        box-sizing: border-box;
    }
    .contenedorCampoGolfInfantil{
        width: 80%;
        margin: auto;
        margin-bottom: 50px;
        display: flex;
        flex-direction: row;
        padding-top: 10px;
    }
    .campoGolfInfantil{
        width: 50%;
    }    
    .accordion {
        width: 50%;
        outline: none;
        transition: 0.4s;
        cursor: pointer;
        margin-left: 1%;
        margin-bottom: 0;
        text-shadow: 0 -2px 0 #4a8a65, 0 1px 1px #F9F9F9;
        box-sizing: border-box;
        font-size: 1.3em;
        font-family: Helvetica, Arial, Sans-Serif;
        text-decoration: none;
        font-weight: bold;
        color: #E7E7E7;
        height: 50px;
        line-height: 50px;
        padding: 0 32.5px;
        display: inline-block;
        background: linear-gradient(to bottom, #64C138 0%, #5EA73C 26%, #49882C 100%);
        border-radius: 5px;
        border-top: 1px solid #c8e2d3;
        border-bottom: 1px solid #c2dece;
        top: 0;
        transition: all 0.06s ease-out;
        position: relative; 
        
    }
    
    
    .accordion:visited{
        color: #5ea97d;
    }
    .active, .accordion:hover {
        background: linear-gradient(to bottom, #baf1d1 0%, #b7e4ca 26%, #96c7ab 100%);
        top: 6px;
        text-shadow: 0 -2px 0 #7fbb98, 0 1px 1px #c2dece, 0 0 4px white;
        color: white;
    }
    .accordion:active:before {
        top: 0;
        box-shadow: 0 3px 3px rgba(0, 0, 0, 0.7), 0 3px 9px rgba(0, 0, 0, 0.2);
    }

    .accordion:after {
        content: '\002B';
        font-weight: bold;
        float: right;
        margin-left: 5px;
    }
    
    .accordion:active{
        top: 6px;
        text-shadow: 0 -2px 0 #7fbb98, 0 1px 1px #c2dece, 0 0 4px white;
        color: white;
    }

    .active:after {
        content: "\2212";
    }

    .panel {
        padding: 0 18px;
        background-color: white;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.2s ease-out;
    }
    .tituloCampoInfantil h3{
        text-align: center;
        font-weight: bold;
        color: #49882C;
        font-size: 1em;
    }
    .contenidoCampoInfantil{
        width: 100%;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        flex-direction: column;
    }
    .mutimediaModalInfantil{
        width: 100%;
        display: flex;
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;
        justify-content: center;
        float: left;
    }
    .contenidoTextoModalInfantil{
        width: 100%;
        float: right;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;    
        justify-content: center;    
        padding-left: 10px;
    }
    .textosModalInfantil p{
        font-size: 0.7em;
    }
    
    
    
}
@media (min-width:1069px){
/* Modal Golf*/
modal-header{
    width: 100%;
}
.tituloModal{
    width: 100%;
    text-align: center;
}
.tituloModal h5{
    font-weight: bold;
    font-size: 2em;
    color: #6EA205;
}
.modal-body{
    width: 100%;
}
.contenidoModal{
    width: 100%;
}
.contenidoMapaModal{
    width: 100%;
    padding: 2%;
}
.mapaHoyo{
    width: 100%;
}
.mapaHoyo img{
    width: 100%;
}
.contenidoTextoModal{
    width: 100%;
    padding: 2%;
    display: flex;
    flex-direction: row;
}
.textosModal{
    width: 40%;
    padding-right: 2%;
}
.tablaModal{
    width: 60%;
    text-align: center;
}

.mutimediaModal{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.videoModal{
    width: 70%;
    margin: auto;
    padding-top: 1%;
}
.sliderModal{
    width: 70%;
    margin: auto;
}
.imagenSli{
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    max-width: 100%;
    max-height: 100%;
}
    
/* Fin Modal Golf */        
    .tituloPaginaGolf{
    width: 100%;
    text-align: center; 
    padding-top: 15px;
    }
    .tituloPaginaGolf h1{
        font-weight: bold;
        font-size: 2em;
        color: #FFF;
    }
    
    .tituloPaginaGolf h2{
        font-weight: bold;
        font-size: 1.2em;
        color: #FFF;
    }
    .cajonMapaCampoGolf{
        width: 50%;
        margin: auto;
        padding-top: 20px;
        padding-bottom: 30px;
    }
    .cajonMapaCampoGolf p{
        width: 100%;
        color: #FFF;
        text-align: center;
        font-size: 1em;
        -webkit-animation-name: tituloGolfCambio; /* Safari 4.0 - 8.0 */
        -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
        animation-name: tituloGolfCambio;
        animation-duration: 4s;
    }
    .cajonMapaCampoGolf p:hover{
        width: 100%;
        color: #F00;
        text-align: center;
        font-size: 1.2em;
        webkit-animation-name: tituloGolfCambio; /* Safari 4.0 - 8.0 */
        -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
        animation-name: tituloGolfCambio;
        animation-duration: 4s;
    }
    /* Safari 4.0 - 8.0 */
    @-webkit-keyframes tituloGolfCambio {
      0%   {color: #FFF;font-size: 1em;}
      50%  {color: #F00;font-size: 1.2em;}
      100% {color: #FFF;font-size: 1em;}
    }

    /* Standard syntax */
    @keyframes tituloGolfCambio {
      0%   {color: #FFF;font-size: 1em;}
      25%  {color: #F00;font-size: 1.2em;}
      100% {color: #FFF;font-size: 1em;}
    }
    .image-map{
        width: 100%;
    }
    .image-map img{
        width: 100%;
    }
    .image-map {
        display: block;
        margin: 20px auto;
        position: relative;
        overflow: hidden;
    }
    .image-map__img {
        max-width: 100%;
        
    }
    .image-map__icons {
        height: 0px;
        overflow: visible;
        pointer-events: none;
        background: none !important;
        position: absolute;
        top: 0;
        left: 0;
        
    }
    .image-map__icons .icon {
        position: absolute;
        display: inline-block;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        box-sizing: border-box;
    }
    
    /* Campo de gol Infantil */
    .contenedorCampoGolfInfantil{
        width: 80%;
        margin: auto;
        margin-bottom: 50px;
        display: flex;
        flex-direction: row;
        padding-top: 10px;
    }
    .campoGolfInfantil{
        width: 50%;
    }    
    .accordion {
        width: 50%;
        outline: none;
        transition: 0.4s;
        cursor: pointer;
        margin-left: 1%;
        margin-bottom: 0;
        text-shadow: 0 -2px 0 #4a8a65, 0 1px 1px #F9F9F9;
        box-sizing: border-box;
        font-size: 1.3em;
        font-family: Helvetica, Arial, Sans-Serif;
        text-decoration: none;
        font-weight: bold;
        color: #E7E7E7;
        height: 50px;
        line-height: 50px;
        padding: 0 32.5px;
        display: inline-block;
        background: linear-gradient(to bottom, #64C138 0%, #5EA73C 26%, #49882C 100%);
        border-radius: 5px;
        border-top: 1px solid #c8e2d3;
        border-bottom: 1px solid #c2dece;
        top: 0;
        transition: all 0.06s ease-out;
        position: relative; 
        
    }
    
    
    .accordion:visited{
        color: #5ea97d;
    }
    .active, .accordion:hover {
        background: linear-gradient(to bottom, #baf1d1 0%, #b7e4ca 26%, #96c7ab 100%);
        top: 6px;
        text-shadow: 0 -2px 0 #7fbb98, 0 1px 1px #c2dece, 0 0 4px white;
        color: white;
    }
    .accordion:active:before {
        top: 0;
        box-shadow: 0 3px 3px rgba(0, 0, 0, 0.7), 0 3px 9px rgba(0, 0, 0, 0.2);
    }

    .accordion:after {
        content: '\002B';
        font-weight: bold;
        float: right;
        margin-left: 5px;
    }
    
    .accordion:active{
        top: 6px;
        text-shadow: 0 -2px 0 #7fbb98, 0 1px 1px #c2dece, 0 0 4px white;
        color: white;
    }

    .active:after {
        content: "\2212";
    }

    .panel {
        padding: 0 18px;
        background-color: #F9F9F9;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.2s ease-out;
    }
    .tituloCampoInfantil h3{
        text-align: center;
        font-weight: bold;
        color: #49882C;
        font-size: 1em;
    }
    .contenidoCampoInfantil{
        width: 100%;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        flex-direction: column;
    }
    .mutimediaModalInfantil{
        width: 95%;
        margin: auto;
    }
    .contenidoTextoModalInfantil{
        width: 90%;
        margin: auto;
    }
    .tituloCampoInfantil{
        width: 100%;
        text-align: center;
    }
    .tablaModal1{
        width: 100%;
        overflow-x: auto;
    }
    
    
    
}