/*
    Note: It is best to use a less version of this file ( see http://css2less.cc
    For the media queries use @screen-sm-min instead of 768px.
    For .omb_spanOr use @body-bg instead of white.
*/

/*	INIZIO parte per bandierine scelta lingua */

/*	css riadattato da: https://codepen.io/bahadirtezer/pen/mBwFA
	img bandierine prese da: http://flag-icon-css.lip.is/ (https://github.com/lipis/flag-icon-css)
	ma NON ho usato il suo css, ho preso solo le img delle bandiere (da mettere in img/flags)
*/
.flags {
	padding-bottom: 5px;
/*
	width: 200px;
	height: 32px;
*/
	line-height: 1.2em;
	float: right;
}
.flags a { /* per far comparire il cursore standard quando il mouse si trova sopra il link */
	cursor: pointer;
	cursor: hand;
}
.flags img { /* consigliabile tenere il rapporto width/line-height = 3/2 */
	width: 1.8em;
	height: auto;
	padding: 0;
	margin: 0;
/*	padding: 0px 1px; */
}
.flags ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
.flags ul li {
	display: inline;
}
/* FINE parte per bandierine scelta lingua */

@media (min-width: 768px) {
	.omb_row-sm-offset-3 div:first-child[class*="col-"] {
		margin-left: 25%;
	}
}
hidden-xs
.omb_login .ombf_authTitle {
	text-align: center;
	line-height: 300%;
}
	
