html {
    line-height: initial;
}
body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Fira Sans', sans-serif;
    font-size: 0.9em;
    color: #4D4C4C;
    margin: 0;
}
body#baseWebPage{ background: #F9F9F9; }

h1, h2, h3, h4 {
    margin: 0 0 0.6em;
}
img {
    vertical-align: bottom;
}
table {
    margin: 2px 0;
    width: 100%;
    -webkit-print-color-adjust: exact;
}
th {
    padding: 4px 8px;
}
/* COMMON CSS */
.scope-inlineButton, .category-inlineButton {
	border: 1px solid #6F7C85;
	display: inline-block;
	margin: 15px 100px;
	padding: 2px 5px;
	width: 200px;
	height: 180px;
	cursor: pointer;
}

.sim-mno {
	width: auto;
	height: 90px;
}

.internet-modem {
	width: auto;
	height: 90px;
}

.input-number{
	width: 3.125em;
}

.colA--balance {
    display: inline-block;
    vertical-align: top;
}

.asolReportsResultsTable {
	display: table;
	width: auto;
	min-width: 100%;
    margin-bottom: 5px;
}

#troubleTicketContainer td.td2_align > select {
	box-sizing: border-box;
    font: inherit;
    border: 1px solid #DDD;
    transition: all 0.25s;
}

.report_totals {
	display: table;
	width: auto;
	min-width: 100%;
}

.report_value,
.report_header,
.subtotal {
	display: table-cell;
	padding: 4px 6px 4px 6px;
}

.total {
	display: table-cell;
}

.totalCellInvisible,
.asolReportsGroupedTotal .total,
.report_totals  .total,
.report_totals  .total_header,
.asolReportsResultsTable .subtotal  {
	padding: 4px 6px 4px 6px;
	display: table-cell;
}

.asolReportsGroupedTotal {
	display: table-row;
}

.report_row, .report_headers {
	display:table-row;
}

.asolReportsHeadersRow {
	display:table-header-group;
}

.asolReportsTotalsRow {
	display:table-row;
}

.asolReportsHeadersRow .report_header,
.report_row .report_value {
	padding: 4px 6px 4px 6px;
    border-bottom: 1px solid #CCC;
}

.asolReportsHeadersRow .report_header p,
.report_row .report_value p {
	margin: 0;
}

#totalTable .asolReportsHeadersRow .report_header {
	border: none;
}

.asolReportExecution .actionsContainer {
	display: none;
}

.d-flex {
display: flex;
}

#eSIMInfo{
  -webkit-font-smoothing: antialiased;
  color: #666;
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
  margin-left: auto;
  margin-right: auto;
  background: #f1f1f1;
  max-width: 100%;
  margin-bottom: 14px;
  padding-top: 5px;
  text-align: center;
  width: 200px;
}

#eSIMQRCode{
  -webkit-font-smoothing: antialiased;
  color: #666;
  text-align: center;
  width: 180px;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
  border-radius: 1px;
  max-width: 100%;
  height: auto;
}


/* CSS PDV TEST */
.table{
	display: table;
	border: 2px solid black;
}
.row{
	display: table-row;
}
.cell{
	display: table-cell;
	padding: 2px;
}

.expand{
	width: 100%;
}
.mainContainer{
	width: 75%;	
}

.containerCenter{
	margin-left: auto;
	margin-right: auto;
	border-collapse: collapse;
	border:none;
	text-align: center;
}
.tableBorder{
	border: 2px solid black;
}
.scope-inlineButton, .category-inlineButton {
    border: 1px solid #6F7C85;
    display: inline-block;
    margin: 15px 100px;
    padding: 2px 5px;
    width: 200px;
    height: 180px;
    cursor: pointer;
}

.sim-mno {
	width: 104px;
	height: 90px;
}
.internet-modem {
	width: 137px;
	height: 90px;
}
.btn-txt {
	padding-top: 5px;
}
.inlineButton a {
	font-weight: 400;
	text-decoration: none;
}
textarea {
	font: inherit;
}
input:focus, select:focus, textarea:focus {
	background-color: #FFF;
}
input[readonly], select[readonly], textarea[readonly] {
	background-color: #FFF;
}
.message {
	display: inline-block;
	margin-top: 10px;
}
.ro-area {
	display: inline-block;
}
.wicketFeedbackMessage {
	font-weight: 600;
}

/**** CONTAINERS START ****/
.pageContainer {
	margin: 0 auto;
	width: 1200px;
}
.headerContainer, .workAreaContainer, .footerContainer, .menuContainer, .centerContainer{ position: relative; }
.workAreaContainer{ 
	display: flex;
	background: #FFFFFF;
    box-shadow: 0px 2px 4px rgba(192, 192, 192, 0.4);
    border-radius: 4px;
}
.centerContainer {width: 80%;}
.menuContainer {width: 20%;}

/**Header y Footer **/
.headerContainer{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 16px 0 8px;
	flex-wrap: wrap;
}

.headerContainer #headerBottom {
    width: 100%;
}

.headerContainer #headerBottom > div {
	width: 100%;
	margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #DDD;
    margin-bottom: 2px;
}

.headerContainer .top{flex:1;}
#headerTop img {
	height: 42px;
}
.headerContainer .middle{color: #9F8B8B; }
#headerMiddle #userProfile img{
	width: auto; 
	height: 14px; 
	transform: translateY(-3px);
}
#headerMiddle #userLogout img{cursor: pointer}

.footerContainer{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 16px 0;
	color: #9F8B8B; 
	font-size: 0.8em;
}
#footerMiddle{display: none}

/* Estructura */
.form-center {
    display: flex;
    align-content: center;
    justify-content: center;
}
/* Menu lateral*/
.menuContainer{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
}
.menuContainer > div:not(.middle){margin: 0 12px}
.menuContainer:after{
    content: "";
    position: absolute;
    width: 1px;
    background: #DDD;
    right: 0;
    top: 0;
    bottom: 0;
}
.menuContainer .title{
	order: 2;
	font-weight: 500;
	font-size: 1.1em;
} 
.menuContainer .top{
	order:3; 
	font-size: 0.9em; 
	color: #9F8B8B; 
}
.menuContainer .bottom{
	order:4; 
	padding: 8px 0;
}
.menuContainer .middle{
	order:1; 
	flex:1; 
	margin-top: 16px;
}
.menuContainer .middle .menuEntry a{
	display:block;
    text-decoration: none;
    color: inherit;
    font-weight: 600;
    font-size: 1em;
    padding: 8px 12px;
    position: relative;
}
.menuContainer .middle .menuEntry a:before{
    content: "";
    position: absolute;
    width: 3px;
    background: #4D4C4C;
    left: -1px;
    top: 0;
    bottom: 0;
    opacity: 0;
    transition: opacity 300ms ease;
}
.menuContainer .middle .menuEntry a:hover{box-shadow: 0 1px 2px 1px rgba(190,190,190,.3)}
.menuContainer .middle .menuEntry a:hover:before{opacity: 1}

#posSelectInput #posList {
	border: 0px;
    width: 100%;
    padding-left: 0;
    margin-bottom: 16px
}
#posSelectInput #posList a {
	text-decoration: none;
}

/*Menu top*/
.centerContainer .topMenu > ul{
	list-style: none;
    display: flex;
    justify-content: flex-end;
    margin: 0;
    padding: 8px 16px;
    border-bottom: 1px solid #ddd;
}

.centerContainer .topMenu > ul a{text-decoration: none}
.centerContainer .topMenu > ul > li{
    padding: 8px 12px;
    position: relative;
}
.centerContainer .topMenu > ul > li > a{
    font-weight: 600;
    color: #9F8B8B;
    transition: all 300ms ease;
}
.centerContainer .topMenu > ul > li > a:hover{color: #4D4C4C}

.centerContainer .topMenu > ul > li ul{
    background-color: #FFF;
    border: 1px solid #ddd;
    list-style: none;
    position: absolute;
    top: 90%;
    left: 0;
    width: 160px;
    z-index: +2;
    box-shadow: 0 1px 2px 1px rgba(190,190,190,.2);
   	display: none;
	padding: 0;
}
.centerContainer .topMenu > ul > li ul a{
    display: block;
    color: #9F8B8B;
    font-weight: 600;
    padding: 6px 12px;
}
.centerContainer .topMenu > ul > li ul a:hover{
    color: #4D4C4C;
    background-color: #f9f9f9;
}
.centerContainer .topMenu > ul > li ul li:not(:last-child){border-bottom: 1px solid #ddd}

/* Contenido */
.centerContainer .middle{padding: 24px;}
.centerContainer .middle .innerTitle{
    font-size: 1em;
    font-weight: 600;
    line-height: 150%;
    color: #9F8B8B;
}
/* Form */
/* Titulo */
.centerContainer .middle #packageHeaderLabel,
.centerContainer .middle .innerContainer .colAx{
	font-weight: 600;
    line-height: 150%;
    font-size: 1.14em;
}
.centerContainer .middle .innerContainer .innerTop{
    line-height: 150%;
}
.centerContainer .middle .innerContainer .innerTop{
    align-self: flex-start;
}

/*form*/
#customerCheckMiddle .rowO{margin-top: 36px;}
#customerCheckMiddle .portabilityCustomerPanel .rowO:not(:first-child){margin-top: 0}

/*Label*/
.centerContainer .middle form .innerMiddle .rowO .colA{
    color: inherit;
}
.centerContainer .middle form .innerMiddle .rowE .colA{margin: 8px 0 0}

/*Input*/
.colB select, .colB input, #portaPageDataMiddle input, #viewTicketContainer #troubleTicketMiddle span.colB span {/*, #userDataMiddle span#userNameIdInputText*/
	box-sizing: border-box;
	font: inherit;
	width: 100%;
    padding: 6px;
    border: 1px solid #DDD;
    margin: 6px 0;
    transition: all 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}
.colB select:hover, .colB input:hover, #portaPageDataMiddle input:hover,
.colB select:focus, .colB input:focus, #portaPageDataMiddle input:focus{
    outline: none;
    border-color: #4D4C4C;
    box-shadow: 0 2px 2px -0.75px rgba(80, 136, 203, 0.1);
}


/*Botones*/
.inlineButton a{display: inline-block;}
.centerContainer .middle form .rowF{
    justify-content: flex-end;
    min-width: 360px;
    display: flex;
    margin-top: 16px;
    grid-column: 1 / span 3;
}



