@charset "UTF-8";

@font-face {
    font-family: 'Banamex Text Regular';
    src: url('/JFP/fonts/Interstate-Light.ttf')
}
@font-face {
    font-family: 'Banamex Text Regular';
    src: url('/apps/prelogin/commonUI/fonts/Interstate-Regular.ttf')
}

.psswrdErrorUXFTAButton:hover {
	background-color: #143666 !important;
}

#desc3 a:hover {
	color: #143666 !important;
}

#geolocModal{
	width: 720px !important;
	height: 322px !important;
	z-index: 1004;
	border-radius: 8px;
}

#geolocModal > div{
	float: left;
}

.geolocImg {
	height: 100%;
	width: 40%;
	padding-left: 0% !important;
	padding-right: 0% !important;
	border-radius: 8px 0 0 8px;
}

.geolocImg img{
	width: 193px;
 	height: 178px;
	margin-top: 72px;
	margin-left: 45px;
}

#geolocDesc{
	margin-left: 32px;
	margin-top: 32px;
}

#desc1{
	margin-bottom: 0px;
	font-size: 24px !important;
	line-height: 30px;
	font-family: 'Banamex Text Semibold';
	width: 281px;
    height: auto;
    margin-top: 0px;
	color: #003746;
}

#desc2 {
	font-family: 'Banamex Text Regular';
	font-size: 16px !important;
	font-weight: normal;
	font-stretch: normal;
	font-style: normal;
	line-height: 22px;
	letter-spacing: normal;
	margin-top: 24px;
	width: 372px;
	color: #003746;
}

#desc3 {
	font-family: 'Banamex Text Regular';
	font-size: 16px !important;
	font-weight: normal;
	font-stretch: normal;
	font-style: normal;
	line-height: 22px;
	letter-spacing: normal;
	margin-top: 24px;
	width: 372px;
	color: #003746;
}

#geolocDesc > input{
	background-color: #003746;
	border-radius: 8px;
	margin-top: 24px;
	font-family: 'Banamex Text Regular';
    font-size: 16px !important;
 	width: 123px;
 	font-weight: normal;
 	height: 48px;
}

#geolocDesc p > a{
	color: #05589D !important;
}

#geolocDesc > input:hover{
	color: #FFFFFF;
}
	
#geoLocEx {
	width: 23px;
	height: 24px;
	float: right;
}

#geoLocIconclose {
		float: right;
		margin-right: 2px;
		margin-top: 0px;
		cursor: pointer;
}

@media only screen and (min-width: 992px) { 
	
	#geolocModal{
		width: 420px !important;
		min-height: 322px !important;
	    height: auto !important;
		z-index: 1004;
		border-radius: 8px;
	}
	
	.geolocImg {
		min-height: 332px;
	    height: auto;
		width: 40%;
		padding-left: 0% !important;
		padding-right: 0% !important;
		border-radius: 8px 0 0 8px;
	}
	
	.geolocImg img{
		width: 340px;
	 	height: 239px;
		margin-top: 74px;
		margin-bottom: 0px;
		margin-left: 0px;
	}
	
		#geolocDesc > input{
		background-color: #003746;
		border-radius: 8px;
		margin-top: 24px;
		font-family: 'Banamex Text Semibold';
	    font-size: 16px !important;
	 	width: 123px;
	 	font-weight: normal;
	 	height: 48px;
	 	margin-bottom: 32px;
	}
}

@media only screen and (max-width: 992px) and (min-width: 769px) {

	#geolocModal{
		width: 400px !important;
		min-height: 322px !important;
    	height: auto !important;
		z-index: 1004;
		border-radius: 8px;
	}
	
	.geolocImg {
		min-height: 332px;
	    height: auto;
		width: 40%;
		padding-left: 0% !important;
		padding-right: 0% !important;
		border-radius: 8px 0 0 8px;
	}
	
	#geoLocIconclose {
		float: right;
		margin-right: 2px;
		margin-top: 0px;
		cursor: pointer;
	}
	
	.geolocImg img{
		width: 320px;
	 	height: 225px;
		margin-top: 100px;
		margin-bottom: 0px;
		margin-left: 0px;
	}
	
	#desc1{
	margin-bottom: 0px;
	font-size: 24px !important;
	line-height: 30px;
	font-family: 'Banamex Text Regular';
	width: 281px;
    height: auto;
    margin-top: 0px;
	color: #003746;
	}
	
	#desc2 {
		font-family: 'Banamex Text Regular';
		font-size: 16px !important;
		font-weight: normal;
		font-stretch: normal;
		font-style: normal;
		line-height: 22px;
		letter-spacing: normal;
		    color: #003746;
		margin-top: 24px;
		width: 320px;
	}
	
	#desc3 {
		font-size: 16px !important;
		margin-bottom: 0px;
		margin-top: 24px;
		line-height: 22px;
		font-family: 'Banamex Text Regular';
		width: 334px;
		color: #003746;
	}
	
	#geolocDesc > input{
		background-color: #003746;
		border-radius: 8px;
		margin-top: 24px;
		font-family: 'Banamex Text Semibold';
	    font-size: 16px !important;
	 	width: 123px;
	 	font-weight: normal;
	 	height: 48px;
	 	margin-bottom: 32px;
	}
	
	
}

