/*All css for BA Iconic version jsp*/

@import url('iconiccurtain.css');

@import url('../ics/common/common.css');

#baAlert1{float: left;display: inline-block;width: 726px;text-align: left;margin-bottom:6px;}
#tabDiv{float: left;margin-bottom: 6px;display: inline-block;width: 726px; text-align: left;}
.dj_ie #tabDiv {margin-bottom: 0px !important; }

TD { border-right-width:0px; border-left-width:0px;border-top-width:0px;border-bottom-width:0px;}
#mainBC {width: 732px;height: 550px;margin: 0 auto;text-align: left;float:left;}
/*.dj_ie #mainBC {top:175px !important;}*/
#bottomDiv {width: 732px;height: 50px;margin: 0 auto;text-align: left;margin-left:140px;float:left;}
#rightDiv {width: 200px;height: 680px;margin: 0 auto;text-align: right;margin-left:20px;float:left;background:green}

/* Static Content css*/

.staticContent a:visited,
.staticContent a{
	color: #438DD8;	
	cursor: pointer;
}

.staticContent .media .link{
	font-weight: bold;
	cursor: pointer; 
}

.staticContent .media .expanded{
	width: 506px;
	padding: 10px 0 20px 12px !important;
}

.staticContent .media .list{
	padding: 12px 0 0;
}

.staticContent .buttonWithNoBorder{
	background:none;border:0;padding:0;cursor:none;
}

.staticContent .dummyPhone{
	background: url(../../images/device/static_contacts_phone.png) no-repeat;
	margin: 22px 0 0;
	height: 170px;
	width: 110px;
	float: left;
}

.staticContent .contacts{
	width: 420px; 
	float: left;
	padding-top: 20px;
}


.staticContent ul{
	list-style-type: decimal; 
	padding-top:0;
	padding-left: 22px;
	margin: 0px;
}

.staticContent li{
	padding-bottom: 5px;
}