.inlineButton a#continue,
.inlineButton#continue a,
.inlineButton a#confirm,
.inlineButton a#createPos,
.inlineButton a#createUser,
#customerDataButtonCheck.inlineButton a,
#createTicketContainer #ticketNewButtons .inlineButton:first-child a,
#viewTicketContainer #ticketNewButtons a, 
#modifyTicketContainer #ticketModifyButtons .inlineButton:first-child a,
#unblock_subscriber.inlineButton a,
#block_subscriber.inlineButton a,
div.upgradeAndChangeContainer form span#pkgConfigButtonCancel > a,
#customerCheckButtons .inlineButton.btnNext a#cancel, 
#simSearchContainer #simSearchStatusPage input.button{
	background: #686D76;
    color: #FFF;
    font-weight: 600;
    padding: 8px 24px;
    border-radius: 14px;
    font-size: 0.9em;
    line-height: 16px;
    transition: all 350ms ease;
}
.inlineButton a#cancel,
.inlineButton a#back,
.inlineButton a#modifyLink,
.inlineButton a#applyChangesLink,
.inlineButton a#goback,
.inlineButton a#correct,
.inlineButton a#generateTicketLink,
.inlineButton a#generatePortaDocLink,
.inlineButton a#gobackLink,
#createTicketContainer .inlineButton:last-child a,
#modifyTicketContainer #ticketModifyButtons .inlineButton:last-child a,
#back.inlineButton a{
	background: #FFF;
    color: #4D4C4C;
    font-weight: 500;
    padding: 8px 16px;
    border-radius: 18px;
    border: 1px solid #DDD;
    font-size: 1em;
    line-height: 100%;
    margin-left: 6px;
    transition: all 350ms ease;
}
.button-secondary{
	background: #FFF;
    color: #4D4C4C;
    font-weight: 500;
    padding: 8px 16px;
    border-radius: 18px;
    border: 1px solid #DDD;
    font-size: 1em;
    line-height: 100%;
    margin-left: 6px;
    transition: all 350ms ease;
}
.inlineButton a#continue:hover,
.inlineButton#continue a:hover,
.inlineButton a#createUser:hover,
.inlineButton a#confirm:hover,
.inlineButton a#createPos:hover,
#managePosBalanceMiddle #buyBalanceBtn:hover,
#customerDataButtonCheck.inlineButton a:hover,
#createTicketContainer .inlineButton:first-child a:hover,
#viewTicketContainer #ticketNewButtons a:hover,
#modifyTicketContainer #ticketModifyButtons .inlineButton:first-child a:hover,
#unblock_subscriber.inlineButton a:hover,
#block_subscriber.inlineButton a:hover,
div.upgradeAndChangeContainer form span#pkgConfigButtonCancel > a:hover,
#customerCheckButtons .inlineButton.btnNext a#cancel:hover,
#simSearchContainer #simSearchStatusPage input.button:hover {
    background: #4D4C4C;
    box-shadow: 0px 2px 6px rgba(105, 105, 105, 0.3);
}
.inlineButton a#cancel:hover,
.inlineButton a#back:hover,
.inlineButton#goback a:hover,
.inlineButton a#modifyLink:hover,
.inlineButton a#applyChangesLink:hover,
.inlineButton a#goback:hover,
.inlineButton a#correct:hover,
.button-secondary:hover,
#createTicketContainer .inlineButton:last-child a:hover,
#modifyTicketContainer #ticketModifyButtons .inlineButton:last-child a:hover,
#back.inlineButton a:hover {
    box-shadow: 0px 1px 4px rgba(105, 105, 105, 0.2);
}

/* SALES FORM */
#salesProcessContainer form, div.upgradeAndChangeContainer form{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.centerContainer .middle #packageHeader{align-self: flex-start}

/* SEARCH FORM */
#subscrMsisdnSearchContainer form{
    display: flex;
    flex-direction: column;
}
#subscrMsisdnSearchContainer .innerMiddle{
    width: 360px;
    align-self: center;
}

.innerTop {font-weight: 600;}

/* COSTUMER CONFIRMATION */
#customerCheckButtons{
	display: flex;
    justify-content: center;
}
#customerCheckButtons .inlineButton.btnNext a#cancel{
    margin-right: 6px; 
}

#residentialDataContainer #customerDataMiddle{
    display: grid;
    grid-gap: 4px 24px;
    grid-template-columns: 1fr 1fr 1fr;  
    width: 100%;
}

#residentialDataContainer #customerDataMiddle > .addressesPanel{
	grid-column: 1 / span 2;
	margin-top: 16px;
}
#customerDataMiddle > .addressesPanel > div{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 4px 24px;
}
#residentialDataContainer #customerDataMiddle .marketingConsent,
#residentialDataContainer #customerDataMiddle #customerData{grid-column: 1 / span 3;}
#residentialDataContainer #customerDataMiddle .marketingConsent{
	display: flex;
	align-items: center;
}

#buttonCopyAddresses a{color: #9F8B8B;}

.calendar{
	min-width: 0;
	width: calc(100% - 60px);
}
.calendar > span:nth-child(2){
	display: flex;
	align-items: center;
}
.calendar .yui-skin-sam{
	transform: translateY(-14px);
	margin-left: 12px;
}

#residentialDataContainer #customerDataTop{margin: 8px 0 12px}
#residentialDataContainer #customerDataMiddle #customerData, #businessDataContainer #customerDataMiddle #customerData{
	justify-content: flex-start;
	margin: 8px 0px;
}

#salesProcessContainer  #residentialDataContainer form{display: block;}


/* DATOS CLIENTE */
#accountInnerTitle{grid-column: 1 / span 2; margin-bottom: 6px;}
#subscriberInner .innerBlockTitle{
    margin-bottom: 6px;
    font-size: 1em;
}
#subscriberInner .rowF{
    grid-column: 1 / span 2;
    display: flex;
    justify-content: flex-end;
    margin: 16px;
}

/* MSISDN + SIM */
#prepayConfigTop{margin: 0 0 16px}
#prepayConfigTopInfoText {margin: 8px 0 0;}
#prepayConfigTop > span {
    font-size: 0.84em;
    color: #9F8B8B;
    font-weight: 400;
}
#prepayConfigTop #prepayConfigTopText, #prepayConfigTop #receiptNumber {
    font-weight: 600
}

#msisdnConfigurePannel .colAx, #simIccidHeader .colAx{
	font-size: 1em;
}

#msisdnConfigurePannel, #simConfigurePannel{min-width: 360px}

#simConfigurePannel{margin-top: 24px}

#msisdnSearch{display: flex; flex-wrap: wrap;}
#msisdnSearch #msisdnSearchLabel{width: 100%}
#msisdnSearch #msisdnIdInput{width: 75%;}
#msisdnSearch #msisdnSearchButton{width: 20%; margin-left: 5%;}
#msisdnSearch #msisdnSearchButton a{
    background: #FFF;
    color: #4D4C4C;
    font-weight: 500;
    padding: 8px 14px 9px;
    border: 1px solid #DDD;
    font-size: 1em;
    line-height: 100%;
    margin-left: 6px;
    transition: all 350ms ease;
    margin: 6px 0;
}

#msisdnSearchReserve .jumbotron{margin-top: 8px}
#msisdnSearchReserve .jumbotron .form-group{display:flex; align-items: center; margin-bottom: 6px;}
#msisdnSearchReserve .jumbotron .form-group{font-size: 0.84em}
#msisdnSearchReserve .jumbotron .form-group .form-control{
	width: 75%;
    border: 1px solid #DDD;
    padding: 4px 0px;
    background: #f0f0f0;
}

#msisdnSearchReserve .jumbotron .form-group .form-control > span{
	margin-left: 4px;	
}

#msisdnSearchReserve .jumbotron .form-group .inlineButton{
    width: 20%; 
    margin-left: 4%;
}
#msisdnSearchReserve .jumbotron .form-group .inlineButton a{
    color: #9F8B8B;
    text-decoration: none;
}
#msisdnSearchReserve .jumbotron .form-group .inlineButton a:hover{color: #4D4C4C;}

#msisdnConfigurePannel #msisdnUnreserve{
    display: flex; 
    align-items: center;
    width: 100%;
}
#msisdnConfigurePannel #msisdnIdOutput{ 
    flex: 1;
    border: 1px solid #DDD;
    padding: 4px 8px;
    background: #f0f0f0;
    display: block;
} 
#msisdnConfigurePannel #unreserveButton{
    margin-left: 8px;
    margin-right: 4px;
}
#msisdnConfigurePannel #unreserveButton a{
	color: #9F8B8B;
    text-decoration: none;
}

#simConfigurePannel #simIccidInput > input {
	width: 75%;
}

/* CONFIRM PAGE */
#msisdnConfigurePannel #msisdnUnreserve{
    display: flex; 
    align-items: center;
    width: 100%;
}
#wicketFeedbackArea ul{list-style: none}

#packageConfigContainer form{
	margin-top: 24px;
}
#packageConfigContainer form > div{
	width: 360px;
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
}
#packageConfigContainer form .colA{width: 100%; margin-bottom: 2px;}
#packageConfigContainer form .colB{margin-right: 8px}
#packageConfigContainer form .colB > span{
    width: 300px;
    border: 1px solid #DDD;
    padding: 4px 8px;
    background: #f0f0f0;
    display: block;
}

/* SUBSCRIPTION PAGE */
#customerCheckMiddle .title-row {display:none;}
#accountSubscriptionContainer.d-flex .subscriptionData{width: 75%;}
#accountSubscriptionContainer.d-flex .qrContainer{
    width: 25%;
    display: flex;
    justify-content: flex-end;
}

#accountSubscriptionContainer.d-flex #eSIMInfo{
	width: 90%;
    padding-top: 8px;
    background-color: #FFF;
}
#accountSubscriptionContainer.d-flex #eSIMInfo .eSIMTitle{
	color: #4D4C4C;
	font-weight: 600;
}
#accountSubscriptionContainer.d-flex #eSIMInfo .eSIMIccId{color: #9F8B8B;}
#accountSubscriptionContainer.d-flex #eSIMInfo #eSIMQRCode{ border: 1px solid #DDD;}

#accountSubscriptionContainer .colA{
    font-style: normal;
    color: #9F8B8B;
}
#accountSubscriptionMiddle{
    display:flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#accountSubscriptionTop{
	width: 100%;
    padding-bottom: 0; 
    margin-bottom: 8px;
}
#accountSubscriptionMiddle div.innerBlockTitle{ margin-bottom: 8px}
#accountSubscriptionMiddle #packageInner{
    width: 100%;
    border-top: 1px solid #DDD;
    padding-top: 12px; 
    margin-top: 12px;
}
#accountSubscriptionMiddle #subscriberInfo{
	width: calc(66% - 16px); 
	padding-left: 16px
}
#accountSubscriptionMiddle #subscriptionInner{width: 33%}

