@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;600&display=swap');

html { background-color: white; margin-top: 1.5em}

body { 
    font-family: 'Rubik', sans-serif;
    font-weight: 400;
    line-height: 1.6em;
    color: #343434;
	overflow: hidden;
	
}

/* Elementos nativos */
p { padding-bottom: 10px; }
h1 { font-size: 2.5em; font-weight: 300!important; text-transform: uppercase; }
h2 { font-weight: 300!important; text-transform: uppercase; }
h3 { font-weight: 300!important; text-transform: uppercase; }
h4 { font-weight: 300!important; text-transform: uppercase; }
h5 { font-weight: 300!important; text-transform: uppercase; }
h6 { font-weight: 300!important; text-transform: uppercase; }

a { color: black; transition: all 0.3s ease; }
a:hover { background-color: #343434; color: white; }

/* Colores */
.color-primary { color: #fcc800!important; }
.color-secondary { color: #ffe066!important; }
.color-yellow { color: #fcc800; }
.color-green { color: #40cbb4; }
.color-purple { color: #4c35a9; }
.color-pink { color: #ec167f; }

/* Loader */

#modal-loader { z-index: 9999; }

.modal-background-noclick { 
	background-color: rgba(10, 10, 10, 0.86); 
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}

/* Fondos */
.bgCream { background-color: #e3deda; }

.register-page { min-height: 100vh; background: url('../img/background-wheat.jpg') no-repeat; background-size:cover;  }
/*.inscripcion-form { min-height: 100vh; width: 50%; background-color: rgba(255, 255, 255, 0.95); padding: 80px; }*/

/* Clases generales */
.contenedor { max-width: 1200px!important; margin: 0 auto; position: static }
.paddingDiv { padding: 6em 4em; }
.margin { margin-bottom: 50px; }
.no-padding { padding: 0; }
.hidden { display: none; }
.cursor-pointer { cursor: pointer; }
.rounded { border-radius:6px }
.section-title { text-transform: uppercase; font-size: 1.1em; letter-spacing: 2px; font-weight: 600; display: block; text-align: center; margin: 50px auto 15px auto; opacity: 0.8 }
.section-subtitle { text-align: center; font-size: 2.2em; font-weight: 300; display: block; margin-bottom: 80px; }
.section-button { text-align: center; margin: 40px auto; }
.navbar-transparente { background-color: rgba(255, 255, 255, 0); }
.transparente { opacity: 0.5!important; }
.sponsor-container { border-bottom: 1px solid #f1f1f1; padding:25px 0; }
.justify-center { justify-content: center; }

/* Footer */
.footer { margin-top: 50px; position:relative; padding: 100px 0; background-color: #ffe066; color: #343434; font-size: 0.85em; }
.footer a { color: #343434; transition: all 0.3s ease; }
.footer a:hover { background-color: #343434; color: white; }
.footer-bottom { padding: 20px 0; background-color: #343434; color: #fff; }
.footer-bottom a { color: white; transition: all 0.3s ease; }
.footer-bottom a:hover { background-color: #343434; color: white; }
.footer-social-links li { display:inline-block; margin-right: 10px; }
.footer h3 { font-size: 1.5em; font-weight: 200; margin-bottom: 15px; opacity: 0.8; }

/* Cookies */

#avisoCookiesBanner {
	display: none;
	background: #fff;
	padding: 20px;
	width: calc(100% - 40px);
	max-width: 400px;
	line-height: 1.2em;
	border-radius: 10px;
	position: fixed;
	bottom: 20px;
	left: 20px;
	z-index: 100;
	padding-top: 60px;
	box-shadow: 0px 2px 20px 10px rgba(222,222,222,.25);
	text-align: center;
}

#avisoCookiesBanner.active { display: block; }
#avisoCookiesBanner img { max-width: 100px; position: absolute; top: -25px; left: calc(50% - 50px); }
#avisoCookiesBanner h2 { margin-top: 1.5em; }

#avisoCookiesBackground { display: none; background: rgba(0,0,0,0.20); position: fixed; z-index: 99; width: 100vw; height: 100vh; top: 0; left: 0; }
#avisoCookiesBackground.active { display: block; }

/* Precarga animada del modal */
.lds-ripple { display: inline-block; position: relative; width: 80px; height: 80px; }
.lds-ripple div { position: absolute; border: 4px solid #fff; opacity: 1; border-radius: 50%; animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite; }
.lds-ripple div:nth-child(2) { animation-delay: -0.5s; }

@keyframes lds-ripple {
	0% {
		top: 36px;
		left: 36px;
		width: 0;
		height: 0;
		opacity: 1;
	}
	100% {
		top: 0px;
		left: 0px;
		width: 72px;
		height: 72px;
		opacity: 0;
	}
}

/* AlertifyJS Overrides */
.alertify-notifier .ajs-message.ajs-error { border-color:#9f111b; background-color: #b11623!important; color: white!important; font-size:1.2em!important; border-radius: 8px!important; box-shadow: 0 0 25px rgba(0, 0, 0, 0.3); text-shadow: none!important; }
.alertify-notifier .ajs-message.ajs-warning { border-color:#f7a541; background-color: #faca66!important; color: #343434!important; font-size:1.2em!important; border-radius: 8px!important; box-shadow: 0 0 25px rgba(0, 0, 0, 0.3); text-shadow: none!important; }
.alertify-notifier .ajs-message.ajs-success { border-color:#a9da88; background-color: #ccf390!important; color: #343434!important; font-size:1.2em!important; border-radius: 8px!important; box-shadow: 0 0 25px rgba(0, 0, 0, 0.3); text-shadow: none!important; }

/* Air datepicker override */
.datepickers-container nav {width:auto!important;}
.only-time .datepicker--nav, .only-time .datepicker--content { display: none; }
.only-time .datepicker--time { border-top: none; }

/* Bulma Overrides */
.is-size-1 { font-size: 4rem!important; }
.is-size-6, .is-size-7 { line-height: 1.5em; }
/*.box { padding: 3em; }*/
.button { transition: all 0.3s ease; }
.button.is-primary { background-color: #fcc800; color: #343434; }
.button.is-primary:hover { background-color: #ffe066; color: #343434; }
.button.is-primary.is-outlined { color: #fcc800; border-color: #fcc800; }
.button.is-primary.is-outlined.is-focused, .button.is-primary.is-outlined.is-hovered, .button.is-primary.is-outlined:focus, .button.is-primary.is-outlined:hover { background-color: #0dcfd9; }
.navbar-link.is-active, .navbar-link:focus, .navbar-link:focus-within, .navbar-link:hover, a.navbar-item.is-active, a.navbar-item:focus, a.navbar-item:focus-within, a.navbar-item:hover { color: white; background-color: #0dcfd9!important; }
.file.is-primary .file-cta { background-color: #0dcfd9; transition: all 0.3s ease; }
.file.is-primary.is-hovered .file-cta, .file.is-primary:hover .file-cta { background-color: #46ecf4; }
.navbar-item img { max-height: 35px; }
.navbar.is-primary, .navbar { background-color: rgba(255, 224, 102, 0.8); }
@media screen and (min-width: 1024px) { .navbar.is-primary .navbar-end .navbar-link, .navbar.is-primary .navbar-end > .navbar-item, .navbar.is-primary .navbar-start .navbar-link, .navbar.is-primary .navbar-start > .navbar-item { color: #343434; } }
@media screen and (min-width: 1024px) { .navbar.is-primary .navbar-end .navbar-link.is-active, .navbar.is-primary .navbar-end .navbar-link:focus, .navbar.is-primary .navbar-end .navbar-link:hover, .navbar.is-primary .navbar-end > a.navbar-item.is-active, .navbar.is-primary .navbar-end > a.navbar-item:focus, .navbar.is-primary .navbar-end > a.navbar-item:hover, .navbar.is-primary .navbar-start .navbar-link.is-active, .navbar.is-primary .navbar-start .navbar-link:focus, .navbar.is-primary .navbar-start .navbar-link:hover, .navbar.is-primary .navbar-start > a.navbar-item.is-active, .navbar.is-primary .navbar-start > a.navbar-item:focus, .navbar.is-primary .navbar-start > a.navbar-item:hover { background-color: #fcc800; color: #343434; } }
.navbar-link.is-active, .navbar-link:focus, .navbar-link:focus-within, .navbar-link:hover, a.navbar-item.is-active, a.navbar-item:focus, a.navbar-item:focus-within, a.navbar-item:hover { background-color: #fcc800 !important; }
.navbar.is-primary .navbar-burger { color: #343434; }
@media screen and (min-width: 1024px) { .navbar.is-primary .navbar-item.has-dropdown.is-active .navbar-link, .navbar.is-primary .navbar-item.has-dropdown:focus .navbar-link, .navbar.is-primary .navbar-item.has-dropdown:hover .navbar-link { background-color: #fcc800; color: #343434; } }
@media screen and (min-width: 1024px) { .navbar.is-primary .navbar-end .navbar-link::after, .navbar.is-primary .navbar-start .navbar-link::after { border-color: #343434; } }
body.has-navbar-fixed-top, html.has-navbar-fixed-top { padding-top: 1.7rem; }
@media screen and (min-width: 1024px) { .navbar-dropdown a.navbar-item:not(.is-active, .is-selected) { color: black!important; } }

/* Header */

/* Slider */
.slider-wrapper { position: relative; }
#div-slider { width: 100%; height: 580px; background-color: #d1d1d1; position:relative;}
#slider-watermark { position: absolute; width: 100%; text-align: center; color: white; z-index: 10; top: 35%; }

.bgTeatro { background-image: url('../img/teatro-lope-de-vega.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; }
.bgHotelBarcelo { background-image: url('../img/bgHotelBarcelo.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; }

/* Inscripciones */
.divMetodoPago { cursor:pointer; border: 1px solid #d1d1d1; padding: 30px 0 10px 0; border-radius: 6px; }
.divMetodoPago:hover { background-color: rgba(255, 234, 102, 0.2); }
.divMetodoPagoActivo { background-color: rgba(255, 234, 102, 0.2); }
.paymentSelected { background-color: rgba(255, 234, 102, 0.2); }

/* Formularios de inscripción */
.container-form {  }

@media screen and (max-width: 1024px) {

	.paddingDiv { padding: 1em; }

	#slider-watermark { top: 15%; line-height: 1rem;}
	#slider-watermark img { width: 30%; }
	
}