.omb_login .omb_socialButtons a {
	color: white; // In yourUse @body-bg 
	opacity:0.9;
}
.omb_login .omb_socialButtons a:hover {
    color: white;
	opacity:1;    	
}
.omb_login .omb_socialButtons .omb_btn-facebook {background: #3b5998;}
.omb_login .omb_socialButtons .omb_btn-facebook:hover {background: #4c70ba;}
.omb_login .omb_socialButtons .omb_btn-twitter {background: #55acee;}
.omb_login .omb_socialButtons .omb_btn-twitter:hover {background: #83c3f3;}
.omb_login .omb_socialButtons .omb_btn-google {background: #dd4b39;}
.omb_login .omb_socialButtons .omb_btn-google:hover {background: #e47365;}
.omb_login .omb_socialButtons .omb_btn-linkedin {background: #0976b4;}
.omb_login .omb_socialButtons .omb_btn-linkedin:hover {background: #0b96e5;}
.omb_login .omb_socialButtons .omb_btn-pipposocial {background: #000000;}
.omb_login .omb_socialButtons .omb_btn-pipposocial:hover {background: #888888;}
.omb_login .omb_socialButtons .omb_btn-spid {background: #3b5998;}
.omb_login .omb_socialButtons .omb_btn-spid:hover {background: #4c70ba;}

/*

.omb_login .omb_socialButtons .omb_btn-facebook {background: #3b5998;}
.omb_login .omb_socialButtons .omb_btn-twitter {background: #00aced;}
.omb_login .omb_socialButtons .omb_btn-google {background: #c32f10;}
.omb_login .omb_socialButtons .omb_btn-linkedin {background: #0976b4;}
.omb_login .omb_socialButtons .omb_btn-linkedin:hover {background: #0b96e5;}
.omb_login .omb_socialButtons .omb_btn-pipposocial {background: #000000;}
.omb_login .omb_socialButtons .omb_btn-pipposocial:hover {background: #888888;}



eventualmente copiare tutti i vari bgcolor e bgcolor hover da qui: http://bootsnipp.com/snippets/3kQrB
a sto punto cambiare nomi agli stili qua dentro?
*/

.omb_login .omb_loginOr {
	position: relative;
	font-size: 1.5em;
	color: #aaa;
	margin-top: 1em;
	margin-bottom: 1em;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}
.omb_login .omb_loginOr .omb_hrOr {
	background-color: #cdcdcd;
	height: 1px;
	margin-top: 0px !important;
	margin-bottom: 0px !important;
}
.omb_login .omb_loginOr .omb_spanOr {
	display: block;
	position: absolute;
	left: 50%;
	top: -0.6em;
	margin-left: -1.5em;
	background-color: white;
	width: 3em;
	text-align: center;
}			
.omb_login .omb_loginForm .input-group.i {
	width: 2em;
}
.omb_login .omb_loginForm  .help-block {
    color: red;
}
@media (min-width: 768px) {
    .omb_login .omb_forgotPwd {
        text-align: right;
		margin-top:10px;
 	}
}

/***********************************
INIZIO personalizzazioni per comitel
***********************************/

.nascosto {
	display: none;
}
.centrato { /* = text-center di bootstrap */
	text-align: center;
}
.footer-comitel {
	margin-top: 40px;
/*	text-align: center; */
}

/*
aggiungo spazio sotto alla riga, i vari padding non dovrebbero servirmi ma li tengo
*/

.top5 {margin-top: 5px !important;}
.top7 {margin-top: 7px !important;}
.top10 {margin-top: 10px !important;}
.top15 {margin-top: 15px !important;}
.top17 {margin-top: 17px !important;}
.top20 {margin-top: 20px !important;}
.top30 {margin-top: 30px !important;}

.bottom5 {margin-bottom: 5px;}
.bottom7 {margin-bottom: 7px;}
.bottom10 {margin-bottom: 10px;}
.bottom15 {margin-bottom: 15px;}
.bottom17 {margin-bottom: 17px;}
.bottom20 {margin-bottom: 20px;}
.bottom30 {margin-bottom: 30px;}

.right5 {margin-right: 5px;}
.right7 {margin-right: 7px;}
.right10 {margin-right: 10px;}
.right15 {margin-right: 15px;}
.right17 {margin-right: 17px;}
.right20 {margin-right: 20px;}
.right30 {margin-right: 30px;}

.padding5 {padding: 5px;}
.padding7 {padding: 7px;}
.padding10 {padding: 10px;}
.padding15 {padding: 15px;}
.padding17 {padding: 17px;}
.padding30 {padding: 30px;}

/* lo applica anche senza !important ma lo tengo lo stesso */
.testo_x2 {
	font-size: 2em !important;
}
.testo_x3 {
	font-size: 3em !important;
}
.testo_x4 {
	font-size: 4em !important;
}
.testo_x5 {
	font-size: 5em !important;
}
.testo_x6 {
	font-size: 6em !important;
}
.testo_grassetto {
	font-weight: bold;
}
.cursor_help {
	cursor: help;
}
.ingrandito {
	transform: scale(2);
	transform-origin: 50% 0%;
}
.testo_nero {
	color: black !important;
}
/*
	default, display medio-grandi (max-width > 768px): dimensiono logo_cliente al 50% della larghezza del display (max-width:50%;)
*/
.logo_cliente {
	display: block;
	max-height:60vh;
	max-width: 70%;
	margin: auto; /* per centrare l'immagine orizzontalmente */
	margin-top: 5px;
	margin-bottom: 10px;
	clear: both; /* IMPORTANTE per tenerlo centrato se segue un elemento float (bandierine scelta lingua) */
}
.loghi_header {
	display: block;
/*	max-height: 15vh;*/ /* 15vh = 15% viewport height */
	max-height: 15%;
	max-width: 40%;
	margin: auto;
/*	margin-bottom: 15vh;*/
}
.logo_wifi_hotspot_header {
	display: inline-block;
	max-height:100%;
	max-width: 30%;
	margin:4px;
}
.logo_comitel_header {
	display: inline-block;
	max-height:60%;
	max-width: 30%;
	margin:4px;
}
.logo_partner_header {
	display: inline-block;
	max-height:60%;
	max-width: 30%;
	margin:4px;
}
.nome_cliente {
/*	display: block;
	margin: auto;*/
	margin-top: 8px;
	font-size:3em;
}

/* logo wifi (se visualizzato singolarmente e NON in un div con altri logo comitel ad es. loghi_header): SEMPRE max 40% larghezza */
/* => simile a logo_cliente*/
.logo_wifi_hotspot {
	display: block;
	max-width:40%;
	margin: auto;
}
.logo_comitel_footer {
/*	display: block; */
	height: 1.7em; /* imposto altezza img = altezza del testo */
	max-width: auto;
	margin: left;
}

/*
	per tablet e cellulari (max-width: 768px) dimensiono il logo a tutta la larghezza del display (max-width:100%)
*/
@media only screen and (max-width: 768px) {
	.ingrandito {
		transform: scale(1);
		transform-origin: 50% 0%;
	}
	.logo_cliente {
		display: block;
		max-height:30vh;
		max-width: 100%;
		margin: auto;
		margin-top: 4px;
		margin-bottom: 4px;
	}
	.loghi_header {
		display: block;
		max-height: 15%;
		max-width: 80%;
		margin: auto;
	/*	margin-bottom: 2px;*/
	}
	.logo_wifi_hotspot_header {
		display: inline-block;
		max-height:100%;
		max-width: 30%;
		margin:2px;
	}
	.logo_comitel_header {
		display: inline-block;
		max-height:60%;
		max-width: 30%;
		margin:2px;
	}
	.logo_partner_header {
		display: inline-block;
		max-height:60%;
		max-width: 30%;
		margin:2px;
	}
	.nome_cliente {
/*		display: block;
		margin: auto;*/
		margin-top: 8px;
		font-size:1.8em;
		clear: both; /* IMPORTANTE per tenerlo centrato se segue un elemento float (bandierine scelta lingua) */
	}
}

/***********************************
FINE personalizzazioni per comitel
***********************************/