/*  IMPORT FONTS  ============================================================================= */


body {font-family: Arial ,sans-serif;background: url(../images/body-blue.jpg) center no-repeat;color:#53565a;font-size: 12px; background-size: cover;}
h1,h2,h3,h4,h5,h6 {color:#002d72;}
a {color:#00bdf2;}
a:hover {color:#008ce6;}
.btn-default, .ui-dialog-buttonset button {color: #fff; background-color: #00bdf2; border-radius:0px; border: none; font-weight: bold; font-size: 12px;}
.btn-default:hover, .ui-dialog-buttonset button:hover {background-color:#008CE6; color: #fff;}
a.cyan, a.cyan:link {color: #00bdf2; text-decoration: underline;}
a.cyan:hover {text-decoration: none; color: #008CE6;}
.cta {padding-top: 10px;}
.ie8-sso {display: none;}
.form-signin-container {
	max-width: 398px;
	max-height: 420px;
	margin: 10% auto;
}
/** HEADER **/
.blk-utility-nav {
	height: 23px;
	background: #313431; /* Old browsers */
	background: -moz-linear-gradient(top,  #313431 1%, #313431 49%, #2c2c2c 50%, #000000 100%, #000000 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#313431), color-stop(49%,#313431), color-stop(50%,#2c2c2c), color-stop(100%,#000000), color-stop(100%,#000000)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #313431 1%,#313431 49%,#2c2c2c 50%,#000000 100%,#000000 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #313431 1%,#313431 49%,#2c2c2c 50%,#000000 100%,#000000 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #313431 1%,#313431 49%,#2c2c2c 50%,#000000 100%,#000000 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #313431 1%,#313431 49%,#2c2c2c 50%,#000000 100%,#000000 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#313431', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
	overflow: hidden;
}



/*SELECT MENU*/
.citi-select {border:1px solid #CCCCCC; background: #fff url(../images/selectmenu-bg.png) no-repeat right 0; border-radius:0px; color:#53565a; font-size: 12px; padding: 3px 30px 4px 10px!important; cursor: pointer!important;}
.citi-select:active {background: #fff url(../images/selectmenu-bg.png) no-repeat right -50px;}
.citi-select:hover,
.citi-select:focus,
.citi-select.active,
.open > .dropdown-toggle.citi-select {background-position:  right -50px;box-shadow: none; color:#008ae7;}
.bootstrap-select .dropdown-menu {background: #fff url('../images/bodybg.png') repeat 0 0!important; color: #008ae7; border-radius:0; margin:0; border-top:0; font-size:12px;}
.dropdown-menu.open {padding-top:0; padding-bottom:0;box-shadow: none;}
.bootstrap-select .dropdown-menu ul.inner li a {color: #53565a; padding: 13px 10px 0px;}
.bootstrap-select .dropdown-menu ul.inner li a span.text { background: url('../images/dotted_line_tile.png') repeat-x left bottom; display: block; padding-bottom:13px;}
.bootstrap-select .dropdown-menu ul.inner li:last-child a span.text {background: none;}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus {outline: none!important;}
.dropdown-menu ul.inner li a:hover {color:#008ae7;}
.citi-select .caret {color:#fff; right:8px!important;}
.btn.citi-select .dropdown-toggle {padding-right: 28px;}
.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {width: 100%;}
/*INPUT*/
input.citi-input {color:#0F1632;border: none; border-bottom: 2px solid #0F1632;font-size:16px;padding: 10px 0px!important; outline-offset: 4px; width:100%;}
input.citi-input::-moz-placeholder { color:#0F1632;}
input.citi-input:-ms-input-placeholder {color:#0F1632;}
input.citi-input::-webkit-input-placeholder {color:#0F1632;}
input.citi-input::-ms-reveal {display:none;}

/* SSO LOGIN SCREENS */
body.sso-body {font-family: 'Interstate', Arial, verdana, helvetica, helve, sans-serif;}
.form-signin {
	padding: 0;
	margin: 0 auto 20px;
	background-color: #FFFFFF;
	border-radius: 20px;

}
.sso-logo img {
	width: 83px;
  }
.form-signin-header { margin-top:0;  padding: 30px 30px 20px;}
.form-signin-header h1 {display: block;  float: left; clear: both; color: #255BE3; font-family: 'Interstate', Arial, verdana, helvetica, helve, sans-serif; font-size: 21px; line-height: 25.2px; margin-bottom: 0; margin-top: 20px; }
.form-signin-header img {float: left;width:64px}
.form-signin h2 {padding: 0 32px; margin: 9px 0 20px;color: #0F1632; font-family: 'Interstate', Arial, verdana, helvetica, helve, sans-serif; font-size: 18px;}
.form-signin h3 {padding: 0 32px; margin: 29px 0 20px;}
ul.controls-container {padding: 0 32px; list-style:none; margin-bottom:0px!important;margin-right: auto;margin-left: auto;max-width: 425px;}
ul.controls-container input.citi-input {padding: 1px 10px 2px;}
ul.controls-container li {margin-bottom: 20px;}
ul.controls-container li:last-child {margin-top: 18px;}
ul.controls-container li ul.dropdown-menu li{margin-bottom: 0px;}
.btn-default, ul.controls-container li.last-child {margin-bottom: 10px;}
.btn-default.sso, .btn-default {width: 179px; background-color: #255BE3; border-radius: 20px; height: 34px; font-family: 'Interstate', Arial, verdana, helvetica, helve, sans-serif; font-size: 16px; font-weight: normal; cursor: pointer;}
.btn-default.cancel {background: #97999b; width: 100%;}
.btn-default.cancel:hover {background: #008ce6;}
div.sso-dvider {margin: 0 32px 16px; background: #ddd; height: 1px; padding:0;display: none;}
.sso-actions {text-align: center; margin-bottom: 13px; color: #0F1632; position: relative; top: -78px; left: 215px; width: 150px;}
.sso-actions a, .sso-actions a:link {font-size:14px;color: #0F1632;}
.sso-actions a:hover {color:#008ce6;}
div.sso-legal {font-family: 'Interstate_Light', Arial, verdana, helvetica, helve, sans-serif;font-size: 9px; padding: 0 32px 28px; margin-top: -45px; color: #53565a; font-weight: bold;}
div.sso-legal.margin-t0 { margin-top: 0;}
ul.controls-container li.sso-logo img {float: right; margin-top: 8px;}
div.cta-mobile {display: none;}
.sso-logo {width: 240px; display: block; text-align: center; margin-bottom: 19px!important;position: relative; top: -12px; left: 20%;}
.sso-logo.l0 {left: 0!important;}
div.sso-footer {font-size: 8px; padding: 0 32px 28px; display: none;}
.sso-footer output{font-size:8px; float: right; }
.top-bar-2 {height: 11px; background-color: #000000;}
.top-bar-1 {height: 11px; background-color: #373737;}
.btn-default.sso.full {
	width: 100%;
}

/*LANGUAGE DROPDOWN DESKTOP*/
.selectlanguage {float: left;font-size: 10px;height: 22px;padding-left: 16px;font-family: Arial;z-index: 999;}
.selectlanguage .lan{text-decoration: none;line-height: 22px;text-transform:uppercase;height: 200px;}
.selectlanguage .lan span {display: inline-block;width: 64px;}
.selectlanguage a{color: #FFFFFF;text-decoration: underline;}
.selectlanguage a:hover{color: #FFFFFF;text-decoration: none;}
.arr{background: url("../images/assets/images/icn/global_arr.png") no-repeat scroll right top transparent;}
.arrhover{color: #FFFFFF;text-decoration: none;background: url("../images/assets/images/icn/global_arr_over.png") no-repeat scroll right top transparent;}
.ul_top_nav_link {float: right;list-style: none;padding:0; margin:0;}
#header .helplink {float: left;font-size: 10px;height: 22px;line-height: 22px;font-family: Arial;}
.middlelink{float:left;margin-left: 10px;margin-right: 10px;line-height: 22px;}	
.helplink a{text-decoration: none;color: #FFF;text-transform: uppercase;}
.helplink a:hover{color:#FFF;}
#ul_flag_sub {height: 100px;width: 154px;background: url("../images/global_country_bg.png") 0 -125px ;position: absolute;z-index: 1001;display: block;list-style: none; padding:0; margin: 0 0 0 -10px;}
#ul_flag li ul li {display: inline;margin-top: 10px;margin-bottom: 10px;}
#ul_flag {position: absolute;z-index: 999;}
#ul_flag_sub li a{line-height: 22px;overflow: visible;width: auto;cursor: pointer;padding-left: 10px;font-size: 10px;text-transform:uppercase;}
#ul_flag_sub li a:hover{color: #FFFFFF;}
div.inner-utility {margin:0; padding: 0 32px;}
p.terms-lan {width: 40%;}
.citi-input.disabled {background: #efefef; color:#53565a;}

/** BEGIN SCREEN SIZE 768 **/
@media only screen and (max-width: 800px){ 
}
@media only screen and (min-width: 767px) and (max-width: 1024px){ 
	body {
		background-size: auto;
	}
	.form-signin-container {
		margin: 30% auto;
	}
}
@media only screen and (max-width: 767px){ 
	/*SSO MOBILE*/
	body {
		background-size: auto;
	}
	body.sso-body {padding-top: 0px; padding-bottom: 0px; margin: 40% auto;}
	.btn-default.sso {width: 100%;}
	.sso-citi-logo {width: 35px; height: auto;}
	
	p.terms-lan {width: 100%;}
	.bg-danger {padding: 26px;}	
	.form-signin {box-shadow: none!important; border: none!important;}

	.form-signin-container {
		max-width: 336px;
	}
	.sso-logo {
		width: 100%;
		margin-bottom: 19px !important;
		position: relative;
		top: -6px;
		left: 0;
	}
	.sso-actions {
		margin-bottom: 40px;
		position: relative;
		top: -5px;
		left: 28%;
	}
	div.sso-legal {
		padding: 0 32px 28px;
		margin-top: -30px;
	}	
}

.SubHeader, .login-message {
	font-family: 'Interstate', Arial, verdana, helvetica, helve, sans-serif;
    font-weight: 400;
    font-size: 16px;
    padding: 12px 18px 30px;
    background-color: #FFFFFF;
	color: #0F1632;
	line-height: 19px;
    text-decoration: none;
	margin-left: 15px;
}


.SubHeader-margin {
	margin-top: 20px;
}

.pwd-validation {
	list-style: none;
	padding-left: 0;
}
.pwd-validation li{
	
}

li.pwd-valid {
    color: #255BE3;
    margin-bottom: 10px!important;
}

ul.pwd-validation li:last-child {
	margin-top: 0!important;
	margin-bottom: 20px!important;
}

li.pwd-valid:before {
    content: '\2713';
	display: inline-block;
	padding: 0 6px 0 0;
}

li.pwd-not-valid {
    color: #97999b;
	margin-bottom: 10px!important;
    
}

li.pwd-not-valid:before {
    content: '\D7';
	display: inline-block;
	padding: 0 6px 0 0;
	font-size: 21px;
	vertical-align: middle;
	line-height: 12px;
}
