@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Satisfy&display=swap');

body
{
    padding: 0;
    margin: 0;
    height: 100%;
    font-family: "Open Sans", sans-serif;
}
.divClear
{
    clear: both;
}
#divAlerta
{
    display: flex;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    position: fixed;
    top: 0;
    left: 0;
    align-items: center;
    z-index: 999;
}
.g-recaptcha div
{
	margin: 15px auto;
}

@media screen and (max-width: 800px)
{
    #divAlerta div.divBox
    {
        width: 40%;
        margin: 0 auto;
        background: #ffffff;
        border-radius: 5px;
        padding: 20px;
        box-sizing: border-box;
        font-size: 0.9em;
        text-align: center;
    }
    #divAlerta div.divBox button
    {
        width: 30%;
        margin: 50px 0 0 0;
        padding: 15px;
        background: #7144db;
        color: #ffffff;
        border: none;
        cursor: pointer;
    }
    header
    {
        margin: 0;
        padding: 10px 0;
        text-align: center;
    }
    header h1
    {
        font-family: "Satisfy", cursive;
        font-size: 2em;
        font-weight: 400;
        color: #f9838c;
        margin: 0 0 15px 0;
        padding: 0;
    }
    header h2
    {
        font-size: 1em;
        font-weight: 400;
        color: #212529;
        margin: 0;
        padding: 0;
    }
    nav.navPC
    {
        display: none;
    }
    nav
    {
        margin: 0;
        padding: 8px 0;
        background: #343a40;
    }
    nav div.divBoton
    {
        width: 30px;
        margin: 0 auto;
        padding: 0;
    }
    nav div.divBoton div
    {
        height: 4px;
        margin: 7px 0;
        background: #ffffff;
    }
    nav ul.navHide
	{
 		position: fixed;
 		top: 0;
 		left: -150%;
	}
	nav ul.navShow
	{
 		position: fixed;
 		top: 0;
 		left: 0;
	}
	nav div.divHide
	{
 		position: fixed;
 		top: 0;
 		right: -150%;
	}
	nav div.divShow
	{
 		position: fixed;
 		top: 0;
 		right: 0;
	}
	nav ul#ulMenu
	{
 		width: 80%;
 		height: 100%;
 		margin: 0;
 		padding: 0;
 		list-style: none;
 		background: #e6e6f0;
 		transition: all linear 0.5s;
 		z-index: 105;
 		overflow: auto;
	}
	nav ul#ulMenu li
	{
 		margin: 0;
 		padding: 0;
 		position: relative;
	}
	nav ul#ulMenu li a
	{
 		display: block;
 		font-size: 0.9em;
 		font-weight: 400;
 		color: #343a40;
 		text-decoration: none;
 		margin: 0 15px;
 		padding: 15px 25px;
 		border-bottom: 1px #343a40 solid;
	}
	nav div#divCerrar
	{
 		width: 20%;
 		height: 100%;
 		margin: 0;
 		padding: 0;
 		list-style: none;
 		background: rgba(0,0,0,0.7);
 		font-size: 3em;
 		color: #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
 		transition: all linear 0.5s;
 		z-index: 101;
	}
    .sectionBanner
    {
        width: 80%;
        margin: 15px auto;
    }
    .sectionBanner img
    {
        width: 100%;
    }
    .sectionNoticias
    {
        width: 80%;
        margin: 0 auto;
        padding: 50px 0;
        box-sizing: border-box;
    }
    .sectionNoticias div.divBox
    {
        margin: 0 0 50px 0;
        padding: 0;
    }
    .sectionNoticias div.divBox h3
    {
        margin: 0 0 10px 0;
        padding: 5px 0;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
        text-transform: uppercase;
        transition: all ease-out 0.5s;
        border-bottom: 1px transparent solid;
    }
    .sectionNoticias div.divBox h3 a
    {
        color: #343a40;
        text-decoration: none;
    }
    .sectionNoticias div.divBox h3:hover
    {
        border-bottom: 1px #343a40 solid;
    }
    .sectionNoticias div.divBox h4
    {
        margin: 0 0 20px 0;
        padding: 0;
        font-size: 0.8em;
        font-weight: 400;
        text-align: center;
        color: #999999;
    }
    .sectionNoticias div.divBox h4 i
    {
        margin-right: 10px;
    }
    .sectionNoticias div.divBox img
    {
        width: 100%;
    }
    .sectionNoticias div.divBox p
    {
        margin: 25px 0;
        padding: 0;
        font-size: 1em;
        color: #343a40;
    }
    .sectionNoticias div.divBox a.aBoton
    {
        margin: 0;
        padding: 10px;
        background: #999999;
        color: #ffffff;
        font-size: 1em;
        text-decoration: none;
    }
    .sectionNoticias div.divBox a.aBoton i
    {
        margin-left: 10px;
    }
    .sectionNoticias div.divBox a.aBoton:hover
    {
        background: #343a40;
    }
    .sectionContent
    {
        width: 90%;
        margin: 0 auto;
        padding: 50px 0;
    }
    .sectionContent h1
    {
        margin: 0 0 10px 0;
        padding: 5px 0;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
        text-transform: uppercase;
    }
    .sectionContent h2
    {
        margin: 0 0 20px 0;
        padding: 0;
        font-size: 0.8em;
        font-weight: 400;
        text-align: center;
        color: #999999;
    }
    .sectionNoticias div.divBox h4 i
    {
        margin-right: 10px;
    }
    .sectionContent div.divSlide
    {
        width: 70%;
        margin: 0 auto 25px auto;
    }
    .sectionContent div.divCompartir
    {
        margin: 25px 0 0 0;
        padding: 10px 0;
        text-align: center;
        border-top: 1px #343a40 solid;
        border-bottom: 1px #343a40 solid;
    }
    .sectionContent div.divCompartir a
    {
        color: #999999;
        text-decoration: none;
        margin: 0 15px;
        font-size: 1em;
    }
    footer
    {
        margin: 0;
        padding: 50px;
        background: #343a40;
        color: #ffffff;
        font-size: 0.9em;
        text-align: center;
    }
    footer a
    {
        color: #ffffff;
    }
}

