html{
    scroll-behavior: smooth;
}

.myBody{
    margin: 0px;
    overflow-x: hidden;
    font-family: Raleway;
    background-color: #f6f6f6;
}

.header{
    background-color: #3d3d3d;
    height: 40px;
    width: 100%;
    z-index: 5;
    position: fixed;
    padding: 10px;
}

img{
    user-select: none;
    -webkit-user-drag: none;
}

/*---Navigation---*/
.topnav {
    overflow: hidden;
    background-color: #3d3d3d;
    box-shadow: 0px -1px 15px black;
    position: fixed;
    width: 100%;
    z-index: 5;
    text-align: center;
}

.topnav a {
    display: inline-block;
    color: #f2f2f2;
    text-align: center;
    padding: 10px 16px;
    text-decoration: none;
    font-size: 15px;
    margin: 7px 10px 0 10px;
}



.topnav a:hover {
  /*background-color: #ddd;
  color: black;
    border-bottom: 2px solid white;*/
    text-decoration: underline;
}

.topnav a.active {
  border-bottom: 2px solid white;
  color: white;
}

.topnav .icon {
  display: none;
}

/* ++++++++++  DROPDOWN  ++++++++++ */
.dropdown {
  position: relative;
  display: inline-block;
}
/* ++++++++++  DROPDOWN FIM  ++++++++++ */




