﻿.popUpBox {
	.opacity(1);
	position: fixed !important;
	left: ~"calc(50% - 315px)";
	top: ~"max(calc(50% - 290px),20px)";
	bottom: ~"max(calc(50% - 290px),20px)";
	margin-top: 0;
	overflow-y: auto;
	width: 630px;
	z-index: 1005;
	@pv-popup-box();
}

    .popUpBox .overlay {
        width:100%;
        height:100%;
        background: #d9d9d9;
        .opacity(0.6);
        text-align:center;
        position:absolute;
    }

        .popUpBox .overlay .overlayContent {
            left: 50%;
            top: 50%;
            margin-left: -600px;
            position: relative;
            font-size:28px;
        }

#content-bottom .popUpBox .content-box {
    padding-top: 0px !important;
}

.popUpBox .content-box .content
{
	padding:19px 27px 25px 23px !important;
	overflow:hidden;

	 h3
	{
		margin:0 !important;
	}

	 .row
	{
		margin: 0 0 3px 0;
	}

	 .popupContent
	{ 
		max-height:500px;
		overflow-y:auto;
		overflow-x:hidden;
	
		h4
		{
			font-size: 18px;
			font-weight: bold;
			margin-bottom: 10px;
			width:100%;
		}

		.priceBreakDown
		{
			position: relative;
			margin-bottom:5px;
			.box-sizing();
			padding: 10px 10px 10px 10px;
			@pv-pricebreakdown();

			ul.pbd
			{
				width:100% !important;
			
				li
				{
					width:100% !important;
					float:left;
					clear:both;

					span.field
					{
						width:auto !important;
					}
				}
			 }

			.total
			{
				height: 30px;
				width:100%;

				@pv-pricebreakdown-total();
				@header-small();
				small{
					font-size:100%;
				}

				span
				{
					width: auto !important;
					@header-small();
				}

				&:not(.discount){
					padding-top:10px;
					border-top:1px solid @color-primary-light-50;
				}

				&.discount
				{
					margin: 10px -11px -11px -11px;
					padding: 11px;
                    background-color:@color-primary;
					color:@color-white;
					@pv-pricebreakdown-discount();

					span{
						@header-small();
						small{
							font-size:100%;
						}
					}
				}

				span.totalPrice
				{
					@pv-pricebreakdown-totalprice();
				}
			}

			p
			{
				float:none !important;
				width:100% !important;
			}
		}
	}

	.popupFooter
	{
		margin-top:17px;
	}

    .popupHeader
	{
		margin-bottom:10px;

		select {
            Width: 100px;
            background-position: 78px;
        }
	}
}

#receipt .popUpBox .content-box .content .popupContent ul{ width: auto;}

.popUp
{
	float:right;
	width:185px;
}


.popUpBox .waitBoxContainer {
	left: 50%;
	top: 50%;
	margin-left: -315px;
	margin-top: -250px;
	width: 630px;
	z-index: 1002;
}
	#receipt .popUpBox .waitBoxContainer .wait-box {
		width: ~"calc(100% - 4px)" !important;
	}

.popUpBox .content-box .content .popupFooter > div {
	margin-top:15px;
}

.popupHeader {
		font-weight:bold;
		width:100%;
		text-align:right;
	}


	.popupHeader .buttonList {
		float:right;
		width:auto !important;
		margin-left:10px;
		margin-top:-7px;
	}
		.popupHeader .buttonList li {
			float:left;
		}

			.popupHeader .buttonList li a {
				/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e5f3fd+100 */
                .linear-gradient( 
                    @origin: top; 
                    @direction: to bottom;
                    @start-color:#ffffff;
                    @stops: #ffffff 0%,#e5f3fd 100%;
                );

				border:1px solid #74c7fe;
				padding:6px 8px;
				color:#000;
				text-decoration:none;
				display:inline-block;

                @pv-popupheader-buttonlist-a();
			}

			.popupHeader .buttonList li:not(.active) a:hover {
                /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e5f3fd+0,ffffff+100 */
                .linear-gradient( 
                    @origin: top; 
                    @direction: to bottom;
                    @start-color:#e5f3fd;
                    @stops: #e5f3fd 0%,#ffffff 100%;
                );
                @pv-popupheader-buttonlist-a-hover();
			}

			.popupHeader .buttonList li:not(:last-child) a {
				border-right: none;
			}
			.popupHeader .buttonList li:first-child a {
				border-top-left-radius:5px;
				border-bottom-left-radius:5px;
			}
			.popupHeader .buttonList li:last-child a {
				border-top-right-radius:5px;
				border-bottom-right-radius:5px;
			}

			.popupHeader .buttonList li.active a {
                /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c8e8fd+0,67c1fd+100 */
                .linear-gradient( 
                    @origin: top; 
                    @direction: to bottom;
                    @start-color:#c8e8fd;
                    @stops: #c8e8fd 0%,#67c1fd 100%;
                );
                @pv-popupheader-buttonlist-a-active();
			}



#content-bottom .content-box, .book .content-box, 
.complete .content-box,body.dossier .content-box,
.popupContainer .content-box, 
.fluid-full-popup .content-box/* #travelparty-container .content-box*/
{
	@pv-content-box();
	.box-sizing();
	padding:0;

}

	.popupContainer .content-box .select-wrapper-2, .popUpBox .content-box .select-wrapper-2 { border-right:none }

.popupContainer .content a.close{
    position: absolute;    
    top: 24px;
    right: 30px;
}
.popupContainer .content label{
    float: left;
    width: 120px;
    font-weight: normal;
    margin: 10px 0px 4px 0px;
    font-size: 14px;
    clear: none;
}
.popupContainer .popUpBox .content-box .content  select{ padding-right: 0px;}
.popupContainer .popUpBox .content-box .content .row{width: 100%;float: left; }
.popupContainer .popUpBox .content-box .content .row:first-child{margin-bottom:5px;}
.popupContainer .popUpBox .content-box .content .row.buttonRow{margin-top: 10px;}

.popupContainer.sizeSmall div.popUpBox
{
	width: 400px;
	margin-left:-200px;
}

.popupContainer .MailThisTrip .form,
.popupContainer .MailAccommodation .form{ margin: 0px;}

.popupContainer .MailThisTrip label,
.popupContainer .MailAccommodation label{
    width: 100%;
    font-weight: bold;
}

.popupContainer .MailThisTrip input,
.popupContainer .MailAccommodation input{ width: 100%;}
.popupContainer .MailThisTrip textarea,
.popupContainer .MailAccommodation textarea{ width: 100%;}


.search-fluid-popup.departuredate {
    width:430px !important;

    select{
        width:180px !important;
    }


}

.search-fluid-popup.departuredate,
.fluid-full-popup.departuredate
{
    .ui-datepicker-header{
        padding:0 3px;
    }

    .ui-datepicker-next,
    .ui-datepicker-prev
    {
        width:32px;
        height:32px;
        line-height:32px;
        margin-top: 6px !important;
    }

    .ui-datepicker-next::before, 
    .ui-datepicker-prev::before
    {
        width:32px;
        height:32px;
    }
}