:root {
    --primary-color: #2243a2;
    --secondary-color: #05d9de;
}

svg{
	max-width: 100px;
}

.container-fluid {
	padding-bottom: 0px !important;
}

b{
	font-family: raflisbold !important;
}


.panel-body b{
	color: var(--primary-color);
	font-size: 15px;
}

.leyenda_tabs h2{
	color: white;
}
.block_switcher{
	position: absolute;
	top :20px;
	width:100%;
}
.block_switcher .container {
    /* position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0; */
    display: flex;
    align-items: center;
    justify-content: center;
	flex-wrap: wrap;
}

strong{
	font-weight: bold;
	font-family: raflisbold;
}

.header {
	background: url("images/fondo_adu.png") no-repeat center;
	background-size: cover;
	min-height: 100vh;
	background-color: rgba(0,0,0,0.8);
	filter:brightness(0.85);
  }
  .raflis2
  {
	  position: absolute;
	  width: auto;
	  height: auto;
	  top: -20px;
	  left: -20px;
	  right: -40px;
	  bottom: -18px;
	  background: rgba(0,0,0,0.75); /* Chrome,Safari4+ */
	  z-index: 66;
	  opacity: 0.7;
  }
  .logo{
	  top:0;
	  position:absolute;
	  padding-top:30px;
	  padding-left:30px;
	  z-index: 99;
  }
  .texto{
	  padding-left:30px;
	  
	  z-index: 99;
  }
  .header .navbar {
	background-color: transparent !important;
  }
  @font-face {
	font-family: "raflis";
	src: url("../fonts/GothamRounded_Light.otf");
  }		
  @font-face {
	font-family: "raflisbold";
	src: url("../fonts/GothamRounded_Bold.otf");
  }
  body {
  font-family: 'raflis', sans-serif !important;
	  overflow-x: hidden;
  }
  .container-fluid{
	  /*padding-top:70px;*/
	  padding-bottom:50px;
	  padding-left:50px;
	  padding-right: 50px;
  }
  
  .foot{
	  padding-top:20px;
	  padding-bottom:20px;
	  padding-left:50px;
	  padding-right: 50px;
  }
  .panel-info{
	  margin-bottom: 25px;
	  min-height:250px;
  }
  h6{
	  margin-bottom: 20px;
	  margin-top:20px;
	  }
  .titulo{
	  margin-top:30px;
	  margin-bottom:40px;
	  }
	  
	  
  .becausa {
  top:0px;
	transition: top 1s;
  }
  .becausa:hover {
	top: -20px;
  }
  
  
  label.tab img {
	  width: 15px;
	  margin-top: -3px;
  }
  
  

.f_roja{
	background: #2243a2;
	margin-top: 10px;
	margin-bottom: 10px;
	height: 25px;
	width: 116.5%;
	margin-left: -25px;
	margin-right: -25px;
	color:white;
	font-family: raflis;
}



.cabecera
	{
		top: 0;
		animation-name: cabe;
		animation-duration: 2s;
	}


.bar_modalidad_mb{
	background-color: var(--secondary-color);
	padding: 5px 5px;
	border-radius: 20px;
	margin-bottom: 30px;
	position: relative;
	z-index: 1;
	width: auto;
	display: inline-block;
}

.leyenda_tabs .bar_modalidad_mb h2{
	margin:0;
	font-size:15px;
}


.bar_modalidad	{
	background-color: var(--secondary-color);
	padding: 10px 5px;
	border-radius: 20px;
	margin-bottom: 30px;
	position: relative;
	z-index: 1;
}

.bar_modalidad::after{
	display: block;
	position: absolute;
	content: '';
	width: 5px;
	height: 30px;
	bottom: -30px;
	left: 80px;
	background-color: rgb(0 0 0 / 23%);
	z-index: -1;

}

.bar_modalidad::before{
	display: block;
	position: absolute;
	content: '';
	width: 5px;
	height: 30px;
	bottom: -30px;
	right: 80px;
	background-color: rgb(0 0 0 / 23%);
	z-index: -1;

}