/* ++++++++++  FLIP BACK TO TOP  ++++++++++ */
.backToTop-container
{
    cursor: pointer; 
    position: fixed; 
    top: 85%; 
    right: 1.7%; 
    z-index: 6; 
    filter: drop-shadow(0px 2px 6px #5E5E5E);
}

.flip-container 
{
    perspective: 1000px;
}

.flip-container:hover .flipper, .flip-container.hover .flipper 
{
    transform: rotateY(180deg);
}

.flip-container, .front, .back 
{
    width: 70px;
    height: 70px;
}

.flipper /* flip speed goes here */
{
    transition: 0.6s;
    transform-style: preserve-3d;

    position: relative;
}

.front, .back /* hide back of pane during swap */
{
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
}

.front /* front pane, placed above back */
{
    z-index: 2;
    transform: rotateY(0deg);
}

.back /* back, initially hidden pane */
{
    transform: rotateY(180deg);
}
.vertical.flip-container 
{
    position: relative;
}

.vertical .back 
{
    transform: rotateX(180deg);
}

.vertical.flip-container .flipper 
{
    transform-origin: 100% 35px; /* half of height */
}

.vertical.flip-container:hover .flipper 
{
    transform: rotateX(-180deg);
}
/* ++++++++++  FLIP BACK TO TOP  ++++++++++ */





/* ------------------------------------------------ ECRA MOBILE ------------------------------------------------ */
@media screen and (max-width: 500px) {
    
    html{
        overflow-x: hidden;
    }
    
    body{
        position: relative;
    }
    
    .award{
        position: relative;
        right: -75%;
        text-align: right;
        top: 80%;
        width: 20%;
    }
    
    .noHover a {
        display: none;
    }
    
    .topnav a:not(:first-child) {
        display: none;
    }
    
    .topnav div:not(:first-child) {
        display: none;
    }
    
    .topnav a.icon {
        float: right;
        display: block;
    }
    
    /*.topnav.responsive {
        position: relative;
    }*/
    .topnav.responsive .icon {
        position: absolute;
        right: 0;
        top: 0;
    }
    
    .topnav.responsive a {
        float: none;
        display: block;
        text-align: left;
    }
    
    .topnav.responsive div {
        display: block;
        
    }
    
    .imageBadge{
        width: 30%;
        margin-bottom: 2%;
    }  
    
    h1.logo{
        font-size: 6vw;
        font-weight: 100;
    }
    
    h1{
        font-family: Raleway;
        font-size: 5vw;
        color: #063796;
        margin-bottom: 0px;
        margin-top: 15%;
    }
    
    h2{
        font-size: 3vw;
        color: #063796;
        margin-bottom: 15%;
        margin-top: 15%;
    }
    
    .badgeTexto{
        margin: 0;
        position: relative;
        top: 50%;
        -ms-transform: translateY(-50%);
        transform: translateY(0%) translateX(23%);
        display: flex;
    }
    
    .banner{
        background-repeat: no-repeat;
        background-size: cover;
        background-position-y: center;
        background-position-x: center; 
        height: 350px; 
    }
    
    
    .rgpdLogoIcon{
        width: 10%;
        display: inline-block;
        vertical-align: sub;
        margin-top: 1.5%;
        margin-left: 20%;
    }
    
    .arrow-left-text{
        padding-left: 45%;
        width: 200%;
        background-color: #e6ecf3;
        height: 200px;
        display: inline-block;
    }
    
    .arrow-right {
        /*width: 250%;*/
        height: 200px;
        background-image: url(Sep.svg);
        background-repeat: no-repeat;
        background-size: cover;
        /*border-top: 6px solid darkblue;
        border-left: 6px solid darkblue;*/                
    }
    
    .arrow-left {
        height: 200px;
        width: 120%;
        /*left: -230px;*/ left: -65%;
        background-image: url(SepL.svg);
        background-repeat: no-repeat;
        background-size: cover;
        position: absolute;
        z-index: 3;
    }
    
    .arrow-right-container{
        height: 215px;
        width: 50%;
        position: absolute;
        right: 0px;
    }
    
    .vertical-center {
        margin: 0;
        position: absolute;
        top: 50%;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        padding-right: 5%;
    }
    
    .mobileTextPad{
        padding-right: 41%;
    }
    
    
    .funcIcon{
        width: 33%; 
        /*right: 75px;*/right: 16%;
        top: 20%;
        position: absolute;
        text-align: center;
    }
    
    .mobileIconRight{
        right: -6%;
        width: 70%;
    }
    
    .arrow-right-text{
        padding-left: 10%;
        padding-right: 15%;
        margin-bottom: 15px;
        background-color: #e6ecf3;
        height: 200px;
        width: 100%;
        display: inline-block
    }
    
    .meuFooter{
        height: 150px;
        width: 100%;
        background: #112c61;
        color: white;
        display: inline-block;
    }
    
    .box{
        width: 100%; 
        position: relative;
        padding: 0px;
        margin: 10% 0 10% 0;
    }
    
    ul{
        color: #063796;
        font-size: 3vw;
        padding-left: 15%;
        padding-right: 10%;
    }
    
    .funcIconBtn h4{
        font-size: 2.5vw;
    }
    
    .funcIconBtn img{
        display: inline-block;
        width: 40%;
    }
    
    .funcIconBtn{
        width:  35%;
        display: inline-block;
        background-color: #063796;
        border: 0px;
        border-radius: 20px;
        margin: 0.2%;
        padding: 10px;
        text-decoration: none;
    }
    
    .contactos{
        display: inline-block;
        width: 30%;
        text-align: left;
        vertical-align: middle;
    }
    
	.contactos.mobileLogo
    {
        margin-left: 5%; 
    }
    
    .contactos.mobileTexto{
        margin-left: 15%;
    }
    
    .contactosContainer{    
        text-align: left; 
        margin-top: 10%;
        margin-bottom: 10%;
        width: 140%;
        padding-left: 10%
    }
	
	.contactosContainer > div > p{
        font-size: 1.8vw;
        color: white;
    }
    
    .contactItems{
        display: inline-block;
        vertical-align: middle;
        text-align: left;
        margin: 1% 2.5% 1% 2.5%;
    }

    .contactItems p{
        margin: 0;
        color: white;
        font-size: 2.1vw;
    }
    
    .contactHeader{
        color: white;
        margin: 7% 0 0 0;
        font-size: 3.5vw;
        padding: 0 2%;
    }
    
    p{
        color: #063796;
        font-size: 3.5vw;
    }
    
    .mobile{
        display: none;
    }
    
    .mapFoto{
        display: none;
    }
}
/* ------------------------------------------------ FIM ECRA MOBILE ------------------------------------------------ */


/* ------------------------------------------------ ECRA PEQUENO ------------------------------------------------ */

@media screen and (max-width: 700px) and (min-width: 501px) {
    
    .award{
        position: absolute;
        right: 2%;
        text-align: right;
        top: 12%;
        width: 10%;
    }
    
    .noHover a {
        display: none;
    }
    
    .topnav a:not(:first-child) {
        display: none;
    }
    
    .topnav div:not(:first-child) {
        display: none;
    }
    
    .topnav a.icon {
        float: right;
        display: block;
    }
    
    /*.topnav.responsive {
        position: relative;
    }*/
    .topnav.responsive .icon {
        position: absolute;
        right: 0;
        top: 0;
    }
    
    .topnav.responsive a {
        float: none;
        display: block;
        text-align: left;
    }
    
    .topnav.responsive div {
        display: block;
        
    }
    
    .imageBadge{
        width: 30%;
        margin-bottom: 2%;
    }  
    
    h1.logo{
        font-size: 6vw;
        font-weight: 100;
    }
    
    h1{
        font-family: Raleway;
        font-size: 3vw;
        color: #063796;
        margin-bottom: 0px;
        margin-top: 0px;
    }
    
    h2{
        font-size: 2vw;
        color: #063796;
        margin-bottom: 0px;
        margin-top: 0px;
    }
    
    .badgeTexto{
        margin: 0;
        position: relative;
        top: 50%;
        -ms-transform: translateY(-50%);
        transform: translateY(0%) translateX(23%);
        display: flex;
    }
    
    .banner{
        background-repeat: no-repeat;
        background-size: cover;
        background-position-y: 35%;
        background-position-x: center; 
        height: 560px; 
    }
    
    .rgpdLogoIcon{
        width: 6%;
        display: inline-block;
        vertical-align: sub;
        margin-top: 0.5%;
        margin-left: 15%;
    }
    
    .arrow-left-text{
        padding-left: 30%;
        width: 200%;
        background-color: #e6ecf3;
        height: 200px;
        display: inline-block
    }
    
    .arrow-right {
        width: 50%;
        height: 200px;
        transform: skew(30deg) translateX(-50%);
        box-shadow: -5px -3px 10px #8a919e;
        background: #2d66d4;
        border-radius: 5px;
        position: absolute;
        z-index: 3;
        /*border-top: 6px solid darkblue;
        border-left: 6px solid darkblue;*/       
    }
    
    .arrow-left {
        width: 50%;
        height: 200px;
        transform: skew(30deg) translateX(-36.5%);
        background: #2d66d4;
        /*border-right: 6px solid darkblue;
        border-top: 6px solid darkblue;*/
        box-shadow: 5px -3px 10px #8a919e;
        border-radius: 5px;
        position: absolute;
        z-index: 3;
    }
    
    .vertical-center {
        margin: 0;
        position: absolute;
        top: 50%;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        padding-right: 5%;
    }
    
    .funcIcon{
        width: 30%; 
        transform: skewX(-30deg);
        right: 15%;
        top: 25%;
        position: absolute;
        text-align: center;
    }
    
    .arrow-right-text{
        padding-left: 10%;
        padding-right: 15%;
        background-color: #e6ecf3;
        height: 200px;
        width: 100%;
        display: inline-block;
        margin-bottom: 15px;
    }
    
    .meuFooter{
        height: 150px;
        width: 100%;
        background: #112c61;
        color: white;
        display: inline-block;
    }
    
    .box{
        width: 100%; 
        position: relative;
        padding: 0px;
        margin: 5% 0 5% 0;
    }
    
    ul{
        color: #063796;
        font-size: 1.7vw;
        padding-left: 15%;
        padding-right: 5%;
    }
    
    .funcIconBtn h4{
        font-size: 1vw;
    }
    
    .funcIconBtn img{
        display: inline-block;
        width: 45%;
    }
    
    .funcIconBtn{
        width:  20%;
        display: inline-block;
        background-color: #063796;
        border: 0px;
        border-radius: 20px;
        margin: 0.2%;
        padding: 10px;
        text-decoration: none;
    }
    
    .contactos{
        display: inline-block;
        width: 100%;
        text-align: center;
        margin-left: 0%;
    }
    
    .localizacao{
        display:  block;
        width: 85%;
        text-align: center;
        margin-left: 2.5%;
    }
    
    .contactosContainer{    
        text-align: left; 
        margin-top: 10%;
        margin-bottom: 10%;
        width: 100%;
        padding-left: 25%
    }
	
	.contactItems{
        display: inline-block;
        vertical-align: middle;
        text-align: left;
        margin: 1% 2.5% 1% 2.5%;
    }

    .contactItems p{
        margin: 0;
        color: white;
        font-size: 1.1vw;
    }
    
    .contactHeader{
        color: white;
        margin: 7% 0 0 0;
        font-size: 1.8vw;
        padding: 0 2%;
    }
	
	.contactosContainer > div > p{
        font-size: 1.8vw;
        color: white;
    }
    
    p{
        color: #063796;
    }
    
    .mobileIconRight{
        right: 55%;
    }
    
    .smallTextPad{
        padding-right: 25%;
    }
    
    .mapFoto{
        display: none;
    }
    
}
/* ------------------------------------------------ FIM ECRA PEQUENO ------------------------------------------------ */


/* ------------------------------------------------ ECRA NORMAL ------------------------------------------------ */
@media screen and (max-width: 1290px) and (min-width: 701px){
    
    .award{
        position: absolute;
        right: 2%;
        text-align: right;
        top: 12%;
        width: 10%;
    }
    
    .dropdown-content {
        display: none;
        position: absolute;
        background-color: #063796;
        transform: translateX(-20px);
        width: 100px;
        z-index: 1;
    }
    .dropdown-content a {
        color: white;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }

    .dropdown-content a:hover {background-color: #2d66d4}

    .dropdown:hover .dropdown-content {
        display: inline-block;
    }
    
    .banner{
        background-repeat: no-repeat;
        background-size: cover;
        background-position-y: 35%;
        background-position-x: center;
        height: 625px; 
    }
    
    .imageBadge{
        width: 20%;
        margin-bottom: 2%;
    }
    
    .badgeTexto{
        margin: 0;
        position: relative;
        display: flex;
        top: 50%;
        -ms-transform: translateY(-30%);
        transform: translateY(-30%) translateX(35%);
    }
    
    .logo h1{
        font-size: 6vw;
    }
    
    .rgpdLogoIcon{
        width: 3%;
        display: inline-block;
        vertical-align: sub;
    }
    
    .noHover{
        pointer-events: none;
    }
    
    h1.logo{
        font-size: 4vw;
        font-weight: 100;
    }
    
    h1{
        font-family: Raleway;
        font-size: 3vw;
        color: #063796;
        margin-bottom: 0px;
        margin-top: 0px;
    }
    
    h2{
        font-size: 1.3vw;
        color: #063796;
        margin-bottom: 0px;
        margin-top: 0px;
    }
    
    .arrow-left-text{
        padding-left: 25%;
        background-color: #e6ecf3;
        height: 200px;
        width: 90%;
        display: inline-block
    }
    
    .funcIcon{
        width: 25%; 
        transform: skewX(-30deg);
        right: 25%;
        top: 20%;
        position: absolute;
        text-align: center;
    }
    
    .arrow-right {
        width: 40%;
        height: 200px;
        transform: skew(30deg) translateX(-20%);
        box-shadow: -5px -3px 10px #8a919e;
        background: #2d66d4;
        border-radius: 5px;
        position: absolute;
        z-index: 3;
        /*border-top: 6px solid darkblue;
        border-left: 6px solid darkblue;*/       
    }
    
    .arrow-left {
        width: 40%;
        height: 200px;
        transform: skew(30deg) translateX(-36.5%);
        background: #2d66d4;
        /*border-right: 6px solid darkblue;
        border-top: 6px solid darkblue;*/
        box-shadow: 5px -3px 10px #8a919e;
        border-radius: 5px;
        position: absolute;
        z-index: 3;
    }
    
    .arrow-right-text{
        padding-left: 10%;
        padding-right: 15%;
        background-color: #e6ecf3;
        height: 200px;
        width: 80%;
        display: inline-block
    }
    
    .vertical-center {
        margin: 0;
        position: absolute;
        top: 50%;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        padding-right: 15%;
    }
    
    .meuFooter{
        height: 200px;
        background: #112c61;
        color: white;
        display: flex;
    }
    
    .box{
        width: 100%; 
        position: relative;
        padding: 0px;
        margin: 5% 0 5% 0;
    }
    
    ul{
        color: #063796;
        font-size: 1.2vw;
        padding-left: 22%;
    }
    
    .funcIconBtn h4{
        font-size: 1vw;
    }
    
    .funcIconBtn img{
        display: inline-block;
        width: 30%;
    }
    
    .funcIconBtn{
        width:  15%;
        display: inline-block;
        background-color: #063796;
        border: 0px;
        border-radius: 20px;
        margin: 0.2%;
        padding: 10px;
        text-decoration: none;
    }
    
    .contactos{
        display: inline-block;
        width: 25%;
        text-align: left;
        margin-left: 10%;
    }
    
    .localizacao{
        display: inline-block;
        width: 45%;
        text-align: center;
        margin-left: 2.5%;
    }
    
    .contactosContainer{    
        text-align: left; 
        margin-top: 5%;
        width: 100%;
    }
    
    p{
        color: #063796;
    }
    
    .mobileIconRight{
        right: 45%;
    }
    
    .arrow-right-container{
        height: 215px;
        width: 30%;
        display: inline-block;
    }
    
    .mapFoto{
        background-image: url(duque.jpg);
        background-position: left;
        background-size: cover;
        background-position-x: -70px;
        width: 22%;
        height: 400px;
        position: absolute;
        z-index: 3;
        right: 5%;
        box-shadow: -2px 0px 8px black;
    }
	
	.contactItems{
        display: inline-block;
        vertical-align: middle;
        text-align: left;
        margin: 1.5% 2.5% 2% 2.5%;
    }

    .contactItems p{
        margin: 0;
        color: white;
        font-size: 1.1vw;
    }
    
    .contactHeader{
        color: white;
        margin: 7% 0 0 0;
        font-size: 1.8vw;
        padding: 0 2%;
    }
	
	.contactosContainer > div > p{
        font-size: 1vw;
        color: white;
    }
}

/* ------------------------------------------------ FIM ECRA NORMAL ------------------------------------------------ */

/* ------------------------------------------------ ECRA COMPRIDO ------------------------------------------------ */

/*Height a para ecrãs maiores de 1291px*/
@media all and (min-width: 1291px){
    .banner{
        background-repeat: no-repeat;
        background-size: cover;
        background-position-y: 35%;
        background-position-x: center;
        height: 990px; 
    }
    
    .award{
        position: absolute;
        right: 2%;
        text-align: right;
        top: 12%;
        width: 10%;
    }
    
    .rgpdLogoIcon{
        width: 3%;
        display: inline-block;
        vertical-align: sub;
    }
    
    .imageBadge{
        width: 20%;
        margin-bottom: 2%;
    }
    
    .badgeTexto{
        margin: 0;
        position: relative;
        display: flex;
        top: 50%;
        -ms-transform: translateY(-30%);
        transform: translateY(-30%) translateX(35%);
    }
    
    
    .dropdown-content {
        display: none;
        position: absolute;
        background-color: #063796;
        width: 100px;
        transform: translateX(-20px);
        z-index: 1;
    }

    .dropdown-content a {
      color: white;
      padding: 12px 16px;
      text-decoration: none;
      display: block;
    }

    .dropdown-content a:hover {background-color: #2d66d4}

    .dropdown:hover .dropdown-content {
      display: inline-block;
    }
    
    .noHover{
        pointer-events: none;
    }
    
    h1.logo{
        font-size: 4vw;
        font-weight: 100;
    }
    
    h1{
        font-family: Raleway;
        font-size: 3vw;
        color: #063796;
        margin-bottom: 0px;
        margin-top: 0px;
    }
    
    h2{
        font-size: 1.3vw;
        color: #063796;
        margin-bottom: 0px;
        margin-top: 0px;
    }
    
    .arrow-left-text{
        padding-left: 25%;
        background-color: #e6ecf3;
        height: 200px;
        width: 90%;
        display: inline-block
    }
    
    .arrow-right {
        /*width: 180%;*/width: 710px;
        height: 200px;
        transform: skew(30deg) translateX(-70%);
        box-shadow: -5px -3px 10px #8a919e;
        background: #2d66d4;
        border-radius: 5px;
        position: absolute;
        margin:0;
        z-index: 3;
        /*border-top: 6px solid darkblue;
        border-left: 6px solid darkblue;*/                
    }
    
    .arrow-left {
        width: 220%;
        height: 200px;
        transform: skew(30deg) translateX(-36.5%);
        background: #2d66d4;
        /*border-right: 6px solid darkblue;
        border-top: 6px solid darkblue;*/
        box-shadow: 5px -3px 10px #8a919e;
        border-radius: 5px;
        position: relative;
        margin:0;
        z-index: 3;
    }
    
    .funcIcon{
        width: 25%; 
        transform: skewX(-30deg);
        right: 25%;
        top: 20%;
        position: absolute;
        text-align: center;
    }
    
    .arrow-right-text{
        padding-left: 10%;
        padding-right: 15%;
        background-color: #e6ecf3;
        height: 200px;
        width: 80%;
        display: inline-block;
        margin-bottom: 15px;
    }
    
    .vertical-center {
        margin: 0;
        position: absolute;
        top: 50%;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        padding-right: 15%;
    }
    
    .meuFooter{
        height: 290px;
        background: #112c61;
        color: white;
        display: flex;
    }
    
    .box{
        width: 100%; 
        position: relative;
        padding: 0px;
        margin: 5% 0 5% 0;
    }
    
    ul{
        color: #063796;
        font-size: 1.2vw;
        padding-left: 22%;
    }
    
    .funcIconBtn h4{
        font-size: 1vw;
    }
    
    .funcIconBtn img{
        display: inline-block;
        width: 30%;
    }
    
    .funcIconBtn{
        width:  15%;
        display: inline-block;
        background-color: #063796;
        border: 0px;
        border-radius: 20px;
        margin: 0.2%;
        padding: 10px;
        text-decoration: none;
    }
    
    .contactos{
        display: inline-block;
        width: 25%;
        text-align: left;
        margin-left: 10%;
    }
    
    .localizacao{
        display: inline-block;
        width: 45%;
        text-align: center;
        margin-left: 2.5%;
    }
    
    .contactosContainer{    
        text-align: left; 
        margin-top: 5%;
        width: 100%;
        padding-left: 0%
    }
    
    p{
        color: #063796;
    }
    
    .mobileIconRight{
        right: 45%;
    }
    
    .mapFoto{
        background-image: url(duque.jpg);
        background-position: left;
        background-size: cover;
        width: 22%;
        height: 400px;
        position: absolute;
        z-index: 3;
        right: 5%;
        box-shadow: -2px 0px 8px black;
    }
	
	.contactItems{
        display: inline-block;
        vertical-align: middle;
        text-align: left;
        margin: 1% 2.5% 1% 2.5%;
    }

    .contactItems p{
        margin: 0;
        color: white;
        font-size: 1.1vw;
    }
    
    .contactHeader{
        color: white;
        margin: 7% 0 0 0;
        font-size: 1.8vw;
        padding: 0 2%;
    }
	
	.contactosContainer > div > p{
        font-size: 1vw;
        color: white;
    }

}

/* ------------------------------------------------ FIM ECRA COMPRIDO ------------------------------------------------ */



/* ------------------------------------- MEDIA QUERIES -------------------------------------*/


/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
  .modal-content {
    width: 70%;
  }
}

/* ------------------------------------- FIM MEDIA QUERIES -------------------------------------*/


/*.logo{
    height: inherit;
    margin-left: 40px;
    color: white;
    font-family: Roboto;
}

.logo{
    margin-left: 30px;
}*/

.badgePosition{
    top: 33%;
    position: relative;
    margin-left: 35%;
}





h4{
    color: white;
    margin: 0;
	/*padding: 0 5%;*/
}

h5{
    color: white
}



hr.RGPD{
    border-top: 2px solid #063796;
    width: 10%;
}

.balao{
    width: 30%;
    display: inline-block;
}


.iconImage{
    margin-bottom: 3%;
    width: 70%;
}

.mapouter{
    position:relative;
    text-align:right;
    height:80%;
    width:100%;
}

.gmap_canvas{
    overflow:hidden;
    background:none!important;
    height:80%;
    width:100%;
}


.contactHeader{
    color: white;
    margin: 3% 0 0 0;
}

.verMaisBotao{
    background-color: #063796;
    color: white;
    /*border: 2px solid white;*/
    border: 0;
    padding: 12px;
    border-radius: 50px;
}







.showMapFoto .mapFoto{
    opacity: 1;
    animation: fadein 0.6s;
    -moz-animation: fadein 0.6s; /* Firefox */
    -webkit-animation: fadein 0.6s; /* Safari and Chrome */
    -o-animation: fadein 0.6s; /* Opera */
}

@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}

.showMapFoto:hover .mapFoto{
    opacity: 0.1;
    animation: fadeout 0.6s;
    -moz-animation: fadeout 0.6s; /* Firefox */
    -webkit-animation: fadeout 0.6s; /* Safari and Chrome */
    -o-animation: fadeout 0.6s; /* Opera */
}

@keyframes fadeout {
    from {
        opacity:1;
    }
    to {
        opacity:0.1;
    }
}
@-moz-keyframes fadeout { /* Firefox */
    from {
        opacity:1;
    }
    to {
        opacity:0.1;
    }
}
@-webkit-keyframes fadeout { /* Safari and Chrome */
    from {
        opacity:1;
    }
    to {
        opacity:0.1;
    }
}
@-o-keyframes fadeout { /* Opera */
    from {
        opacity:1;
    }
    to {
        opacity:0.1;
    }
}

/*.arrow-right{
    background-color: #2d66d4;
}
.arrow-left{
    background-color: #2d66d4;
}*/



.listas{
    margin-bottom: 5px;
}




.funcIconBtn:hover{
    opacity: 0.8;
}