#accountSubscriptionMiddle #subscriberInfo span.colA,
#accountSubscriptionMiddle #subscriptionInner span.colA,
#accountSubscriptionMiddle #subscriberInfo span.colB,
#accountSubscriptionMiddle #subscriptionInner span.colB{display: block}

#accountSubscriptionMiddle #subscriberInfo span.colB,
#accountSubscriptionMiddle #subscriptionInner span.colB{margin-bottom: 4px}

#accountSubscriptionMiddle #subscriptionAccount{
	display: flex; 
	justify-content: flex-end; 
	margin-top: 30px;
}

/* Subscription Search */
#subscrSearchMiddle > div{
	display: flex;
    flex-direction: column;
    align-items: center;
}

#subscrSearchMiddle > div form {
	width: 360px;	
}

#subscrSearchMiddle > div > div:nth-child(5){
    align-self: flex-end;
	margin-top: 36px;
}
#subscrSearchMiddle > div #spSearchList{padding-bottom: 24px}
#centerMiddle table th{
	background: #DDD; 
	text-align: left; 
	font-weight: 600;
}
table a{
	color: #9F8B8B;
	font-weight: 600;
}
table a:hover{color: #4D4C4C;}

/* cliente info como pagina */
.orderFoundPageClass .subscriberInfo{
    width: calc(66% - 16px); 
	padding-left: 16px;
    display: grid;
    grid-template-columns: 50% 50%;
	grid-row-gap: 8px;
  
}
.orderFoundPageClass #subscriptionProcessInner{
	width: 100%;
    border-top: 1px solid #DDD;
    padding-top: 12px; 
    margin-top: 12px;
}
#subscriptionProcessButtons{
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
    margin-right: 16px;
}

/* SIM y MSISDN como pagina */
.assignElements #msisdnSearchReserve{
    width: 360px; 
    margin-top: 16px;
}
.assignElements #msisdnSearch #msisdnSearchButton{margin-left: 4%}
.assignElements #simSearchReserve{
    display: flex; 
    flex-direction: column;  
    width: 360px;    
    margin-top: 16px;
}
.assignElements #msisdnConfigurePannel #msisdnUnreserve{
	width: 360px;    
    margin-top: 16px;
}

/* formulario cliente como pagina */
#residentialDataContainer .modifySubscriberClass{}
#residentialDataContainer .modifySubscriberClass #customerDataMiddle{
    display: block;
    padding: 0 42px 16px;
    width: auto;
}
#residentialDataContainer .modifySubscriberClass #customerDataInformation{margin-bottom: 16px}
#birthdayInput { display: flex; }
#birthdayInput #birthDaySelect, #birthdayInput #birthMonthSelect{ margin-right: 8px; }

/* Actualizar package y bonos */
#accountSubscriptionMiddle.upgradeChanges{display: block}
#accountSubscriptionMiddle.upgradeChanges #subscriptionInner, 
#accountSubscriptionMiddle.upgradeChanges #accountInner{ width: 100%}
#simChangeConfig{
	display: flex; 
	justify-content: flex-end; 
	margin-top: 16px;
}

#packageSelectContainer #packageSelectMiddle{
    display: flex; 
    flex-direction: column; 
    align-items: center;
	margin-top: 24px;
}
#packageSelectContainer #packageSelectMiddle #transitionPackagesDiv{ margin-top: 16px }

/* Comprobar SIM */
#simSearchContainer.form-center{
	flex-direction: column;
    align-items: center;
}

#simSearchContainer #simSearchStatusPage{
    margin-top: 24px;
}
#simSearchContainer #simSearchStatusPage .simstatus{
    padding: 4px 8px 8px;
    margin: 8px 0;
    background: #f9f9f9;
    border: 1px solid #DDD;
    border-radius: 4px;
    width: 360px;
}

#simSearchContainer #simSearchStatusPage form{ text-align: right;}
#simSearchContainer #simSearchStatusPage input.button{
    border: none;
    cursor: pointer;
}
#simSearchContainer #simSearchStatusPage input.button:focus{
    outline: none;
}

/* PORTA */
#portaPageDataMiddle, #portaPageDataTop .portaSummaryTop{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 0 36px;
}
#portaPageData, #packageList{ grid-column: 1 / span 2; }

#packageList{margin: 16px 0 8px}
#portaPageDataMiddle #packageList select{width: calc(50% - 18px); min-width: 0; display: block}

#processingDateSpan{
    display: flex; 
    align-items: center;
}
#processingDateSpan input{
    width: calc(100% - 24px);
    min-width: 0;
    margin-right: 12px;
}
#processingDateSpan .yui-skin-sam{
	transform: translateY(-14px);
}


#portaPageDataTop span.portaSummary{
    display: block;
    border-bottom: 1px solid #DDD;
    margin: 8px 0;
    padding-bottom: 4px;
}

#portaConfirmContainer #headerTitle, 
#portaConfirmContainer #portinMsisdnDiv, 
#portaConfirmContainer #vatNumberDiv{
    display: block;
	width: 100%;
    font-weight: 600; 
    font-size: 1.04em; 
    line-height: 150%;
    margin: 4px 0;
}

/* Porta table y demas */
.sugarResultInfo{
    display:flex; 
    justify-content: flex-end; 
    margin-top: 16px;
}
#portaPageDataButtonSearch #search,
#troubleTicketFilterButton a,
#listPosFilterButton a,
#listUsersFilterButton a{
	background: #FFF;
    color: #4D4C4C;
    padding: 4px 8px;
    border: 1px solid #DDD;
    font-size: 1em;
    line-height: 100%;
}
#portaPageDataButtonSearch #search {
	
}

#portaPageDataButtonSearch #search:hover,
#troubleTicketFilterButton a:hover,
#listPosFilterButton a:hover{
    box-shadow: 0 2px 2px -0.75px rgba(80, 136, 203, 0.2);
}
#ticketTypeInput select, 
#ticketDescription textarea {
	box-sizing: border-box;
	font: inherit;
	width: 100%;
    min-width: 100%;
    max-width: 100%;
    padding: 6px;
    border: 1px solid #DDD;
    margin: 6px 0;
    transition: all 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}

#listPosSearchOptions, #listUsersSearchOptions, #troubleTicketSearchOptions{display:flex; align-items: center;}
#listPosSearchOptions input, #listUsersSearchOptions input {padding:0}

#listUsersFilterSelect #listUsersSearchOptions > span, #listPosFilterSelect #listPosSearchOptions > span {
	margin-right: 4px;
}

/* Form empresa */
.subscriberEnterprisePanel #customerDataMiddle .colB select, 
.subscriberEnterprisePanel #customerDataMiddle{
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 4px 24px;
    margin-top: 16px;
}
#comercialName { grid-column: 1 / span 2; }

.subscriberEnterprisePanel #contactPersonalData {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 4px 24px;
    grid-column: 1 / span 3;
}

.subscriberEnterprisePanel .addressesPanel{
    grid-column: 1 / span 2;
    margin-top: 16px;
}
.subscriberEnterprisePanel .addressesPanel .BillingAndShippingAddressPanel{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 4px 24px;
}
.subscriberEnterprisePanel .marketingConsent { grid-column: 1 / span 3; }
.subscriberEnterprisePanel #contactPersonalDataTitle {grid-column: 1 / span 3;}

.subscriberEnterprisePanel #customerDataBottom { width: 100%; }


/*ERRORS*/
#messageContainer #messageBottom a{
	background: #4D4C4C;
    color: #FFF;
    font-weight: 600;
    padding: 6px 24px;
    border-radius: 14px;
    font-size: 0.9em;
    line-height: 16px;
    transition: all 350ms ease;
    text-decoration: none;
}
#messageContainer #messageBottom a:hover{box-shadow: 0px 2px 6px rgba(105, 105, 105, 0.3);}

body.sessionless #messageContainer{
    height: 400px; 
    display: flex; 
    align-items: center;
    text-align: center;
	flex-direction: column;
}
body.sessionless #messageContainer #messageMiddle{margin: 100px 0 12px}
body.sessionless #messageContainer #messageBottom{margin: 0}

/* Seleccionar movil o fibra */
#salesProcessContainer form.SelectPackageScope{
    flex-direction: row;
}
.SelectPackageScope .scope-inlineButton, .upgradeAndChangeContainer form div#packageSelectMiddle > .scope-inlineButton{
    border: 1px solid #DDD;
    margin: 24px 16px;
    padding: 24px 8px;
    width: 160px;
    height: auto;
    cursor: pointer;
    border-radius: 4px;
    box-shadow: 0px 1px 2px rgba(115, 115, 115, 0.1);
    background-color: #FFF;
    transition: all 350ms ease;
}
.SelectPackageScope .scope-inlineButton:hover, .upgradeAndChangeContainer form div#packageSelectMiddle > .scope-inlineButton:hover{
    border-color: #4D4C4C;
    box-shadow: 0px 2px 4px rgba(115, 115, 115, 0.2);
}
.SelectPackageScope .internet-td_lte, div.upgradeAndChangeContainer form .sim-mno{
    height: 60px; 
    width: auto;
    margin: 8px 0 16px;
}
.SelectPackageScope #btn_container p.btn-txt{
    font-family: 'Segoe UI';
    font-weight: 700;
    margin: 0;
    padding: 0;
    font-size: 1.07em;
}

/*Formulario*/
.CheckCoveragePanel #addressBillingArea .title-row{
    font-weight: 600;
    margin-bottom: 16px;
}
.CheckCoveragePanel .addressPanel{width: 100%;} 
.CheckCoveragePanel #addressBillingArea .col-4{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 8px 16px;
}
.CheckCoveragePanel #addressBillingArea label{font-size: 0.9em;}
.CheckCoveragePanel #addressBillingArea .colB select{padding: 4px 6px; font-size: 0.9em;}
.CheckCoveragePanel #addressBillingArea input{padding: 5px 6px; font-size: 0.9em;}
.centerContainer form.CheckCoveragePanel .rowF{
    width: 100%;
    margin: 0;
}
.CheckCoveragePanel #customerDataButtonCheck.inlineButton{
    display: block; 
    transform: translateY(-37px);
}

.SelectPackageScope{position: relative}
.SelectPackageScope > span.wicket-ajax-indicator{
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    background-color: rgba(255,255,255,.6);
    display: flex;
    align-items: center;
    justify-content: center;
}
.SelectPackageScope > span.wicket-ajax-indicator img{
    margin: 0;
    display:block;
}