.bar_modalidad h2{
	font-size: 25px;
	color: white;
	font-family: raflisbold;
	letter-spacing: 2px;
	margin:0
}

.front-right{
	bottom: 120px;
	position: absolute;
	width: 350px;
	max-width: 400px;
	right: 30px;

}

.formi1{
	background: rgb(0 0 0 / 23%);
	padding: 20px;
	border-radius: 25px;
}


.formi2
	{
		animation-duration: 2s;
		padding-top: 35px;
		background: rgb(0 0 0 / 23%);
		padding-bottom: 10px;
		border-radius: 30px;
	}

	.form_media{
		background-image: url("../images/banners/background-form.jpg");
		background-repeat:no-repeat;
		background-position: center center;
		border-top: 4px solid #8f8f8f5e;
		padding: 15px 20px;
		margin: 0;
	}

	.hidden{
		display:none;
	}

.tab {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 190px;
    font-size: 1.05rem;
    font-weight: 500;
    border-radius: 99px;
    cursor: pointer;
	font-family: raflisbold;
    transition: color 0.15s ease-in;
	margin-bottom: 0;
}

.notification {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    margin-left: 0.75rem;
    border-radius: 50%;
    background-color: var(--secondary-color);
    transition: 0.15s ease-in;
}

input[type=radio]:checked+label {
    color: white;
}

input[type=radio]:checked+label>.notification {
    background-color: #2243a2;
    color: #fff;
}

input[class="radio-1"]:checked~.glider {
    transform: translateX(0);
}

input[class="radio-1"]:checked~.img_star {
	content:url("https://");
}


input[class="radio-2"]:checked~.glider {
    transform: translateX(100%);
}

input[class=radio-3]:checked~.glider {
    transform: translateX(200%);
}

.glider {
    position: absolute;
    display: flex;
    height: 41px;
    width: 190px;
    background-color: #2243a2;
    z-index: 0 !important;
    border-radius: 99px;
    transition: 0.25s ease-out;
}

.glider.left{
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}

.glider.center{
	border-radius: 0px;
}

.glider.right{
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}


.leyenda_tabs{
	width:100%;
	text-align:center;
	color:#2243a2;
	font-family: raflisbold;
	font-weight:bold;
}


.tabs {
    display: flex;
    /* position: relative; */
    background-color: #fff;
	box-shadow: 0 0 1px 0 rgb(0 0 0), 0 6px 12px 0 rgb(0 0 0 / 75%);
    padding: 0;
    border-radius: 99px;
}

.tabs * {
    z-index: 2;
}

input[type=radio] {
    display: none;
}

input[type=text]::placeholder{
	font-size: 11px;
}
.block_content{
	position: absolute;
	bottom: 80px;
	left: 60px;
	width: 100%;
}

.program_title{
	padding:0 5%;
}

.block_content h3{
	color: white;
	font-family: raflisbold;
	font-size: 1.5rem;
	padding: 10px 0;
	border-radius: 40px;
}

.block_content h2{
	color: white;
	font-family: raflisbold;
	font-size: 2rem;
	padding: 0 50px;


}

.btn_conoce{
	text-align: center;
}
.btn_conoce a{
	background: var(--secondary-color);
	padding: 10px 35px;
	color: white !important;
	border-radius: 20px;
	font-family: raflisbold;
	position: relative;
}

.btn_conoce a img{
	width: 50px;
    position: absolute;
    bottom: -16px;
    right: -10px;
}

.block_content h2 span.blue{
	color: #00cbcb;
	
}

.p_modalidad{
	color: white;
	font-family: raflisbold;
	font-size: 1.3rem;
	margin-bottom: 0px;
}

.p_matricula{
	margin-bottom: 25px;

}
.p_matricula span{
	color: white;
	font-family: raflisbold;
	font-size: 1rem;
	background: #fc0b90;
	padding: 5px 15px;
	border-radius: 2px;
	
}

.carousel-item
	{
		background: no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size:cover;
	}
	
