/* Fluid header */
#header-fluid 
{
	background-color:@pv-header-fluid-background-color;
    float:left;
    width:100%;
    position:fixed;
    height:@pv-header-fluid-height;
	top:0;
	z-index:1004;
	@pv-header-fluid();
	font-size:16px;
	min-width:320px;

    .center 
    {
	    margin:12px auto 7px;
	    text-align:center;
	    height:25px;
	    min-width:120px;
    }

	h1, 
    div.center a div 
    { 
        display:inline-block; 
	}

	.logo
	{
		img
		{
			height:@pv-header-fluid-logo-height;
			width:166px;
		}
	}

	.container 
    {
		width:100%;
	}

	.button-holder 
    {
		margin-top:-5px;

        &.fr 
        {
		    margin-right:10px;
	    }
	    &.fl 
        {
		    margin-left:10px;
	    }
	}
	

}

#fluid-autocomplete 
{
	float:left;
	margin-top:-5px;
	position:relative;
	
	&::before 
    {
		font-family: @pv-font-icons;
        line-height: 25px;
        font-size: 20px;
        vertical-align: middle;
        display: inline-block;
	    content:'o';
	    position:absolute;
	    left:5px;
	    bottom:5px;
	    
	    z-index:1001;
	    pointer-events:none;
		@pv-fluid-autocomplete-before();
	}

	&::after 
    {
		content:attr(data-content);
		position:absolute;
		left:30px;
		top:4px;
		color:#ccc;
		line-height: 25px;
		font-size:14px;
		font-family:@pv-font-twc-bold;
		pointer-events:none;
	}

	input.search
	{
		background-position: 276px;
		width: 310px !important;
	}
}




#header-fluid .visited-count,
#link-toggle-visited-accommodations .visited-count 
{
	display:block;
	background-color:#cf3b3b;
	color:#fff;
	font-size:10px;
	.border-radius(50%);
	width:10px;
	height:10px;
	text-align:center;
	padding:2px;
	line-height:10px;
}

#header-fluid .fluid-button
{
	.visited-count
	    {
		position:absolute;
		top:2px;
		right:2px;
	}

    .wishlist-container
    {
		position:absolute;
		top:2px;
		right:2px;
        display:block;

        span 
        {
            display:block;
        }

        .wishlist-button-holder 
        {
            left:auto;
            right:1px;
            top:-10px;

            .heart 
            {
                color:#c00;
            }
        }

        .value 
        {
            left:auto;
            top:-9px;
            right:-10px;
            font-size:9px;
        }
	}
}

#link-toggle-visited-accommodations
{
    div 
    { 
        display:inline-block;
        line-height:17px;
        vertical-align:text-top; 
    }

	.visited-count
	{
		margin-left:10px;
	}
}





	#txtSearch2,
	.fluid-button 
    {
		display:inline-block;
		width:33px;
		height:33px;
		line-height:25px;
		font-size:16px;
		.border-radius(@pv-fluid-button-border-radius);
		padding:0;
		margin:0 5px 0 0;
		.box-sizing();
		border:@pv-fluid-button-border;
		color:@pv-fluid-button-color;
		text-align:center;
		text-decoration:none;
		position:relative;
		cursor:pointer;
		.text-shadow(none);
		@pv-fluid-button();
	}
		.fluid-button:hover {cursor:pointer; }

		.fluid-button.icon-text span { display:none; }
		.fluid-button.lightgreen 
        { 
            /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#22bb22+0,18b118+3,15ae15+7,18b118+10,15ae15+20,07a008+37,009800+50,039300+53,007701+77,04750b+80,026719+83,016622+87,006711+90,026306+93,075605+97,005605+100 */
            .linear-gradient( 
                @origin: top; 
                @direction: to bottom;
                @start-color:#22bb22;
                @stops: #22bb22 0%,#18b118 3%,#15ae15 7%,#18b118 10%,#15ae15 20%,#07a008 37%,#009800 50%,#039300 53%,#007701 77%,#04750b 80%,#026719 83%,#016622 87%,#006711 90%,#026306 93%,#075605 97%,#005605 100%;
            );

		}

		.fluid-button.profile { margin-right:0; }

		.fluid-button.contact::after,
		.fluid-button.profile::after,
		.fluid-button.search::after,
		.fluid-button.menu::after {
			font-family:@pv-font-icons;
			color:@pv-fluid-button-color;
			line-height:25px;
			font-weight:normal;
			font-size:20px;
			vertical-align:middle;
			display:inline-block;
			@pv-fluid-button-after();
		}

		.fluid-button.contact::after { content:'p'; transform: rotate(90deg); }
		.fluid-button.profile::after { content:'n'; }
		.fluid-button.search::after { content:'o'; }
		.fluid-button.menu::after { content:'m'; }


