﻿/*@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Space+Grotesk:wght@300..700&display=swap');*/
@font-face {
    font-family: Blogger;
    font-weight: normal;
    src: url("/files/assets/fonts/Blogger_Sans.otf") format("opentype");
}
@font-face {
    font-family: Blogger;
    font-weight: normal;
    font-style:italic;
    src: url("/files/assets/fonts/Blogger_Sans-Italic.otf") format("opentype");
}
@font-face {
    font-family: Blogger;
    font-weight: lighter;
    font-style: italic;
    src: url("/files/assets/fonts/Blogger_Sans-Light_Italic.otf") format("opentype");
}
@font-face {
    font-family: Blogger;
    font-weight: bolder;
    src: url("/files/assets/fonts/Blogger_Sans-Bold.otf") format("opentype");
}
@font-face {
    font-family: Blogger;
    font-weight: bolder;
    font-style:italic;
    src: url("/files/assets/fonts/Blogger_Sans-Bold_Italic.otf") format("opentype");
}
@font-face {
    font-family: Blogger;
    font-weight: lighter;
    src: url("/files/assets/fonts/Blogger_Sans-Light.otf") format("opentype");
}
@font-face {
    font-family: Blogger;
    font-weight: bold;
    src: url("/files/assets/fonts/Blogger_Sans-Medium.otf") format("opentype");
}
:root {
    --main-bg-color: white;
    --primary-color: #00587C;
    --secondary-color: #006BA6;
    --third-color: #64B4E6;
    --accent-color: #FFCC00;
}
body {
    font-family: Blogger, Calibri;
    /*background-color: var(--main-bg-color) !important;*/
    background-color: var(--secondary-color) !important;
    background-image: unset;
}
.link {
    text-decoration:underline;
}
h1, h2, h3, h4, h5, h6, .title, .titulo, .head{
    font-family: Blogger, sans-serif;
}
div#main{
    max-width:1440px;
    margin:0 auto;
}
div.page-wrapper{
    max-width:1180px;
    margin:0px auto;
}
.card-block p > a{
    text-decoration:underline;
}
.page-header {
    min-height: 150px;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    background-color: var(--primary-color);
    background-image: url('/files/assets/images/logos/curve-top.png');
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: contain;
}
    .page-header .logo-zone {
        padding: 0px 20px;
        align-self: flex-start;
    }
    .page-header .menu-zone {
        align-self:flex-start;
    }
    .logo{
        max-width:200px;
    }
.page-header .curve {
    flex-basis:100%;
    background-color: var(--primary-color);
    background-image: url('/files/assets/images/logos/curve-top.png');
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size:contain;
    min-height: 100px;
    width:100%;
}
.page-body {
    font-family: Blogger, Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: normal;
    background-color: var(--main-bg-color);
}
.page-footer {
    min-height: 250px;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    background-color: var(--primary-color);
    background-image: url('/files/assets/images/logos/curve-bottom.png');
    background-repeat: no-repeat;
    background-position: top left;
    background-size: cover;
}
    .page-footer div {
        padding: 30px;
        align-self: end;
    }
    .page-footer .menu-zone ul {
    }
        .page-footer .menu-zone ul li {
            display: inline;
            margin:0px 10px;
        }
    .page-footer .menu-zone a {
        color: white;
    }
    .page-footer .disclaimer-zone ul li {
        display:inline;
        list-style-type:none;
    }

.menu-social li{
    margin:0px 10px;
}
    .menu-social li a {
        color: #fff;
        font-size: 24px;
        transition: transform .2s; /* Animation */
    }
.menu-social {
    transition: transform .2s; /* Animation */
}
    .menu-social:hover {
        transform: scale(1.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
    }
/* Elementos UI personalizados */
.validation, .validator{
    font-size:10px;
    color:red;
}
#alertzone{
    position:fixed;
    width:98%;
    bottom:0px;
    margin:1%;
    z-index:10000;
}
.close{
    border:none;
    background:transparent;
}
.disclaimer{
    border:solid 1px #ccc;
    padding:5px;
    font-size:12px;
    line-height:14px;
    color:#999;
    text-align:justify;
}
/* SLIDER HOME */

.slider{
    padding:40px;
}
.carousel-item{
    background-color:#000;
    cursor:default;
}
    .carousel-item img {
        opacity:1;
        transition: opacity 0.5s ease; /* Transición de 0.5 segundos */
    }
    .carousel-item:hover img{
        opacity: 0.3;
    }

/* Para las clases que solo van en desktop */
@media only screen and (min-width: 601px) {
    .mobile {
        display: none !important
    }
    .login-block{
        margin:0px 25%;
    }
}