/*Tabla*/
.coverageTable input{padding: 0; border: 1px solid #9F8B8B;}
.coverageTable input:hover, .coverageTable input:focus{
    border-color: #4D4C4C;
}

.coverageTable tr th:not(:last-child){border-right: 1px solid #BFBFBF; padding: 2px 6px;}
body#baseWebPage .coverageTable tr td:not(:last-child){border-right: 1px solid #DDD; padding: 4px 6px;}

body#baseWebPage .coverageTable tr th:not(:nth-child(-n+3)),
body#baseWebPage .coverageTable tr td:not(:nth-child(-n+3)){text-align: right; padding-right: 4px;}
.coverageTable .input-number{width: 32px}

/*Flechas*/
.coverageTable td:last-child{text-align: center;}
.coverageTable td > a{
    cursor: pointer; 
    text-align: center;
    display: inline-block;
}
.coverageTable td > a img{transition: all 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;}
.coverageTable td > a:hover img{transform: translateX(6px)}

/*Paginado*/
body#baseWebPage .coverageTable thead tr:first-child td{padding: 0 0 12px;}
.coverageTable thead tr:first-child td > div{width: 100%; display: flex; justify-content: flex-end;}

.coverageTable td div span.goto{cursor: default;}
.coverageTable td div span a{
    color: #9F8B8B;
    font-style: normal;
    text-decoration: none;
    cursor: pointer;
}
.coverageTable td div span em{font-style: normal; color: #ACACAC; }

.coverageTable td div a.first, .coverageTable td div span.first,
.coverageTable td div a.prev, .coverageTable td div span.prev, 
.coverageTable td div a.next, .coverageTable td div span.next,
.coverageTable td div a.last, .coverageTable td div span.last{
    display: inline-block;
    border: 1px solid #DDD; 
    text-decoration: none;
    font-family: 'Consolas';
    letter-spacing: -2px;
    text-align: center;
    margin: 0 2px;
}

.coverageTable td div a.prev, .coverageTable td div span.prev, 
.coverageTable td div a.next, .coverageTable td div span.next{
    padding: 2px 7px;
}
.coverageTable td div a.first, .coverageTable td div span.first,
.coverageTable td div a.last, .coverageTable td div span.last{
    padding: 2px 5px;
}

.coverageTable td div span.goto > a,
.coverageTable td div span.goto > span{
    margin: 0 1px;
    padding: 2px 4px;
}
.coverageTable td div span.goto > span{border-bottom: 1px solid #4D4C4C}
.coverageTable td div span.goto > a{border-bottom: 1px solid #FFF}
.coverageTable td div span.goto > a:hover{color: #4D4C4C}


/* Confirmar direcciones */
.ConfigPackagePanel #buttonCopyAddresses{display: none}
.ConfigPackagePanel .colB select:hover, 
.ConfigPackagePanel .colB input:hover,
.ConfigPackagePanel .colB select:focus, 
.ConfigPackagePanel .colB input:focus{
    border-color: #DDD;
    box-shadow: none;
}
form.ConfigPackagePanel .BillingAndShippingAddressPanel{
    display: grid; 
    grid-gap: 0 32px;
    grid-template-columns: 1fr 1fr;
}

form.ConfigPackagePanel .title-box{
    font-weight: 600;
    margin-bottom: 8px;
    padding-bottom: 4px;
    border-bottom: 1px solid #DDD;
}
form.ConfigPackagePanel label,
form.ConfigPackagePanel input,
form.ConfigPackagePanel select{font-size: 0.9em}
form.ConfigPackagePanel select{padding: 4px}
.ConfigPackagePanel #prepayConfig{
	min-width: 540px;
}


/** Cambiar tarifa de fibra **/
#packageList .colB .col-3,
#transitionPackageList .colB .col-3{
    display:flex;
    flex-direction: column;
    justify-content: flex-end;
}

#packageList {
	min-width: 360px;
}

#packageList .colB .col-3 > .form-group:first-child,
#transitionPackageList .colB .col-3 > .form-group:first-child{order: 1}

#subscriptionConfiguredMiddle form{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
#subscriptionConfiguredMiddle #packageConfirm{margin: 0}
#subscriptionConfiguredMiddle #packageConfirmButtons{
    display: flex;
    flex-wrap: wrap;
}
#subscriptionConfiguredMiddle #packageConfirmButtons > span.inlineButton{order: 1}
#subscriptionConfiguredMiddle #packageConfirmButtons > span:not(.inlineButton){margin: 0 0 12px !important; width: 100%;}

/* botones de crear en Gestión de pos */
/****/
#listPosListMiddle, #listUsersListMiddle{
    display: flex;
    flex-wrap: wrap;
}
#listPosListMiddle #listPosFilterSelect,
#listUsersListMiddle #listUsersFilterSelect{flex: 1}

/* Balance pos */
/****/
#managePosBalanceMiddle{margin-top: 8px;}
#managePosBalance_posNameContainer{font-weight: 600; margin-bottom: 4px }

#managePosBalanceContainer #managePosBalanceMiddle > div {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}

#managePosBalanceContainer #managePosBalanceMiddle > div div:nth-child(7), #managePosBalanceContainer #topupMiddle > div div:nth-child(7) {
	grid-column: 1 / span 3;
}

#buyBalanceDiv{margin-top: 16px}
#buyBalanceDiv #buyBalanceMsg{display:none}

#buyBalanceDiv #amountTextFieldContainer{display: flex; justify-content: center; flex-direction: row-reverse}

#buyBalanceDiv #amountTextFieldContainer input.button{
    border:none;
    background: #4D4C4C;
    color: #FFF;
    font-weight: 600;
    font-size: 0.9em;
    line-height: 16px;
    transition: all 350ms ease;
    padding: 0 24px;
    border-radius: 16px;
}

#buyBalanceDiv #amountTextFieldContainer input.colB{
    box-sizing: border-box;
    font: inherit;
    padding: 6px;
    border: 1px solid #DDD;
    margin-right: 8px;
    transition: all 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}

.colA--balance{
    text-align: left;
    max-width: 100%;
    min-width: 0;
}

#managePosBalanceMiddle .rowO{margin-bottom: 8px;}
#managePosBalanceMiddle .rowO > div > *{font-size: 1em !important; line-height: 1em;}


#managePosBalanceMiddle .rowO .inlineButton:not(#gobackLink), #managePosBalanceContainer .rowO .inlineButton:not(#gobackLink){
    margin-top: 8px;
    cursor: pointer;
    border: none;
    background: #4D4C4C;
    color: #FFF;
    font-weight: 600;
    padding: 8px 24px 6px;
    border-radius: 14px;
    font-size: 0.9em;
    line-height: 16px;
    transition: all 350ms ease;
}
#managePosBalanceMiddle .rowO .inlineButton#gobackLink, #managePosBalanceContainer .rowO .inlineButton#gobackLink{
    margin-top: 8px;
    cursor: pointer;
    background: #FFF;
    color: #4D4C4C;
    font-weight: 500;
    padding: 9px 24px 8px;
    border-radius: 18px;
    border: 1px solid #DDD;
    font-size: 0.9em;
    line-height: 100%;
    margin-left: 6px;
    transition: all 350ms ease;
}
#managePosBalanceMiddle .rowO .inlineButton:not(#gobackLink):hover{box-shadow: 0px 2px 6px rgba(105, 105, 105, 0.3);}
#managePosBalanceMiddle .rowO .inlineButton#gobackLink:hover{box-shadow: 0px 1px 4px rgba(105, 105, 105, 0.2);}

#managePosBalanceMiddle #buyBalanceBtn {
	cursor: pointer;
}

#topupFormContainer, #cdrReportsPage > form, #managePosBalanceMiddle.addPosBalance {
	width: 360px;
	margin: 24px auto 0;
}

#managePosBalanceContainer #topupMiddle > div {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}

#managePosBalanceContainer #topupMiddle .confirmationMessage {grid-column: 1 / span 3;}

/*********************************/
.colC {
	display: inline-block;
	margin-right: 10px;
}

.colD {
	display: inline-block;
}

.colAx {
	display: inline-block;
	font-weight: 600;
	min-width: 80%;
}

.colBx {
	display: inline-block;
	text-align: right;
	width: 18%;
}

.colAt {
	font-weight: normal;
	margin-right: 2px;
}

.colBt {
	display: inline-block;
	margin-right: 10px;
}

.rowE {
	clear: both;
}
/**** INNER END ****/

/**** INNER BLOCK START ****/
.innerBlock {
	margin-top: 8px;
}

.innerBlockTitle {
	font-weight: 600;
	min-width: 13em;
}

.innerTop .colB {
	max-width: 40em;
	min-width: 40em;
}
/**** INNER BLOCK END ****/

/**** POPUP START ****/
@media all {
	.a4 {
		height: 297mm;
		width: 210mm;
		margin-left: auto;
		margin-right: auto;
	}
}

.popupTop {
	font-size: 18px;
	font-weight: 600;
	margin: 10px auto;
	width: 100%;
}

.popupMiddle {
	margin: 10px auto;
	width: 100%;
}

.popupFooter {
	margin: 10px auto;
	text-align: center;
	width: 100%;
}

.popupMiddle #simId, .popupMiddle #simFound, .popupMiddle #msisdnId, .popupMiddle #msisdnFoundId {
	margin: 10px auto;
}

#popupMiddle .colA {
	min-width: 12em;
}

#popupMiddle .input-text-01, #popupMiddle .ro-text-01 {
	width: 14em;
}
/**** POPUP END ****/

/**** MODAL POPUP START ****/
.modalContainer {
	margin: 0 auto;
	width: 95%;
}

.modalTop {
	
}

.modalMiddle {
	margin-top: 30px;
	text-align: center;
}

.modalBottom {
	bottom: 0;
	margin: 10px auto;
	position: absolute;
	text-align: center;
	width: 95%;
}

.modalMessage {
	font-size: 18px;
}
/**** MODAL POPUP END ****/

/**** VARIOUS START ****/

#footerTitle, #footerBottom {display: none;}

#userName {
	font-weight: 600;
}

/**** MENU END ****/

/**** TOP MENU START ****/
.topMenu ul li ul {

}

.topMenu ul li:hover ul {
	display: block;
}

/**** LOGIN START ****/
#loginMiddle {
	margin-top: 125px;
}

#loginBottom {
	margin-left: 275px;
	margin-top: 30px;
}
/**** LOGIN END ****/

/**** ERROR MESSAGE START  ****/
#messageMiddle {
	margin-top: 150px;
}

#messageBottom {
	margin-top: 20px;
}
/**** ERROR MESSAGE END ****/

