/* TAB STEPS */
/* Globals */

html body {
	color:var(--Text-Global);
	background-color:var(--Body-Bg) !important;
	}
html body option {
    color: #333 !important;
}
html body .modal {
    color: #333 !important;
}
html body .note-editable {
    color: #333 !important;
}
a, button {
	transition:0.09s linear 0s;
	}
#fixedbar {
	background-color:rgba(0,0,0, 0.5)!important;
	}
.tabGeneralData {
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
	border: medium none;
	margin: 15px 0;
	min-height: 22px;
	padding: 10px 20px;
	position: relative;
	text-align: center;
	}
.tabGeneralData h3 {
	color: var(--Text-1)!important;
	font-size: 2.8rem;
	letter-spacing: -0.1rem;
	margin:10px auto 20px;
	}
.tabGeneralData .description {
	border: 2px dashed #ddd;
	opacity:0.9;
	font-size: 0.9rem;
	font-style: oblique;
	padding: 20px;
	background-color:var(--Bg-3)!important;
	}
        
.tabGeneralData .description ul {
	list-style-position: inside;
	}
        
.tabGeneralData .description ol {
	list-style-position: inside;
	}

.tabProcessor {
	background-color: var(--Tab-Processor-Bg)!important;
	border:none;
	box-shadow: none;
	margin: 0 auto;
	max-width: 780px;
	padding: 10px;
	box-sizing:border-box !important;
	}
.hr-line-dashed {
	border:none;
	}

#tabs .elementGroup {
	background:var(--Bg-3)!important;
	}

/* BUTTONS */
.infopopover.btn-info {
	background-color: var(--Tab-Active-Bg);
	border-color: var(--Tab-Active-Bg) ;
	}
.infopopover.btn-info:hover {
	background: var(--Tab-Active-Bg);
	border-color: var(--Tab-Active-Bg);
	opacity: 0.8;
	}

/* Radio and Check buttons */

.choiceGroup {
	padding:10px;
	}
.choiceGroup label.container-radio,
.choiceGroup label.container-checkbox {
	display: inline-block;
	font-weight: 600;
	padding: 3px 0;
	position:relative;
	min-height:24px;
	}

.choiceGroup label input[type="radio"],
.choiceGroup label input[type="checkbox"] {
	margin:0 10px auto 0;
	vertical-align:bottom;
	width:24px;
	}
.choiceGroup label input[type="radio"] + span,
.choiceGroup label input[type="checkbox"] + span {
	background: #fcfcfc;
	border: 2px solid rgba(0, 0, 0, 0.1)!important;
	border-radius: 150px;
	display: block;
	height: 20px;
	left: 0;
	position: absolute;
	top: 3px;
	width: 20px;
	transition:all 0.4s linear 0s;
	}
.choiceGroup label input[type="radio"] + span:hover,
.choiceGroup label input[type="checkbox"] + span:hover {
	cursor:pointer;
	border-color:#ccc;
	}
.choiceGroup label input[type="radio"]:checked + span,
.choiceGroup label input[type="checkbox"]:checked + span {
	background: #2e8b57 none repeat scroll 0 0;
	border-color: #2e8b57;
	}
.choiceGroup label input[type="radio"]:checked + span::before,
.choiceGroup label input[type="checkbox"]:checked + span::before {
	color: #ffffff;
	content: "";
	font-family: fontawesome;
	font-weight: 100;
	height: auto;
	position: absolute;
	text-align: center;
	width: 100%;
	}

.choiceGroup label input[type="checkbox"] + span {
	border-radius:0;
	height:20px;
	}
.choiceGroup label input[type="checkbox"]:checked + span {
	border-color: rgba(0, 0, 0, 0.1)!important;
	}
.choiceGroup label input[type="checkbox"]:checked + span::before {
	content: "";
	background-color: #6b8e23;
	border-radius: 0;
	height: 20px;
	}
	
/* Clonable Group */

.clonneableGroup {
	background-color: var(--Clonneable-Bg)!important;
	border: 2px solid rgba(0,0,0, 0.25)!important;
	border-width:2px;
	border-style:solid;
	border-color:var(--Clonneable-Border)!important;
	border-radius: 14px;
	margin: 5px 0;
        box-sizing: border-box !important;
	}

.clonneableGroup .groupHandler {
	cursor:pointer;
	}
/* Image Preview */
.imagePreview {
	background: var(--Bg-3)!important;
	border: 1px solid var(--Form-Border-2)!important;
	margin: 10px auto;
	padding: 20px;
	text-align:center;
	}