.formi
	{
		position:relative;
		font-size: 11px;
		background-color: #FFF;
		border-radius: 10px;
		border:1px solid #165FC8;
		height:35px;
		margin:3.5px;
		font-family: raflisbold;
		z-index:99;
	}
.envi
	{
		position: relative;
		margin:5px;
		border-radius: 5px;
		z-index:99;
	}
.tit
	{
		position: relative;		border-radius: 30px;
		color:#FFF;
		font-size: 1.3rem;
		font-family: raflisbold;
		text-transform: uppercase;
		height:35px;
		padding:5px;
		z-index:99;
	}


	.red{
		color: var(--secondary-color) !important;
	}
	.grey{
		color: #898888;
	}

	.switcher_body{
		padding: 0 35px;
	}

	#mod_form{
		font-family: raflisbold;
		background-color: var(--secondary-color);

	}
	.desc_modalidad{
		font-family: raflis;
		text-align: center;
		font-size: 17px;
		color: #898888;
	}
	.btn-danger.envi{
		background-color: var(--secondary-color);
		border-color: var(--secondary-color);
		font-family: raflisbold;
		border-radius: 20px;
	}
	
	.block_switcher.body{
		position: relative;
	}
@keyframes cabe
	{
		from {top: -100px;}
		to {top: 0;}
	}
@keyframes form1
	{
		0% {top: 500px;}
		100% {top: 125px;}
	}
@keyframes form2
	{
		0% {margin-left: 550px;}
		100% {margin-left: 20px;}
	}


/* ##Device = Tablets, Ipads (portrait) */
/* ##Screen = B/w 768px to 1024px */
  
@media (min-width: 768px) and (max-width: 1024px) {

	
	#banner.presencial{
		content:url("../images/banners/tablet/presencial-tab.jpg");
	}

	#banner.blended{
		content:url("../images/banners/tablet/blended-tab.jpg");
	}

	#banner.virtual{
		content:url("../images/banners/tablet/virtual-tab.jpg");
	}

	#banner.especializacion{
		content:url("../images/banners/espe-banner-tab.webp?version=090420242");
	}

	.block_content{
		bottom: 40px;
		left: 10px;
	}

	.becausa .panel{
		min-height: 420px;
	}

	.switcher_body{
		padding: 0 65px;
	}

	.form_media{
		padding:20px 0;
	}
}


/*
##Device = Low Resolution Tablets, Mobiles (Portrait)
##Screen = B/w 481px to 767px
*/

@media (min-width: 320px) and (max-width: 480px) {
	#banner.presencial{
		content:url("../images/banners/mobile/presencial-cel.jpg");
	}

	#banner.blended{
		content:url("../images/banners/mobile/blended-cel.jpg");
	}

	#banner.virtual{
		content:url("../images/banners/mobile/virtual-cel.jpg");
	}

	#banner.especializacion{
		content:url("../images/banners/espe-banner-cel.webp?version=090420242");
	}

	.leyenda_tabs h2{
		font-size: 1.1rem;
	}

	.formi2{
		padding-top: 10px;
	}

	.block_content {
		position: absolute;
		bottom: 20px;
		left: 0;
		right: 0;
		margin: 0 0;
		width: 100%;
	}

	.block_content  .btn_conoce{
		text-align: center !important;
	}

	.block_content  .btn_conoce a{
		background-color: var(--secondary-color);
	}



	.p_matricula span{
		font-size: 0.8rem;
	}

	.block_content h3{
		padding: 0px 0px;
		font-size: 1rem;
	}

	.program_title{
		margin-top: -13px;
	}

	.p_modalidad{
		font-size: 1rem;
	}
	.switcher_body{
		padding: 0;
	}

	.tabs {
		transform: scale(0.6);
	}


}



@media only screen and (max-width: 600px) {
	.card.speakingup img {
		width:100%;
	}
	.block_switcher{
		top:10px;
	}
}

@media (max-width: 700px) {
	.tabs {
		transform: scale(0.6);
	}
}