/* NEW GENERAL */
:root {
  --primary-color: #4a9cdd;
}
*{box-sizing: border-box;}

/* MAIN DIVS */
div#bsscenter {
	background-color: white;
	clear: both;
	width: 100%;
}
div#bsscontent {
	background-color: white;
}
/* CENTER CONTENT MIDDLE STYLES */
div#contentmiddletop {
	background-color: white;
	width: 100%;
}
div#contentmiddlecenter {
	clear: both;
}
div#contentmiddlebottom {
	background-color: white;
	border: 0px solid orange;
	padding: 2px 0;
	width: 100%;
}
#subscription_features_apply, #subscription_saldo_apply {
	background-color: DarkGrey;
	color: white;
}
/* BASIC ELEMENTS */
body {
	background-color: white;
	text-align: left;
	color: #373737;
	font-family: verdana,arial,sans-serif;
	font-size: 12px;
	margin: 2px;
}
p {
	margin-top: 0px;
	margin-bottom: 0px;
}
img {
	border: 0 solid;
}
form {
	margin: 0px;
}
table {
	border: 0 solid;
	width: 100%;
	min-width: 250px;
}
table a {
	text-decoration: none;
}
textarea {
	font-family: inherit;
	height: 35px;
	min-width: 250px;
	resize: none;
	width: 95%;
}

/* INPUT AND BUTTONS STYLES */
input[type=checkbox], input[type=radio] {
	border: 0px;
	background-color: transparent;
	margin: 0px;
	padding: 0px;
	vertical-align: bottom;
}

input[type=text].input-text-00 {
	width: 100%;
}

input[readonly], select[readonly], textarea[readonly] {
	border: none;
	color: #000000;
}

input:focus, textarea:focus, select:focus {
	background-color: #F9F9F9;
}

.avoid-rtl {
	unicode-bidi: plaintext;
}

.id-ff .button {
	background-color: #F5F5F5;
	padding: 0px;
}

.id-ff .button:hover {
	background-color: #FFFFFF;
}

.buttons {
	padding: 0;
}

/* HEADINGS FONTS  */
h1, h2, h3, h4, h5 {
	display: inline;
	margin: 2px;
}

h1 {
	font-size: 14px;
}

h2 {
	font-size: 14px;
}

h3 {
	font-size: 13px;
}

h4 {
	font-size: 12px;
}

h5 {
	font-size: 11px;
	font-weight: normal;
}

/* LINKS */
a, a:link, a:visited, a:hover {
	color: #373737;
	cursor: pointer;
	padding-left: 4px;
	padding-right: 4px;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}

/* HEADER STYLES */
div#headermiddle a {
	background-color: #DBD3B0;
	color: #533F00;
	font-variant: small-caps;
	padding: 4px;
}

/* MENU STYLES */
div#navmidddle a {
	color: #533F00;
	font-variant: small-caps;
	text-decoration: none;
}

div#navmidddle a:hover {
	font-weight: bolder;
}

div#navmidddle div {
	border-bottom: 1px solid #FFFFFF;
	padding: 3px 1px 4px 8px;
}

/* CONTENT RELATED STYLES */
table.actionsContainer {
	padding: 4px 4px 2px 8px;
}

/* DetailView/EditView/ListView styles */
.lastCol {
	width: 99%;
}

/* editviews */
.sugarEdit {
	padding: 0px;
}

.sugarEdit>table {
	margin-bottom: 0px;
	padding: 3px 3px 3px 10px !important;
}

.th_title {
	text-align: left;
}

.th_links {
	text-align: right;
}

.th_submenu {
	text-align: right;
	width: 5%
}

.action_links {
	text-align: center;
}

.action_links  img {
	padding: 4px 0 0 0;
}

/*************/
/*  COMMON   */
/*************/
.sugarView .sugarMessage {
	margin: 5px;
}
.sugarView h4 {
	display: block;
}
.button {
	border: 1px solid #6F7C85;
	/*	border-radius: 5px;*/
	display: inline-block;
	padding: 1px 4px;
	background: transparent;
	padding: 0 5px;
	margin-bottom: 5px;
}

.button, .button * {
	text-decoration: none !important;
}

.sugarView .sugarSearchForm, .sugarView .sugarResultInfo {
	border-bottom: solid 1px #000000;
}