/*Contacts Form css*/
.baContainer {}
.baContainer .contactsFormDiv {padding: 0 0 0 5px;float:left;}
.baContainer .contactsFormDiv .formTitle {padding: 15px 0 25px 0;font-weight:bold;font-size:25px;}
.baContainer .contactsFormDiv .brokenLine{border-bottom:1px dashed #C8C8C8;height:5px;clear:both;display:block;width:500px;}
.baContainer .contactsFormDiv .plusSymbol {font-size:14px;font-weight:bold;padding-right:5px;}
.baContainer .contactsFormDiv .newPlusSymbol {font-size:14px;font-weight:bold;padding-right:5px;color:#0066CC;text-decoration: underline}
.baContainer .contactsFormDiv .plusSymbol {font-size:14px;font-weight:bold;padding-right:5px;color:#0066CC;text-decoration: underline}
.baContainer .contactsFormDiv .secHeadDiv{padding: 15px 0 15px 0;}
.baContainer .contactsFormDiv .sectionTitle{font-weight:bold;font-size:18px;}
.baContainer .contactsFormDiv .subSectionTitle{font-weight:bold;}

.baContainer .contactsFormDiv .phoneBox{width:85px;margin-right:5px;}	
.baContainer .contactsFormDiv .mobilePhoneBox,
.baContainer .contactsFormDiv .homePhoneBox,
.baContainer .contactsFormDiv .workPhoneBox{width:85px;margin-right:3px;}

.baContainer .contactsFormDiv .mobilePhoneSpan,
.baContainer .contactsFormDiv .homePhoneSpan,
.baContainer .contactsFormDiv .workPhoneSpan{margin-right:10px;}

.baContainer .contactsFormDiv .emailBox{margin-top:10px;}
.baContainer .contactsFormDiv .emailSelect{margin-right:10px;}
.baContainer .contactsFormDiv .emailTxtbox{margin-right:3px;}

#contactsFormDiv {}
#contactsFormDiv.formOpen {overflow-x: hidden; overflow-y: scroll;}

#contactsFormDiv {overflow-x: hidden; overflow-y: scroll;}
.baContainer.iPad #contactsFormDiv {z-index:1;width:700px;overflow-x: hidden; overflow-y: scroll;}

.baContainer .noLink { color:black !important;text-decoration:none;}
.baContainer .buttonAsLink {background:none;border:0;color:#0066CC;cursor:pointer;}
.baContainer .buttonAsLink span{text-decoration:underline;cursor:pointer;}
.baContainer .buttonAsNoLink {background:none;border:0;padding:0;color:grey !important;cursor:pointer;font-weight:bold;}
.baContainer .buttonAsNoLink span{text-decoration:none;}
.baContainer .phoneBulletsList{width:460px;}

.baContainer .staticContentMain{
	border:1px solid #CCCCCC ;
	float:left;   
	width:726px ;
	height:700px;
}


.importBrokenLine{border-bottom:2px solid;height:5px;clear:both;display:block;width:350px;}
 .buttonAsTab {
    font-weight: bold; 
 	text-align: left; 
 	border: 2px solid #CCCCCC ; 
  	border-style: outset; 
  	border-bottom-style: none;
  	border-left-style: none;
   	margin:0px
 }
 
 ol#toc{height: 2em;list-style: none;margin: 0 auto;padding: 0;}
 ol#toc .roundedTab button{    
	/*float: left;*/display:inline-block;
	border-style: outset;border-bottom-style: none;
	-moz-border-radius:15px 15px 0px 0px; /* Firefox */
	border-radius:15px;border-width: 1px;border-color:black;/*#657AB7*/
	-webkit-border-radius:15px; /* safari */
	-webkit-border-top-left-radius: 15px;
	-webkit-border-top-right-radius: 15px;
	-webkit-border-bottom-right-radius: 0px;
	-webkit-border-bottom-left-radius: 0px;
	}
 /*ol#toc a {background: #bdf;color: #008;display: block;float: left;height: 2em;padding-left: 10px;text-decoration: none;}*/
 ol#toc .roundedTab button:hover {background-position: 0 -120px;background:white;}
 ol#toc .roundedTab button:hover span {background-position: 100% -120px;}
 ol#toc .roundedTab button.selected {background: none !important;background-position: 0 -60px;font-weight: bold; border-bottom-color:white;}
 ol#toc .roundedTab button.selected span {background-position: 100% -60px;}
 ol#toc .roundedTab button.notselected {font-weight: bold;cursor:pointer;color:#545454;background:#CCCCCC}
 ol#toc .roundedTab span {display: inline-block;line-height: 2em;padding-right: 10px;}
 div.content {/*margin-left:20px;*/display:inline-block;/*margin-top:30px;*/}
/*.baContainer .listItem {margin-left:9px;}*/

/*.baContainer.dj_ie .selectAll {margin-top:-35px;}*/
.baContainer.dj_ie .contactsItem .checkbox {margin-bottom:20px;}
.baContainer .nextPrevLinks {margin-top:5px;margin-right:5px; float:right;}
.baContainer.dj_ie .nextPrevLinks.top {margin-top:-20px;}

/* Contacts Row css*/
.contactsRow {
}

.contactsRow .body {
    background: #fff;
    position: relative;
	zoom: 1;
	height: 66px;
	overflow: hidden;
	display: block;
}

.dj_gecko .contactsRow .body {
	padding-bottom:1px;
}

 .contactsItem {
 	border:1px solid #d9d9d9;
	/*border-left:1px solid #d9d9d9;
	border-bottom:1px solid #d9d9d9;
	width:100%;*/
	width:720px;
	height:100%;
}

.contactsRow .contactsItem.rowSelected {
	background-color: #E0FFFF;
}

.contactsRow.vspSelected .body {
	background-color: #ebebeb;
}

.contactsRow.rowHover .body {
	background-color: #d9d9d9 !important;
}

.contactsRow img {
    height: 52px;
    width: 52px;
    position: absolute;
    left: 35px;
    top: 10px;
}

.contactsRow .summary {
    margin: 0 0 0 80px;
    padding: 5px 0;
    line-height: 15px;
    width: 260px;
	height: 60px;
	white-space: nowrap;
	overflow: hidden;
}

.contactsRow .name,
.contactsRow .phone {
	font-weight: bold;
}

.contactsRow .name span {
	/*font-weight: normal;
	padding-left: 6px;*/
}

.contactsRow .date {
    margin: 6px 0 0 0;
    width: 150px;
    color: #999999;
	vertical-align: top;
	font-family:arial;
	font-size:11px;
}

.contactsRow .icsROToolbar,
.contactsRow .icsROButton.select {
    position: absolute;
    top: 20px;
    right: 100px;
}

.contactsRow .icsROButton.select {
    right: 35px;
    visibility: hidden;
}

.rowHover .icsROButton.select,
.vspSelected .icsROButton.select {
    visibility: visible;
	cursor: pointer;
}

.contactsRow .iceIcon{
	/*background:transparent url(../../images/ics/vzwBASprites.png) no-repeat scroll -198px -52px;
	width:20px;
	height:20px;*/
	background:url("images/ics/nab/icons/ice.png") no-repeat;
	height: 20px;
    width: 20px;
}

.contactsRow .vzwIcon{
	/*background:transparent url(../../images/ics/vzwBASprites.png) no-repeat scroll -432px -34px;
	width:20px;
	height:20px;*/
	background: url(../../../images/vzwrga/formSmSprite.png) no-repeat transparent;
	height:15px;
	width:20px;
	background-position: -185px;
}

.contactsRow .mbSyncIcon{
	/*background:transparent url(../../images/ics/vzwBASprites.png) no-repeat scroll -402px -34px;
	width:20px;
	height:20px;*/
	background:url("../../../images/vzwrga/formSmSprite.png") no-repeat scroll -240px 50% transparent;
	width:20px;
	height:15px;
}

.autoEllipsis {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	width: 100%;
}

.contactsRow .group {
    width: 185px;
	vertical-align: top;
}

.contactsRow .mobileGroupsLabel {
    margin: 0 0 3px 3px;
    width: 150px;
    height: 50px;
    font-size: 11px;
    overflow: hidden;
}

.contactsRow .mobileGroupsSpan {
    /*background:transparent url(../../images/ics/vzwBASprites.png) no-repeat scroll -380px -36px;
	width: 23px;
	height: 13px;
	margin: -40px 0 0 0;*/
	background: url("../../../images/vzwrga/groups.png") no-repeat scroll 50% 50% transparent;
    height: 21px;
    vertical-align: top;
    width: 22px;
}

.baContainer .closeIcon {
    background: url("../../images/ics/InboxSprites.png") no-repeat scroll -338px -120px transparent;
    cursor: pointer;
    height: 20px;
    margin-left: 2px;
    width: 17px;
}

.contactImageCrop label {
	display: block;
	font-weight: bold;
}

.contactImageCrop .cropperContainer {
	height: 200px;
	width: 200px;
	background: #cccccc;
	position: relative;
}
.contactImageCrop .photoWrapper {
	width: 230px;
	top:-40px;
	position: relative;
}

.contactImageCrop .photoPreview img {
	height: 100px;
	width: 100px;
}

.contactImageCrop .contactName {
	font-size: 15px;
	font-weight: bold;
	margin-left: 10px;
	width:250px;
}

/* part of the widget: drag handle styles */
.contactImageCrop{
	margin:0px 25px;
}

.contactImageCrop .buttonAsLink {background:none;border:0;color:#0066CC;cursor:pointer;width:50px;}
.contactImageCrop .buttonAsLink span{text-decoration:underline;cursor:pointer;}

.contactImageCrop .imageDragger {
	/* required: */
	position:absolute;
	/* optional: */
	cursor: move;
	z-index:999;
    border:3px solid #f4131d;
	background: #ebebeb;
}

.contactImageCrop .dojoxResizeHandle {
	float: right;
	position: absolute;
	right: 2px;
	bottom: 2px;
	width: 13px;
	height: 13px;
	z-index: 20;
	background-image: url('../images/contacts/icons/resize.png');
	line-height: 0px;
}

.contactImageCrop .dojoxResizeNW {
	cursor: nw-resize;
}

.contactImageCrop .photoPreview {
	position: relative;
	overflow: hidden;
}

/* this is needed to fix an IE bug with fileuploader */
.contactImageCrop .linkSpan {
	vertical-align: middle;
}

.contactImageCrop .avatarTable {
    width: 217px;
    height: 200px;
	padding: 5px;
	background-color: #cccccc;
	overflow-y:auto;
}
.contactImageCrop .avatarTable img
{
	background: #ffffff;
	color: inherit;
	margin: 2px;
	width: 42px;
	height: 42px;
	border: 2px solid #ffffff;
}

.contactImageCrop .avatarTable img.selected
{
	border:2px solid #f4131d;
}

.contactImageCrop .wrapperContainer {
	position: relative;
}

.contactImageCrop .divider {
height: 20px;
border-bottom: 1px dotted #C8C8C8;
margin-bottom:8px;
}
.contactImageCrop .uploadHover {
	cursor:pointer !important;
}

.dj_ie6 .contactImageCrop .cropperContainer,
.dj_ie7 .contactImageCrop .cropperContainer{
	margin-bottom:6px;
	margin-right:3px;
}
.baContainer .nextButton{
	display:inline-block;
}
.baContainer .numberLabel{
	display: inline-block; 
	/*margin-right: 1px; 
	margin-left: 1px; */
	font-weight: bold;
	margin-top:3px;
}
.baContainer .previousButton{
	display:inline-block;
}
.baContainer .toogleCount{
	color:black;cursor:auto;padding-left:1px;
	margin-left:18px; /*-8px; /*-14px;*/
	margin-top:3px;/*width:72px;*/
}
.baContainer .actionBtn{
	margin-right:5px;font-weight:bold;
}
.baContainer .selectAllOrNone{
	width:80px; /*82px;*/
	text-align:left;
	/*margin-left:-2px;*/
	margin-left:8px;
	height:20px;
}

.baContainer #subDiv{
	left: 0px; top: 32px; right: auto; bottom: auto; width: 730px; height: 120px;
}
.baContainer #topNav12{
	border: 1px solid #CCCCCC;width:720px;height:125px;text-align:center;
}
.baContainer .topNav{
	height:35px;margin-top:4px;
}
.baContainer .mbGrpsDiv{
	/*padding-top:5px;*/margin-right:10px;float:right;
}
.baContainer .searchDiv{
	float:right;margin-right: 10px;
}
.baContainer .selectedCount{
	float:left;margin-left:115px;
}
.baContainer .searchOptionsDiv{
	/*padding-top:5px;*/margin-left:10px;float:right;
}
.baContainer .filterByDiv{
	/*float:left;margin-left:10px;padding-top:5px;
	width:200px !important;*/
	float: left;
    margin-left: 12px;
    /*width: 200px !important;*/
}
