@charset "UTF-8";
/* CSS Document */

	body {
		background:#000000;
		padding:0;
		margin:0;
		font-family: "Roboto Condensed", Helvetica, Arial, "sans-serif";
		color:#B0B0B0;
		height: 100vh;
    	width: 100%;
	}

	#wrapper {
		margin-top:8px;
		width:100%;
		overflow: hidden;
	}
	.video-box {
		width:33.3%;
		float:left;
	}
	.vbox {
		margin:3px 6px;
		width:99%;
		height:300px;
		background:#f1f1f1;
	}
	.bg1 {
		background: url("../images/elle_video.png") no-repeat center center;
		background-size:cover;
	}
	.bg2 {
		background: url("../villa/images/MAIN_DOMINGUE.png") no-repeat center center;
		background-size:cover;
	}
	.bg3 {
		background: url("../villa/videos/VIDEO_Cap-Au-Vent_screen.png") no-repeat center center;
		background-size:cover;
	}
	.bg4 {
		background: url("../images/car_video.png") no-repeat center center;
		background-size:cover;
	}
	.bg5 {
		background: url("../villa/videos/VIDEO_Belamour.jpg") no-repeat center center;
		background-size:cover;
	}
	.bg6 {
		background: url("../chateau/thumbnail.jpg") no-repeat center center;
		background-size:cover;
	}

	.vbox:hover {
		cursor:pointer;
		filter:brightness(30%);
		transition: all 0.3s ease-in-out;
	}
	footer {
		padding-top:20px;
		text-align: center;
	}
	footer h3 {
		font-weight:400;
	}
	/* Pop-up buttons begin */

	/* Pop-up second layer begin */

	.pop-up-overlay {
		position: fixed;
		display: flex;
		justify-content: center;
		align-items: center;
		color: white;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: rgba(0, 0, 0, 0.9);
		transition: opacity 500ms;
		visibility: hidden;
		color: visible;
		opacity: 1;
		z-index: 1000;
	}

	.pop-up-overlay:target {
		visibility: visible;
		opacity: 1;
	}

	.pop-up {
		text-align: center;
		width:90%;
		
	}

	.pop-up a {
		position: absolute;
		color: white;
		text-decoration: none;
		font-size: 200%;
		top: 2%;
		right: 2%;
		z-index: 2000;
	}
/* Pop-up second layer end */
	.inner-box {
		width:100%;
		margin:0 auto;
		box-shadow: 0px 0px 40px 8px #000000;
	}
	.inner-box video {
		width:100%;
	}
	
	
	.sliderContainer {
		position:relative;
		width:80%;
		height:100%;
		margin:0 auto;
		overflow:hidden;
	}

	.sliderContainer img:first-child {
		position:relative;
		width:100%;
		left:0%;
		top:0;
	}

	.sliderContainer img {
		position:absolute;
		width:100%;
		left:-100%;
		top:0;
	}

	.nextCircle {
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		left:95%;
		width:50px;
		height:50px;
		border-radius: 50%;
		opacity:0.5;
		background-color:black;
		z-index:19;	
	}

	.next {
		position:absolute;
		top:50%;
		left:50%;
		transform:translate(-50%,-50%);
		color:white;
		z-index:20;

	}

	.nextCircle:hover{
		opacity:0.7;
		cursor: pointer;
	}

	.fa.fa-arrow-right, .fa.fa-arrow-left {
		font-size:30px;
	}

	.prevCircle {
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		right:95%;
		width:50px;
		height:50px;
		border-radius: 50%;
		opacity:0.5;
		background-color:black;
		z-index:19;	
	}

	.previous {
		position:absolute;
		top:50%;
		left:50%;
		transform:translate(-50%,-50%);
		color:white;
		z-index:20;

	}

	.prevCircle:hover {
		opacity: 0.7;
		cursor: pointer;
	}