/**** POS SELECT/DATA START ****/
.posList {
	margin-left: 30px;
	width: 25%;
}

.posListEntry {
	padding: 6px 12px;
}

#posSelectLabel {
	margin-top: 10px;
	vertical-align: top;
}

#comercialName, #posId, #posContactSurname1, #posContactSurname2, #bankAccountNumber, #bankAccountName {
	clear: none;
	margin-bottom: 10px;
}

#posSelectLabel {
	font-weight: 600;
	margin: 16px 0 8px;
	display: block;	
}

#posSelectInput {
	display: block;
}
​​
.panelPagination {
	padding-bottom: 16px;
}
​

/**** POS SELECT/DATA END ****/

/**** USERDATA START ****/
#userLocaleSelect select {
	min-width: 4em;
}
#userNameId, #userStatus, #userSurname1, #userSurname2, #pwd1Id, #pwd2Id, #userBrandTelephone, #userPin {
	margin-bottom: 0px;
}
/**** USERDATA END ****/

/**** CUSTOMERDATA START ****/
#customerDataTopText {
	width: 40em;
}
#birthDaySelect, #birthMonthSelect, #birthYearSelect {
	min-width: 2em;
}

#addressDescLabel {
	vertical-align: top;
}

#addressDescInput .text-area-01, #shippingAddressDescInput .text-area-01 {
	width: 17em;
}
/**** CUSTOMERDATA END ****/

/**** PACAKAGE SELECT START ****/
#packageSelectMiddle {
	margin-top: 100px;
}
/**** PACAKAGE SELECT END ****/

/**** PPREPAY CONFIG START ****/
#subscriptionConfigMiddle {
	margin-top: 20px;
}

.TopText {
	display: inline-block;
	width: 50em;
}

#subscriptionConfigMiddle .colA {
	display: inline-block;
}

#subscriptionConfigMiddle .colB {
	display: inline-block;
	min-width: 17em;
}

#subscriptionConfigMiddle .colC {
	display: inline-block;
	margin-right: 1px;
	min-width: 10em;
	text-align: right;
}

#subscriptionConfigMiddle .colD {
	display: inline-block;
	min-width: 10em;
}

#subscriptionConfigMiddle .colE {
	display: inline-block;
	min-width: 12em;
	text-align: right;
}
#prepayConfigContainer .inlineButton {
	margin: 0px 1px 1px;
}

#prepayConfigButtons .inlineButton {
	margin: 30px 1px 1px;
}
/**** PPREPAY CONFIG END ****/

/**** CUSTOMER AND SUBSCRIPTION START ****/
#accountSubscriptionMiddle {
	margin-top: 10px;
}

#accountSubscriberMiddle .colA {
	color: #9F8B8B;
	vertical-align: top;
}

#accountSubscriptionContainer .colA {vertical-align: top;}

#marketingConsent {
	clear: both;
}

.address-information {
	display: none;
}
/**** CUSTOMER AND SUBSCRIPTION END ****/

/**** ASSOCIATE START ****/
#associationData {
	clear: both;
}

#associationInnerTitle, #showPopupAssociation, #associationAngelInnerTitle, #showPopupAngel {
	margin-left: 5px;
}

#angelSearchContainer, #associationSearchContainer {
	height: 400px;
}
/**** ASSOCIATE END ****/

/**** SEARCH SUBSCR BY MSISDN START ****/
#subscrSearchMiddle, #subscrMsisdnSearchMiddle {
	margin-top: 10px;
}

/**** SEARCH SUBSCR BY MSISDN END ****/

/**** SEARCH SUBSCR BY ICCID START ****/
#subscrSearchMiddle, #subscrIccidSearchMiddle {
	margin-top: 10px;
	min-width: 360px;
}
/**** SEARCH SUBSCR BY ICCID END ****/

/**** PORTA START ****/
#portaInMiddle .colA, #portaInMiddle .innerBlockTitle {
	max-width: 18em;
	min-width: 18em;
}

/**** PORTA START ****/

/**** QUOTA START ****/
#quotaFoundMiddle {
	margin-top: 10px;
}

#quotaPendingOutp {
	margin-top: 8px;
}
/**** QUOTA END ****/

/**** SIM CHANGE START ****/
#simChangeMiddle {
	margin-top: 100px;
}

#simChangeConfigMiddle {
	margin-top: 100px;
}
/**** SIM CHANGE END ****/

/**** SUBSCRIPTION CHANGE START ****/
#subscriptionChangeConfigMiddle {
	margin-top: 100px;
}
/**** PRICE PLAN CHANGE END ****/

/**** RESERVED MSISDN START ****/
#reservedMsisdnSearchMiddle, #reservedMsisdnMiddle {
	margin-top: 100px;
}
/**** RESERVED MSISDN END ****/

/**** VIEW SIM STATUS START ****/
.simstatus .colA {
	text-align: right;
	min-width: 22em;
}

.simstatus .innerBlockTitle {
	min-width: 22em;
}
/**** VIEW SIM STATUS END ***/

/**** SUBSCRIPTION-ACCOUNT OVERVIEW START ****/
#dueAmountOutp {
	margin-top: 8px;
}
/**** SUBSCRIPTION-ACCOUNT OVERVIEW END ****/

/**** TROUBLE TICKETS START ****/
#troubleTicketMiddle {
	margin-top: 20px;
}

#troubleTicketMiddle .colA {
	min-width: 15em;
}

#troubleTicketContainer td {
	text-align: center;
}

#troubleTicketContainer .th2_align, #troubleTicketContainer  td.td2_align, #troubleTicketContainer .th3_align,
	#troubleTicketContainer  td.td3_align {
	text-align: left;
}

#ticketDescriptionLabel, #ticketWorkLogLabel, #ticketWorkLogAdditionLable, #ticketResolutionLabel {
	vertical-align: top;
}

#troubleTicketFilterLabel {
	text-align: left;
}

#troubleTicketFilterButton {
	margin: 1px 1px 1px;
}
/**** TROUBLE TICKETS END ****/

/**** NOTIFICATIONS START ****/
.notificationsTable {
	margin: 25px 0;
}

.notificationArea {
	margin-top: 10px;
	text-align: center;
}

.notificationColA {
	text-align: right;
	font-style: italic;
	display: inline-block;
	text-align: right;
	min-width: 10em;
	vertical-align: top;
}

.notificationButton {
	display: inline-block;
	min-width: 63em;
	text-align: right;
}

.notificationButtonCenter {
	display: inline-block;
	min-width: 27em;
	text-align: right;
}
/**** NOTIFICATIONS END ****/

/**** REPORTS START ****/
.reportsTable .td2_align, .reportsTable .td3_align {
	text-align: center;
}

.reportCenterContainer {
	padding-top: 4px;
}

.reportInnerContainer {
	padding-top: 4px;
}
#reportContainer .inlineButton {
	margin: 1px;
}

#reportContainer table {
	border: 0px none;
}

#reportContainer td {
	background-color: #FFF;
	text-align: center;
}

#reportContainer td .list .view {
	font-weight: 600;
	margin-bottom: 25px;
	margin-top: 10px;
}

#chartTable {
	font-weight: 600;
}
/**** REPORTS END ****/

/**** PRINT START ****/
.popupContainer {
	position: relative;
	width: 99%;
}

.printHeader {
	margin-top: 10px;
}

.printHeaderMiddle {
	margin-bottom: 10px;
}

.printHeaderBottom {
	clear: both;
	font-weight: 600;
	border-top: 2px solid;
	margin-bottom: 30px;
}

.printMiddleBottom {
	margin-left: 5%;
	margin-right: 5%;
	text-align: center;
}

.rowT {
	width: 100%;
}

.colA1 {
	margin-left: 5px;
}

.colB1 {
	margin-right: 5px;
}

#ticketPrintButtons {
	text-align: center;
	width: 100%;
}

#orderTicketButtons {
	border-bottom: 1px dashed;
	padding-bottom: 5px;
}

#companyLogoSize {
	height: 70px;
	margin: 10px;
}

#companyName {
	text-align: right;
}

#companyFid {
	text-align: right;
}

#companyAddress1 {
	text-align: right;
}

#companyAddress2 {
	text-align: right;
}

#ticketNumberData {
	margin-top: 10px;
	text-align: right;
}

#ticketDateData {
	margin-top: 5px;
	text-align: right;
}

#companyGreeting {
	margin-top: 5px;
	text-align: center;
}

#ticketSubscriberDataAddressElements {
	margin-left: 5px;
	width: 75%;
}

#ticketSubscriberDataAddressElements .colA1 {
	margin-left: 0px;
}

#ticketContentTitle {
	border-bottom: 1px dotted;
}

#ticketSubscriberDataAddress {
	margin-bottom: 15px;
}

#ticketTotals {
	margin-bottom: 30px;
	margin-top: 10px;
}

#ticketSubscrNumber, #ticketMessage2Label, #ticketMessage4Label {
	font-weight: 600;
	margin-bottom: 15px
}

#ticketMessage5Label {
	margin-bottom: 15px
}

#ticketMessage6Label, #ticketMessage7Label, #ticketMessage8Label {
	margin-bottom: 10px
}
/**** PRINT END ****/

/**** TO ADDRESS START ****/
#wicketDebugLink, #packageChangeList {
	display: none;
}
/**** TO ADDRESS END ****/

/**** MENUCHAT ****/
#menuChat {
	margin-bottom: 10px;
}
/**** MENUCHAT END****/
#addressDisclaimer {
	display: none;
}

#reassignSubscriptionMiddle #customerCheckMiddle {
	margin-top: 10px
}

#portaPageDataMiddle #customerCheckMiddle {
	margin: 0;
}

.wicket-ajax-indicator img {
	vertical-align: text-bottom;
	height: 20px;
}

#managePosBalanceForm {
	height: 50%;
}
.value {
	text-align: left;
}

#interests, #socialDataAddedChoice, #fileUploader {
	height: inherit !important;
}

td.mini {
	box-sizing: border-box;
	width: 20px;
}
/**** Calendar navigation improvements ****/
.yui-cal-nav-m>select {
	min-width: 10em;
}

.yui-cal-nav-y>input {
	margin-left: auto;
	margin-right: auto;
	display: block;
	text-align: center;
}

.calnavleft {
	left: 10px !important;
}

.calnavright {
	right: 10px !important;
}

#fileUploadInput {
	height: initial;
}

.pdv-input-fix {
	min-width: 47px;
	height: initial;
}

/**** End Calendar navigation improvements ****/


/* NEW APPS TEAM */

