:root{
	
/* 	COLOR-2(BLUE) HEX: 1c4ca1 - RGB: 28 76 161 */
	--primary-hue: 218;
	--primary-saturation: 83%;
	--primary-light: 33%;
	
	--secondary-hue: 194;
	--secondary-saturation: 83%;
	--secondary-light: 47%;
	
	--default-text-color: #333;
	
	--primary-color: hsl(var(--primary-hue), var(--primary-saturation), var(--primary-light));
	--primary-color-darken: hsl(var(--primary-hue), var(--primary-saturation), calc(var(--primary-light) - 10%));
	--primary-color-lighten: hsl(var(--primary-hue), var(--primary-saturation), calc(var(--primary-light) + 30%));
	--primary-color-lighten-half: hsl(var(--primary-hue), var(--primary-saturation), calc(var(--primary-light) + 45%));
	--primary-color-lighten-full: hsl(var(--primary-hue), var(--primary-saturation), calc(var(--primary-light) + 58%));
	--primary-color-op-half: hsla(var(--primary-hue), var(--primary-saturation), var(--primary-light), 0.5);
	
	--secondary-color: hsl(var(--secondary-hue), var(--secondary-saturation), var(--secondary-light));
	--secondary-color-darken: hsl(var(--secondary-hue), var(--secondary-saturation), calc(var(--secondary-light) - 10%));
	--secondary-color-lighten: hsl(var(--secondary-hue), var(--secondary-saturation), calc(var(--secondary-light) + 25%));
	--secondary-color-lighten-half: hsl(var(--secondary-hue), var(--secondary-saturation), calc(var(--secondary-light) + 45%));
	--secondary-color-lighten-full: hsl(var(--secondary-hue), var(--secondary-saturation), calc(var(--secondary-light) + 50%));
	--secondary-color-op-half: hsla(var(--secondary-hue), var(--secondary-saturation), var(--secondary-light), 0.5);
	
	--icon-bg:#83a8c9;
}

html body .blueline,
html body .blueline2,
html body #main .greyline,
html body .d3-tip,
html body #main .total-result-text,
html body #content2,
html body #content3,
html body #content4,
html body #content4.hotelDetails .hotel-header,
html body .searchHeader,
html body .returnHeader,
html body .searchrow{
	border-color: var(--primary-color);
}
html body,
html body .d3legend .d3query > b,
html .d-results h3{
	background-color: var(--primary-color-lighten);
}
html body .d3legend .d3cheapest > b,
html .guest-rating-recommend{
	background-color: var(--secondary-color);
}

#main .sub-innerContent span,
#main .sub-innerContent .sectionHeader{
	font-weight: 700; color: var(--default-text-color);
}

#main #header td,
#main #header .agentId,
#main #header .main-help,
#main #header .main-logout{
	transition: 0.2s;
}

#main #header .main-help:hover,
#main #header .main-logout:hover{
	background-color: transparent;
}

#main .roomPriceTable th,
#main .unavailable-box-wrapper > td > .unavailable-box > .unavailable-box-item,
html body #content4.hotelDetails #tabs > ul li,
html body #admintools > ul:first-child{
	border-color: var(--primary-color);
	background-color: var(--primary-color-lighten-half);
	color: var(--primary-color-darken);
}
/* LOGIN SECTION BEGIN */
html body .flip-clock-wrapper ul li a div div.inn{background-color: var(--primary-color);}
html body .ui-widget-overlay{background: rgba(0,0,0,0.7);}
html body .ui-widget-header:not(thead){
	background: var(--primary-color);
	border-color: var(--primary-color);
	border-radius: 0;
}
html body #rules .rules-item-header,
html body #closed .rules-item-header,
html body .modifiedtrue{
	background: var(--primary-color-lighten-half) !important;
	border-color: var(--primary-color-lighten-half);
}
html #loginForm .half,
html #loginForm .half .register-link a {
    border-bottom:1px solid #fff;
    color:#fff;
}
html #loginForm .half .sectionHeader,
html .loginform ul li label,
html #loginForm #main a{
    color:#fff;
}
html .loginform ul li input {
    border-color:#fff;
}
html .loginform ul li input.submit {
	border-color: var(--primary-color);
}
html .footer{
/* 	background: rgba(9,123,151,.5); */
	background: var(--secondary-color-op-half);
}
html .footer,
html #main .footer a,
html .footer a,
html .footer span,
html .call-center{
	color:#fff;
}
.footer-contact{
	background-color:#1c1c21;
	color:#fff;
}
.footer-contact p,
.footer-rnmore a{
	color:#fff;
}
.footer-contact .form-control{
	background:#333;
	border:1px solid #6a6a6a;
}
.footer-rnmore{
	background-color:var(--primary-color);
	background: linear-gradient(270deg, var(--primary-color) 0%, var(--primary-color-darken) 100%);
	color:#fff;
}
.footer-rnmore a:hover{
	color:var(--secondary-color);
}
#rnmoreSlider,
.footer-contact-title {
	background:var(--primary-color);
	color: #fff;
}
/* LOGIN SECTION END */