#site.mobile #content,
#site.tablet #content 
{
		margin-top:48px;
}

body.travelparty #site.mobile #content,
body.travelparty #site.tablet #content 
{
	margin-top:0;
}

#autocompletePhone {
	position: fixed;
	z-index: 1004;

	#history-list {
		position: fixed !important;
		height: auto;
	}

	.autocomplete-list {
		background-color: transparent !important;
		height: auto;

		&:not(#history-list) {
			left: ~"calc(50% - 90px)" !important;
		}
	}

	.header-item {
		width: 100%;
		padding: 0 !important;
		margin: 0 !important;
		background-color: transparent !important;
	}

	.header {
		width: ~"calc(100% + 50px)";
	}
}




#txtSearch2 
{
	font-size:16px;
	background:#fff !important;
	color:#000 !important;
	margin:0 !important;
	padding-left:30px;
	text-align:left;
	font-family:@pv-font-twc-bold;
	@pv-searchphone();
}


	.fluid-full-popup .header,
	.fluid-popup .header,
	#autocompletePhone .header 
    {
		height:45px;
		padding:10px;
		width:100%;
		color:#fff;
		.box-sizing();


		position:relative;
		font-size:16px;
		line-height:22px;
		text-transform:uppercase;
		@pv-fluid-header();
	}

	body .fluid-full-popup .header > *
    {
		line-height:inherit !important;
		font-size:inherit !important;
		color:inherit !important;
		margin:0 !important;
	}
	body #travelparty-container .content-box .content h3 
    {
		margin:0 0 30px 0 !important;
	}




	.fluid-popup .header .triangle-border,
	#autocompletePhone .header .triangle-border 
    {
        display:block;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 10px 10px 10px;
        border-color: transparent transparent #000 transparent;
        position:absolute;
        top:-10px;
        left:60px;
		@pv-fluid-triangle-border();
	}
	.fluid-popup .header .triangle,
	#autocompletePhone .header .triangle 
    {
        display:block;
        width: 0;
        height: 0;
        position:absolute;
        top:-9px;
        left:61px;
		@pv-fluid-triangle();
	}
	.fluid-popup.main .header .triangle-border { left:7px; }
	.fluid-popup.main .header .triangle { left:8px; }

	.fluid-popup.contact .header .triangle-border { left:auto;right:50px; }
	.fluid-popup.contact .header .triangle { left:auto;right:51px; }
	.fluid-popup.profile .header .triangle-border { left:auto;right:10px; }
	.fluid-popup.profile .header .triangle { left:auto;right:11px; }


	.fluid-close::after {
		content:'×';
		color:@pv-fluidpopup-close-color;
		position:absolute;
        font-weight: 400;
		left:0;
		width:100%;
		text-align:center;
        line-height:@pv-fluidpopup-close-lineheight;
		@pv-fluid-close-after();
	}

		.fluid-popup .header .fluid-close,
		#autocompletePhone .header .fluid-close {
			position:absolute;
			right:0px;
			top:5px;
			@pv-fluid-close();
		}

.fluid-popup {
    position: fixed;
    left: 10px;
    width: 310px;
    z-index: 1005;
    @pv-fluid-popup();

    &.profile,
    &.contact {
        left: auto;
        right: 10px;
    }

    .content {
        width: 310px;
        padding: 10px;
        .box-sizing();
        max-height: 55vh;
        overflow-y: auto;
        margin-top: 0;
        @pv-fluid-content();

        & > ul > li {
            line-height: 33px;
            color: #0193f3;
            font-size: 16px;
            font-weight: bold;
            @pv-fluid-content-parent-li();

            & > a {
                text-decoration: none;
                display: block;
                width: 100%;
                height: 100%;
                @pv-fluid-content-a();
            }
        }

        & > ul.no-visited-accos > li > a#link-toggle-visited-accommodations {
            pointer-events: none;
            cursor: default;
            color: #ccc;
        }
    }
}






			.fluid-popup .content > ul > li:not(:last-child) {
				@pv-fluid-content-li();

			}
			.fluid-popup.profile ul.inactive li.logon.last, 
			.fluid-popup.profile ul.active li.logoff.last {
				border-bottom:none;
                .box-shadow(none);
			}


			.fluid-popup .content > ul > li > .toggle-box > ul 
            {
				width:100%;
				.box-sizing();
			
				& > li 
                {
					color:#333;
					font-size:14px;
					font-weight:normal;
					line-height:26px;
					padding-left:18px;

					& > a 
                    {
						color:#333;
						text-decoration:none;
						position:relative;
					}
                }
            }