/* START LOGIN */
/* LOGIN */
#loginContainer #loginMiddle span{ display:block }
body.sessionless #loginContainer, body.sessionless #posSelectContainer {
    width: 480px;
}
body.sessionless #workAreaContainer {
    box-shadow: none;
    border-radius: 0 0 4px 4px;
    min-height: 0;
}
body.sessionless #headerContainer {
    background: #FFF;
    border-radius: 4px 4px 0 0;
    margin: 15vh 0 0;
    padding: 48px 0 0;
    display: block;
}
body.sessionless #headerTop, body.sessionless #headerMiddle {
    width: 490px;
    margin: 0 auto;
}
body.sessionless #pageContainer {
	width: 600px;
}
body.sessionless #centerMiddle {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding-top: 16px;
}
#loginMiddle{height: 520px}
#loginMiddle > h1 {
    margin: 0 0 8px;
    font-size: 21px;
    font-weight: 600;
}
#loginContainer #loginMiddle span#loginButtonLabel {
	display: none;
}
#loginUser {
	margin-top: 36px;
}

body.sessionless #menuContainer {
    display: none;
}

body.sessionless .centerContainer {
    width: 100%;
}

body.sessionless .innerTitle, body.sessionless .innerTop {
	display: none;
}

body.sessionless #loginUserInput, body.sessionless #loginPwdInput, body.sessionless #loginButtonInput {
    display: block;
}

body.sessionless #loginUserLabel::after, body.sessionless #loginPwdLabel::after  {
    content: "*";
}

body.sessionless #loginButtonInput input[type='submit'] {
	border: none;
	opacity: 1;
    color: #FFF;
    background: #686D76;
    border-radius: 4px;
    margin: 24px 0 0;
    padding: 8px;
    font-size: 1.06em;
    font-weight: 500;
    cursor: pointer;
    transition: all 350ms ease;
}
body.sessionless #loginButtonInput input[type='submit']:hover{background: #4D4C4C; box-shadow: 0px 2px 6px rgba(105, 105, 105, 0.3);}

body.sessionless .colA, body.sessionless .colB  {
    max-width: none;
}

body.sessionless #loginPwd {
	margin-top: 10px;
}

body.sessionless #wicketfeedback {
    width: 50%;
    margin: -25% auto 0 auto;
}

/* START GENERAL CSS */

body#baseWebPage table {
    border: none;
}

body#baseWebPage tr, body#baseWebPage td {
    border-bottom: none;
    border-right: none;
    padding: 4px 8px;
    text-align: inherit;
}

body#baseWebPage .workAreaContainer {
    border: none;
    margin: 0px;
}
body#baseWebPage #loginMiddle {
    margin-top: 0px;
}

body#baseWebPage #userLocaleSelect select {
    min-width: 5em;
}

#workAreaContainer {
	min-height: calc(100vh - 136px);;
}

#userDataMiddle, #troubleTicketMiddle, #packageSelectMiddle {
    margin-top: 0px;
}

#userDataMiddle, #createUserMiddle, #createTicketContainer #troubleTicketMiddle, #viewTicketContainer #troubleTicketMiddle, #modifyTicketContainer #troubleTicketMiddle, #accountSubscriptionMiddle #subscriberInfo,  
div.upgradeChanges #accountInner, div.upgradeChanges #subscriptionInner{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 8px 24px;
}

#userDataTop.innerTop, #createUserTop.innerTop, #posDataTitle.innerBlockTitle {
	display: none;
}

div#headerBottom span span {
	color: #9F8B8B;
}

div#headerBottom span span:hover {
	color: #4D4C4C;
}

div#headerBottom span a {
	text-decoration: none;
}

div#headerBottom span img {
	width: 12px;
	margin: 0 4px 2px;
}

div#headerBottom div > span:last-child span {
	color: #4D4C4C;
}

#headerMiddle #userProfile img, #headerMiddle #userLogout img{display: inline !important;}
#headerMiddle #userLogout img{
	width: 16px;
	height: 16px;
}

/* New version -> Dont show "Logout" and Breadcrumbs arrows */
span#userLogout a/*, #headerBottom img */ {
	display: none !important;
}

.innerBlockTitle {
	text-align: left;
}

/* START USER DATA PAGE */

#userNameIdInputText {
    width: 18em;
    height: 20px;
    border-radius: 4px;
}

body#baseWebPage #birthdayLabel {
	display: inline;
}

/* START POS DATA PAGE */ 

#posData, #createPosTopBlock {
	display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 8px 24px;
}

#posDataMiddle div.BillingAndShippingAddressPanel, #createPosMiddle div.BillingAndShippingAddressPanel, #customerDataMiddle div.BillingAndShippingAddressPanel, #CreateposContainer #contactPersonalData, #customerDataInformation {
   	display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 4px 24px;
}

#posDataMiddle #contactPersonalData, #createPosMiddle #contactPersonalData{
    display: grid;
    grid-gap: 4px 24px;
    grid-template-columns: 1fr 1fr;
}

/* Create and Modify a PoS */
#posDataMiddle #posContactName, #createPosMiddle #posContactName {
	grid-column-start: 1;
}

#posDataMiddle #contactPersonalDataTitle, #createPosMiddle #contactPersonalDataTitle {
    text-align: left;
}

#posDataMiddle div.title-CoreClient, #posDataMiddle #contactPersonalDataTitle {
	margin-bottom: 10px;
	font-weight: 600;
}

/* START USERS PAGE */

#listUsersListMiddle table, #listPosListMiddle table {
	margin: 10px 0px;
}

#listUsersListMiddle div[wicketsource] > span, #listPosListMiddle div[wicketsource] > span {
	margin-top: 10px;
}

#userBirthday > span.colD, #customerDataInformation #birthday span.colD {
	font-style: italic;
}

#troubleTicketListMiddle #troubleTicketSearchOptions > span, 
#troubleTicketListMiddle #troubleTicketSearchOptions > select {
	margin-right: 8px;
}

#troubleTicketListMiddle #troubleTicketSearchOptions input, #troubleTicketListMiddle #troubleTicketSearchOptions select {
	border: 1px solid #DDD;
}

/* START NEW TICKET PAGE */
#ticketTypeInput > select {
	height: 34px;
}

#createTicketContainer #ticketDescription {grid-column: 1 / span 2;}
#createTicketContainer #ticketNewButtonsLabel {display:none;}

#viewTicketContainer #troubleTicketMiddle span.colB span, #viewTicketContainer #troubleTicketMiddle span.colAB span {
	width: 100%;
	min-height: 32px;
	padding-top: 6px;
	padding-bottom: 6px;
}

#viewTicketContainer #troubleTicketMiddle #ticketResolutionLabel {
	margin-top: 0px;
}

#modifyTicketContainer #troubleTicketMiddle span.colB span, 
#modifyTicketContainer #troubleTicketMiddle span.colAB span, 
#modifyTicketContainer textarea, #modifyTicketContainer select {
	width: 100%;
	min-height: 24px;
	padding: 6px;
}

#modifyTicketContainer #troubleTicketMiddle span.colB span.disabled-field,
#modifyTicketContainer #troubleTicketMiddle span.colAB span.disabled-field,
#modifyTicketContainer #troubleTicketMiddle span.colAB textarea.disabled-field  
{
	margin-top: 6px;	
}


#modifyTicketContainer #ticketNewButtonsLabel {
	display: none;
}

#modifyTicketContainer #ticketWorkLogAdditionOutput > textarea {
	border: 1px solid #DDD;
}

/* START ONLINE SALE PAGE */ 

#salesProcessContainer #accountSubscriberMiddle #accountInner, #accountSubscriberMiddle #subscriberInner {
	display: grid;
	grid-template-columns: 50% 50%;
	grid-gap: 4px;
}

#accountSubscriberMiddle #accountInner div > span.colA, 
#accountSubscriberMiddle #subscriberInner div > span.colA, 
#subscriberInner #accountSubsInner div > span.colA, 
#subscriberInner #accountSubsInner div > span.colA{
	display: inline;
}

#accountSubscriberMiddle #accountInner div > span.colB, 
#accountSubscriberMiddle #subscriberInner div > span.colB, 
#subscriberInner #accountSubsInner div > span.colB, 
#subscriberInner #accountSubsInner div > span.colB{
	font-weight: 600;
	min-width: auto;
}

#packageConfigContainer #subscriptionConfiguredMiddle {
	margin-top: 0px
}

#subscriptionConfigMiddle #msisdnIdOutputText{
    width: 18em;
    height: 20px;
    border-radius: 4px;
}

#subscriptionConfigMiddle div.configHeader {
	border-radius: 4px;
}

#customerDataMiddle .marketingConsent input[type='checkbox'] {
    width: 15px;
    height: 15px;
    margin: 4px;
}

#residentialDataContainer #customerDataInformation, #businessDataContainer #customerDataInformation{
	display: grid;
   	grid-template-columns: repeat(2, 1fr);
}

#salesProcessContainer #accountSubscriberContainer span.colB {
	display: inline;
}

#prepayConfigTop span#prepayConfigTopText {
	width: auto;
}
/* END ONLINE SALE PAGE */

/* START UPDATES AND CHANGES PAGE */
div.innerContainer div[id*="processPanel"], div.innerContainer div[id*="changeOwner"] {
	margin-left: 10px;
}

div#packageConfigContainer div#packageConfirmTop span#packageConfirmTopText {
	width: inherit;
}

div#packageConfigContainer div#packageConfirmTop span#OrderNumberLabel {display: block;}

/* END UPDATES AND CHANGES PAGE */

/* START SIM STATUS PAGE */
#simSearchStatusPage .innerBlockTitle {
	text-align: left;
}

#simSearchStatusPage .rowO > span.colA, #simSearchStatusPage .rowE > span.colA {
	display: inline;
	text-align: left;
}

#simSearchStatusPage input {
    width: auto;
}

/* END SIM STATUS PAGE */

/* START CHANGE OWNERSHIP PAGE */
#changeOwnershipContainer form[id*="findSubscription"], #changeOwnershipContainer #changeOwnerHeader {
	display: grid;
	grid-template-columns: 50% 50%;
}

#changeOwnershipContainer form[id*="subscriberForm"] .portabilityCustomerPanel {
	display: grid;
	grid-template-columns: repeat(2, 1fr);	
}

/* END CHANGE OWNERSHIP PAGE */

/* START POINT OF SALE ORDER */

div#portaPageDataContainer form[wicketsource*='DataPortin'] div#subscriptionInner { grid-area: 1 / 1 / 2 / 3; }
div#portaPageDataContainer form[wicketsource*='DataPortin'] div#depossitInner { grid-area: 3 / 1 / 4 / 2; }
div#portaPageDataContainer form[wicketsource*='DataPortin'] div#packageInner { grid-area: 3 / 2 / 4 / 3; }

