/* COMPONENTES ******************************************/
input[type=text],
input[type=email],
input[type=password],
select,
textarea {
	font-family: sans-serif;
	font-size: 14px;
	font-weight: 500;
	appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	-webkit-appearance: none;
	box-sizing: border-box;
	border: none;
	resize: none;
	margin-bottom: 15px;
	padding: 10px;
	height: inherit;
	border: 1px solid #9B9B9B;
	border-radius: 30px;
	background-color: rgba(255,255,255,0.9);
	box-shadow: 0 7px 26px 0 rgba(0,0,0,0.2);
	width: 100%;
}
input::placeholder{
	color:black;
}
input:-moz-placeholder{
	color:black;
}
input::-moz-placeholder{
	color:black;
}
input:-ms-input-placeholder{
	color: black;
}
input::-webkit-input-placeholder{
	color: black;
}

/* CLASSES DE LOS INPUT DE BOOTSTRAP */

.fieldset-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
}
.fieldset-wrapper > fieldset:first-child{
	margin-right: 20px;
}
.form-actions{
	text-align: center;
	padding-top: 18px;
}
.form-actions > button{
	background-color: white;
	border-radius: 30px;
	color: black;
	box-shadow: 0 7px 26px 0 rgba(0,0,0,0.3);
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 1.14px;
	padding: 10px 20px;
}

/* SELECTS */
.G-desplegable{
	border-radius: 8px;
	background-color: #f1f1f1;
	position: relative;
	margin-bottom: 10px;
}
.G-desplegable > select{
	background-color: transparent;
	margin-bottom: 0;
	padding-right: 40px;
  border: none;
  outline: none;
  user-select: none;
  -o-user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
}
.G-desplegable > select option{
  border: none;
  outline: none;
  user-select: none;
  -o-user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
}
.G-desplegable:after{
	content: "";
	display: block;
	width: 30px;
	height: 100%;
	position: absolute;
	right: 5px;
	top: 0;
	background-image: url(src/icons/flecha-desplegable.svg);
	background-position: center center;
	background-size: 20px;
	background-repeat: no-repeat;
}
.G-desplegable > select option:first-child{
	opacity: 0.4 !important;
}


/* TEXTAREAS */
textarea{

}

/* CHECKBOX */
.checkbox{
	display: flex;
	align-items: flex-start;
	margin-bottom: 3px;
}
.checkbox input{
	appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	-webkit-appearance: none;
	background-image: url(../img/check-sinmarcar.svg);
	background-position: left center;
	background-size: contain;
	width: 100%;
	height: 13px;
	margin: 0;
	padding-right: 3px;
	background-repeat: no-repeat;
	opacity: 0.4;
	max-width: 24px;
}
.checkbox input + label{
	font-size: 12px;
	padding-left: 5px;
}
.checkbox input:checked{
	background-image: url(../img/check-marcado.svg);
	opacity: 1;
}
.checkbox input:hover{
	cursor: pointer;
}
.checkbox input + label:hover{
	cursor: pointer !important;
}


.G-checkbox.toggle input{
	background-image: none;
	background-color: #D94C4C;
	border-radius: 30px;
	width: 45px;
	height: 25px;
	position: relative;
}
.G-checkbox.toggle input:after{
	width: 21px;
	height: 21px;
	display: block;
	background-color: white;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
	border-radius: 50%;
	content: "";
	left: 2px;
	top: 2px;
	position: absolute;
	transition:ease all 0.4s;
}
.G-checkbox.toggle input:checked{
	background-color: #4CD964;
}
.G-checkbox.toggle input:checked:after{
	left: inherit;
	right: 2px;
	transition:ease all 0.4s;
}


/* RADIOBUTTONS */
.G-radiobutton > div{
	margin-bottom: 10px;
}
.G-radiobutton input{
	margin-bottom: 10px;
	appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	-webkit-appearance: none;
	background-image: url(src/icons/radiobutton-sinmarcar.svg);
	background-position: center center;
	background-size: 16px;
	width: 20px;
	height: 20px;
	margin: 0;
	margin-right: 3px;
	background-repeat: no-repeat;
	opacity: 0.4;
}
.G-radiobutton input + label{
}
.G-radiobutton input:checked{
	background-image: url(src/icons/radiobutton-marcado.svg);
	opacity: 1;
}
.G-radiobutton input + label:hover{
	cursor: pointer !important;
}



.G-radiobutton.toggle input{
	background-image: none;
	background-color: #D94C4C;
	border-radius: 30px;
	width: 45px;
	height: 25px;
	position: relative;
}
.G-radiobutton.toggle input:after{
	width: 21px;
	height: 21px;
	display: block;
	background-color: white;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
	border-radius: 50%;
	content: "";
	left: 2px;
	top: 2px;
	position: absolute;
	transition:ease all 0.4s;
}
.G-radiobutton.toggle input:checked{
	background-color: #4CD964;
}
.G-radiobutton.toggle input:checked:after{
	left: inherit;
	right: 2px;
	transition:ease all 0.4s;
}

