.general {
	background-color:white;font-family:'Open Sans';
	min-height: 500px;
    min-width: 500px;
}

.main-title {
	font-size:0.9rem;
	font-weight:normal;
	margin-top:2rem;margin-bottom:0;padding-right:0.5rem;
	text-align:center;
}

.main-title2 {
	font-size:1.1rem;
	margin-top:3rem;
	font-weight:bold;
	text-align:center;
}

.ticket {
	font-size:1.0rem;
	margin-top:0rem;
	font-weight:bold;
	text-align:center !important;

}

.one-edge-shadow {
	-webkit-box-shadow: 0px 0px 10px grey;
	   -moz-box-shadow: 0px 0px 10px grey;
	        box-shadow: 0px 0px 10px grey;
	color:grey;
	border: 0px white solid;  
	   
}

.one-edge-shadow:focus {
	border: 0px white grey !important;  
}


.myButton {
	margin-top:0.9rem;
	background-color:#1976d3;
	border-radius:0.5rem;
	height:3.2rem !important;
	cursor:pointer;
	color:white;
	font-size:1rem;
	font-weight:normal;
	margin-left:2rem;
	text-decoration:none;
	text-align:center;
	border-color: #1976d3;
	

}



.myButton:hover {
	background-color:#104d89;
}
.myButton:active {
	position:relative;
	top:1px;
} 


.checkpin {
	width:10rem !important;
}

.title1 {
	margin-top:2rem;
	font-size:1.0rem;
	font-weight:normal;
	text-align:center;
}

.search-div {
	display:flex;flex-direction:row;justify-content:center;margin-top:1rem;
}

.search-input {
	margin-top:1rem;padding:0.2rem;padding-left:1.0rem;font-size:1.5rem;border-radius:0.5rem;
	width:17rem;
	
}

.logo {
	height:59%;margin-top:8%;
	grid-area:logo1;
}

.logo2 {
	height:40%;margin-top:10%;
	grid-area:logo2;
}

.title {
	margin-top:3rem;
	grid-area:title;
}

.logo-title1 {
	width:100%;color:black;font-size:1.2rem;font-weight:normal;text-align:center;margin-top:-1rem;
}

.logo-title2 {
	width:100%;color:black;font-size:1.8rem;font-weight:normal;text-align:center;
	
}

.divisor {
	background-color:#f1f1f1;height:3px;
}

.input-tel {
	font-size:1.0rem !important;padding:0.2rem 1rem 0.2rem 1rem;
}

.slot-input {
	margin-top:0.5rem !important;
	text-align:center;
}

.phonehint {
	font-size:0.9rem;text-align:center;
	margin-bottom:0.1rem;
}

.header-container {
	height:8rem; 
	/*background-color:#3b8fd1;*/
	/*background-color:white;*/
	background-color: #633aa4;
	font-family:'Open Sans';
	/*background:url(img-home-banner.jpg)	;*/
	display:grid;
	grid-template-rows: 100%;
	grid-template-columns: 15% 70% 15%;
	grid-template-areas:
	"logo1 title logo2"
	"logo1 title logo2"
}

.slot-telefono {
	display:flex;flex-direction:row;justify-content: center
}

.telefono-prefixlabel {
	font-size:1.rem;padding:0.1rem 1rem 0.1rem 1rem;margin-top:0.5rem;margin-right:0.5rem;
}

.msgwait {
	font-size:1.5rem;color:blue;margin-top:1rem;background-color:white;text-align:center;
	margin-top:3rem;
}

.errorMsg {
	color:red;font-size:1.3rem;text-align:center;margin-top:3rem;
}

.nok {
	color:red !important;
}

.footer-titlex1 {
	float:right;font-weight:normal;
	padding-top:0;height:2rem;margin-top:0.5rem;margin-right:2rem; color:white;
}

.warning-input {
	border:1px red solid;
}

.warning-hsbc {
	margin-top:1rem;
	font-size:0.9rem;
	text-align:center;
	color:black;	
}