/* REGISTER PAGE BEGIN */
#registerationForm fieldset legend{
	color: var(--primary-color);
	border-color: var(--secondary-color);
}
/* REGISTER PAGE END */

/* NEWS SECTION BEGIN */
html body .mobilapp-desc li span.num{background-color: var(--primary-color);}
html body .mobilapp-desc p.title strong{color: var(--primary-color);}

html body .mobilapp-desc p a,
html body .mobilapp-desc .svg-icon,
html body .mobilapp-desc p strong > span{color: var(--primary-color);}

/* NEWS SECTION END */

/* WORKSPACE PAGE BEGIN */

.content-box{
/* 	background-color:rgba(28, 76, 161, .5); */
	background: var(--primary-color-op-half);
	color:#fff;
}
.content-box-header{
	border-bottom:1px solid #fff;
}
.content-box-header .agentId{
/* 	background-color:#16ccd5; */
	background: var(--secondary-color);
	color:#fff;
}
.dashboard-icons a{
	color:#fff;
}
.dashboard-icons .icon-bg{
	background: var(--icon-bg);
	box-shadow:1px 1px 2px rgba(1,1,1,0.2);
}
.dashboard-icons .icon-bg:hover{
	background: var(--secondary-color);
	box-shadow:1px 1px 12px rgba(1,1,1,0.4);
}
.dashboard-icons .row:not(:last-child){
	border-bottom:1px solid rgba(205,205,205,0.4);
}
.dashboard-icons h6{
	background: rgba(205,205,205,0.2);
    color: #fff;
}

.workspace-wrapper .adminmenu #unreadCount,
.workspace-wrapper .adminmenu .readtrue{color: var(--primary-color);}
.jui #parameters #tabs .find-flight td div{color: #777;}
.d3container-wrapper .searchHeader{
	border-color: var(--primary-color);
}
.d3container-wrapper .matrixToggle{border-color: var(--primary-color-lighten);}
html body #main .d3container-wrapper .matrixToggle > .matrixButton{
	background-image: none;
	color: white;
}
.d3container-wrapper .matrixToggle > .matrixButton{background-color: var(--secondary-color);}

#main .searchResult .functionDiv,
html body .infostyle,
html body #datatable th{
	background-color: var(--primary-color-lighten-full);
	border-color: var(--primary-color-lighten);
}
.d3container-wrapper .matrixContainer .matrixAirline li:not(.matrixHead){background-color: #fff;}
html .searchResult{
	border-color: var(--primary-color-lighten-half);
	background:#fff;
}
.d3container-wrapper #departureResultsFree .searchResult .functionDivPac{
	background: var(--primary-color-lighten);
	color:#333;
}
.d3container-wrapper .returnHeader{border-color: var(--secondary-color);}
html #search2 {    
	background: #f9fbfd;
    border: 1px solid #CFDBEC;
}
/* WORKSPACE PAGE END */

/* INPUT COMPONENTS BEGIN */
html body input,
html body input[type=text],
html body input[type=password],
html body input[type=number],
html body input[type=email],
html body input.ui-autocomplete-input,
html body select,
html body select.selecter{
	border-color: currentColor;
}
html body input:hover,
html body input[type=text]:hover,
html body input[type=password]:hover,
html body input[type=number]:hover,
html body input[type=email]:hover,
html body input.ui-autocomplete-input:hover,
html body select:hover,
html body select.selecter:hover,
html body input[type=text]:focus,
html body input[type=password]:focus,
html body input[type=number]:focus,
html body input[type=email]:focus,
html body input.ui-autocomplete-input:focus,
html body select:focus,
html body select.selecter:focus{
	border-color: var(--primary-color);
}
/* INPUT COMPONENTS END */