#accountSubscriptionMiddle span.colA, #accountSubscriptionMiddle span.colB {
	display: inline;
}

#accountSubscriptionMiddle span.colB {
    font-weight: 600;
}

/* END POINT OF SALE ORDER */

#portaPageDataTop .portaSummaryTop {
	margin-top: 10px;
}

/* Table Rows */
tr:nth-child(even), #resultTable tr:nth-child(even) td, #totalTable tr:nth-child(even) td, #pageContainer #modifyTicketContainer .disabled-field, 
#subscriptionConfigMiddle div.configHeader, #reportContent table.asolReportsResultsTable td, #userDataMiddle #userLocaleSelect select[disabled],
body.sessionless #posSelect #posList div:nth-child(even) {
    background-color: #f6f6f6;
}

#reportContent #resultDiv table {
	background-color: inherit;
}

body.sessionless input {
    border: 1px solid #ccc;
    background-color: #FFF;
    color: #555;
}



body#baseWebPage input.submit, body#baseWebPage .button, body#baseWebPage table {
    background-color: transparent;
}
/* Top Side Menu */
body .menuEntry:hover,  body .topMenu li:hover {
    opacity: 1;
}

/* Table Headers */
#resultTable tr th, #totalTable tr th, #reportDiv table.asolReportsResultsTable tr th, #centerMiddle table th {
    background-color: #DDD;
}

#reportTop #reportButtons #printReportButton a, #reportTop #reportButtons a#downloadReportButton ,#reportTop #reportButtons #downloadReportButtonBack a {
	color: #9F8B8B;
}

#userNameIdInputText {
    border: 1px solid #ccc;
    color: #333;
    background-color: #f2f2f2;
}

#troubleTicketMiddle span.ro-area, #troubleTicketMiddle select[disabled] {
    border: 1px solid #DDD;
    color: #333;
    background-color: #EDEDED;
}
#accountSubscriptionMiddle span.colB, #changeOwnerHeader span.colB {
    color: #4D4C4C;
}

button.scope-inlineButton, button.category-inlineButton {
	background-color: inherit;
}

/**********/
#subscrSearchMiddle.container-margin-top,
.container-margin-top {
    margin-top: 36px;
}


.panelPagination span > em {
	font-style: inherit;
	color: #ACACAC;
	font-family: 'Consolas';
}

.panelPagination span > a {
	text-decoration: unset;
	color: #9F8B8B;
	font-family: 'Consolas';	
}

.panelPagination span.goto {
	cursor: default;
}

.panelPagination span.goto > span {
	border-bottom: 1px solid #4D4C4C;
}

#continue--ajax-indicator {
	margin-left: 4px;
}



/******** POS AVANZADO *********/
/*Estilos para distribución de SIMs*/
.distributionSims form{
    width: 360px;
    margin: 24px auto 0;
}
#posSearch{
    display: flex;
    margin: 16px 0 8px;
    align-items: center;
}
#posSearch #posSearchInput {
    display: flex;
    align-items: center;
}
#posSearch #posSearchInput .input-text-01 {
    padding: 2px;
    margin-left: 8px;
    width: 300px;
}
#posSearch #posSearchInput a{
    border: 1px solid #DDD;
    text-decoration: none;
    outline: none;
    color: inherit;
    padding: 2px 8px ;
    margin-left: 8px;
    transition: all 350ms ease;
    cursor: pointer
}
#posSearch #posSearchInput a:hover{
    border-color: #4D4C4C;
    outline: none;
    box-shadow: 0px 1px 4px rgba(105, 105, 105, 0.2);
}
#posSelectInput #posList a{
    color: #9F8B8B;
    font-weight: 600;
}
#posSelectInput #posList a:hover{color: #4D4C4C}

#distributionConfirmMiddle #destPosInnerTitle{margin-top: 8px}
#distributionConfirmMiddle #distributionPackageInnerTitle,
#distributionConfirmMiddle #posOrigInnerTitle,
#distributionConfirmMiddle #destPosInnerTitle{color: #9F8B8B;}

#distributionConfirmMiddle #distributionConfirmButtons{
    display: block;
    margin-top: 16px;
    width: 100%; 
    display:flex; 
    justify-content: center;
}
#distributionConfirmMiddle{
    display: flex;
    flex-wrap: wrap;
}
#distributionConfirmMiddle .innerBlock{
    border-top:1px solid #DDD;
    padding-top: 8px;
    margin-top: 16px;
    width: 46%;
}
#distributionConfirmMiddle #posInner{margin-left: 4%;}
#distributionConfirmMiddle #distributionPackageInner{}
#distributionConfirmMiddle #distributionConfirmButtons{justify-content: flex-end; width: 98% }

#distributionConfirmMiddle #distributionPackageInnerTitle, 
#distributionConfirmMiddle #posOrigInnerTitle, 
#distributionConfirmMiddle #destPosInnerTitle{
    margin-bottom: 4px;
}
#distributionConfirmMiddle #posInner #destPosInnerTitle{
    border-top:1px solid #DDD;
    padding-top: 8px;
    margin-top: 8px;
}

#distributionConfigContainer #simConfigurePannel{
    width: 480px;
    margin: 24px auto 0;
}
#distributionConfigContainer #simConfigurePannel #ListView #simSearchReserve{
    display: flex;
    align-items: center;
    width: 100%;
}
#distributionConfigContainer #simConfigurePannel #ListView #simSearchReserve .colB{
    margin: 0 16px 0 8px;
    width: 240px;
}
#distributionConfigContainer #simConfigurePannel #ListView #simSearchReserve #simIccidInput > input{
    width: 100%;
    padding: 2px 4px;
    font-size: 0.9em;
}
#distributionConfigContainer #simConfigurePannel #ListView #simSearchReserve #simIccidInput a{
    color: #9F8B8B;
    font-weight: 600;
    text-decoration: none;
}
#distributionConfigContainer #simConfigurePannel #ListView #simSearchReserve #simIccidInput a:hover{color: #4D4C4C}
#distributionConfigContainer #config{
    width: 480px; 
    margin: 16px auto 0;
}

/*estilos para gestión de lineas*/
.accountSubscriptionManagement span.colB, #changeOwnerHeader span.colB{ color: #4D4C4C; }
.accountSubscriptionManagement > form{ 
    width: 100%;
    margin: 24px 0;
}
.accountSubscriptionManagement > form > select{
    border: 1px solid #DDD;
    outline: none;
    margin: 0 !important;
    width: 300px;
    padding: 0 4px;
    transition: all 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}
.accountSubscriptionManagement > form > select:focus,
.accountSubscriptionManagement > form > select:active,
.accountSubscriptionManagement > form > select:hover{ 
    outline: none;
    border-color: #4D4C4C;
    box-shadow: 0 2px 2px -0.75px rgba(80, 136, 203, 0.1);
}
body#baseWebPage .accountSubscriptionManagement > form input{
    border: 1px solid #DDD;
    outline: none;
    color: inherit;
    padding: 6px 12px ;
    min-height: 30px;
    margin-left: 8px;
    transition: all 350ms ease;
    cursor: pointer;
}
body#baseWebPage .accountSubscriptionManagement > form input:focus,
body#baseWebPage .accountSubscriptionManagement > form input:hover,
body#baseWebPage .accountSubscriptionManagement > form input:active{
    border-color: #4D4C4C;
    outline: none;
    box-shadow: 0px 1px 4px rgba(105, 105, 105, 0.2);
}

.accountSubscriptionManagement #accountInner,
#accountSubscriptionMiddle.accountSubscriptionManagement #subscriptionInner{ 
    width: calc(50% - 8px); 
    margin: 0; 
}
.accountSubscriptionManagement #accountAddressInner > div > div{ display: flex; }
.accountSubscriptionManagement #accountAddressInner > div > div .colB{ margin-left: 4px; }
.accountSubscriptionManagement #simChangeConfig{
    margin-top: 32px;
    margin-right: 16px;
    justify-content: flex-start;
}

.accountSubscriptionManagement #accountInner #subscriptionSimIccid{margin-bottom: 16px}

.upgradeAndChangeContainer form{ margin-top: 32px; }
.upgradeAndChangeContainer form > div{ min-width: 360px; }

/* POP-UPS */
div.wicket-modal div.w_blue div.w_top, div.wicket-modal div.w_blue div.w_bottom, div.wicket-modal div.w_blue div.w_topLeft, 
div.wicket-modal div.w_blue div.w_topRight, div.wicket-modal div.w_blue div.w_bottomRight, div.wicket-modal div.w_blue div.w_bottomLeft, 
div.wicket-modal div.w_blue a.w_close{
    background: transparent;
}
div.wicket-modal div.w_blue div.w_left, div.wicket-modal div.w_blue div.w_right{
    background: transparent;
}
div.wicket-modal div.w_content_1{
    border: 1px solid white; 
    box-shadow: 0 2px 6px rgba(0,0,0,.4);
}
div.wicket-modal div.w_caption {
    height: 24px;
}
div.wicket-modal div.w_blue a.w_close{
    display: block;
    background-image: url('/bssresourcesDEV/posportal/common/images/add.png');
    background-repeat: no-repeat;
    background-size: 12px auto;
    transform: rotate(45deg);
    background-position: center;
    right: 8px;
    top: 4px;
    opacity: .8;
    transition opacity 300ms;
}
div.wicket-modal div.w_blue a.w_close:hover{opacity: 1}
div.wicket-modal div.w_content_3{border: none;}

#popupContainer{
    box-sizing: border-box; 
    padding: 16px 0 0;
    margin: 0 auto;
    width: calc(100% - 16px);
    border-top: 1px solid #DDD;
}

#popupContainer .modalMiddle input.button, 
#popupContainer #modifyConsumptionLimitButtonsDiv input{
    cursor: pointer;
    background: #FFF;
    color: #4D4C4C;
    font-weight: 500;
    padding: 8px 16px;
    border-radius: 18px;
    border: 1px solid #DDD;
    font-size: 1em;
    line-height: 100%;
    margin-left: 6px;
    transition: all 350ms ease;
}
#popupContainer .modalMiddle input.button:hover,
#popupContainer .modalMiddle input.button:focus{
    box-shadow: 0px 1px 4px rgba(105, 105, 105, 0.2);
}

#popupContainer input,
#popupContainer select{
    border: 1px solid #DDD;
    outline: none;
    transition: all 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}
