/*  ----------------   Fuentes   ----------------- */

@font-face {
    font-family: 'TelcelNova Media';
    src: url('../fonts/TelcelNova-Media.woff2') format('woff2'),
        url('../fonts/TelcelNova-Media.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Regular.woff2') format('woff2'),
        url('../fonts/Lato-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


body {
    font-family: 'TelcelNova Media','Lato';    
}

a{
	color: #00338D;
}

/*  ----------------------   Titulos  ----------------------- */

.head-l1-c1{
	color: #00338D;
	font-family: 'TelcelNova Media';
	margin: 5px 0px 5px 0px;
	padding: 0px;
}

.head-d1-c1{
	color: #ffffff;
	font-family: 'TelcelNova Media';
	margin: 5px 0px 5px 0px;
	padding: 0px;
}

.row-content
{
	height: 100vh;
	--bs-gutter-x:0 !important;
}

.head-title
{
	font-size:50px;
	font-weight: bold;
	color: #ffffff;		
	text-align: center;
	padding-top: 4rem;
}

.image-door
{
	height: 60%;
	width: 60%;
	position: absolute;
}

.logo-telcel{
	height: 40%;
	width: 40%;
}

.text-bold{
	font-weight: bold;
}

.card-shadow{
	border-radius: 20px;
	box-shadow: 0px 0px 21px 2px rgba(0, 0, 0, 0.52);
}

.text-telcel-primary{
	color:#00338D;
}

/*  ----------------   Botones   ----------------- */

/*  Boton Primario */

.btn-l1 {
	background-color: #039BE5;
	color: #ffffff;
	
	font-weight: 600;
	letter-spacing: 1px; 
	font-family: 'Lato';
	padding-right: 25px;
	padding-left: 25px;
	font-size: 14px;
	height: 38px;
	margin: 5px 0px 5px 0px;
}


.btn-l1:hover, .btn-l1-lg:hover, .btn-l1-sm:hover {
	background-color: #28B5F6;
	color: #ffffff;
}

.btn-l1:disabled{
	background-color: #4EC2F7;
	color: #ffffff;
}

@media only screen and (max-width: 640px) {

	.row-content
	{
		height: 90vh;		
	}

    .div-imagen{
        display:none;
    }

	.div-logo-telcel{
		padding-top: 0 !important;
		padding-bottom: 3rem !important;
		text-align: center;
	}

	.logo-telcel{
		height: 30%;
		width: 30%;
	}

	.head-title
	{
		font-size:40px;
		color: #00338D;		
	}

	.column-left
	{
		background-image: none;
		padding-bottom: 0 !important;
		height: .5px;
	}
	.head-d1-c1{
		color: #002278;
	}
}

@media only screen and (min-width: 768px) {
	.column-left
	{		
		flex: 0 0 auto;
		width: 50% !important;
		background-image: linear-gradient(#00338D, #0376BD);		
	}

	.column-right
	{		
		flex: 0 0 auto;
		width: 50% !important;
	}

	.div-logo-telcel{
		padding-top: 8rem !important;
		padding-bottom: 3rem !important;
		text-align: center;
	}
}


/* Largest devices such as desktops (1280px and up) */
@media only screen and (min-width: 1280px) 
{
	.image-door
	{
		height: 70%;
		width: 53%;
		position: absolute;		
	}

	.column-left
	{		
		flex: 0 0 auto;
		width: 45% !important;		
	}

	.column-right
	{		
		flex: 0 0 auto;
		width: 55% !important;
	}

	.card-shadow{
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}
}

@media (max-width: 992px){
    
    .btn-l1, .btn-l2, .btn-l3, .btn-l4 {
    	width: 100%;
    	margin: 5px 0px 5px 0px;
    } 

    .btn-d1, .btn-d2, .btn-d3, .btn-d4 {
    	width: 100%;
    	margin: 5px 0px 5px 0px;
    } 

}