.imagePreview .imageUpload {
	margin: 20px auto 10px;
	}
.imagePreview .imageUpload img {
	  box-shadow: 0 0 16px -10px #000000;
	  max-width: 90%;
	  padding: 10px;
	}


/* Video Form */

.formVideo {
	background: var(--Bg-3)!important;
	border: 1px solid var(--Form-Border-2)!important;
	border-radius: 5px;
	margin: 20px auto;
	padding: 30px 40px;
	}
.formVideo .videoTitle {
	color: var(--Text-1)!important;
	font-size: 1.3rem;
	margin: 0 auto 30px;
	text-align: center;
	}

/* Botones */
button.uploadImage {
	font-weight: 600;
	line-height: 1;
	padding: 10px 20px;
	text-transform: uppercase;
	vertical-align: middle;
	}
button.uploadImage i {
	font-size: 1.3rem;
	}

/* Clonable Block */

.clonneableBlock {
	min-height:34px;
	}
.clonneableBlock .clonneableTools button {
	border: 1px solid rgba(0, 0, 0, 0.27)!important;
	border-radius: 2px;
	color: #ffffff;
	float: left;
	margin: 0 1px 0 0;
	padding: 5px 10px;
	}
.clonneableBlock .clonneableTools button:hover {
	opacity: 0.7;
	}
.clonneableBlock .clonneableTools .collapseElement {
	background:#999;
	}
.clonneableBlock .clonneableTools .cloneElement {
	background:#555;
	}
.clonneableBlock .clonneableTools .trashElement {
	background:#ff6347;
	}

/* Date picker */
.datepicker {
    color: #444;
}

/* Comentarios */

.formComment {
	background: var(--Bg-1)!important;
	border-width:2px;
	border-style:dashed;
	border-color:var(--Form-Border-2)!important;
	border-radius: 5px;
	color: var(--Text-2)!important;
	margin: 10px auto;
	padding: 20px 30px;
	}

/* FORMS */

#tabs .form-horizontal {
	margin:10px 20px;
	background:var(--Body-Bg)!important;
	}

#tabs .form-group {
	background: var(--Bg-2)!important;
	border-width:1px;
	border-style:solid;
	border-color:var(--Form-Border)!important;
	border-radius: 5px;
	box-shadow: 0 -10px 30px -33px #000000 inset;
	padding: 10px;
	margin:10px auto !important;
	}

#tabs .form-horizontal .control-label {
	color: var(--Text-1)!important;
	font-size: 1.3rem;
	margin: 0 0 10px;
        text-align: left;
	}
#tabs .form-horizontal .sendButtonAction {
	margin: 20px 0 0 10px;
        text-align: left;
}

#tabs .form-group .elementTip {
	margin-bottom: 6px;
	margin-top: 4px;
	font-size:inherit;
	}
#tabs .form-horizontal .form-control,
#tabs .form-horizontal .single-line {
	background: var(--Input-Bg) !important;
	color:var(--Input-Text) !important;
	border: 1px solid var(--Input-Border) !important;
	padding: 12px 20px;
	box-sizing:border-box !important;
	width:100%;
	font-size:1.1rem;
	}
#tabs .form-horizontal .form-control option {
	color: #333;
	background: var(--Input-Bg);
	border-color: var(--Input-Border);
	padding:5px;
	}
.plainGroup {
	border-radius: 5px;
	border: 1px solid rgba(0, 0, 0, 0.13)!important;
	padding:10px;
	}

/* MODAL CONTENT */
.modal-content .form-horizontal {
	background: inherit !important;
	margin:0 20px !important;
	}
.modal-content .form-group {
	background: inherit !important;
	border-color: inherit !important;
	margin:0 auto -1px !important;
	padding:2px 0 !important;
	line-height:1;
        color: #444;
	}
.modal-content strong {
    color: #444;
}
.modal-content span {
    color: #444;
}
.modal-content small {
    color: #444;
}
.modal-content h4 {
    color: #444;
}
.modal-content h3 {
    color: #444;
}
.modal-content .btn-white {
    color: #444;
}
.modal-content .btn-warning {
    color: #f0f0f0;
}
.modal-content .btn-danger {
    color: #f0f0f0;
}
.modal-content .form-group input {
	background: white !important;
	border-color: #ccc !important;
        color: #333 !important;
	}
.modal-content .form-horizontal .control-label {
	color: inherit !important;
        font-size: 1.1rem !important;
	}

/* Tabs*/ 
/* Superior */