#popupContainer input:hover, 
#popupContainer input:focus, 
#popupContainer input:active,
#popupContainer select:hover, 
#popupContainer select:focus, 
#popupContainer select:active{
    border: 1px solid #4D4C4C;
    box-shadow: 0 2px 2px -0.75px rgba(80, 136, 203, 0.1);
}

/* Gestión de servicios */
#popupContainer .table{
    border-collapse: collapse; 
    border: none;
}
#viewLineFeatures{padding: 0 16px;}
#viewLineFeatures #contentmiddletop{
    display: flex;
    padding: 2px 0 4px;
    position:relative;
}
#viewLineFeatures #contentmiddletop input{
    cursor: pointer;
    margin-right: 4px;
    background: #FFF;
    color: #4D4C4C;
    padding: 4px 8px;
    border: 1px solid #DDD;
    font-size: 1em;
    line-height: 100%;
    transition: all 350ms ease;
}
#viewLineFeatures #contentmiddletop input#subscription_features_apply{
    position: absolute;
    top: 0;
    right: 0;
    
    border: none;
    background: #686D76;
    color: #FFF;
    font-weight: 600;
    padding: 7px 16px 8px;
    border-radius: 18px;
}
#viewLineFeatures #contentmiddletop input#subscription_features_apply:hover{
    background: #4D4C4C;
    box-shadow: 0px 2px 6px rgba(105, 105, 105, 0.3);
}

#popupContainer .sugarView tr th, 
#popupContainer .sugarView tr td{padding: 4px 6px;}
#popupContainer .sugarView tr th:not(:last-child) {
    border-right: 1px solid #BFBFBF;
}
#popupContainer .sugarView tr td:not(:last-child) {
    border-right: 1px solid #DDD;
}

/*PUK*/
#viewPuk strong{
    font-weight: 700; 
    font-size: 1.07em;
}
#viewPuk table{border-collapse: collapse; text-align: left}
#viewPuk table th{
    background: #DDD; 
    text-align: left; 
    font-weight: 600;
}
#viewPuk table th h4{
    text-align: left;
    font-weight: 700;
    font-size: 1em;
    margin: 0;
}
#viewPuk tr th, #viewPuk tr td{padding: 4px 6px;}
#viewPuk tr th:not(:last-child) {
    border-right: 1px solid #BFBFBF;
}
#viewPuk tr td:not(:last-child) {
    border-right: 1px solid #DDD;
}
#popupContainer #viewPuk input.button{
    border: none;
    background: #686D76;
    color: #FFF;
    font-weight: 600;
    padding-top: 7px;
}
#popupContainer #viewPuk input.button:hover{
    background: #4D4C4C;
    box-shadow: 0px 2px 6px rgba(105, 105, 105, 0.3);
}

/*Limite de consumo*/
#popupContainer #consumptionLimit{padding: 0 16px;}
#popupContainer table.tableConsumeLimit{ display: flex; flex-wrap: wrap}
#popupContainer table.tableConsumeLimit thead, #popupContainer table.tableConsumeLimit tbody{width: 100%;}
#popupContainer table.tableConsumeLimit th{
    text-align: left; 
    width: 100%;
    padding: 0 0 8px;
}
#popupContainer table.tableConsumeLimit th h4{
    margin: 0;
    font-weight: 700;
}
#popupContainer table.tableConsumeLimit tbody tr{display: grid; grid-template-columns: 30% 70%;}
#popupContainer table.tableConsumeLimit tbody tr td{width: 100%; padding: 8px 0; border-bottom: 1px solid #DDD }

#popupContainer #consumptionLimitForm{display: flex; flex-direction: column}
#popupContainer #consumptionLimitForm #modifyConsumptionLimitButtonsDiv{
    order:1;
    display: flex;
    justify-content: flex-end;
}

#popupContainer #modifyConsumptionLimitButtonsDiv input{
    border: none;
    background: #686D76;
    color: #FFF;
    font-weight: 600;
    padding-top: 7px;
}
#popupContainer #modifyConsumptionLimitButtonsDiv input[disabled="disabled"]{ 
    cursor: default; 
    background: #BFBFBF;
}

/*Arreglillos*/
#headerTop img{height: 60x}
body#baseWebPage .ui-datepicker table tr, 
body#baseWebPage .ui-datepicker table td {
    padding: 1px;
}
 
/* ver bonos y miniplanes */
.viewPackagesContainer .table-responsive table.sugarView{
    border-collapse: collapse;
}
.viewPackagesContainer .table-responsive table.sugarView tbody{
    font-size: 0.82rem;
}
.viewPackagesContainer .innerMiddle{ margin-top: 12px; }
.viewPackagesContainer .innerMiddle > div:not(:first-child){
    margin-top: 24px;
}
#centerMiddle .viewPackagesContainer .table-responsive table.sugarView thead tr:first-child th{
    background: transparent;
    padding: 0;
}
.viewPackagesContainer .table-responsive table.sugarView h4{
    font-size: 1em;
    font-weight: 600;
    line-height: 150%;
    color: #9F8B8B;
    margin: 0 0 .5em;
}
.viewPackagesContainer .table-responsive table.sugarView tr{ font-weight: 400 !important }

.viewPackagesContainer .table-responsive table.sugarView tr th, 
.viewPackagesContainer .table-responsive table.sugarView tr td{
    padding: 4px 6px;
}
body#baseWebPage .viewPackagesContainer .table-responsive table.sugarView tr th:not(:last-child) {
    border-right: 1px solid #BFBFBF;
}
body#baseWebPage .viewPackagesContainer .table-responsive table.sugarView tr td:not(:last-child) {
    border-right: 1px solid #DDD;
}

.viewPackagesContainer .innerMiddle #goBack{padding-bottom: 24px;}
.viewPackagesContainer .innerMiddle #goBack button,
.viewConsumptionContainer form > input.button{
    cursor: pointer;
    background: #FFF;
    color: #4D4C4C;
    font-weight: 600;
    padding: 8px 16px;
    border-radius: 18px;
    border: 1px solid #DDD;
    font-size: 1em;
    line-height: 100%;
    transition: all 350ms ease;
}
.viewPackagesContainer .innerMiddle #goBack button:hover{ box-shadow: 0px 1px 4px rgba(105, 105, 105, 0.2); }


/* Ver consumo */
/*busqueda*/
.viewConsumptionContainer form{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.viewConsumptionContainer form > span{ display:block; margin-left: 16px; }
.viewConsumptionContainer form > input.button{
    margin-top:16px;
    margin-right: 8px;
}
.viewConsumptionContainer form > span:last-child{font-size: 0.82rem;}

.viewConsumptionContainer form select,
.viewConsumptionContainer form > span input,
.viewConsumptionContainer form > span select{
    box-sizing: border-box;
    font: inherit;
    padding: 4px;
    border: 1px solid #DDD;
    margin: 0;
    transition: all 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}
.viewConsumptionContainer form select:hover,
.viewConsumptionContainer form > span input:hover,
.viewConsumptionContainer form > span select:hover,
.viewConsumptionContainer form select:focus,
.viewConsumptionContainer form > span input:focus,
.viewConsumptionContainer form > span select:focus{
    outline: none;
    border-color: #4D4C4C;
    box-shadow: 0 2px 2px -0.75px rgba(80, 136, 203, 0.1);
}
.viewConsumptionContainer form > span input.button{
    padding-left: 12px;
    padding-right: 12px;
    cursor: pointer;
}
.viewConsumptionContainer form > span .id-ff button{display: none;}
/*tabla*/
.viewConsumptionContainer .sugarResultInfo #totalsContainer{
    font-weight: 600; 
    margin-left: 8px;
}
.viewConsumptionContainer table{
    border-collapse: collapse;
    font-size: 0.82rem;
}
.viewConsumptionContainer table thead a{color: #4D4C4C}
.viewConsumptionContainer table tr{ font-weight: 400 !important }

.viewConsumptionContainer table tr th, 
.viewConsumptionContainer table tr td{
    padding: 4px 6px;
}
.viewConsumptionContainer table tr th:not(:last-child) {
    border-right: 1px solid #BFBFBF;
}
.viewConsumptionContainer table tr td:not(:last-child) {
    border-right: 1px solid #DDD;
}


/* Reports */
#reportContainer {margin: 0 24px;}
.reportMiddle{margin:0}

#reportContainer #centerTitle{display: none}
.reportTop{text-align: left; margin: 0 0 24px}
#reportTop #reportButtons a{
    text-decoration: none;
    padding: 4px 16px;
    border: 1px solid #DDD;
    background-color: white;
    margin: 0;
    transition: all 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;   
}
#reportTop #reportButtons a:hover{ box-shadow: 0px 1px 2px rgba(105, 105, 105, 0.2);}
#reportContainer h2{
    font-size: 18px; 
    font-weight: 700;
    border-bottom: 1px solid #DDD;
}
#reportContainer #reportDiv h4 .asolReportMessage{display:none}
#reportContainer #reportDiv{font-size: 0.82rem}
#reportContainer #reportDiv .report_headers{
    background-color: #DDD;
}
#reportContainer #reportDiv .report_header,
#reportContainer #reportDiv .report_value{
    padding: 4px 6px; 
}
#reportContainer #reportDiv .report_header p,
#reportContainer #reportDiv .report_value p{margin: 0}
#reportContainer #reportDiv .report_header:not(:last-child) {
    border-right: 1px solid #BFBFBF;
}
#reportContainer #reportDiv .report_value:not(:last-child) {
    border-right: 1px solid #DDD;
}

#reportContainer #reportDiv .subtotal,
#reportContainer #reportDiv .subtotal.report_value p,
#reportContainer #reportDiv .report_totals .total p{text-align: right}
#reportContainer #reportDiv .list:not(:first-child){margin-top: 16px}

#reportContainer #reportDiv .asolReportsSubTotalTitle h3{
    margin-top: 16px;
    font-size: 0.82rem; 
    font-weight: 700;
}
#reportContainer #reportDiv .asolReportsSubTotalTitle h3 em{font-style: normal}
#reportContainer #reportDiv .subtotal.report_header, 
#reportContainer #reportDiv .report_totals .asolReportsGroupedTotal:first-child{
    background: #DDD;
}
#reportContainer #reportDiv .subtotal.report_value{width: 100% !important; box-sizing: border-box; display: block }

.asolReportsHeadersRow .report_header, .report_row .report_value{border-bottom:none;}
.asolReportsHeadersRow .report_header, .report_row:nth-child(odd){background-color: #f6f6f6}

#reportContainer #reportDiv .currency{text-align: right;}
#reportContainer #reportDiv .asolReportsGroupedTotal .invisible,
#reportContainer #reportDiv .asolReportsGroupedTotal .total{
    display: table-cell;
    text-align: right;
}