.main-footer {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(5%, #015A8F), to(#0283D0));background:-webkit-linear-gradient(#015A8F 5%, #0283D0);background:-o-linear-gradient(#015A8F 5%, #0283D0);background:linear-gradient(#015A8F 5%, #0283D0);
}


.blinking{  animation:blinkingText 1.2s infinite;}@keyframes blinkingText{   0%{     color: blue;    }    49%{    color: blue; }    60%{    color: transparent; }    99%{    color:transparent;  }    100%{   color: #000;    }}


/* alert */
.alert {
 
}

.ui-widget-header {
    background-color: #1976d3 !important;
}

.ui-dialog-content {
	background-color: #F2F2F2 !important;	
}

/* ########################################## */
/* ESTO ES LO QUE SE USA EN LA VERSION BONDA */

.header-2{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    background: #6339a4;
    color: white;
}

.bondaLogoStyle-2 {
    margin: 0 0 0 0;
    height: 175px;
    width: 175px;
}
.catLogoStyle-2 {
    margin: 60px 0 0 0 ;
    height: 60px;
    width: 140px;
}
.titleHello-2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.title-2 {
    margin: 12px 0 0 0;
    font-size: 25px;
}
.hello-2 {
    margin: 10px 0 0 0;
    font-size: 30px;
    font-weight: normal;
    text-align: center;    
}


@media all and (max-width:768px) {
    .bondaLogoStyle-2 {
        margin: 0 0 0 30px;
        height: 85px;
        width: 85px;
    }
    .catLogoStyle-2 {
        margin: 25px 30px 0 0 ;
        height: 30px;
        width: 80px;
    }
    .titleHello-2 {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .title-2 {
        margin: 12px 0 0 0;
        font-size: 16px;
    }
    .hello-2 {
        display: none;    
    }
}

/* ########### FIN NUEVO ########## */
 

@media all and (max-width:768px) {
	
	
	body {
		margin-left: 0rem !important;
	}
	
	.header-container {
		height:8rem; 	
		display:grid;
		grid-template-rows: 100%;
		grid-template-columns: 40% 20% 40%;
		grid-template-areas:
		"logo1 logo2 logo2"
		"title title title"
	}
	
	.logo {
		width:100%;
		height:50% !important;
		height:2rem;
		margin-top:0rem !important;
		margin-left:2rem;
	}
	
	.logo2 {
		height:33%;margin-top:4.5%;
		margin-left:7rem;
		
	}
	
	.main-container {
		margin-left:1rem;
	}
	
	.main-title {
		font-size:0.8rem;
		margin-top:3rem !important;margin-bottom:0;padding-right:0.5rem;
	}
	
	#main-title-div{
		margin-botton:3rem;
	}
	
	.main-title2 {
		font-size:1.0rem;
		margin-top:2rem !important;
		padding-top:0 !important;
	}
	
	.ticket {
		font-size:0.9rem;
		margin-top:0rem;
		font-weight:bold;
		text-align:left;
	}
	
	.search-div {
		margin-top:1rem !important;
	}
	
	
	.search-input {
		font-size:1.0rem;
		width:11rem !important;
	}

	
	
	.myButton {
		font-size:0.8rem;
		height:30px !important;
		padding:0.2rem 0.9rem 0.2rem 0.9rem;
		margin-left:1rem !important;
	}
	.title1 {
		font-size:0.9rem;
		font-weight:normal;
		text-align:center;
		margin-top:1.0rem;
	}
	#productoid_p {
		font-size:0.9rem;
		margin-top:0 !important;
	}
	#telefono_p {
		font-size:0.9rem;
		margin-top:0 !important;
	}
	.phonehint {
		font-size:0.7rem;
	}
	#search-box {
		margin-top:4rem;
	}
	.logo-title1 {
		margin-top:-4rem;
		margin-left:0rem;
		font-size:1.0rem;
	}
	.logo-title2 {
		font-size:1.0rem;
		margin-left:0.7rem;
		margin-top:-2.8rem;
	}
	.logo {
		height:100%;margin-top:25%;margin-left:10%;
	}
	.title {
		margin-top:0;
	}
	.msgwait {
		/*font-size:2.7rem;color:blue;margin-top:1rem;background-color:white;margin-left:3rem;
		margin-top:3rem;*/
		font-size:1.2rem;color:blue;margin-top:1rem;background-color:white;
		text-align:center;margin-top:3rem;
	}
	
	.errorMsg {
		/*color:red;font-size:2.7rem;*/
		color:red;font-size:1.1rem;
	}
	
	.footer-titlex1 {
		font-size:0.7rem;
	}
	
	.warning-hsbc {
		padding-right:1.5rem !important;	
		padding-left:1.5rem !important;
	}
	
	.one-edge-shadow {
		-webkit-box-shadow: 0px 0px 3px grey;
	   -moz-box-shadow: 0px 0px 3px grey;
	        box-shadow: 0px 0px 3px grey;
		color:grey;
		border: 0px white solid;  
	}

}


@supports (-ms-ime-align:auto)  {
	.logo {
		height:15% !important;margin-top:8%;
		grid-area:logo1;
	}
	.logo2 {
		height:13%;margin-top:10%;
		grid-area:logo2;
	}
	
}

 