.docxnav-tabs {
	border:none;
	border-bottom: 1px solid var(--Tab-Border)!important;
	}
.docxnav-tabs > li > a {
	background: var(--Tab-Bg)!important;
	color: var(--Tab-Text)!important;
	border-width:1px;
	border-style:solid;
	border-color:var(--Tab-Border)!important;
	margin: 0 0 0 -1px;
	font-size:0.9rem;
	padding:9px;
	}
.docxnav-tabs  > li > a:hover,
.docxnav-tabs  > li > a:focus {
	opacity:0.7;
	border-color:var(--Tab-Border)!important;
	background-color:var(--Tab-Bg)!important;
	color: var(--Tab-Text)!important;
	margin-top: -4px;
	padding-bottom: 13px;
	}
.docxnav-tabs > li.active > a,
.docxnav-tabs > li.active > a:hover,
.docxnav-tabs > li.active > a:focus {
	border:1px solid var(--Tab-Border)!important;
	border-radius: 5px 5px 0 0;
	box-shadow: 0 -4px 20px -20px #000 inset;
	color:var(--Tab-Active-Text)!important;
	background:var(--Tab-Active-Bg)!important;
	opacity:1;
	}

	
	/* Inferior */
.docxbotnav-tabs {
	border:none;
	border-top: 1px solid var(--Tab-Border)!important;
	}
.docxbotnav-tabs > li > a {
	background-color:var(--Tab-Bg)!important;
	color: var(--Tab-Text)!important;
	border:1px solid var(--Tab-Border)!important;
	border-radius: 0 0 5px 5px;
	margin: 0 0 0 -1px;
	font-size:0.9rem;
	padding:9px;
	}
.docxbotnav-tabs  > li > a:hover,
.docxbotnav-tabs  > li > a:focus {
	background-color:var(--Tab-Bg)!important;
	color: var(--Tab-Text)!important;
	border-color:var(--Tab-Border)!important;
	margin-top:0;
	margin-bottom: -4px;
	padding-top: 14px;
	}
.docxbotnav-tabs > li.active > a,
.docxbotnav-tabs > li.active > a:hover,
.docxbotnav-tabs > li.active > a:focus {
	background:var(--Tab-Active-Bg)!important;
	border:1px solid var(--Tab-Border)!important;
	box-shadow: 0 -4px 20px -20px #000 inset;
	color:var(--Tab-Active-Text)!important;
	opacity:1;
	}


	/* Tab Collapse ACORDION*/
#docxpressoTabBar-accordion {
	box-shadow:0 10px 10px -16px #000000;
	}
	
#docxpressoTabBar-accordion div.panel-default {
	border:none;
	margin:0 0 -1px;
	}
#docxpressoTabBar-accordion div.panel-default .panel-heading {
	box-shadow:0 10px 10px -16px #000000;
	}
#docxpressoTabBar-accordion .panel-title .js-tabcollapse-panel-heading {
	padding:0;
	
	}
#docxpressoTabBar-accordion div.panel-default span.clickable {
	display: block;
	padding: 10px 30px 10px 10px;
	position:relative;
	border:1px solid #ddd;
	background:var(--Tab-2)!important;
	color:var(--Tab-Text)!important;
	box-shadow:0 10px 10px -16px #000000;
	}
#docxpressoTabBar-accordion div.panel-default span.clickable::before,
#docxpressoTabBar-accordion div.panel-default .collapsed span.clickable::before {
	font-family: fontawesome;
	height: 100%;
	left: 0;
	padding: 6px 10px 0 0;
	/*position: absolute;*/
	text-align: right;
	top: 3px;
	width: 100%;
	font-size:1.3rem;
	}

#docxpressoTabBar-accordion div.panel-default .collapsed span.clickable::before {
	content: "";
	}
#docxpressoTabBar-accordion div.panel-default span.clickable::before {
	content: "";
	}
#docxpressoTabBar-accordion a span.clickable {
	transition:0.09s linear 0s;
	}
#docxpressoTabBar-accordion a:hover span.clickable {
	opacity:0.6;
	}
/* RESPONSIVE */


@media (max-width: 480px) {
	.tabGeneralData h3 {
		font-size:1.9rem;
		}
    body .clonneableGroup {
        padding-left: 15px !important;
	    }
	}
@media (max-width: 779px) {
	.tabGeneralData h3 {
		font-size:2.3rem;
		}
	.formVideo {
		padding:20px 0;
		}
	.formVideo .videoTitle {
		margin:0 auto 20px;
		}
        .panel {background:var(--Tab-Processor-Bg) !important;}
	}