.sugarView .sugarSearchForm {
	padding: 10px 5px;
}

.sugarView .sugarResultInfo {
	padding: 5px 10px;
	background-color: #FFFFFF;
}

.sugarView .sugarResultInfo .sugarPagination {
	text-align: left;
}

.sugarView .sugarResultInfo .sugarExtraInfo {
	float: right;
}

.sugarList thead tr {
	background-color: #EBEBEB;
	color: #373737;
	padding: 2px;
	font-weight: normal;
	text-align: left;
	white-space: nowrap;
}

.sugarList tr:nth-child(odd) td {
	background-color: #FFFFFF;
}

.sugarList tr:nth-child(even) td {
	background-color: #F9F9F9;
}

.sugarList input[type=checkbox], .sugarList input[type=radio] {
	margin: 3px;
}

.sugarEdit tr td.sugarLabel, .sugarDetail tr td.sugarLabel {
	background-color: inherit;
}
/********************/
/* EDIT/DETAIL VIEW */
/********************/

/* Bug 27478 - IE Hacks to make sure username/password boxes on login page are same length */
td.sugarEdit.sugarView td {
	text-align: left;
}
/* login page*/
#user_password, #user_name {
	width: 150px;
}

.login table tr td {
	padding: 0px !important;
	text-align: left;
}

.login {
	padding: 10px 6px 12px 10px !important;
}

.login .login_more {
	text-align: right;
	*padding-right: 18px !important; /* only needed in IE7 and earlier */
}

/* GENERIC */
.centerMessage {
	text-align: center;
	padding: 10px 0px !important;
	font-size: small;
}

/* SPECIALS */
#description_label {
	vertical-align: top;
}

.rulesUrl {
	width: 100%;
}

#html_label {
	vertical-align: top;
}

.rulesHtml {
	height: 150px;
}

#rules_html {
	padding: 0px 0px;
}

table.rules_html {
	border: 0px solid #637C96;
}

/***Highligth changes button***/
.changed {
	background-color: Peru;
}

.changed_server {
	background-color: Peru;
}

.innerContainer {
	clear: both;
	overflow: auto;
	width: 100%;
}
.wicketFeedbackMessage {
	color: red;
	font-weight: bold;
}

.tooltip {
	font-style: italic;
	color: #708090;
	font-weight: bold;
}

span.rpNotInCore {
	color: red;
}

.required {
	font-family: verdana;
	font-size: 11px;
	color: red;
}

table.ui-datepicker-calendar {
	min-width: auto;
}

#scheParamsValue {
	white-space: normal;
}
.addressPanelSameRow {
	width: 49%;
	display: inline-block;
}

.colA.borderless, .colB.borderless{
    border:none;
}
.borderless-transparent{
    border:none; 
    background-color: transparent;
}

.without-margin-top{
    margin-top:0px;
}