/* TEXTO RGPD EN FORMULARIOS */
#edit-fila3 .fieldset-wrapper p {
  padding: 20px;
  text-align: left;
}

/* GRUPOS DE ELEMENTOS */
.G-grupo {
	display: flex;
	position: relative;
	align-items: stretch;
}
.G-grupo input{
	margin: 0;
}
.G-grupo .G-grupo--izq + input{
border-radius: 0 8px 8px 0;
}
.G-grupo .G-grupo--der + input{
border-radius: 8px 0 0 8px;
}
.G-grupo .G-grupo--izq,
.G-grupo .G-grupo--der{
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 15px;
	background-color: #d1d1d1;
	color: black;
	white-space: nowrap;
}

.G-grupo--hor,
.G-grupo--ver{
	display: flex;
	align-items: center;
}

.G-grupo--hor{
	justify-content: space-between;
}
.G-grupo--ver{
	flex-direction: column;
}

.G-grupo > div{
	flex: 1;
}

.G-grupo .G-grupo--izq{
	left: 0;
	top: 0;
}
.G-grupo .G-grupo--der{
	right: 0;
	top: 0;
}
.G-grupo .G-grupo--izq{
	left: 0;
	top: 0;
	border-radius: 8px 0 0 8px;
}
.G-grupo .G-grupo--der{
	right: 0;
	top: 0;
	border-radius: 0 8px 8px 0;
	order: 2;
}


/* ENLACES */
a{

}

/*ESTADOS*/
.G-enlace--desactivarClick{
	pointer-events: none;
}
.G-enlace--activo{
	opacity: 1;
}
.G-enlace--desactivado{
	opacity: 0.2;
	filter: grayscale(1);
	-webkit-filter: grayscale(1);
	-ms-filter: grayscale(1);
	-o-filter: grayscale(1);
}

/* ACORDEONES */
.G-acordeon{
	border: 1px solid #f3f3f3;
	margin: 0;
	border-radius: 8px;
}
.G-acordeon--cabecera{
	background-color: #f3f3f3;
	cursor: pointer;
}
.G-acordeon--cabecera > *{
	padding: 20px;
	margin: 0;
}
.G-acordeon--descripcion{
	padding: 20px;
}
.G-acordeon--cerrado > .G-acordeon--descripcion{
	height: 0;
	opacity: 0;
	transition: ease all 0.4s;
	display: none;
}
.G-acordeon--abierto > .G-acordeon--descripcion{
	height: inherit;
	opacity: 1;
	transition: ease all 0.4s;
}

