body { font-family: Arial !important; font-size:12px !important; }
h1{ font-size: 17px; color: #ffffff;  margin:0;}
h2{ font-size: 15px; color: #ffffff;  margin:0;}
h4{ font-size: 13px; color: #ffffff;  margin:0;}

/* input, textarea { text-transform: uppercase !important; } */
input.email, input.file { text-transform: none !important; }

.textb1{ color:#ffffff; font-size:12px; }
/* .readonly { background: #f5f5f5 !important; } */

/* .disabled  {} */
	input[disabled="disabled"], select[disabled="disabled"], textarea[disabled="disabled"] {
	    color: black !important;
	    background: #F0F0F0 !important;
	    opacity: .95 !important;;
	}

	.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled {
	     opacity: .65 !important;;
	}

hr {
    margin-top:0px;
    margin-bottom: 0px;
}

.readonly { background: rgba(240,240,240,1) !important; }

/* .ui-widget-header{background: #6785a9  !important; } */

.spacer {clear:both;}

/* UI styles generales */
.ui-corner-all, .ui-corner-left, .ui-corner-right { -webkit-border-radius: 0 !important; border-radius: 0 !important; }
.ui-button, .ui-selectcheckboxmenu-trigger, .ui-selectonemenu-trigger { font-size: 100% !important; color:#ffffff !important; text-shadow:none !important; background-color: #6785A9 !important; background-image: none !important; }
.ui-button { height:30px !important; border-radius: 4px !important;}
.ui-button .ui-icon, .ui-selectcheckboxmenu-trigger .ui-icon, .ui-selectonemenu-trigger .ui-icon { background-image: url("../../resources/css/images/ui-icons_ffffff_256x240.png") !important; }

.ui-button.ui-state-hover, .ui-selectcheckboxmenu-trigger.ui-state-hover { background-color: #EBEBEC !important; color:#404040 !important; }
.ui-button.ui-state-hover .ui-icon, .ui-selectcheckboxmenu-trigger.ui-state-hover .ui-icon { background-image: url("../../resources/css/images/ui-icons_222222_256x240.png") !important; }

.ui-link, .ui-commandlink { color:#6785a9 !important; }
.iconLinkRight span { float:right; }

.ui-state-highlight { background: #428bca !important; }
.ui-state-highlight .ui-button { background-color: #EBEBEC !important; color:#404040 !important; }
.ui-state-highlight .ui-icon { background-image: url("../../resources/css/images/ui-icons_222222_256x240.png") !important; }

.ui-datatable .ui-column-customfilter .ui-selectonemenu-trigger.ui-state-default.ui-corner-right { width: 23px !important; }
.ui-datatable .ui-selectonemenu-label { border: 0 !important; }
.ui-datatable .ui-selectonemenu-trigger { border-radius: 0px !important; }
.ui-datatable .ui-state-highlight a { color:#ffffff !important; text-decoration: underline !important; }
.ui-datatable table { font-size: 95% !important; }
.ui-datatable .ui-column-filter { height:25px !important; width:100% !important; max-width:150px !important; font-size:90% !important; }

.ui-datatable .ui-datatable-footer { position: relative; text-align: right; padding: 0 !important; border:none !important; height:0 !important; }
.ui-datatable .ui-datatable-footer .btn-footer { position: absolute; right:0; top:-35px; }
.ui-datatable .commands button { margin-right:5px !important; }

.window-data-table { margin: 0; border:0 !important; display:none; }
.window-data-table .ui-panel-title { font-weight: bold !important; }
.grid-data-table { margin-top: 5px; }

.ui-breadcrumb { margin: 0 0 5px !important; padding:2px 5px 2px 5px !important; }

.ui-panelmenu-header { border-radius:0 !important; box-shadow:none !important; webkit-box-shadow:none !important; background-color: #6785A9 !important; background-image: none !important; }
.ui-panelmenu-header .ui-icon { background-image: url("../../resources/css/images/ui-icons_ffffff_256x240.png") !important; }

.ui-datatable-data .ui-button { width: 20px !important; height: 20px !important; }
.ui-paginator { text-align: left !important; padding: 5px !important; }
.ui-paginator > span { background: none !important; border-left: none !important; margin-left:-1px !important; padding: 5px !important; }
.ui-paginator .ui-paginator-first { border-left: 1px #ccc solid !important; }
.ui-paginator .ui-paginator-page { background: none !important; border-left: none !important; margin-left:-1px !important; padding: 5px 10px 5px 10px !important; color: #428bca !important; font-weight: normal !important; }
.ui-paginator .ui-paginator-pages { padding: 0 !important; margin: 0 !important;  }
.ui-paginator .ui-state-active { background: #428bca !important; color: #fff !important; }
.ui-paginator .ui-paginator-rpp-options { background: none !important; border-radius: 0 !important; padding: 5px !important; color: #428bca !important; font-weight: normal !important; }

/* .ui-menu-list .ui-menuitem-active a { background: #428bca !important; } */

.ui-menu-list .ui-separator { height: 2px !important; }
.ui-messages-error-summary { font-weight: normal !important; }

.modal .modal-content { padding: 4px !important; }
.modal .modal-header { padding: 0 !important; }
.modal .close { margin-top: 3px !important; }
.modal .modal-title { padding: 5px !important; text-align: center !important; background: #ebebec !important; }
.modal .modal-body { background: #ffffff !important; }
.modal .modal-footer { background: #ffffff !important; padding: 5px 5px 0 5px !important;}
.modal .modal-dialog { margin: 100px auto !important; max-width: 400px !important; }
.modal .modal-alert { border: 1px solid #6785A9 !important; }
.modal .btn-default { font-size:inherit !important; }

.ui-inputtext, .ui-autocomplete-input { font-size: 95% !important; } 

/* Menú styles */
.content-left-menu .ui-menuitem-link.ui-corner-all.ui-state-hover { background-color: #428bca !important; color: #ffffff !important; }
.content-left-menu .ui-menuitem-selected { background: #66a0d5; }
.content-left-menu .ui-menuitem-selected a { color: #ffffff !important; }

/* Header styles */
#wrapper{ max-width: none; background: #f1f2f7; padding:0; }
#header{ border-bottom: 1px #f8f8f8 solid; margin-bottom: 5px;}
#header .topIn { padding-top: 10px; padding-right: 10px; }
#header a.logo.l1 { margin-top: 10px; margin-left: 10px;}
#header a.logo.l2 { margin-top: 10px; margin-left: 10px;}
#header a.logo.l3 { margin-top: 10px; margin-left: 10px;}
.container{ max-width: none; }

/* Layout styles */
#layout {margin-left: 8px; margin-right:8px; /*height: 500px !important;*/ position:relative}

#footer{ border-top: 1px #f8f8f8 solid; margin-top: 15px; margin-bottom: 0; }
#footer .top { margin-top:0; min-height: inherit;}
#footer .container .row { background: #fff;}
#footer .bottom .box { padding-bottom: 20px; padding-right: 10px; }
#west-layout{ padding: 0; margin: 0; background: #ffffff;  }
.topNavUser{ padding: 3px 10px 3px 10px;  float:right; margin-top:-30px; position:relative; }
.topNavUser ul li { float:left; padding-right:20px; padding-left:20px; border-right: 1px solid #e6e6e6; }

#north-layout { padding:0; margin:0; margin:2px 10px 2px 10px; }

#top-user-bar { background: #6785A9; padding: 5px 0 5px 0; }
#top-user-bar .topnavbar-left{ float:left; padding-left:10px; }
#top-user-bar .topnavbar-right{ float:right; padding-right:5px; padding-top:2px; }

.content-profile{ padding:10px; }
#profile { width: 100%; }
#profile .ui-widget-header { background: none; border-top: 0; border-left:0; border-right:0; }

#profile .user-heading { background: #69A4D0; border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; padding:10px; }
#profile .user-heading a { border-radius: 50%; -webkit-border-radius: 50%; border: 10px solid rgba(255,255,255,0.3); display: inline-block; }
#profile .user-heading a img { width: 112px; height: 112px; border-radius: 50%; -webkit-border-radius: 50%; }
#profile .user-heading p { padding: 5px 0 5px 0; }

.content-left-menu { padding:10px }
.content-left-menu .ui-panelmenu-panel h3 a, #menu .ui-panelmenu-panel h3 a { color: #ffffff; font-weight: bold; text-shadow:none; }
.content-left-menu .ui-panelmenu .ui-panelmenu-panel { margin-bottom: 2px !important; }

#center-layout { padding: 5px; }

#formContent { padding: 10px 15px	;  margin-bottom: 5px; }
#formContent_header { background: #6785A9; color:#ffffff; }
#formContent_content { padding:5px !important; }
#formContent .ui-panel .ui-panel-content { padding: 0 !important; }
#content { border: 0 !important; }
.fcontent-bar { border: 0 !important; }
.fcontent-bar-left { float: left; }
.fcontent-bar-right { float: right; }
.fcontent-buscar { margin-right: 30px; }
.fcontent-bar-left ul li { float: left; margin:10px 20px 10px 0; }

.popup-estado { min-width: 100px !important; width: 100px !important; }
.row-grid-disable { color: #770606 !important; }

#searchWindow_content .ui-panelgrid-content { padding: 10px 0 10px 0 !important; }
.content-search-avanzado { padding-top:10px; width: 130px; }
.frm-grid-btn-export { float: right; margin: 5px 5px 0 0; height:20px; }

#formContent_content td, th { padding: 5px; }
.tblFormContent { width: 100%; }
.tblFormContent .tdFormLabel { width: 1%; padding-left:10px !important; }
.tblFormContent td.required { background: url(../../resources/images/required.png) no-repeat -2px center; }
.form-required-info { color:#ff0000; float:right; }

#dashboard ul li { float: center; }
/* 
#dashboard .dashboard1{ max-width: 50px; width: 100%; }
#dashboard .dashboard2{ max-width: 434px; width: 100%; }
*/

.ui-dialog .ui-dialog-title { font-size: 13px !important; }
.ui-dialog .ui-dialog-titlebar { padding: 5px 10px 5px 10px !important; }
.ui-dialog .ui-dialog-titlebar-icon { margin-top: 5px !important; }
.ui-dialog .ui-dialog-content { padding: 0 !important; }
.ui-widget-overlay { opacity: .20 !important; }
.ui-panelgrid .ui-grid-responsive { border: 0 !important; }
.ui-panelgrid .ui-grid-responsive .ui-grid-row { border: 0 !important; }
.ui-message-dialog .ui-dialog-content { padding: 20px !important; font-size:13px !important; }

#popExclude .ui-panelgrid-footer, 
#popActivate .ui-panelgrid-footer, 
#popReject .ui-panelgrid-footer,
#popAccept .ui-panelgrid-footer { margin:5px !important; padding: 5px !important; text-align: center !important; }
#popExclude .ui-messages-error, 
#popReject .ui-messages-error,
#popAccept .ui-messages-error { margin: 5px 0 0 0 !important; padding: 5px !important; }
#popExclude .ui-panelgrid-cell, 
#popReject .ui-panelgrid-cell,
#popAccept .ui-panelgrid-cell { padding: 2px 10px 0 10px !important; }

.colored { background-color: #D88E99 !important; }
.cologreen { background-color: #00B285 !important; }
.colorLightSkyBlue { background-color: #a4cbfb !important; }
.ui-outputlabel-rfi { color: red !important; }
.colorange { background-color: #B18904 !important; }
.skyblue { background-color: #01A9DB !important; }
.estado1 { background-color: #FDE18D !important; }
/* .estado2 { background-color: #ADD8C7 !important; } */
.estado2 { background-color: #dff0d8 !important; color: #468847 !important; }

.estado3 { background-color: #EEC6DE !important; }
.estado4 { background-color: #70AFC4 !important; }
/* .estado5 { background-color: #FD6D86 !important; } */
.estado5 { background-color: #f2dede !important; border-color: #ebccd1 !important;  color: #b94a48 !important; font-weight: bold !important}

.exportExcel { background: url(../../resources/images/icon-xls-export.gif) no-repeat -2px center; }
.exportPDF {background: url(../../resources/images/icon-pdf-export.gif) no-repeat -2px center; }

/* Styles upload files */
#musuUpFicha .ui-button .ui-button-text, 
#musuUpPoder .ui-button .ui-button-text { padding-left: 24px !important; color:inherit !important; }
#contentPoder,
#contentPhoto { position: relative !important; }
#contentPoder .ui-panelgrid-cell { padding: 0 !important; }
#contentPoder label { font-weight:normal !important; font-size:10px !important; }
#contentPoder .ui-messages-error { padding:5px !important; }
#musuFichaFile, 
#musuPoderFile,
#mcolaPhotoFile { position: absolute !important; background:#f5f5f5; width: 95% !important; height:20px !important; top:35px; left:10px; border:0px !important; }
#musuUpFicha .ui-messages, 
#musuUpPoder .ui-messages,
#mcolaUpPhoto .ui-messages  { margin-top: 25px; }
#btnUpFicha_input, 
#btnUpPoder_input { width: 0 !important; height: 0 !important;  font-size: 12% !important; }
.btns-down-right { margin: 0 0 0 5px !important; } 

.uploader-content { position: relative !important; }
.uploader-content .ui-panelgrid-cell { padding: 0 !important; }
.uploader-content .ui-fileupload-content { padding-bottom: 5px !important; }
.uploader-content label { font-weight:normal !important; font-size:12px !important; }
/* .uploader-btn-up .ui-button { height: 22px !important; } */
.uploader-btn-up .ui-button .ui-button-text { padding-left: 10px !important; color:inherit !important; }

.uploader-txt-up { position: absolute !important; background:#f5f5f5; width: 95% !important; height:20px !important; padding:2px !important; top:32px; left:5px; border:0px !important; }
.uploader-content .ui-messages  { margin-top: 2px; font-size: 95% !important; }
.uploader-content .ui-messages-error { padding:5px !important; }
.uploader-content .ui-messages-error-icon { display: none !important; }
.uploader-content .ui-messages ul, .uploader-content .ui-messages-error-summary { margin: 0 !important; }


/* Revisar version 6.1 primefaces */
.uploader-btn-up .ui-fileupload-buttonbar .ui-button .ui-button-text { display: -webkit-box;}
.uploader-btn-up .ui-fileupload-buttonbar .ui-button { padding: .2em 1em .2em 1em;}

.uploader-btn-up  .ui-fileupload-buttonbar {border: none; background: none; padding: .2em .0px}
.uploader-btn-up  .ui-fileupload-content {border: none;}
.uploader-btn-up  .ui-fileupload-files {margin: 0px;}
/* End styles upload files */

.ui-breadcrumb a { font-size:inherit !important; color:#6785A9 !important; }

#functions { margin-top:5px; margin-bottom: 20px; }
#functions .functions-header { padding: 4px; background:#6785A9; color:#ffffff; font-weight: bold; }
#functions .functions-header .cols, #functions .functions-content .cols { float:left; position: relative; }
#functions .icon-custom-permits { position: absolute; left: -18px; top: 50%; margin-top: -8px; }
#functions .functions-header .col1, #functions .functions-content .col1 { width: 40%; }
#functions .functions-header .col2, #functions .functions-content .col2 { width: 10%; font-size:85% !important; }
#functions .functions-content .lvl-1 { border-bottom:1px #dddddd solid; border-left:1px #dddddd solid; border-right:1px #dddddd solid; padding: 4px 4px 0 20px; background: #EBEBEC; }
#functions .functions-content .lvl-2 { border-bottom:1px #dddddd solid; border-left:1px #dddddd solid; border-right:1px #dddddd solid; padding: 4px 4px 4px 20px; display:none; }

.ui-confirm-dialog.ui-dialog.ui-widget.ui-widget-content { width:100% !important; max-width:280px !important; left:35% !important; }
.ui-confirm-dialog.ui-dialog.ui-widget.ui-widget-content .ui-dialog-content .ui-icon { display:none !important; }

.ui-confirm-dialog .ui-dialog-content { font-size:inherit !important; padding:10px !important; }
.ui-confirm-dialog .ui-dialog-buttonpane { text-align: center !important; }

#primefacesmessagedlg { left:40% !important; width: 280px !important; }

.mainroot.navbar { margin-top: 30px !important; }

.hasDatepicker { width:80px !important; height:25px !important; }
.ui-spinner-button { height: 13px !important; }
.ui-panelgrid-cell { padding: 2px 5px !important; }

.ui-selectcheckboxmenu, .ui-selectonemenu { background:none !important; min-height:26px !important; height:100% !important; font-size: 90% !important; }
.ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger, .ui-selectonemenu .ui-selectonemenu-trigger  { width:26px !important; }
.ui-selectcheckboxmenu .ui-selectcheckboxmenu-label { padding: 2px 26px 0 5px !important; font-weight:normal !important; }
.ui-selectcheckboxmenu-item label { font-weight:normal !important; }
.ui-selectcheckboxmenu-label.ui-state-hover { background-color:#ffffff !important; }
.ui-selectonemenu .ui-inputfield { border:none !important; }

.ui-selectoneradio label { font-weight:normal !important; }

.ui-wizard .ui-wizard-step-title { font-size: 95%; margin: 0 10px 10px 0; }
.ui-wizard-content { border-top: 1px solid #dddddd; border-bottom: 1px solid #dddddd; padding : 10px 0 10px 0; margin: 10px 0 10px 0 !important; }

.ui-fieldset-legend { padding: 2px 5px 2px 5px !important; font-size: inherit; margin: 0 !important; }
.panel-group { padding: 0 !important; margin: 0 !important; }

.popup .hasDatepicker { height: 12px !important; }
.popup .ui-selectonemenu { min-height: 22px !important; }
.popup .ui-selectonemenu-trigger { width: 18px !important; height: 100% !important; }
.popup .ui-panelgrid tr, .popup .ui-panelgrid td { border: 0 !important; }

.search-content-element .ui-panelgrid-cell { padding: 0 !important; }

.legend-bar ul li{ float: left; margin-right: 10px; }
.legend-bar .legend-square { width: 15px; height: 15px; float: left; margin-right: 5px; border: 1px #999 solid; }

@media screen and (max-width: 1300px) {
	.mainroot.navbar { margin-top: -20px !important; }
}

@media screen and (max-width: 1025px) {
	#west-layout{ width: 150px !important; }
}

@media screen and (max-width: 801px) {
	#layout { margin-left: 5px !important; max-width: 100% !important; }
	#west-layout{ width: 0px !important; display: none !important; }
	
	#frameNavigator { height: 80px !important; }
	#top-user-bar { height: 50px !important; }
}

@media screen and (max-width: 600px) {
	.commands span.ui-column-title { display:none !important; }
	.responsive-hidden { display:none !important; }
	.ui-datatable-tablewrapper table td { width: 100% !important; text-align:left !important; }
	
	#header a.logo.l1{top: 0; width: 50px; height:65px; background-size: cover;}
	#header a.logo.l2{top: 0; width: 50px; height:65px; background-size: cover; left:55px;}
  	#header a.logo.l3{top: 0; width: 50px; height:65px; background-size: cover; left:110px;}
	
	#header .topIn { margin-bottom: 0px !important; }	
	#top-user-bar .topnavbar-right { clear:both !important; float:left !important; margin-left:10px !important; }
	
	.ui-datatable .ui-datatable-footer .btn-footer { position: relative !important; top:auto !important; padding:10px !important; }
}


.loader { 
	position: absolute;
	z-index: 1000000;
	background-image: url("../../resources/images/wait.gif");
	background-position: center; 
	background-repeat: no-repeat;
	background-color:#333;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.2;
	opacity: 0.4;
}


.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer !important; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected {
  		cursor: text;
   		background-color:blue !important; 
  		color: white !important;
  		border-bottom: 1px solid #A8A8A8 !important;
  		background-color:#A9CCE3 !important;
  		box-shadow: 4px 4px 4px #CCCCCC !important;
}	

.ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger, .ui-selectonemenu .ui-selectonemenu-trigger {
  	width: 22px !important;
}	
				
.ui-selectoneradio label {
    margin: 0 4px 0 7px !important;
}

.ui-tabs .ui-tabs-panel {
    padding: 1em 0em !important;
}


.ui-datatable-tablewrapper {
    overflow: inherit !important;
}

/* .ui-datatable-scrollable-body { */
/*     overflow: initial !important; */
/* } */
		
/* .ui-layout-unit .ui-layout-unit-content { */
/*     overflow: auto !important; */
/* } */


/* ACORDION  18 ENERO 2018 */
.ui-accordion .ui-accordion-content{background:#ffffff;margin:0 0.2em  !important;}
.ui-accordion .ui-accordion-header{background: #e5e5e5 !important;border:1px solid #e4eaed;margin:0 0.2em  !important;}
.ui-accordion .ui-accordion-content.ui-widget-content { padding: 9px 25px 9px 15px !important;}
.ui-accordion .ui-accordion-header .ui-icon { display: block !important;}
.ui-accordion .ui-accordion-content { overflow: hidden  !important;}
.ui-accordion .ui-icon.ui-icon-triangle-1-e {background-position: -16px -128px;}
.ui-accordion .ui-icon.ui-icon-triangle-1-s {background-position: -48px -128px;}


/* except below bootstrap elements */
.img-circle {
  border-radius: 50% !important; 
    float: left;
    margin-top: -8px;
    margin-right: 4px;
    height: 30px;
    display: inline-block; 
  }
  
/* Inicio de Boton flotante */

.quick-nav {
  position: fixed;
  z-index: 10103;
  top: 50%;
  right: 10px;
  margin-top: -230px;
  pointer-events: none; }
  .quick-nav .quick-nav-bg {
    /* this is the stretching navigation background */
    position: absolute;
    z-index: 10102;
    top: 0;
    right: 0;
    width: 60px;
    height: 60px;
    border-radius: 30px !important;
    background: #41748e;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
    webkit-transition: height .2s, box-shadow .2s;
    -moz-transition: height .2s, box-shadow .2s;
    -ms-transition: height .2s, box-shadow .2s;
    -o-transition: height .2s, box-shadow .2s;
    transition: height .2s, box-shadow .2s; }
  .quick-nav.nav-is-visible {
    pointer-events: auto; }
  .quick-nav.nav-is-visible .quick-nav-bg {
    height: 100%;
    box-shadow: 0 6px 30px rgba(0, 0, 0, 0.2); }
    
 
 .quick-nav-trigger {
    position: absolute;
    z-index: 10103;
    top: 0;
    right: 0;
    height: 60px;
    width: 60px;
    border-radius: 50%!important;
    overflow: hidden;
    white-space: nowrap;
    color: transparent;
    pointer-events: auto; 
}

  .quick-nav-trigger span,
  .quick-nav-trigger span::after,
  .quick-nav-trigger span::before {
      /* this is the hamburger icon */
    position: absolute;
    width: 16px;
    height: 2px;
    background-color: #ffffff; }

  .quick-nav-trigger span {
    /* middle line of the hamburger icon */
    webkit-transition: background-color 0.2s;
    -moz-transition: background-color 0.2s;
    -ms-transition: background-color 0.2s;
    -o-transition: background-color 0.2s;
    transition: background-color 0.2s;
    left: 50%;
    top: 50%;
    bottom: auto;
    right: auto;
    webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%); }
    
  .quick-nav-trigger span::after,
  .quick-nav-trigger span::before {
    /* top and bottom lines of the hamburger icon */
    content: '';
    top: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    webkit-transition: transform 0.2s;
    -moz-transition: transform 0.2s;
    -ms-transition: transform 0.2s;
    -o-transition: transform 0.2s;
    transition: transform 0.2s; }

  .quick-nav-trigger span::before {
    webkit-transform: translateY(-6px);
    -moz-transform: translateY(-6px);
    -ms-transform: translateY(-6px);
    -o-transform: translateY(-6px);
    transform: translateY(-6px); }
  .quick-nav-trigger span::after {
    webkit-transform: translateY(6px);
    -moz-transform: translateY(6px);
    -ms-transform: translateY(6px);
    -o-transform: translateY(6px);
    transform: translateY(6px); }
  .no-touch .quick-nav-trigger:hover ~ .quick-nav-bg {
    box-shadow: 0 6px 30px rgba(0, 0, 0, 0.2); }
  .nav-is-visible .quick-nav-trigger span {
    background-color: transparent; }
  .nav-is-visible .quick-nav-trigger span::before {
    webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg); }
  .nav-is-visible .quick-nav-trigger span::after {
    webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg); }
        
   
.quick-nav ul {
  position: relative;
  z-index: 10103;
  padding: 60px 0 0;
  visibility: hidden;
  webkit-transition: visibility 0.3s;
  -moz-transition: visibility 0.3s;
  -ms-transition: visibility 0.3s;
  -o-transition: visibility 0.3s;
  transition: visibility 0.3s;
  text-align: right;
  list-style: none; }

  .quick-nav ul > li a {
    position: relative;
    display: block;
    height: 50px;
    line-height: 50px;
    padding: 0 calc(1em + 60px) 0 1em;
    font-size: 1.4rem;
    webkit-transition: color 0.2s;
    -moz-transition: color 0.2s;
    -ms-transition: color 0.2s;
    -o-transition: color 0.2s;
    transition: color 0.2s; }
   .quick-nav ul > li a:hover {
      text-decoration: none; }
      .quick-nav ul > li a:hover > span {
        text-decoration: none; }
    .quick-nav ul > li a > i {
      /* navigation item icons */
      content: '';
      position: absolute;
      height: 16px;
      width: 16px;
      font-size: 18px;
      right: 24px;
      top: 16px;
      color: #ebebeb; }
      
    .quick-nav ul > li a::before {
      /* line visible next to the active navigation item */
      content: '';
      position: absolute;
      width: 3px;
      height: 16px;
      top: 50%;
      right: 60px;
      webkit-transform: translateX(3px) translateY(-50%) scaleY(0);
      -moz-transform: translateX(3px) translateY(-50%) scaleY(0);
      -ms-transform: translateX(3px) translateY(-50%) scaleY(0);
      -o-transform: translateX(3px) translateY(-50%) scaleY(0);
      transform: translateX(3px) translateY(-50%) scaleY(0);
      background-color: #FF3F3F; }
      
  .quick-nav ul > li span {
    /* navigation item labels */
    color: #ebebeb;
    font-weight: 400;
    display: block;
    opacity: 0;
    webkit-transform: translateX(-25px);
    -moz-transform: translateX(-25px);
    -ms-transform: translateX(-25px);
    -o-transform: translateX(-25px);
    transform: translateX(-25px); }
  .quick-nav ul > li:last-child {
    padding-bottom: 10px; }      
                

.quick-nav.nav-is-visible ul {
  visibility: visible; }
  .quick-nav.nav-is-visible ul a::after {
    /* navigation item icons */
    webkit-transform: translateY(-50%) scale(1);
    -moz-transform: translateY(-50%) scale(1);
    -ms-transform: translateY(-50%) scale(1);
    -o-transform: translateY(-50%) scale(1);
    transform: translateY(-50%) scale(1);
    -webkit-animation: scaleIn 0.15s backwards;
    -o-animation: scaleIn 0.15s backwards;
    animation: scaleIn 0.15s backwards;
    webkit-transition: opacity 0.2s;
    -moz-transition: opacity 0.2s;
    -ms-transition: opacity 0.2s;
    -o-transition: opacity 0.2s;
    transition: opacity 0.2s; }
  .quick-nav.nav-is-visible ul a:hover::after {
    opacity: 1; }
  .quick-nav.nav-is-visible ul a:hover::before {
    webkit-transform: translateX(3px) translateY(-50%) scaleY(2);
    -moz-transform: translateX(3px) translateY(-50%) scaleY(2);
    -ms-transform: translateX(3px) translateY(-50%) scaleY(2);
    -o-transform: translateX(3px) translateY(-50%) scaleY(2);
    transform: translateX(3px) translateY(-50%) scaleY(2);
    webkit-transition: transform 0.15s 0.3s;
    -moz-transition: transform 0.15s 0.3s;
    -ms-transition: transform 0.15s 0.3s;
    -o-transition: transform 0.15s 0.3s;
    transition: transform 0.15s 0.3s; }
  .quick-nav.nav-is-visible ul a:hover > span {
    color: white; }
  .quick-nav.nav-is-visible ul a:hover > i {
    color: #fafafa; }
  .quick-nav.nav-is-visible ul span {
    opacity: 1;
    webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation: slideIn 0.15s backwards;
    -o-animation: slideIn 0.15s backwards;
    animation: slideIn 0.15s backwards;
    webkit-transition: transform 0.2s;
    -moz-transition: transform 0.2s;
    -ms-transition: transform 0.2s;
    -o-transition: transform 0.2s;
    transition: transform 0.2s; }
  .no-touch .quick-nav.nav-is-visible ul a:hover::after {
    opacity: 1; }
  .no-touch .quick-nav.nav-is-visible ul a:hover span {
    webkit-transform: translateX(-5px);
    -moz-transform: translateX(-5px);
    -ms-transform: translateX(-5px);
    -o-transform: translateX(-5px);
    transform: translateX(-5px); }

.quick-nav-overlay {
  display: none;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  position: fixed;
  z-index: 10101;
  background: transparent; }

.quick-nav.nav-is-visible + .quick-nav-overlay {
  background: rgba(0, 0, 0, 0.8);
  display: block;
  -webkit-transition: background .7s ease-out;
  -moz-transition: background .7s ease-out;
  -o-transition: background .7s ease-out;
  transition: background .7s ease-out; }

@media (max-width: 991px) {
  /* 991px */
  .quick-nav {
    top: 150px;
    margin-top: 0; } }