/******** FIX FORMS ********/
input[type=text], select, textarea {
	background: transparent;
	color: #373737;
}
input[type=submit]:hover, input[type=submit]:focus, input[type=submit][selected] {
	background-color: #FFFFFF;
}
.sugarView tr td table, .sugarView tr td table tr td {
	padding: 0;
	border-bottom: 1px solid #cbdae6;
	border: none;
}
.sugarView {
	margin-bottom: 5px;
	padding: 0 0 5px;
}
.sugarView h4 {
	background-color: #EBEBEB;
	background: linear-gradient(to bottom, #EBEBEB, #DADADA);
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	display: block;
	padding: 5px;
	margin: 0;
}
.sugarView th, .sugarView td {
	/*line-height: 21px;*/
	white-space: nowrap;
	/*padding-left: 5px;*/
}
.sugarView th:not(:first-child), .sugarView td:not(:first-child) {
	padding-left: 5px;
}

.sugarView tr td {
	border-bottom: 1px solid #cbdae6;
}
.sugarEdit tr td, .sugarDetail tr td {
	background: white;
	border-bottom: 1px solid #CCCCCC;
}
.select {
	max-width: 14.6em;
	min-width: 14.6em;
}

/******** NEW ********/
.ftthForm.sugarView{
	margin: 0;
	padding: 0 24px;
}
.sugarView .sugarView{ padding:0; }
.ftthForm.sugarView h4{
	padding: 0;
	margin: 0 0 24px;
	font-size: 0.9em;
	background: transparent;
  border-radius: 0;
}
.title-row{
	display: block;
	width: 100%;
	font-size: 1.1em;
	font-weight: bold;
	position: relative;
	margin-bottom: 3px;
}
.title-row:before{
	content: "";
	position: absolute;
	top: -6px;
	width: 100%;
	left: 0;
	background-color: #E0E0E0;
	height: 1px;
}

/*FORM ELEMENTS*/
select, input[type=text], textarea{
	background: transparent;
	border: 1px solid #ced4da;
	color: #505050;
	font-size: 12px;
	padding: 4px;
}
select, input[type=text], input[type=password]{
	transition: all 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}
.ftthForm.sugarView select, .ftthForm.sugarView input[type=text], .ftthForm.sugarView textarea{
	max-width: 100%;
	min-width: 48px;
	width: 100%;
	min-height: 26px;
}

select:hover, input[type=text]:hover{border-color: var(--primary-color)}
select:focus, input[type=text]:focus{
	border-color: var(--primary-color);
	box-shadow: none;
	background-color: white;
}
select option:hover{background-color: var(--primary-color) }
.form-group label, .form-group span.colA{
	display: block;
	padding-bottom: 3px;
	color: #505050;
	font-size: 11px;
	line-height: 18px;
	letter-spacing: 0.4px;
}
.form-group label span{
	display: inline-block;
	transform: translateX(-8px);
}

/*LAYOUT GRID*/
.col-3{
	display: grid;
	grid-gap: 12px;
	grid-template-columns: repeat(3, 1fr);
}
.col-4{
	display: flex;
	flex-wrap: wrap;
}
.col-4 > div{
    width: calc(28% - 12px);
    margin: 9px 12px 9px 0;
    min-width: 70px;
}
.col-4 > div:first-child{
	margin-left: 0;
}
.col-4 #addressPostalCode{width: calc(16% - 12px);}
.col-4 #checkCoverageStreet{width: calc(20% - 12px); margin-left: 0;}
.col-4 #street{width: calc(36% - 12px);}
.col-4 #checkCoverageAddress{width: 9%;}

.flex-end{
	display: flex;
    justify-content: flex-end;
    margin-top: 12px;
}
@media (min-width: 720px) {
	.filterResult{position:relative}
	.filterResult .flex-end{
	    margin: 0;
		position: absolute;
		right: 24px;
		top: calc(100% - 39px);
	}
	.filterResult .flex-end input{margin: 0}
}
.primary.button{
	background-color: var(--primary-color);
	display: block;
	border: none;
	color: white;
	text-transform: uppercase;
    font-weight: bold;
	letter-spacing: 1.2px;
	font-size: 11px;
    padding: 9px 30px;
    box-shadow: 0 3px 10px rgba(74, 156, 221, .2);
	transition: all 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}
.primary.button:hover{
	transform: translateY(-3px);
	background-color: #4390ce;
	cursor: pointer;
}
.primary.button:focus{background-color: #4390ce;}

.secondary.button{
	background-color: white;
	border: solid 1px;
	border-color: var(--primary-color);
	color: var(--primary-color);
	display: block;
	text-transform: uppercase;
    font-weight: bold;
	letter-spacing: 1.2px;
	font-size: 11px;
    padding: 9px 30px;
    box-shadow: 0 3px 10px rgba(74, 156, 221, .1);
	transition: all 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}
.secondary.button:hover{
	transform: translateY(-3px);
	cursor: pointer;
}
.flex-end .button:last-child{margin-left: 12px}

#wicketfeedback ul{
	list-style: none;
	padding: 0 24px;
}
#wicketfeedback ul li{
	color: #ea5b51;
}

.ftthForm.sugarView .rowO{
	margin-bottom: 48px;
}
.filterResult:not(.rowO) .col-4 > div{
	width: calc(16% - 12px);
}
.table_services{
	margin-top: 9px;
}
.sugarView th, .sugarView td{
	line-height: 12px;
	white-space: nowrap;
}

