/***************************/
/**    Matej Pliesovsky   **/
/**     copyright 2014    **/
/***************************/
*, *:before, *:after {box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}

/***************************/
/********** Form ***********/
/***************************/
.freeze {overflow:hidden;}
.form {position:relative; font:normal 1em/1.5em Roboto, sans-serif; min-height:350px; background:#f6f7f8;}


/*********** Menu **********/
.form ul.menu {}
.form ul.menu li {display:inline-block; width:20%; text-align:center;} 

.form ul.menu li a {display:block; padding:1em 0;font-size:0.625em; text-transform:uppercase; color:rgba(250, 250, 250, 0.95); border-right:1px solid rgba(250, 250, 250, 0.5); background:rgba(19, 193, 225, 0.7);}
.form ul.menu li.FlightFlight a {border:0;}
.form ul.menu li a:hover {transition:background 1s ease; color:rgba(250, 250, 250, 1); background:rgba(19, 193, 225, 1);}
.form ul.menu li.active a {color:rgba(250, 250, 250, 1); background:rgba(19, 193, 225, 1);}

.form ul.menu li a span.icon {display:block; font-size:1.3125em;}

.form ul.menu li span.arrow {display:block; line-height:0.375em;}
.form ul.menu li span.arrow i {display:block; font-size:1em; line-height:0.375em; color:transparent;}
.form ul.menu li:hover span.arrow i {transition:color 1s ease; color:rgba(19, 193, 225, 1);}
.form ul.menu li.active span.arrow i {color:rgba(19, 193, 225, 1);}

.form ul.menu.eng1 li {width:100%;}
.form ul.menu.eng2 li {width:50%;}
.form ul.menu.eng3 li {width:33.33%;}
.form ul.menu.eng4 li {width:25%;}
.form ul.menu.eng5 li {width:20%;}



/***************************/
/********* Fields **********/
.form form {position:relative;}
.form form fieldset {padding:0 5.5% 1em 5.5%;}
.form form fieldset input {margin:-0.5em 0 0; color:#5b5b5b; font:normal 1em/1.5em Roboto, sans-serif; border:0; width:85%;}
.form form fieldset b {color:#000; font-size:0.8125em;}
.form form fieldset a {display:inline-block; width:100%; color:#5b5b5b; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
.form form fieldset a span {text-align:center;}
.form form fieldset a > i {float:right; margin:0.5em 1em 0 0; font-size:0.75em;}


/********** Select *********/
.form form fieldset a.select {float:left; margin:0.5em 0 0; padding:0.5em 0 0; background:#fff; border:1px solid #dedede; border-radius:5px 4px 4px 5px; cursor:pointer;}
.form form fieldset a.select.left {float:left; width:48%;}
.form form fieldset a.select.right {float:right; width:48%;}
.form form fieldset a.select:hover {box-shadow:0 0 3px #ddd;}

.form form fieldset a.select span {float:left; width:2.5em; height:2.5em; margin:-0.5em 0.5em 0 0; text-align:center; color:#fff; background:#c5c8cc; border-radius:4px 0 0 4px;}
.form form fieldset a.select span i {margin:0.75em 0 0; transition:color 0.75s ease;}
.form form fieldset a.select:hover span {color:#616161;}


/*********** Input *********/
.form form fieldset a.input {margin:0.5em 0 0; padding:0.5em 0 0; background:#fff; border:1px solid #dedede; border-radius:5px 4px 4px 5px; cursor:text;}
.form form fieldset a.input:hover {box-shadow:0 0 3px #ddd;}

.form form fieldset a.input span {float:left; width:2.5em; height:2.5em; margin:-0.5em 0.5em 0 0; text-align:center; color:#fff; background:#c5c8cc; border-radius:4px 0 0 4px;}
.form form fieldset a.input span i {margin:0.75em 0 0; transition:color 0.75s ease;}
.form form fieldset a.input:hover span {color:#616161;}


/********* Checkbox ********/
.form form fieldset a.checkbox {margin:0.5em 0 0 1em;}
.form form fieldset a.checkbox span {float:left; width:1.5em; height:1.5em; margin:0 0.5em 0 0; background:#fff; border:1px solid #dedede; border-radius:4px;}
.form form fieldset a.checkbox span i {margin:0.25em 0 0; display:block;}
.form form fieldset a.checkbox span.checked {color:green; transition:display 0.75s ease;}
.form form fieldset a.checkbox#directFlight {font-weight: bold;}

/********** Number *********/
.form form fieldset a.number {}
.form form fieldset a.number:hover {}


/********* Advanced ********/
.form form a.advanced {display:block; text-transform:uppercase; text-align:right; font-size:0.6875em; padding:0 5.5% 0 0; margin:0; border:1px solid #dcdcdc; border-width:1px 0; background:#fff;}
.form form a.advanced:hover {background:#fff;}
.form form a.advanced i {font-size:1.25em; padding:0.75em 0 0.75em 0.25em;}

 
/********** Button *********/
.form form fieldset a.button {font:bold 1em/1.5em Roboto; background:#737373; border-radius:2px; /*border:1px solid #616161;*/ color:#fff; text-align:center; padding:1em 0; cursor:pointer; text-transform:uppercase;*/}
.form form fieldset a.button:hover {background:#616161; /*transition:background 0.5s ease;*/}
.form form fieldset a.button i {float:none;}
 
 

/***************************/
/********** Dialog *********/
.overlay {position:fixed; top:0; left:0; width:100%; height:100%; overflow:hidden; background:rgba(0,0,0,0.45); z-index:1000;}
.overlay section {position:relative; width:320px; margin:0 auto; box-shadow:0 0 5px #ddd; background:#fff; z-index:10000;}
 
 
/********** Header *********/
.overlay section header {position:relative; padding:1em 0; border-bottom:1px solid #dedede; background:#f6f7f8; background:linear-gradient(#fff, #f0f0f0); background:#fafbfb;}
.overlay section header h6 {font-size:1.25em; text-align:center; text-align:center; letter-spacing:-1px;}
.overlay section header h6 i {margin:0 0.5em 0 0; font-size:1em;} 
.overlay section header a.close {position:absolute; top:-7px; right:-7px; z-index:100000; background:#fff; border-radius:10px;}
.overlay section header a.close i {font-size:1.3125em; color:#5b5b5b;}
.overlay section header a.close:hover i {color:#000;}


/********** Groups *********/
.overlay section ul.groups {position:relative; background:#c5c8cc;}
.overlay section ul.groups li {display:inline-block; width:25%; border-right:1px solid #fff;}
.overlay section ul.groups li.top, .overlay section ul.groups li.exotic, .overlay section ul.groups li.az {width:22%;}
.overlay section ul.groups li.mediterranean {width:34%;}
.overlay section ul.groups li.az {border:0;}
.overlay section ul.groups li:hover, .overlay section ul.groups li.active {background:#5b5b5b; color:#fff;}
.overlay section ul.groups li a {display:block; text-transform:uppercase; font-size:0.6875em; text-align:center; padding:1em 0;}
.overlay section ul.groups li a:hover, .overlay section ul.groups li.active a  {color:#fff;}
.overlay section ul.groups li i {display:block;}

.overlay section ul.groups.flight {background:#fff;}
.overlay section ul.groups.flight li {color:gray; width:100%;}
.overlay section ul.groups.flight li.active {background:#f6f7f8; color:#000; border:0;}
.overlay section ul.groups.flight li.active a {color:#000; text-align:left; padding-left:13%; cursor:default;}
.overlay section ul.groups.flight li i {display:inline; margin:0 0.5em 0 0;}


/********** Options ********/
.overlay section div.options {position:relative; margin:0 auto; overflow-y:auto;}
.overlay section div.options ul {border-bottom:1px solid #dedede;}
.overlay section div.options ul:last-child {border:0;}
.overlay section div.options ul li a {display:block; padding:0.5em 5.5%; border-bottom:1xp solid #dedede;}
.overlay section div.options ul li a:hover {background:#f9f9f9; background:#f6f7f8; transition:background 0.75s ease;}
.overlay section div.options ul li a img {display:none;}
.overlay section div.options ul li a span {background:#fff; border-radius:4px; float:left; width:1.5em; height:1.5em; border:1px solid #dedede; margin:0 0.5em 0 0; text-align:center;}
.overlay section div.options ul li a span {float:left; width:1.5em; height:1.5em; vertical-align:middle; display:inline-block; line-height:1.375em;}
.overlay section div.options ul li a > i {float:right; margin:0.5em 0 0 0; font-size:0.75em;}

.overlay section div.options ul li a span.number {border:0; font-weight:bold; color:#000;}
.overlay section div.options ul li a span.plusSign {/*color:green;*/}
.overlay section div.options ul li a span.minusSign {/*color:red;*/}

/***** Options simple ******/
.overlay section div.options.simple ul li a {}
.overlay section div.options.simple ul li a i {float:none;}
.overlay section div.options.simple ul li a span {border:0; background:none;}
.overlay section div.options.simple ul li a strong {display:block; margin-left:2.75em; font-size:0.75em; line-height:1em; color:#000; text-transform:uppercase;}

.overlay section div.options ul li.closed > a {}
.overlay section div.options ul li.closed > a:hover {} 
.overlay section div.options ul li.closed > ul {display:none;}

.overlay section div.options ul li.open {background:#f9f9f9;}
.overlay section div.options ul li.open > a {color:#000;}
.overlay section div.options ul li.open > a:hover {}
.overlay section div.options ul li.open > ul {display:block; border:0;}

.overlay section div.options ul li.checkon > a {color:#000; font-weight:bold; background:#f6f7f8;}
.overlay section div.options ul li.checkon > a span {}
.overlay section div.options ul li.checkon > a span i {color:green; /*display:block; margin:0.25em 0 0;*/}

.overlay section div.options ul li.active > a {color:#000; font-weight:bold; background:#f6f7f8;}
.overlay section div.options ul li.active > a span i {color:green; display:block; margin:0.25em 0 0;}

.overlay section div.options p.message {margin:1.5em; text-align:center;}
.overlay section div.options p.message input {width:100%; border:1px solid #dedede; padding:1em;}

/*level 1*/
.overlay section div.options ul li.open a {}
.overlay section div.options ul li.open a:hover {}

/*level 2*/
.overlay section div.options ul li.open ul li a {padding:0.5em 5.5% 0.5em 3.5em;}
.overlay section div.options ul li.open ul li a:hover {background:#eee}

/*level 3*/
.overlay section div.options ul li.open ul li ul li a {padding:0.5em 0 0.5em 5.5em;}
.overlay section div.options ul li.open ul li ul li a:hover {}
 

/********** Footer *********/
/*.overlay section footer {position:relative; bottom:0.75em; left:0; height:1.5em; padding:5.5%;}*/
.overlay section footer { position: relative; bottom: 0; left: 0; height: 3.5em; padding: 4%; }

/***************************/
/********* Calendar ********/
.picker {color:#000; font-size:16px; line-height:1.2; text-align:left; z-index:10000;}
.picker__input {cursor:default;}
.picker__input.picker__input--active {border-color:#0089EC;}
.picker__holder {overflow-y:auto; width:100%;}
.picker {width:100%;}
.picker__holder {background:#fff; border:1px solid #aaa; border-radius:0 0 5px 5px; max-height:0; max-width:466px; min-width:176px; opacity:0;}
.picker--opened .picker__holder {box-shadow:0 6px 18px 1px rgba(0, 0, 0, 0.12); max-height:25em; opacity:1;}

.picker__box {padding:0 1em;}
.picker__header {margin-top:0.75em; position:relative; text-align:center;}
.picker__month, .picker__year {display:inline-block; font-weight:500; margin-left:0.25em; margin-right:0.25em;}
.picker__year {color:#999; font-size:0.8em; font-style:italic;}
.picker__select--month, .picker__select--year {border:1px solid #B7B7B7; font-size:0.8em; height:2.5em; margin-left:0.25em; margin-right:0.25em; margin-top:-0.5em; padding:0.66em 0.25em;}
.picker__select--month {width:35%;}
.picker__select--year {width:22.5%;}
.picker__select--month:focus, .picker__select--year:focus {border-color:#0089EC;}
.picker__nav--prev, .picker__nav--next {height:1em; padding:0.5em 1.33em; position:absolute; top:-0.33em; width:1em;}
.picker__nav--prev {left:-1em; padding-right:1.5em;}
.picker__nav--next {padding-left:1.5em; right:-1em;}
.picker__nav--prev:before, .picker__nav--next:before {border-bottom:0.5em solid rgba(0, 0, 0, 0); border-right:0.75em solid #000; border-top:0.5em solid rgba(0, 0, 0, 0); content:" "; display:block; height:0; margin:0 auto; width:0;}
.picker__nav--next:before {border-left:0.75em solid #000; border-right:0 none;}
.picker__nav--prev:hover, .picker__nav--next:hover {background:#B1DCFB; color:#000; cursor:pointer;}
.picker__table {border-collapse:collapse; border-spacing:0; font-size:inherit; margin-bottom:0.5em; margin-top:0.75em; table-layout:fixed; text-align:center; width:100%;}

.picker__table td {margin:0; padding:0;}
.picker__weekday {color:#999; font-size:0.75em; font-weight:500; padding-bottom:0.25em; width:14.2857%;}

.picker__day {border:1px solid rgba(0, 0, 0, 0); font-weight:200; padding:0.3125em 0;}
.picker__day--today {color:#0089EC; position:relative;}
.picker__day--today:before {border-left:0.5em solid rgba(0, 0, 0, 0); border-top:0.5em solid #0059BC; content: " "; height:0; position:absolute; right:2px; top:2px; width:0;}
.picker__day--selected, .picker__day--selected:hover {border-color:#0089EC;}
.picker__day--highlighted {background:#B1DCFB;}
.picker__day--disabled:before {border-top-color:#aaa;}
.picker__day--outfocus {color:#ddd; opacity:0.66;}
.picker__day--infocus:hover, .picker__day--outfocus:hover {background:#B1DCFB; color:#000; cursor:pointer;}
.picker__day--highlighted:hover, .picker--focused .picker__day--highlighted {background:#0089EC; color:#fff;}
.picker__day--disabled, .picker__day--disabled:hover {background:#F5F5F5; border-color:#F5F5F5; color:#ddd; cursor:default;}
.picker__day--highlighted.picker__day--disabled, .picker__day--highlighted.picker__day--disabled:hover {background:#bbb;}
.picker__footer {text-align:center;}
.picker__button--today, .picker__button--clear {background:#fff; border:1px solid #fff; display:inline-block; font-size:0.8em; font-weight:bold; padding:0.66em 0; vertical-align:bottom; width:50%;}
.picker__button--today:hover, .picker__button--clear:hover {background:#B1DCFB; border-bottom-color:#B1DCFB; color:#000; cursor:pointer;}
.picker__button--today:focus, .picker__button--clear:focus {background:#B1DCFB; border-color:#0089EC; outline:medium none;}
.picker__button--today:before, .picker__button--clear:before {display:inline-block; height:0; position:relative;}
.picker__button--today:before {border-left:0.66em solid rgba(0, 0, 0, 0); border-top:0.66em solid #0059BC; content: " "; margin-right:0.45em; top:-0.05em; width:0;}
.picker__button--clear:before {color:#EE2200; content: "×"; font-size: 1.1em; margin-right:0.35em; top:-0.1em; vertical-align:top;}
.picker__button--close{ display: none; }


@media (min-height:542px) {
.picker__table {margin-bottom:0.75em;}
.picker__weekday {padding-bottom:0.5em;}
}  


/****************************************/
/********* new datepicker dialog ********/
#NewDatesDialog.overlay section {width:90%; max-width: 850px;}
#NewDatesDialog.overlay #durOptions{min-width: 350px;  max-width: 360px; float: right;}
#NewDatesDialog.overlay section .daterangepicker.ltr.auto-apply.show-calendar {display: block !important;} 
#NewDatesDialog .daterangepicker:before, #NewDatesDialog .daterangepicker:before, #NewDatesDialog .daterangepicker.opensright:after {display: none !important;} 





/***************************/ 
/********* Devices *********/
/***************************/		
		
/******* Base - 960px ******/
/***************************/
@media only screen and (min-width:960px) and (max-width:2000px) {
.freeze {overflow-y:hidden; padding:0 18px 0 0;}



/********* Fields **********/
.form form fieldset a.select  {font-size:0.875em;}
.form form fieldset a.checkbox {font-size:0.875em;}
.form form fieldset a.input {font-size:0.875em;}

/********** Options ********/
.overlay section div.options ul li a  {font-size:0.875em;}
}


/* Wide - 1176px */
/*------------------------------------------------------*/ 
@media only screen and (min-width: 1176px) {
}


/* Tablet Portrait - 768px */
/*------------------------------------------------------*/  
@media only screen and (min-width:768px) and (max-width:959px) {
.freeze {overflow:hidden; position:fixed;}

.form form fieldset a.select.tabletFirst {float:left; width:100%;}
.form form fieldset a.select {float:left; width:48%;}
.form form fieldset a.select.tabletRight {float:right;}
.form form fieldset a.checkbox {width:auto;}
.form form fieldset a.button {width:48%;}
}


/* Mobile Portrait - 320px 
/*------------------------------------------------------*/
@media only screen and (max-width:767px) {
.freeze {overflow:hidden; position:fixed;}

/*********** Menu **********/
.form ul.menu li a {font-size:0.625em;}
.form ul.menu li span {font-size:1.5em;} 

.form form fieldset input {width:70%;}

/********** Options ********/
.overlay section div.options ul li a:hover {background:none;}
.overlay section div.options ul li.closed > a:hover {background-color:none;}
.overlay section div.options ul li.open > a:hover {background-color:none;}
.overlay section div.options ul li.open ul li ul li a:hover {background-color:none;}
.overlay section div.options ul li.open a:hover {background-color:none;}
.overlay section div.options ul li.open ul li a:hover {background-color:none;}

/********** Header *********/
.overlay section header a.close {right:15px; top:20px;}
}


/* Mobile Landscape - 480px
/*------------------------------------------------------*/
@media only screen and (min-width:480px) and (max-width:767px) {
}


/* Mobile Landscape - 320px
/*------------------------------------------------------*/
@media only screen and (min-width:320px) and (max-width:759px) {
.freeze {position:fixed; overflow:hidden;}
}


/* Retina
/*------------------------------------------------------*/
/*@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
}*/