/* TABS */
ul.G-tabs{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin: 0;
	padding: 0;
}
ul.G-tabs > li > a > h3{
	margin: 0;
}
ul.G-tabs li{
	list-style: none;
	text-align: center;
	padding: 0 24px;
}
ul.G-tabs li a{
	text-decoration: none;
	display: block;
	width: 100%;
	opacity: 0.4;
	transition: ease all 0.4s;
	padding: 15px 0;
	color: #000000;
	font-size: 24px;
	font-weight: bold;
	letter-spacing: 1.71px;
}
ul.G-tabs li a.active{
	opacity: 1;
	position: relative;
}
ul.G-tabs li a.active::after{
    content: "";
    display: block;
    position: absolute;
	background-image: url(../img/separador-negro-mini.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	height: 24px;
	width: 114px;
	left: 50%;
    transform: translate(-50%, 0%);
}
ul.G-tabs li a:hover{
	opacity: 1;
	transition: ease all 0.4s;
}

ul.E-tabs.circular {
	padding: 2px;
	display: inline-flex;
	margin: 0;
}
ul.E-tabs.circular li{
	padding: 0 7px;
	display: inline-block;
	white-space: nowrap;
	display: block;
	border: 1px solid white;
	border-radius: 30px;
	height: 5px;
	width: 27px;
	opacity: 1;
}
ul.E-tabs.circular li .activo{
	background-color: white;
}

ul.G-tabs-carta{
  z-index: 10;
  flex-wrap: nowrap;
  justify-content: space-between;
  overflow-x: auto;
  position: fixed;
  top: 83px;
  background-color: white;
  left: 0;
  right: 0;
  padding: 20px 0 0;
}
ul.G-tabs-carta li a{
  white-space: nowrap;
  padding: 0 0 30px;
}
/* Width */
ul.G-tabs-carta ::-webkit-scrollbar {
  width: 2px;
}
/* Track */
ul.G-tabs-carta ::-webkit-scrollbar-track {
  background: white;
}
/* Handle */
ul.G-tabs-carta ::-webkit-scrollbar-thumb {
  background: #727272;
  opacity: .8;
  border-radius: 50px;
  border: 4px solid white;
}

ul.G-tabs-curso{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
	margin: 0;
	padding: 0;
}
ul.G-tabs-curso li{
	width: 100%;
	max-width: 230px;
	list-style: none;
	text-align: center;
	padding: 6px;
}
ul.G-tabs-curso li a{
	height: 100%;
	background-color: white;
	box-shadow: 0 15px 25px 0 rgba(0,0,0,0.1);
	border-radius: 8px;
	text-decoration: none;
	display: block;
	width: 100%;
	padding: 30px 20px;
}
ul.G-tabs-curso li h3{
	margin: 0;
	color: #000000;
	font-size: 20px;
	font-weight:600;
}
ul.G-tabs-curso li a img{
	height: 80px;
	width: 80px;
	display: block;
	margin: auto;
	margin-bottom: 19px;
}
ul.G-tabs-curso li a.active{
	border: 2px solid black;
}
ul.G-tabs-curso li a:hover{
	border: 2px solid black;
}


ul.G-tabs-curso-detalle{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
	margin: 0;
	padding: 0;
}
ul.G-tabs-curso-detalle li{
	width: 100%;
	max-width: 230px;
	list-style: none;
	text-align: center;
	padding: 10px;
}
ul.G-tabs-curso-detalle > li > div{
	height: 100%;
	background-color: white;
	color: black;
	padding: 30px 20px;
	box-shadow: 0 15px 25px 0 rgba(0,0,0,0.1);
	border-radius: 8px;
	text-decoration: none;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: 100%;
}
ul.G-tabs-curso-detalle li div.activo{
	background-color: black;
	color: white;
}


ul.G-tabs-equipo{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin: 0;
	padding: 0;
}
ul.G-tabs-equipo li{
	list-style: none;
	text-align: center;
	padding: 0 15px;
}
ul.G-tabs-equipo li a{
    background-repeat: no-repeat;
    background-size: cover;
	background-position: center center;
	border-radius: 50%;
	height: 155px;
	width: 155px;
	text-decoration: none;
	display: block;
	opacity: 0.4;
	transition: ease all 0.4s;
	margin: 15px 0;
    filter: grayscale(100%);
}
ul.G-tabs-equipo li a.active{
	opacity: 1;
    filter: none;
}
ul.G-tabs-equipo li a:hover{
	opacity: 1;
    filter: none;
	transition: ease all 0.4s;
}
.page-node-137 ul.G-tabs-carta{
  top: 85px !important;
}
/* ALERTAS */
.G-alert{
	border-radius: 8px;
}


/* BADGE */
.G-badge{
	background-color: gray;
	color: white;
	border-radius: 4px;
	font-size: 0.9rem;
	padding: 0.3em 0.5em;
	margin-left: 5px;
	line-height: inherit;
	vertical-align: middle;
}

/* BREADCRUMBS */
ul.G-breadcrumb{
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
ul.G-breadcrumb li{
	list-style: none;
	position: relative;
	padding-left: 15px;
	padding-right: 5px;
}
ul.G-breadcrumb li a{
	color: #000000;
	font-size: 16px;
	text-decoration: none;
}
ul.G-breadcrumb li:first-child{
	padding-left: 0;
}
ul.G-breadcrumb li:first-child:before{
	display: none;
}
ul.G-breadcrumb li:before{
	content: ">";
	position: absolute;
	left: -2px;
	width: 20px;
	height: 20px;
}

/* LISTADOS */
.G-listado{
	margin: 0;
	padding: 0;
}
.G-listado li{
	list-style: none;
}

.G-listado-sep--xxxs > *{
	margin-bottom: 8px;
}
.G-listado-sep--xxs > *{
	margin-bottom: 10px;
}
.G-listado-sep--xs > *{
	margin-bottom: 14px;
}
.G-listado-sep--s > *{
	margin-bottom: 18px;
}
.G-listado-sep--m > *{
	margin-bottom: 22px;
}
.G-listado-sep--l > *{
	margin-bottom: 28px;
}
.G-listado-sep--xl > *{
	margin-bottom: 36px;
}


.G-listado-sep-h--xxxs>* {
    margin: 0 4px;
}
.G-listado-sep-h--xxs>* {
    margin: 0 8px;
}
.G-listado-sep-h--xs>* {
    margin: 0 10px;
}
.G-listado-sep-h--s>* {
    margin: 0 12px;
}
.G-listado-sep-h--m>* {
    margin: 0 14px;
}
.G-listado-sep-h--l>* {
    margin: 0 18px;
}
.G-listado-sep-h--xl>* {
    margin: 0 22px;
}
.G-listado-sep-h--xxl>* {
    margin: 0 28px;
}
.G-listado-sep-h--xxxl>* {
    margin: 0 36px;
}