.fluid-popup .toggle-box 
{
	background-color:#fff;
	width:100%;
	.box-sizing();
	display:none;
	float:left;
	margin-bottom:10px;
	@pv-fluid-togglebox();
					
	.phonenumber-holder 
    {
		.box-sizing();
		width:100%;
		position:relative;

		& > div:not(.item-status) 
        {
			float:left;
			line-height:18px;
			margin-left:30px;
		}	

        &.closed
        {
			& > div:not(.item-status) 
            {
				width:~"calc(100% - 30px)";
				.box-sizing();
			}

			span.phonenumber,
			span.note 
            {
				clear:none;
			}
        }

		span.phonenumber 
        {
			color:#000 !important;
			text-decoration:none !important;
			float:left;
			clear:both;
			font-size:22px;
			line-height:22px;
		}

		span.note {
			color:#000;
			clear:both;
			float:right;
			font-weight:normal;
			font-size:14px;
			line-height:18px;
			margin-top:2px;
		}

		& > a 
        {
			float:right;
			display:none;
		}

		&.open
        {
			& > a 
            {
				display:block;
			}
        }

		&::before 
        {
			content:'';
			width:21px;
			height:15px;
			background: url(img/base/ico/vlaggen_mobiel.jpg?2) no-repeat 100px 0;
			background-size: 63px 15px;
			position:absolute;
			left:0;
			margin-top:4px;
		}
		&.nl::before { background-position:0 0; }
		&.be::before { background-position:-21px 0; }
		&.cz::before { background-position:-42px 0; }

	}

	.item-status 
    { 
		display:none;
		text-align:center;
		padding:0;
		width:100%;
		color:#fff;
		margin-top:10px;
		float:left;
		clear:both;
	}

	.open
    { 
        .item-status.open { display:block;background-color:#238c00; }
    }
						
    .closed 
    {
        .item-status.closed { display:block;background-color:#bbb; }
    } 

	.chat-holder 
    {
		color:#000;
						
		strong 
        {
			font-size:14px;
			line-height:16px;
		}

		.chat-status-box 
        {
			display:none;
			position:relative;

			p 
            {
				font-size:14px;
				line-height:16px;
				margin-bottom:10px;
				font-weight:normal;
			}
		}

        &.open
        {
            .chat-status-box.open { display:block; }
			.chat-status-box a 
            {
				width:auto;
				margin:0 auto;
				display:inline-block;
				position:absolute;
				left:50%;
				margin-left:-25%;
			}
        }

        &.closed
        {
            .chat-status-box.closed { display:block; }
			.chat-status-box p a 
            {
				color: @pv-color-blue;
				text-decoration:underline;
			}
        }
    }


	dl 
    {
		float:left;
		margin-top:10px;
		color:#000;
		line-height:16px;
		font-size:14px;
		width:100%;
		font-weight:normal;
						
		dd 
        {
			width:100%;
			margin-bottom:5px;
			font-weight:normal;
						    
			span.time 
            {
				float:right;
			}

			a 
            {
				color:#000;
				font-style:italic;
				text-decoration:none;
				font-size:12px;
				font-weight:normal;
			}
        }
    }

}




.fluid-full-popup 
{
	width:100% !important;
	height:100%;
	top:0;
	left:0;
	z-index:1005;
	margin:0;
	position:fixed !important;

	.content-box
    {
		height:100%;
		width:100%;
	}

	.content 
    {
		padding:0 !important;
		height:100%;
		width:100%;
	
		& > .row 
        {
			width:100%;
		}/*hoogte 45*/

		.header 
        {
			top:0;
			left:0;
		}

		.fluid-content 
        {
			height: ~"calc(100% - 105px)";
			max-height: ~"calc(100% - 105px)";
			overflow-y:scroll;
			@pv-fluidheader-content();
			
		
			.dashed-box 
            {
				border:none;
				border-image:none;
				background:none;
				height:~"calc(100% + 100px)";
			}
        }

		.footer 
        {
			bottom:0;
			left:0;
			height:60px;
			
			padding:10px;
			.box-sizing();
			@pv-fluidfullpopup-content-footer();
		}
    }

	.header 
    {
		.border-radius(0);
		border:none;
	}
}

body.travelparty #header-fluid {
	position:static;
}

body > div.fluid-shade
{
	@pv-fluid-shade();
}
/* Fluid header */