@media only screen and (max-width: 768px) and (min-width: 417px) {

	#geolocModal > div{
		float: initial;
	}
	
	.geolocImg {
	    height: 263px;
	    width: 100%;
	    padding-left: 0% !important;
	    padding-right: 0% !important;
	    border-radius: 8px 8px 0 0;
	}
	
	#geolocModal {
	    width: 416px !important;
	    height: auto !important;
	    z-index: 1004;
	    border-radius: 8px;
	    min-height: 540px !important;
	    top: 0% !important;
	    left: 0% !important;
	    transform: initial !important;
	    position: sticky !important;
	}
	
	.geolocImg img {
	    width: 340px;
	    height: 239px;
	    margin-top: 32px;
	    margin-left: 0px;
	}
	
	#geoLocIconclose {
		float: right;
		margin-right: 32px;
		margin-top: -258px;
		cursor: pointer;
	}
	
	#geolocDesc {
	    margin-left: 32px;
	    margin-top: 24px;
	}
	
	#desc1{
		margin-bottom: 0px;
		font-size: 24px !important;
		line-height: 30px;
		font-family: 'Banamex Text Semibold';
		width: 368px;
	    height: auto;
	    margin-top: 0px;
		color: #003746;
	}
	
	#desc2 {
	    font-family: 'Banamex Text Regular';
	    font-size: 16px !important;
	    font-weight: normal;
	    font-stretch: normal;
	    font-style: normal;
	    line-height: 22px;
	    letter-spacing: normal;
	    color: #003746;
	    margin-top: 24px;
	    width: 368px;
	}
	
	#desc3 {
		font-size: 16px !important;
		margin-bottom: 0px;
		margin-top: 24px;
		line-height: 22px;
		font-family: 'Banamex Text Regular';
		width: 368px;
		color: #003746;
	}
	
	#geolocDesc > input {
	    background-color: #003746;
	    border-radius: 8px;
	    margin-top: 24px;
	    font-family: 'Banamex Text Semibold';
	    font-size: 16px !important;
	    width: 352px;
	    height: 48px;
	    font-weight: normal;
	    margin-bottom: 32px;
	}
	
}

@media only screen and (max-width: 416px) {
	#geolocModal > div{
		float: initial;
	}
	
	.geolocImg {
	    height: 180px;
	    width: 100%;
	    padding-left: 0% !important;
	    padding-right: 0% !important;
	    border-radius: 8px 8px 0 0;
	}
	
	#geolocModal {
	    width: 288px !important;
	    height: auto !important;
	    z-index: 1004;
	    border-radius: 8px;
	    min-height: 540px !important;
	    top: 0% !important;
	    left: 0% !important;
	    transform: initial !important;
	    position: sticky !important;
	}
	
	.geolocImg img {
	    width: 198px;
	    height: 140px;
	    margin-top: 16px;
	    margin-left: 0px;
	}
	
	#geoLocIconclose {
		float: right;
		margin-right: 16px;
		margin-top: -188px;
		cursor: pointer;
	}
	
	#geolocDesc {
	    margin-left: 24px;
	    margin-top: 24px;
	}
	
	#desc1{
		margin-bottom: 0px;
		font-size: 24px !important;
		line-height: 30px;
		font-family: 'Banamex Text Semibold';
		width: 240px;
	    height: auto;
	    margin-top: 0px;
		color: #003746;
	}
	
	#desc2 {
	    font-family: 'Banamex Text Regular';
	    font-size: 16px !important;
	    font-weight: normal;
	    font-stretch: normal;
	    font-style: normal;
	    line-height: 22px;
	    letter-spacing: normal;
	    color: #003746;
	    margin-top: 16px;
	    width: 240px;
	}
	
	#desc3 {
		font-size: 16px !important;
		margin-bottom: 0px;
		margin-top: 16px;
		line-height: 22px;
		font-family: 'Banamex Text Regular';
		width: 240px;
		color: #003746;
	}
	
	#geolocDesc > input {
	    background-color: #003746;
	    border-radius: 8px;
	    margin-top: 24px;
	    font-family: 'Banamex Text Semibold';
	    font-size: 16px !important;
	    width: 240px;
	    height: 48px;
	    font-weight: normal;
	    margin-bottom: 24px;
	    
	}
}