@media screen and (min-width: 800px)
{
    #divAlerta div.divBox
    {
        width: 40%;
        margin: 0 auto;
        background: #ffffff;
        border-radius: 5px;
        padding: 20px;
        box-sizing: border-box;
        font-size: 0.9em;
        text-align: center;
    }
    #divAlerta div.divBox button
    {
        width: 30%;
        margin: 50px 0 0 0;
        padding: 15px;
        background: #7144db;
        color: #ffffff;
        border: none;
        cursor: pointer;
    }
    header
    {
        margin: 0;
        padding: 20px 0;
        text-align: center;
    }
    header h1
    {
        font-family: "Satisfy", cursive;
        font-size: 2.5em;
        font-weight: 400;
        color: #f9838c;
        margin: 0 0 15px 0;
        padding: 0;
    }
    header h2
    {
        font-size: 1em;
        font-weight: 400;
        color: #212529;
        margin: 0;
        padding: 0;
    }
    nav.navMovil
    {
        display: none;
    }
    nav
    {
        margin: 0;
        padding: 0 5%;
        background: #343a40;
        font-size: 1em;
    }
    nav ul
    {
        margin: 0;
        padding: 0;
        list-style: none;
    }
    nav ul li
    {
        margin: 0;
        padding: 0;
        float: left;
    }
    nav ul li a
    {
        display: block;
        margin: 0;
        padding: 10px 15px;
        color: #ffffff;
        text-decoration: none;
        text-transform: uppercase;
    }
    .sectionBanner
    {
        width: 60%;
        margin: 15px auto;
    }
    .sectionBanner img
    {
        width: 100%;
    }
    .sectionNoticias
    {
        width: 80%;
        margin: 0 auto;
        padding: 50px 0;
        box-sizing: border-box;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .sectionNoticias div.divBox
    {
        width: 45%;
        margin: 0 0 50px 0;
        padding: 0;
    }
    .sectionNoticias div.divBox h3
    {
        margin: 0 0 10px 0;
        padding: 5px 0;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
        text-transform: uppercase;
        transition: all ease-out 0.5s;
        border-bottom: 1px transparent solid;
    }
    .sectionNoticias div.divBox h3 a
    {
        color: #343a40;
        text-decoration: none;
    }
    .sectionNoticias div.divBox h3:hover
    {
        border-bottom: 1px #343a40 solid;
    }
    .sectionNoticias div.divBox h4
    {
        margin: 0 0 20px 0;
        padding: 0;
        font-size: 0.8em;
        font-weight: 400;
        text-align: center;
        color: #999999;
    }
    .sectionNoticias div.divBox h4 i
    {
        margin-right: 10px;
    }
    .sectionNoticias div.divBox img
    {
        width: 100%;
    }
    .sectionNoticias div.divBox p
    {
        margin: 25px 0;
        padding: 0;
        font-size: 1em;
        color: #343a40;
    }
    .sectionNoticias div.divBox a.aBoton
    {
        margin: 0;
        padding: 10px;
        background: #999999;
        color: #ffffff;
        font-size: 1em;
        text-decoration: none;
    }
    .sectionNoticias div.divBox a.aBoton i
    {
        margin-left: 10px;
    }
    .sectionNoticias div.divBox a.aBoton:hover
    {
        background: #343a40;
    }
    .sectionContent
    {
        width: 70%;
        margin: 0 auto;
        padding: 50px 0;
    }
    .sectionContent h1
    {
        margin: 0 0 10px 0;
        padding: 5px 0;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
        text-transform: uppercase;
    }
    .sectionContent h2
    {
        margin: 0 0 20px 0;
        padding: 0;
        font-size: 0.8em;
        font-weight: 400;
        text-align: center;
        color: #999999;
    }
    .sectionNoticias div.divBox h4 i
    {
        margin-right: 10px;
    }
    .sectionContent div.divSlide
    {
        width: 60%;
        margin: 0 auto 25px auto;
    }
    .sectionContent div.divCompartir
    {
        margin: 25px 0 0 0;
        padding: 10px 0;
        text-align: center;
        border-top: 1px #343a40 solid;
        border-bottom: 1px #343a40 solid;
    }
    .sectionContent div.divCompartir a
    {
        color: #999999;
        text-decoration: none;
        margin: 0 15px;
        font-size: 1em;
    }
    footer
    {
        margin: 0;
        padding: 50px;
        background: #343a40;
        color: #ffffff;
        font-size: 0.9em;
        text-align: center;
    }
    footer a
    {
        color: #ffffff;
    }
}