/* BUTTON COMPONENT BEGIN */

html body .submit,
html body .btn-primary,
html body .closeDialog,
html body #showThumbs,
html body #dp-order-row .dp-order-item,
html .dynamic-result-table > tbody > tr > .dynamic-button-buy > .dynamic-btn{
	background-color: var(--primary-color);
	border: 1px solid var(--primary-color);
	color: white;
}

html body .submit:hover,
html body .btn-primary:hover,
html body button:hover,
html body .submit:focus,
html body button:focus,
html body .closeDialog:hover{
	background-color: var(--primary-color-darken);
	border: 1px solid var(--primary-color-darken);
	color: white;
}

html body .btn-default{background-image: none;}

html body input.btn-warning,
html body input.reserve,
html body input.btn-danger,
html body input.decline,
html body input.btn-collapseall,
html .dynamic-result-table > tbody > tr > .dynamic-button-change > .dynamic-btn{
	background-color: var(--secondary-color);
	border-color: var(--secondary-color);
}
html body input.btn-warning:hover,
html body input.reserve:hover,
html body input.btn-danger:hover,
html body input.decline:hover,
html body input.btn-collapseall:hover{
	background-color: var(--secondary-color-darken);
	border-color: var(--secondary-color-darken);
}

/* BUTTON COMPONENT END */

html body .ui-datepicker .ui-datepicker-title,
html body .cluster-icon span{
	color: white;
}
/* DEFAULT TEXT COLOR BEGIN */
html body,
html body #main a,
html body a.adminmenu,
html body label,
html body p,
html body .formtitle, 
html body .formtitlered, 
html body .formtitlenormal, 
html body .formtitlesub, 
html body .rtnsortlabel,
html body .page-title-span,
html body h3.d3title,
html body .ui-autocomplete a,
html body .ui-autocomplete a:hover,
html body .ui-datepicker .ui-state-default, 
html body .ui-datepicker .ui-widget-content,
html body .ui-datepicker .ui-state-default, 
html body .ui-datepicker .ui-widget-header,
html body .ui-datepicker .ui-state-default,
.chotelmapcontents .mapcontents .hotelCity,
html body .searching,
html body .found,
html body .cancelled,
html body .status7,
html body .status4,
html body .status5,
html body .status8,
html body .status2,
html body .aheader span,
html body #innerContent .daily-news p > b,
html body #innerContent .daily-news p,
#main #header .header-item > div .call-center span,
#main #header .agentId,
html body #loader,
html body #content4.hotelDetails #tabs > ul li a,
html body #content4.hotelDetails #tabs > div,
html body #content4.hotelDetails #tabs > div .roomHeader,
html body .notice,
#main .searchfilter p,
html body .section-inner-item p span,
html body .section-item .info-text{
	color: var(--default-text-color);
}

/* DEFAULT TEXT COLOR END */

/* PRIMARY TEXT COLOR BEGIN */
#main #header td.tableHeader,
#main #header .agentId span,
html body .verticalMenu .fa-angle-double-right,
html .searchHeader,
html .jui .searchTabs #tabs ul li a,
.d3container-wrapper .searchHeader td,
.d3container-wrapper .matrixContainer li:hover,
.d3container-wrapper .matrixContainer a:hover,
.d3container-wrapper #departureResultsFree .money,
.d3container-wrapper #departureResultsFree .currency,
.d3container-wrapper .d3price .d3-title h3,
.d3container-wrapper .d3price span,
html body .d3-tip span,
html body .d3-tip:after,
#main .chotelmapcontents .mapcontents .hotelName,
html body .ui-menu li,
html body .glyphicon-info-sign:before,
html body #main span.money,
html body #main span.currency,
html body .tableHeader,
html body #innerContent .daily-news b,
html body #logincounter legend,
#main #header .header-item > div .call-center strong,
html body #content4.hotelDetails .hotel-header h2,
html body .section-inner-item p,
html body .formtitle,
html body #main .sortlabel,
#main .searchfilter .filterTitle span,
html .dynamic-result-table > thead > tr > th > p,
html .travel-organiser-tabs label,
html .fullcollapsed .info-aircraft i{
	color: var(--primary-color);
}
/* PRIMARY TEXT COLOR end */