.sugarView th:last-child, .sugarView td:last-child{padding-right: 0}
.sugarView th{
	padding: 0;
	font-size: 11px;
	color: #9E9E9E;
	letter-spacing: 0.3px;
	font-weight: normal;
}
.sugarView td{
	font-size: 12px;
	padding: 5px 0;
}
.sugarView tbody tr:not(:last-child) td{
	border-bottom: 1px solid #E0E0E0;
}

.button-next{
	display: block;
	position: relative;
	height: 26px; 
	width: 26px; 
	background-color: var(--primary-color);
	border-radius: 15px;
    box-shadow: 0 4px 14px 0px rgba(74, 156, 221, .2);
    overflow: hidden;
	transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}
.button-next:before{
	content: "";
	position: absolute;
	top: 9px;
	left: -15px;
	border: solid white;
	border-width: 0 2px 2px 0;
	display: block;
	padding: 3px;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0.1s;
}
.button-next:after{
	content: "";
	position: absolute;
	top: 9px;
	left: 7.5px;
	border: solid white;
	border-width: 0 2px 2px 0;
	display: block;
	padding: 3px;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}
.button-next:hover:before{left: 7.5px}
.button-next:hover:after{left: 30px}
.button-next:hover{
	background-color: #4390ce;
	cursor: pointer;
}
.button-next:focus{background-color: #4390ce;}

/* LOADING */
.wicket-ajax-indicator img{
	position: absolute;
    top: 40%;
    left: calc(50% - 8px);
    z-index: +55;
}
.wicket-ajax-indicator:before{
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: rgba(255,255,255,.4);
	z-index: +50;
}
/* ERROR */
.innerContainer{
	margin-top: 30px;
	padding: 0 24px;
	position: relative;
	display: block;
}
.innerContainer:before{
	content: "";
	position: absolute;
	top: -9px;
	left: 24px;
	right: 24px;
	background-color: #E0E0E0;
	height: 1px;
}
.innerContainer .sugarMessage{
	font-size: 1.1em;
	line-height: 1.6em;
	max-width: 550px;
	margin: 0 0 12px;
}
.pagination a{
	text-decoration: none;
	color: var(--primary-color);
	font-style: italic;
}

.cont{
	padding: 0 24px;
	margin-bottom: 24px;
}

.confirmation-table td{
	padding: 12px 12px 12px 0;
}
.confirmation-table tr{
	display: flex; 
	align-items: flex-end;
}
.confirmation-table tr td{flex: 1}
.confirmation-table td.sugarLabel{
	font-size: 1.1em;
	font-weight: bold;
	max-width: 300px;
	display: block;
}

/*progressCounter*/
#View{position: relative}
.progressCounter{
	position: absolute;
    top: 0;
    right: 24px;
}
.progressCounter{color: #9E9E9E}
.progressCounter::first-letter{
	font-weight: bold;
    color: #373737;
    padding-right: 2px;
}

/**/
.confirmation-table{ 
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 48px;
}
.confirmation-table td{padding: 9px 0 0}

.confirmation-table .colAt{
    font-size: 11px;
    color: #9E9E9E;
    letter-spacing: 0.1px;
    font-weight: normal;
}
.confirmation-table tr{
    align-items: flex-start;
    flex-direction: column;
    padding-right: 36px;
}

/*.sugarView tbody.confirmation-table tr:not(:last-child) td{ border-bottom: none }*/
.sugarView tbody.confirmation-table tr td{ border-bottom: none }

#customerDataButtonCheck{
	display:flex;
    justify-content: space-between;
}

#subscriptionApplyPkg .sugarView h4{margin: 24px 0 12px}

.rowO:not(.filterResult) .title-row{
	margin-bottom: 12px;
}
#prepayConfigTop .table_services{ margin-top: 0 }
.sugarView .cont{ padding: 0; margin: 0 }

.buttonContainer #customerDataButtonCheck{justify-content: flex-end;}

/*Confirmation*/
.sugarView .cont .exito{margin: 0 0 30px;}
.sugarView .cont .exito span{
	display: block;
    padding: 12px 9px;
    background-color: #E9FCF2; 
    border: 1px solid #C6FADB; 
    color: #0C7338;
}
.sugarView .cont .fallo{margin: 0 0 30px}
.sugarView .cont .fallo span{
	display: block;
    padding: 12px 9px;
    background-color: #FFE8E3; 
    color: #E51400;
}