﻿.how_tg_card_box{ width:27%; float:left; border-left:1px solid #666; background:url('../forms/credit_cards/images/tfh_arrow.png') no-repeat left; margin-bottom:20px; padding:0% 3.5% !important; }
.how_tg_card_box_big{ width:31%; padding-right:0px !important; }
.citi_fancy_logo{ float:right; padding:0px 0px 20px 0px; }
.formHldr_mar { margin-left:0px; }
.title_new{ background:#003399; padding:3px 0px 3px 0px !important; margin-bottom:10px; }
.title_new_p{ font-weight:bold; padding-bottom:0px !important; }
.mar-top-radio{  }
.formHldr .formInner .formField{ padding-top:0px; }
.fancy_form_apply{position: static;}


#fancybox-wrap{ width:490px !important; }
#fancybox-content{ width:465px !important; }
#fancybox-content-inner{ width:465px !important; }
.fancytop{top:50px !important;}

@media ( max-width:1024px ){
	.mar-top-radio{ margin-top:0px; }
	.formHldr.formStarted.commonForm.citiPre{ width:100%; }
	.formInner .formField{ width:43%; }
	.formInner .formValue{ width:53%; float:right !important; }
	.dropListLarge.drpLitLgeOne.portrait .sbHolder, .dropListLarge.portrait .sbOptions li, .dropListLarge.portrait .sbOptions{ width:215px !important; }
	.dropListLarge.portrait .sbSelector{ width:215px !important; }
	#fancybox-wrap{ left:25% !important	; }
}

@media ( max-width:768px ){
	.formHldr{ margin-top:0px !important; }
	.formInner .formValue{ padding-left:0px; }
	#fancybox-wrap{ left:15% !important	; }
}

@media (max-width:667px){
	#fancybox-wrap{ left:10% !important; }

}

@media (max-width:640px){
	#fancybox-wrap{ left:7% !important; }

}

@media (max-width:568px){
	#fancybox-wrap{ left:3% !important; }
}

@media (max-width:480px){
	#fancybox-wrap{ width:400px !important; left:5% !important;  }
	#fancybox-content{ width:380px !important; }
	#fancybox-content-inner{ width:380px !important; }
	.formInner .formField{ width:35%; }
	.inputBoxMedium{ padding:0px; width:107px !important; }
	.inputBoxLarge{ width:208px !important; }
	.dropListLarge .sbHolder, .dropListLarge .sbOptions li, .dropListLarge .sbOptions{ width:208px !important; }
	.dropListLarge.portrait .sbSelector{ width:208px !important; }
	.dropListLarge.drpLitLgeOne.portrait .sbHolder, .dropListLarge.portrait .sbOptions li, .dropListLarge.portrait .sbOptions{ width:208px !important; }
	.mar-top-radio{  }
	.formValue.fixedwidth.padNone{ padding:0px; }
	.formHldr{ padding:0px; }
	.contBoxHdSilk{ font-size:14px !important; }
	.mar_top_mob{ padding-top:10px !important; }
}

@media (max-width:375px){
	#fancybox-wrap{ width:300px !important; }
	#fancybox-content{ width:280px !important; }
	#fancybox-content-inner{ width:280px !important; }
	.sbHolder{ width:60px; }
	.sbOptions{ width:60px; }
	.inputBoxMedium.smallListBox.instantCard{ width:82px !important; }
	.dropListLarge .sbHolder, .dropListLarge .sbOptions li, .dropListLarge .sbOptions{ width:208px !important; }
	.dropListLarge.portrait .sbSelector{ width:155px !important; }
	.dropListLarge.drpLitLgeOne.portrait .sbHolder, .dropListLarge.portrait .sbOptions li, .dropListLarge.portrait .sbOptions{ width:155px !important; }
	#fancybox-wrap{ left:7% !important; }
	.sbSelector{ width:60px; text-indent:5px; }
}

@media (max-width:320px){
	#fancybox-wrap{ width:260px !important; }
	#fancybox-content{ width:240px !important; }
	#fancybox-content-inner{ width:240px !important; }
	.inputBoxLarge.kanatxtBox{ width:143px !important; }
	.dropListLarge.portrait .sbHolder, .dropListLarge.portrait .sbOptions li, .dropListLarge.portrait .sbOptions{ width:143px !important; }
	.dropListLarge.portrait .sbSelector{ width:143px !important; }
	.dropListLarge.drpLitLgeOne.portrait .sbHolder, .dropListLarge.portrait .sbOptions li, .dropListLarge.portrait .sbOptions{ width:143px !important; }
	.inputBoxMedium.smallListBox{ margin-left:0px; }
	.inputBoxMedium.smallListBox.instantCard{ width:70px !important; float:right; } 
}

@CHARSET "UTF-8";
.sbHolder{
	border: solid 1px #ccc;
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	height: 24px;
	position: relative !important;
	position/**/:/**/absolute;
	width: 88px;
	float:left;
	background: #fff;
}
.dropListsmallDrop .sbHolder{
	border: solid 1px #ccc;
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	height: 24px;
	position: relative !important;
	width: 88px;
	display:inline-block;
	top:8px;
	float:none !important;
	*float:left  !important;
	background: #fff;
}

.dropListBig .sbHolder{
	border: solid 1px #ccc;
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	height: 24px;
	position: relative !important;
	width: 100px;
	display:inline-block;
	top:0px;
	float:none !important;
	*float:left  !important;
	background: #fff;
}
	

.dropListYear .sbHolder{
	border: solid 1px #ccc;
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	height: 24px;
	position: relative !important;
	width: 75px;
	display:inline-block;
	top:8px;
	float:none !important;
	*float:left  !important;
	background: #fff;
}
.sbHolder:focus .sbSelector{
	
}
.dropListsmallDrop .sbSelector{width:60px !important;}

/*.dropListSmall.Tiny .sbSelector{width:40px !important;}
.dropListSmall.Tiny .sbHolder, .dropListSmall.Tiny .sbOptions li, .dropListSmall.Tiny .sbOptions{width:40px !important;}*/
.sbSelector{
	display: block;
	height: 24px;
	left: 0;
	line-height: 26px;
	outline: none;
	overflow: hidden;
	position: absolute;
	text-indent: 10px;
	top: 0;
	width: 88px;
	

}
.dropListLarge1 .sbHolder, .dropListLarge1 .sbOptions {width: 215px !important;}
.dropListLarge .sbHolder, .dropListLarge .sbOptions li, .dropListLarge .sbOptions{
	width: 215px !important;
}
.filterSec .dropListLarge .sbHolder, .filterSec .dropListLarge .sbOptions li, .filterSec .dropListLarge .sbSelector, .filterSec .dropListLarge .sbOptions{
	width: 284px !important;
}
.dropListLarge1 .sbOptions li, .dropListLarge1 .sbSelector{
	width: 194px !important;
}
.dropListSuppCard .sbHolder, .dropListSuppCard .sbOptions li, .dropListSuppCard .sbOptions{
	width: 260px !important;
	padding:0;
}
.dropListYear .sbHolder, .dropListYear .sbOptions li, .dropListYear .sbOptions{
	width: 89px !important;
	padding:0;
}
.dropListMonth .sbHolder, .dropListMonth .sbOptions li, .dropListMonth .sbOptions{
	width: 100px !important;
	padding:0;
}

.dropListHuge .sbHolder, .dropListHuge .sbOptions li, .dropListHuge .sbOptions{
	width: 350px !important;
}

.dropListBig .sbHolder, .dropListBig .sbOptions li, .dropListBig .sbOptions{
	width: 150px !important;
	padding:0;
}
.listBoxLarge .sbHolder, .listBoxLarge .sbOptions li, .listBoxLarge .sbOptions{
	width: 180px !important;
}
.dropListSmall .sbHolder, .dropListSmall .sbOptions li, .dropListSmall .sbOptions{
	width:80px !important;
}
.dropListSmallsize .sbHolder, .dropListSmallsize .sbOptions li, .dropListSmallsize .sbOptions{
	width:64px !important;
}
.dropListSmallsize.center .sbHolder,.dropListSmallsize.right .sbHolder{
	margin-left:10px;
}
.dropListsmallDrop .sbHolder, .dropListsmallDrop .sbOptions li, .dropListsmallDrop .sbOptions{
	width:60px !important;
	padding:0;
}
.dropListRedesign .sbHolder, .dropListRedesign .sbOptions li, .dropListRedesign .sbOptions{
	width: 300px !important;
	padding:0;
	*z-index:999999999 !important;
}
.dropListBig .sbSelector{width:150px;}
.dropListLarge .sbSelector{width:215px;}
.dropListSuppCard .sbSelector{width:260px;}
.dropListHuge .sbSelector{width:350px;}
.dropListSmall .sbSelector{width:80px;}
.dropListYear .sbSelector{width:89px;}
.listBoxLarge .sbSelector{width:180px;}
.dropListMonth .sbSelector{width:100px !important;}
.dropListRedesign .sbSelector{width:300px !important;}

.dropListLarge.listMedium .sbHolder, .dropListLarge.listMedium .sbOptions li, .dropListLarge.listMedium .sbOptions{
	width: 230px !important;
}
.dropListLarge.listMedium .sbSelector{width:230px; }

.tpFormBlock.existCustomer .tpFormBlockInn .sbOptions li{
	margin:0 !important;
	text-align:left;
	padding:0 !important;
	*display:inline;
}
.tpFormBlock.existCustomer .tpFormBlockInn .sbOptions li a{padding-left:10px;}

.dropListSmallForm .sbHolder, .dropListSmallForm .sbOptions li, .dropListSmallForm .sbOptions{
	width: 62px;
	text-align:left;
	padding-left:0px;
	float:left;
	
}
/*---chrome hack---*/
 
 @media screen and (-webkit-min-device-pixel-ratio:0) {
   
   .dropListSmallForm .sbHolder, .dropListSmallForm .sbOptions li, .dropListSmallForm .sbOptions
    {
      
     margin-top:2px; 
      }

}

.dropListLarge.balance .sbHolder, .dropListLarge.balance .sbOptions li, .dropListLarge.balance .sbOptions{width:293px !important;}
.dropListLarge.balance .sbSelector{width:293px; }
.sbSelector:link, .sbSelector:visited, .sbSelector:hover{
	color: #555;
	outline: none;
	text-decoration: none;
}

.dropListLarge.balance .sbOptions li, .dropListSmall .sbOptions li{*float:left;}


.commonFormSel .sbHolder{width:500px !important;}

.commonFormSel .sbOptions{width:500px !important;}
.commonFormSel .sbSelector{width:500px !important;}

.sbToggle{
	background: url(../images/down-arrow.jpg)  no-repeat;
	display: block;
	height: 24px;
	outline: none;
	position: absolute;
	right: 0;
	top: 0;
	width:23px;
}
.sbToggle:hover{
	background: url(../images/down-arrow.jpg)  no-repeat;
	height:24px;
	width:23px;
}
.sbToggleOpen{
	background: url(../images/up-arrow.jpg) 0 0px no-repeat;
	height:24px;
	width:23px;
}
.sbToggleOpen:hover{
	background: url(../images/up-arrow.jpg) 0 0px no-repeat;
	height:24px;
	width:23px;
}
.sbHolderDisabled{
	/*background-color: #3C3C3C;
	border: solid 1px #515151;*/
}
.sbHolderDisabled .sbHolder{
	
}
.sbHolderDisabled .sbToggle{
	
}
.sbOptions{
	background-color: #F7F7F7;
	border: solid 1px #ccc;
	list-style: none;
	left: -1px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 24px;
	width: 88px;
	z-index: 1;
	*z-index:9999;
	min-height:30px;
	max-height:150px !important;
	overflow-x: hidden;
	overflow-y: scroll;
	}

.sbOptions li {
	/*padding: 0 7px;
	width:88px !important;*/
}
.sbOptions a{
	/*border-bottom: dotted 1px #515151;*/
	display: block;
	outline: none;
	padding: 7px 6px 7px 10px;
}
.sbOptions a:link, .sbOptions a:visited{
	color: #555;
	text-decoration: none;
}
.sbOptions a:hover,
.sbOptions a:focus,
.sbOptions a.sbFocus{
	color: #3399CC;
}
.sbOptions li.last a{
	border-bottom: none;
}
.sbOptions .sbDisabled{
	/*border-bottom: dotted 1px #515151;
	color: #999;;*/
	display: block;
	padding: 7px 0 7px 10px;
	font-weight:bold;
}
.sbOptions .sbGroup{
	border-bottom: dotted 1px #515151;
	color: #555;
	display: block;
	font-weight: bold;
	padding: 7px 0 7px 0;
	margin:0 7px;
}
.sbOptions .sbSub{
	padding-left: 17px;
}

@media (max-width: 767px){
	.commonFormSel .sbHolder{width:260px !important;}
	.commonFormSel .sbOptions{width:260px !important;}
	.commonFormSel .sbSelector{width:260px !important;}

}

/*forms redesign*/
.dropListBig .sbHolder, .dropListBig .sbOptions li, .dropListBig .sbOptions{width: 150px !important;padding:0;}
.dropListBig .sbHolder{
border: solid 1px #ccc;font-family: Arial, sans-serif;font-size: 12px;font-weight: normal;height: 24px;position: relative !important;width: 100px;display:inline-block;top:0px;
float:none !important;*float:left !important;background: #fff;}
.dropListRedesign .sbSelector{width:300px !important;}
.dropListRedesign .sbHolder, .dropListRedesign .sbOptions li, .dropListRedesign .sbOptions{width: 300px !important;padding:0;}
/*forms redesign*/

/*W-2014-1455 New Citigold KANA form*/

.dropListSmallsize .sbHolder, .dropListSmallsize .sbOptions li, .dropListSmallsize .sbOptions{width:64px !important;}
.dropListSmallsize.center .sbHolder,.dropListSmallsize.right .sbHolder{margin-left:10px;}

/*W-2014-1455 New Citigold KANA form*/

@media (max-width:375px){
	.newWidt .sbHolder, .newWidt .sbOptions li, .newWidt .sbOptions{ width: 70px; text-align:left; padding-left:0px; float:left; }
	.newWidt .sbSelector, .newWidt .sbSelector, .newWidt .sbSelector{ width: 70px; text-align:left; padding-left:0px; float:left; }
}