#main .searchfilter #searchFilter h2,
.d3container-wrapper form.sectionHeader,
.d3container-wrapper #departureResultsFree .hiddendiv .sr-classes .formtitle td,
.d3container-wrapper .returnHeader td,
html body #innerContent .daily-news th,
html body .searching:hover,
html body #main .aside-map .aside-map-title p,
html .hotel-name-td div.resultPension,
html .returnHeader,
html .news-title,
html .d3price li,
html .travel-organiser-tabs .advanced-options label{
	color: var(--secondary-color);
}
html .dark #header-wrap:not(.not-dark) #primary-menu > ul > li.current > a,
html #primary-menu ul li:hover > a, 
html #primary-menu ul li.current > a{
	color: var(--secondary-color) !important;
}
html body .sidecontentpullout,
html .guest-rating-score,
html .functionDiv .showProviders span,
html i.icon-info{
	background-color: var(--primary-color) !important;
}
html body .sidecontent{border-color: var(--primary-color) !important;}

html body .ui-menu .ui-autocomplete-category,
html body #content4.hotelDetails #tabs > div .roomHeader{
	background-color: var(--primary-color-lighten-full);
}

html .header,
.register-page #main #header{
	background:var(--primary-color);
	color:#fff;
}
html .header .main-nav a,
html #main .header .main-nav a,
html body .sectionHeader{
	color:#fff;
}
table.tablesorter thead tr .header {
    background-color: var(--primary-color-lighten-full);
    color: #333;
}

html body .product-btns .btn-product,
html body .product-btns .btn-product:hover{
	border-color: var(--primary-color);
	color: var(--default-text-color);
}

html body .campaign-dialog .camp-list-num{background: linear-gradient(90deg, var(--secondary-color), var(--secondary-color-lighten));}
html body .campaign-dialog h4{color: var(--secondary-color);}

html body .campaign-detail table th{border-color: var(--primary-color);}

html body .campaign-detail table th,
html body .campaign-detail table td{
	color: var(--default-text-color);
}

html body .pager div.paged,
html body .pager div a:hover,
html body .lastSeat,
html body .new-badge,
html body .adminNoteName{
	background-color: var(--primary-color);
	border-color: var(--primary-color);
	color: white;
}

html body #admintools > ul:first-child li{
	background-color: var(--primary-color-lighten);
	border-color: var(--primary-color-lighten);
}
html body #admintools > ul:first-child li a{
	color: var(--default-text-color);	
}

html body .fullcollapsed{ background-color: white; }
html body .order-window-wrapper > .fullcollapsed,
html body .order-window-wrapper > .table-responsive > .fullcollapsed,
html body .order-window-wrapper > .table-responsive > .fullcollapsed th{border: 1px solid var(--primary-color);}
html .guest-rating-count{color:#fff;}
html .cc-banner{
	box-shadow:0 2px 8px var(--primary-color-lighten-half);
	background-color: var(--primary-color-lighten-half);
	color: var(--primary-color-darken);
}
html .cc-banner:hover{
	background-color: var(--primary-color-lighten);
}
html .cc-banner .fa-headset{
	color: var(--primary-color);
}
html input[type='checkbox'] {
	 border:1px solid #aaa;
	 background-color: #fff;
}
html input[type='checkbox']:checked:before {
	background-image: url("/images/theme/rnmore/check-solid.svg");
}
html input[type='checkbox']:checked {
  border:1px solid var(--secondary-color);
	background-color: var(--secondary-color);
}
html input[type='radio'] {
  background-color: white;
  border:1px solid #aaa;
}
html input[type='radio'].radio__primary{
  border:1px solid var(--primary-color);
}
html input[type='radio'].radio__secondary {
  border:1px solid var(--secondary-color);
}
html input[type='radio']:checked:before {background: var(--secondary-color);}

/*** LOADING PROGRESS ***/
html body .progress-cover {
	background-color: var(--primary-color-op-half);
}
html body .progress {
	background: var(--primary-color);
	color: white;
}