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



@font-face{
	font-family: 'cream';
	src:url(cream.ttf)
}

@font-face{
	font-family: 'nunito';
	src:url(nunito.ttf)}

@font-face{
	font-family: 'paint';
	src:url(paint.ttf)}

@font-face{
	font-family: 'guyon';
	src:url(guyon.otf)}



* {
   margin: 0px;
   padding: 0px;
}


* {
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  -khtml-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
}


@keyframes fadeout {
					from{
					opacity: 1;
				}
				to{
					opacity: 0;
				}
				}
@keyframes fadein {
					from{
					opacity: 0;
				}
				to{
					opacity: 1;
				}
				}
.fadeout{
				animation: fadeout 1s linear 1 forwards;
			}

/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*------------------------------------------- HTML -------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */



html{
	width: 100%;
	max-width: 1366px;
	height: 100%;
	padding: 0;
	margin: 0;
	margin-left: auto;
	margin-right: auto;
	scroll-behavior: smooth;
	
	background-color: black;
	
	
}
html::-webkits-scrollbar{display:none;}

body{ 
	width: 100%;
	height: 100%;
	padding: 0;
	margin:0;
	position: relative;
	
	overflow: hidden;
	overflow: scroll;
	
	padding: 0;
	margin: 0;
	

}
body::-webkit-scrollbar {
    display: none;
}




/*--------------------------------------------------------------------------------------------------- */
/*----------------------------------- General Settings ---------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */


	.none{display:none}

.inactive{opacity: 0.3; transition: 1s;}
.inactive:hover{opacity: 0.7}
.full{width: 100%;}



/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*------------------------------------------- INDEX ------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------------------------- */


		/*-------------- Index Logo ----------------- */

		.index_hero_text{
			text-align: center;
			padding: 0;
			margin: 0;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%)}

		/*-------- Index Video Background ------------ */

		.ParallaxVideo{height: 100vh;}

			.ParallaxVideo video{ 
				min-height: 100vh;
				min-width: 100%;
				position: fixed;
				top:0;
				z-index: -999;}









		/* ------- Down Arrow -------- */

					.downarrow{
					width: 30px;
					position: absolute;
					right: 50%;
					bottom: 20px;
				}

					.downarrow_black{
						width: 30px;
						position: absolute;
						right: 50%;
						bottom: 20px;
						filter: invert();
					}















/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*------------------------------------- HEADER ------------------------------------ */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */



header{
		display: flex;
		flex-flow: row wrap;
		align-items: center;
		align-content: center;
		justify-content: flex-end;
	
		width: 100%;
		height: 80px;
		z-index: 5000;
	
		background-color: transparent;
	
	
		position: fixed;
		top: 0;
	}

	.header_work{
		/*
		position: sticky;
		*/
		position: relative;
		justify-content: flex-end;
		margin: 0;
		padding: 0;
		height: 70px;
		background-color: transparent;
	}
	.header_socialmedias{
		display: flex;
		flex-flow: row wrap;
		align-content: center;
		align-items: center;
		justify-content: center;
		width: auto;
		text-align: center;
		transition: 2s;
		margin-left: 30px;
		left: 0;
		float: left;
		position: absolute;
	}
	.header_works{
	display: flex;
		flex-direction: row;
		align-items: center;
		align-content: center;
		justify-content: flex-end;
		width: 100%;
		height: 100px;
		z-index: 1500;
}


	.header_jlmaclav_logo{
			margin: 0;
			padding: 0;
			margin-right: auto;
			margin-left: auto;
			width: auto;
			text-align: center;
			letter-spacing: 2px;
			
			display: flex;
			flex-flow: row wrap;
			align-items: center;
			align-content: center;
		
		position: absolute;
			left: 30px;
		top: 20px;
		
		z-index: 5000;
		
		z-index: 5000;
			
}
	.header_jlmaclav_logo h2{
			font-family: 'guyon';
			text-transform: uppercase;
			padding: 0;
			margin: 0;
		/*
			margin-top: -5px;
		*/
			font-size: 18px;
			letter-spacing: 4px;
			font-weight: 800;
			color: white;
		
		display: none;
			}
	.header_jlmaclav_logo p{
							margin: 0px;
							font-family: 'proxima';
							text-transform: uppercase;
							text-align: center;
							letter-spacing: 4px;
							font-size: 10px;
							color: white;
							margin-left: 10px;
		}
	.header_jlmaclav_logo a{
			text-decoration: none;
			color: white;
		}
	.header_jlmaclav_logo_flex{
			display: flex;
			flex-flow: row wrap;
			align-items: center;
			
		cursor: pointer;
			
}
	.header_jlmaclav_logo_flex img{
		width: 150px;
		margin-right: 10px; 
		margin-left: 0px; }

@media only screen and (max-width: 600px){
	.header_jlmaclav_logo p{display: none;}
	.header_jlmaclav_logo{left: 30px;}
	.header_jlmaclav_logo_flex img{
		width: 100px;
		margin-right: 10px; 
		margin-left: 0px; }
}



	/*-------------- Website Header ----------------- */



	.header_logo{margin-right: auto; }
	.header_logo{
			display: flex;
			flex-direction: column;
			align-content: center;
			align-items: center;
			color: white;
			transition: 2s;
		}
	.header_logo h1{
			font-family: 'oldstyle';
			font-size: 22px;
			color: inherit;
			padding: 0;
			margin: 0;
			margin-left: 50px;
			letter-spacing: 3px;
		}
	.header_logo a{
			text-decoration: none;
			color: inherit;
		}


			/*-- Logo : Main -- */

			.logo{
				height: 80px;
				width: 241px;
				margin-right: auto;
				margin-left: 40px;
				background-image: url(images/maclav_logo_white.png);
				background-size: cover;
				transition: 1s;}

			.logo_halfscreen{
				display: none;
				height: 70px;
				width: 210px;
				margin-right: auto;
				margin-left: 40px;
				background-image: url(images/maclav_logo_white.png);
				background-size: cover;
				transition: 1s;		}
			.logo_smallscreen{
				display: none;
				height: 60px;
				width: 180px;
				margin-right: auto;
				margin-left: 30px;
				background-image: url(images/maclav_logo_white.png);
				background-size: cover;
				transition: 1s;		}

				/*-- Logo : Invert -- */

				.logo_invert{
				height: 60px;
				width: 180px;
				margin-left: 50px;
				filter: invert();
				transition: 1s;  }

				.logo_invert_halfscreen{
				height: 60px;
				width: 180px;
				filter: invert();
				margin-left: 50px;
				transition: 1s;		}

				.logo_invert_smallscreen{
				height: 60px;
				width: 180px;
				filter: invert();
				margin-left: 50px;
				transition: 1s;		}

				@media only screen and (max-width: 980px){

					.logo{display: none;}
					.logo_halfscreen{display: block;}

							 }

				@media only screen and (max-width: 600px){

					.logo_halfscreen{display: none;}
					.logo_smallscreen{display: block;}


							 }


			/*-- Logo : WHITE PAGES -- */

			.logo2{
				display: none;
				height: 60px;
				width: 180px;
				margin-right: auto;
				margin-left: 40px;
				background-image: url(images/maclav_logo_white.png);
				background-size: cover;
				transition: 1s;
}

			.logo2_invert{
				display: none;
				height: 60px;
				width: 180px;
				margin-right: auto;
				margin-left: 40px;
				background-image: url(images/maclav_logo_black.png);
				background-size: cover;
				transition: 1s;
}

			.logo_black{
				height: 60px;
				width: 180px;
				margin-right: auto;
				margin-left: 40px;
				background-image: url(images/maclav_logo_black.png);
				background-size: cover;
				transition: 1s;}


			@media only screen and (max-width: 980px){
				.logo2{display: block;}
				.logo_black{display:none;}
			}


















/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------- Navigation Bar -------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */

	.burger_menu{
		margin-right: 30px;
		z-index: 5000;
		cursor: pointer;
		transition: 1s;
}
	.burger_menu img{margin: 0;padding: 0;}

	nav{
			transition: 2s;
			
			position: absolute;
			right: 0;
			margin-right: 50px;
		
		background-color: black;
		
		background-image: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)), url(images/art_peinturebg5.JPG);
		background-position: center;
		background-size: cover;
		
		width: 100vw;
		height: 100vh;
		top: 0;
		margin: 0;
		color: antiquewhite;
		z-index: 4000;
		
		display: none;
		flex-flow: row wrap;
		align-items: center;
		justify-content: center;
		text-align: center;
		
}
	nav::-webkit-scrollbar {
			display: none;
		}
	nav ul li{
				list-style: none;
				font-family: 'guyon';
				font-size: 35px;
				margin: 0;
				text-transform: uppercase;
				letter-spacing: 3px;
				text-decoration: none;
				padding: 5px;
}
	nav ul li a{
				color: antiquewhite;
				text-decoration: none;
				}


	label{
				z-index: 4000;
				padding: 0;
				margin: 0;
				transition: 1s;
				display: block;
				cursor: pointer;}
	.wheel{
				margin: 0;
				padding: 0;
				width: 35px;
				height: 35px;
}

	#toggle:checked + .navbar{display: block;}


	.flip {transform: rotate(-800deg); transform-origin: center;}

	

			


	@media only screen and (max-width: 43rem){
				
				label{margin-right: 30px;}

		.burger_menu{
			margin-right: 30px;
			z-index: 5000;
			cursor: pointer;
			transition: 1s;
	}
		
			
							}	



		


























/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*------------------------------------- MAIN -------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */
/*--------------------------------------------------------------------------------- */


main{
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	scroll-behavior: smooth;
	
	background-color: black;
	
	
}
main::-webkit-scrollbar {
    display: none;
}

.main_wrapper{
	padding: 0;
	margin: 0;
}


/*--------------------------------------------------------------------------------- */
/*------------------------------------- INDEX ------------------------------------- */
/*--------------------------------------------------------------------------------- */

.main_index{
		height: 100vh;
		display: flex;
		flex-flow: row wrap;
}
	
	.index_intro{
					position: absolute;
					left: 50%;
					top: 50%;
					transform: translate(-50%, -50%);
					justify-content: center;
					text-align: center;
					width: 100%;
					z-index: 1000;
				}
	.index_intro h1{
					width: auto;
					font-family: "guyon";
					font-size: 3rem;
					color: antiquewhite;
					text-transform: uppercase;
					letter-spacing: 3px;
					margin: 0;
				}
	.index_intro p{
					font-family: "nunito";
					font-size: 14px;
					text-transform: uppercase;
					color: white;
					letter-spacing: 5px;
					margin: 0;
				}

	#index_jlucmaclav{
				width: 100%;
				height: 100vh;
				background-color: black;
				position: relative;
}
	#index_jlucmaclav video{
				  width: 100%;
				  height: 100%;
				  position: absolute;
				  object-fit: cover;
				  z-index: 0;
			}
	#index_jlucmaclav h2{
					font-family: "paint";
					color: white;
					text-transform: uppercase;
					letter-spacing: 2px;
					font-size: 12vw;
					/*--
					border: 1px solid white;
					border-radius: 5px;
					--*/
					position: absolute;
					bottom: 20vh;
					left: 50%;
					transform: translate(-50%, 0%);
					
					padding: 2px 4px ;
					margin: 0;
					
				}

	#index_page{
				width: 50%;
				height: 100vh;
				position: relative;
				
				
			}
	#index_page video{
				  width: 100%;
				  height: 100%;
				  position: absolute;
				  object-fit: cover;
				  z-index: 0;
			}
	#index_page h2{
					font-family: "arista";
					color: white;
					text-transform: uppercase;
					letter-spacing: 8px;
					font-size: 6vw;
					text-align: center;
					/*--
					border: 1px solid white;
					border-radius: 5px;
					*/
					position: absolute;
					bottom: 20vh;
					left: 50%;
					transform: translate(-50%, 0%);
					
					padding: 2px 4px ;
					margin: 0;
				}


.main_section{
	min-height: 100vh;
	width: 100%;
	
	background-color: black;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	
	position: relative;
}

.main_section_wrapper{
	width: auto;
	
	
	display: flex;
	flex-flow: column wrap;
	
	cursor: pointer;
	
	
	position: absolute;
	right: 50px;
	bottom: 50px;
	
	cursor: pointer;
	
}
.main_section_wrapper h3{
	margin: 0;
	padding: 0;
	
	width: 100%;
	font-family: "guyon";
	font-size: 60px;
	color: white;
	text-align: right;
	
	
	
	text-transform: uppercase;
	
	z-index: 10;
}
.main_section_wrapper p{
	width: 100%;
	margin: 0;
	padding: 0;
	
	width: auto;
	max-width: 50%;
	
	font-family: "nunito";
	font-size: 14px;
	color: white;
	letter-spacing: 1px;
	
	cursor: pointer;
	margin-left: auto;
	
	text-align: right;
}
.main_section_wrapper a{color: inherit; text-decoration: none; cursor: pointer}

@media only screen and (max-width: 600px){
	.main_section_wrapper h3{
	font-size: 30px;
	
	
	
	text-transform: uppercase;
	
	z-index: 10;
}
}


.main_title{
	font-family: "guyon";
	color: floralwhite;
	text-transform: uppercase;
	font-size: 15vw;
}



/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*------------------------------------- WORK STRUCTURE------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------- */




.work_main{
	width: 100vw;
	height: auto;
	margin: 0;
	padding: 0;
	scroll-behavior: smooth;
	
	position: relative;
	
	display: flex;
	flex-flow: row wrap;
	
}
.work_main::-webkit-scrollbar{
	display: none;
}

	.work_title{
			width: auto;
			position: absolute;
			left: 0;
			
			height: 100%;
			text-align: left;		
			z-index: 1000;
			transition: 2s;
			display: flex;
			flex-flow: column wrap;
			padding: 0;
						margin: 0;
					
		cursor: pointer;
					
		}
	.work_title a{text-decoration: none; color: inherit;}
	.work_title h1{
							width: auto;
							font-family: 'guyon';
							text-transform: uppercase;
							text-align: center;
							letter-spacing: 5px;
							font-size: 20px;
							/*
							color: salmon;
							text-shadow: aqua 2px 3px, yellow -2px 4px;
							*/
							margin: 0;
							padding: 0;
							margin-left: 50px;
							margin-right: 20px;
							
							display: flex;
							flex-flow: row wrap;
							align-items: center;
		
		color: antiquewhite;
								}
	.work_title h2{
							width: auto;
							font-family: 'guyon';
							text-transform: uppercase;
							text-align: center;
							letter-spacing: 5px;
							font-size: 20px;
							/*
							color: salmon;
							text-shadow: aqua 2px 3px, yellow -2px 4px;
							*/
							margin: 0;
							padding: 0;
							margin-left: 50px;
							margin-right: 20px;
							
							display: flex;
							flex-flow: row wrap;
							align-items: center;
		
		color: antiquewhite;
		
		cursor: pointer;
								}
	.work_title h1 a{text-decoration: none; color: inherit;}
	.work_title p{
							width: auto;
							font-family: 'cream';
							text-transform: uppercase;
							text-align: center;
							letter-spacing: 5px;
							font-size: 12px;
							/*
							color: salmon;
							text-shadow: aqua 2px 3px, yellow -2px 4px;
							*/
							margin: 0;
							padding: 0;
							margin-left: 50px;
							margin-right: 20px;
							
							display: flex;
							flex-flow: row wrap;
							align-items: center;
					color: white;
								}


.work_title_work{
	font-family: "guyon";
	position: absolute;
	bottom: 50px;
	left: 50%;
	transform: translate(-50%,0);
	
}



	.work_mainmenu {
		width: 90%;
		height: 100vh;
		margin-left: auto;
		margin-right: auto;
		
		display: flex;
		flex-flow: row wrap;
		justify-content: center;
		align-content: center;
		align-items: center;
		
		font-family: "guyon";
		font-size: 26px;
		color: white;
		text-align: left;
		text-transform: uppercase;
		letter-spacing: 2px;
		
		list-style: none;
		
		padding: 0px;
		
}
	.work_mainmenu li{
		cursor: pointer;
		opacity: 1;
		transition: 0.5s;
}
	.work_mainmenu li:hover{opacity: 1}

	.work_mainmenu2 {
		width: 85%;
		margin-left: auto;
		margin-right: auto;
		
		display: flex;
		flex-flow: row wrap;
		justify-content: center;
		align-items: center;
		
		font-family: "guyon";
		font-size: 4vw;
		text-align: center;
		text-transform: uppercase;
		letter-spacing: 2px;
		color: white;
		
		list-style: none;
		
		padding: 0;
		
}
	.work_mainmenu2 li{
		cursor: pointer;
		opacity: 1;
		transition: 0.5s;
		display: flex;
}
	.work_mainmenu2 li:hover{opacity: 1; color: sandybrown}

.work_mainmenu_word1{font-size: 7vw;}
.work_mainmenu_word2{font-size: 3vw;}






	.work_submenu{
			height: auto;
			position: fixed;
			bottom: 100px;
			left: 50px;
			
		z-index: 100;
			
}
	.work_submenu ul {
			display: flex;
			flex-flow: column wrap;
			justify-content: flex-end;
			
			list-style: none;
			padding: 0;
			margin-left: 0px;
			margin-bottom: 0px;
			margin-right: 0;
			text-align: left;
		
						}
	.work_submenu ul li {
			margin: 0;
			margin-right: 30px;
			
			font-family: 'cream';
			text-transform: uppercase;
			letter-spacing: 3px;
			font-size: 14px;
			color: white;
								
			cursor: pointer;
								
		}
	.work_submenu ul li a{
	text-decoration: none;
	color: inherit;
}
	.work_submenu_active{
			text-decoration: underline;
}


	@media only screen and (max-width: 43rem){
				
		.work_mainmenu2 {
		width: 85%;
		flex-flow: column wrap;
		
		font-size: 40px;
		
}
		
			.work_submenu ul {display: none;}
						
			.work_title h1 {margin-left: 30px}
			.work_title p {margin-left: 30px}
						
					}
	@media only screen and (max-width: 600px){
		
		.work_mainmenu {
			min-height: 100vh;
			height: auto;
			display: flex;
			flex-flow: column wrap;
			padding: 0;
			
}
		.work_mainmenu_word1{font-size: 35px;}
		.work_mainmenu_word2{font-size: 35px;}
		.work_mainmenu li{
			cursor: pointer;
			opacity: 1;
			transition: 0.5s;
			display: flex;
	}
		
		.work_title h1 {}
		.work_title p {display: none;}
		
}
	


.work_album{
	width: 100%;
	background-color: black;
	height: 100%;
	display: flex;
	flex-flow: row wrap;
	
}
	.work_album_unit{
	width: 50%;
	margin: 0;
	padding: 0;
}
	.work_album_unit img{margin: 0; padding: 0; display: block;}
	.work_album_unit100{
	width: 100%;
	margin: 0;
	padding: 0;
}
	.work_album_unit100 img{margin: 0; padding: 0; display: block;}


.work_description{
	position: absolute;
		right: 50px;
		top: 50%;
		transform: translate(0, -50%);
}


	.work_album_unit_art{
		width: 100%;
		min-height: 100vh;
		margin: 0;
		padding: 0;
		display: flex;
		flex-flow: row wrap;
		align-items: center;
		align-content: center;
		justify-content: center;
		
		position: relative;
}
	.work_album_unit_art img{
		max-width: 90vw;
		width: auto;
		max-height: 90vh;
		height: auto;
		
		margin-bottom: 20px;
}
	.work_album_unit_art_txt{	
		width: 100%;
		text-align: center;
	}
	.work_album_unit_art h6{
		font-family: "guyon";
		font-size: 20px;
		letter-spacing: 2px;
		text-transform: uppercase;
		
		color: floralwhite;
		
		padding: 0;
		margin: 0;
		
		
		
	}
	.work_album_unit_art p{
		font-family: "nunito";
		font-size: 12px;
		color: white;
		letter-spacing: 1px;
		
		margin: 0;
		padding: 0;
	}

@media only screen and (max-width: 980px){
	.work_album_unit{width: 95%;margin-left: auto; margin-right: auto; margin-top: 5px; margin-bottom: 5px;}
	.work_album_unit100{width: 95%;margin-left: auto; margin-right: auto; margin-top: 5px; margin-bottom: 5px;}
}


.work_submenu_list {
	width: calc(100vw - 100px);
	
	padding: 0;
	margin: 0;
	font-family: "guyon";
	font-size: 60px;
	color: white;
	text-transform: uppercase;
	letter-spacing: 3px;
	
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	
	z-index: 100;
	
}
.work_submenu_list li{list-style: none; color: white; cursor:pointer; opacity: 0.7; }
.work_submenu_list li a{color:  white; text-decoration: none; opacity: 0.3; transition: 0.5s;}
.work_submenu_list li a:hover{opacity: 1;}

.work_submenu_list2 {
	width: auto;
	
	padding: 0;
	margin: 0;
	font-family: "guyon";
	font-size: 20px;
	color: white;
	text-transform: uppercase;
	letter-spacing: 3px;
	
	display: flex;
	flex-flow: column wrap;
	justify-content: flex-start;
	
	position: fixed;
	bottom: 70px;
	left: 50px;
	
	z-index: 100;
	
}
.work_submenu_list2 li{list-style: none; color: white; cursor:pointer; opacity: 1; }
.work_submenu_list2 li a{color:  white; text-decoration: none; opacity: 0.3; transition: 0.5s;}
.work_submenu_list2 li a:hover{opacity: 1;}

















































/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*------------------------------------- ARTWORK ---------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/



.work_art_bg{
	
	width: 100%;
	height: 100vh;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	
	position: relative;
	
		background-image: linear-gradient(rgba(0, 0, 0,0) , rgba(0, 0, 0,0)), url(images/art_paintings/p_hypnagogie_mu.jpg);
		background-size: cover;
		background-position: center;
	
}
.work_art_bg_smallscreen_title{
	font-family: "guyon";
	color: floralwhite;
	font-size: 15vw;
	text-transform: uppercase;
	display: none;
}
.work_art_album{
	width: 100%;
	height: 100vh;
	background-color: black;
	
	display: flex;
	flex-flow: column wrap;
	justify-content: center;
	align-items: center;
	
	position: relative;
	
	padding: 0;
	margin: 0;
	
	text-align: center;
	
}
.work_art_album_hypnagogia{
	font-family: "guyon";
	color: white;
	font-size: 15vw;
	text-transform: uppercase;
	letter-spacing: 3px;
	padding: 0;
	margin: 0;
	
	
}

.section_paintings2{
	background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), url(images/art_paintings/p_limalimon_mu.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
}
.section_palets2{
	background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), url(images/art_palets/mm_stormtrooper_mu.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
}
.section_muses2{
	background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), url(images/art_muses/digitalart_mediterranea_mu1.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
}
.section_stilllife2{
	background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), url(images/art_stilllife/stilllife_paumedeterre.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
}


.work_paintings_bg{
	
	width: 100%;
	height: 100vh;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	
	position: relative;
	
		background-image: linear-gradient(rgba(0, 0, 0,0) , rgba(0, 0, 0,0)), url(images/art_paintings/p_limalimon_mu.jpg);
		background-size: cover;
		background-position: center;
	
}
.work_paintings_bg h3{
	font-family: "guyon";
	color: white;
	font-size: 150px;
	text-transform: uppercase;
	letter-spacing: 2px;
	padding: 0;
	margin: 0;
	
	
}
.work_palets_bg{
	
	width: 100%;
	height: 100vh;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	
	position: relative;
	
		background-image: linear-gradient(rgba(0, 0, 0,0.5) , rgba(0, 0, 0,0.5)), url(images/art_palets/mm_stormtrooper_mu.jpg);
		background-size: cover;
		background-position: center;
	
}
.work_palets_bg h3{
	font-family: "guyon";
	color: white;
	font-size: 150px;
	text-transform: uppercase;
	letter-spacing: 2px;
	padding: 0;
	margin: 0;
	
	
}
.work_muses_bg{
	
	width: 100%;
	height: 100vh;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	
	position: relative;
	
		background-image: linear-gradient(rgba(0, 0, 0,0.5) , rgba(0, 0, 0,0.5)), url(images/art_muses/digitalart_mediterranea_mu1.jpg);
		background-size: cover;
		background-position: center;
	
}
.work_muses_bg h3{
	font-family: "guyon";
	color: white;
	font-size: 150px;
	text-transform: uppercase;
	letter-spacing: 2px;
	padding: 0;
	margin: 0;
	
	
}
.work_stilllife_bg{
	
	width: 100%;
	height: 100vh;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	
	position: relative;
	
		background-image: linear-gradient(rgba(0, 0, 0,0.5) , rgba(0, 0, 0,0.5)), url(images/art_stilllife/stilllife_coffeeflowers.jpg);
		background-size: cover;
		background-position: center;
	
}
.work_stilllife_bg h3{
	font-family: "guyon";
	color: white;
	font-size: 150px;
	text-transform: uppercase;
	letter-spacing: 2px;
	padding: 0;
	margin: 0;
	
	
}



@media only screen and (max-width: 43rem){
	.work_paintings_bg h3{font-size: 60px;}
	.work_palets_bg h3{font-size: 60px;}
	.work_muses_bg h3{font-size: 60px;}
	.work_stilllife_bg h3{font-size: 60px;}
}
@media only screen and (max-width: 600px){
	.work_art_bg{
	
		background-image: linear-gradient(rgba(0, 0, 0,0.5) , rgba(0, 0, 0,0.5)), url(images/art_paintings/p_hypnagogie_mu.jpg);
		background-size: cover;
		background-position: center;
	
}
.work_art_bg_smallscreen_title{
	display: flex;
}
}











































































/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*---------------------------------------- PHOTO  -------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/



.work_photography_bg{
	padding: 0;
	margin: 0;

	width: 100%;
	height: 100%;
	
	position: relative;
	
		background-image: linear-gradient(rgba(0, 0, 0,0) , rgba(0, 0, 0,0)), url(images/jl_about.JPG);
		background-size: cover;
		background-position: center;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
}

.section_drops2{
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/photo_drops/photo_drops-.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
	
	position: absolute;
	
	z-index: 0;
}
.section_shapes2{
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/photo_shapes/photo_shapes-2.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
	
	position: absolute;
}
.section_nafarroa2{
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/photo_nafarroa/photo_nafarroa-1.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
	
	position: absolute;
}
.section_hondartza2{
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/photo_hondartza/photo_hondartza-1.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
	
	position: absolute;
}
.section_chicha2{
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/photo_chicha/photo_chicha-1.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
	
	position: absolute;
}
.section_aurasidusmare2{
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/photo_aurasidusmare/photo_aurasidusmare-1.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
	
	position: absolute;
}



.work_photography_album{
	width: 100%;
	height: 100vh;
	background-color: black;
	
	display: flex;
	flex-flow: column wrap;
	justify-content: center;
	align-items: center;
	
	position: relative;
	
	padding: 0;
	margin: 0;
	
	text-align: center;
	
}
.work_photography_album_drops{
	font-family: "guyon";
	color: white;
	font-size: 20vw;
	text-transform: uppercase;
	letter-spacing: 3px;
	padding: 0;
	margin: 0;
	
	
}
.work_photography_album_shapes{
	font-family: "guyon";
	color: white;
	font-size: 20vw;
	text-transform: uppercase;
	letter-spacing: 3px;
	padding: 0;
	margin: 0;
	
	
}
.work_photography_album_nafarroa{
	font-family: "guyon";
	color: white;
	font-size: 13vw;
	text-transform: uppercase;
	letter-spacing: 3px;
	padding: 0;
	margin: 0;
	
	
}
.work_photography_album_hondartza{
	font-family: "guyon";
	color: white;
	font-size: 10vw;
	text-transform: uppercase;
	letter-spacing: 3px;
	padding: 0;
	margin: 0;
	
	
}
.work_photography_album_chicha{
	font-family: "guyon";
	color: white;
	font-size: 15vw;
	text-transform: uppercase;
	letter-spacing: 3px;
	padding: 0;
	margin: 0;
	
	
}
.work_photography_album p{
	font-family: "proxima";
	color: white;
	text-transform: uppercase;
	font-size: 16px;
	letter-spacing: 2px;
	
}

.work_photography_album_description{
	width: 100%;
	height: auto;
	background-color: black;
	text-align: center;
	justify-content: center;
	
	padding: 0;
	padding-top: 50px;
	padding-bottom: 50px;
	
}
.work_photography_album_description_1{
	font-family: "proxima";
	color: white;
	text-transform: none;
	font-size: 22px;
	letter-spacing: 0px;
	text-align: center;
	
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	
}
.work_photography_album_description_2{
	font-family: "proxima";
	color: white;
	text-transform: none;
	font-size: 14px;
	letter-spacing: 0px;
	text-align: center;
	
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	
}
.work_photography_album_description_3{
	font-family: "metro";
	color: white;
	text-transform: none;
	font-size: 16px;
	letter-spacing: 1px;
	text-align: center;
	
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	
}

 

@media only screen and (max-width: 43rem){
	
	.clients{display: none;}
	.neutral_li{display: none;}
	
	
	.main_work3{
		width: 100%;
		height: 100%;

		margin: 0;
		padding: 0;

		position: relative;

		display: block;

		background-color: black;

		}
	
	.main_title_smallscreens p{display: block;}
	
	.main_menu{
		width: 100vw;
		height: 15vh;
		
		overflow-x: scroll;
		
		white-space: nowrap;
		
		position: sticky;
		background-color: black;
		
		z-index: 100;
	}
	.main_menu a{text-decoration: none;color: inherit; }
	.main_menu_box{
		width: 40%;
		height: 100%;
		
		display: inline-block;
		margin: 0;
		vertical-align: middle;
	}
	.main_menu_box p{
		top: 0;
		margin-left: 0;
	}
	

	
	.main_showroom_img{
		width: 100%;
		display: block;
		padding: 0;
		margin: 0;
	}
	
}
@media only screen and (max-width: 600px){
	.work_photography_bg{

		background-image: linear-gradient(rgba(0, 0, 0,0.5) , rgba(0, 0, 0,0.5)), url(images/jl_about.JPG);
		background-size: cover;
		background-position: center;
	
}
}


/*-------------------------------------------------------------------------------------------*/
/*----------------------------------- PHOTO ALBUMS  -----------------------------------------*/
/*-------------------------------------------------------------------------------------------*/

			.photo_drops{
				background-image: linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.5)), url(images/photo_drops/photo_drops-5.JPG);
				background-size: cover;
				background-position: center;
				opacity: 1;
				transition: 0.5s;
			}
			.photo_shapes{
				background-image: linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.5)), url(images/photo_shapes/photo_shapes-1.JPG);
				background-size: cover;
				background-position: center;
				opacity: 1;
				transition: 0.5s;
			}
			.photo_nafarroa{
				background-image:  linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.5)), url(images/photo_nafarroa/photo_nafarroa-1.JPG);
				background-size: cover;
				background-position: center;
				opacity: 1;
				transition: 0.5s;
			}
			.photo_hondartza{
				background-image: linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.5)), url(images/photo_hondartza/photo_hondartza-1.JPG);
				background-size: cover;
				background-position: center;
				opacity: 1;
				transition: 0.5s;
			}
			.photo_chicha{
				background-image: linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.5)), url(images/photo_chicha/photo_chicha-1.JPG);
				background-size: cover;
				background-position: center;
				opacity: 1;
				transition: 0.5s;
			}
			.photo_muxu{
				background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/photo_muxu/photo_muxu.JPG);
				background-size: cover;
				background-position: center;
				opacity: 0.5;
				transition: 0.5s;
			}
			.photo_muxu:hover{
				background-image: url(images/photo_muxu/photo_muxu.JPG);
				background-size: cover;
				background-position: center;
				opacity: 1;
				transition: 0.5s;
			}

			.photo_aetas{
				background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/photo_35mm/35mm_maria12.jpg);
				background-size: cover;
				background-position: center;
				opacity: 0.5;
				transition: 0.5s;
			}
			.photo_aetas:hover{
				background-image: url(images/photo_35mm/35mm_maria12.JPG);
				background-size: cover;
				background-position: center;
				opacity: 1;
				transition: 0.5s;
			}





































































































/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*---------------------------------------- MUSIC --------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/

.music_wrap{
	margin-top: 70px;
}



















































/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*---------------------------------------- PROJECS  -------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/



.projects_bg{
	padding: 0;
	margin: 0;

	width: 100%;
	height: auto;
	min-height: 100vh;
	
	position: relative;
	
		background-image: linear-gradient(rgba(0, 0, 0,0) , rgba(0, 0, 0,0)), url(images/jl_nature.JPG);
		background-size: cover;
		background-position: center;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	
}
.section_studiomaclav2{
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/photo_design_bg.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
	
	
	z-index: 0;
}
.section_fishandshots2{
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/photo_drops/photo_drops-6.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
	
	position: absolute;
	
	z-index: 0;
}
.section_galerielospatas2{
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/design/galerielospatas.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
	
	position: absolute;
	
	z-index: 0;
}
.section_larrrt2{
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(images/design/logo_lar1.jpg);
	background-position: center;
	background-size: cover;
	
	width: 90vw;
	height: 90vh;
	
	border-radius: 10px;
	
	position: absolute;
	
	z-index: 0;
}



@media only screen and (max-width: 600px){
	.projects_bg{

		background-image: linear-gradient(rgba(0, 0, 0,0.5) , rgba(0, 0, 0,0.5)), url(images/jl_nature.JPG);
		background-size: cover;
		background-position: center;
	
}
}





























/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*---------------------------------------- ABOUT --------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/


.about_bg{
	padding: 0;
	margin: 0;

	width: 100%;
	height: auto;
	min-height: 100vh;
	
	position: relative;
	
		background-image: linear-gradient(rgba(0, 0, 0,0) , rgba(0, 0, 0,0.5)), url(images/art_bg3.JPG);
		background-size: cover;
		background-position: left;
	
	
	
}
.about_wrapper{
	width: 70%;
	margin-left: auto;
	margin-right: auto;
	padding-top: 150px;
	text-align: center;
	padding-bottom: 100px;
}


.about_wrapper_title{
	font-family: "guyon";
	color: white;
	font-size: 30px;
	text-transform: uppercase;
	letter-spacing: 3px;
}
.about_wrapper_text{
	font-family: "nunito";
	font-size: 14px;
	color: white;
}
.about_wrapper_text_title{
	text-align: center;
	margin-bottom: 30px;
}



















/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*---------------------------------------- CONTACT ------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/


.contact_bg{
	padding: 0;
	margin: 0;

	width: 100%;
	height: auto;
	min-height: 100vh;
	
	position: relative;
	
		background-image: linear-gradient(rgba(0, 0, 0,0) , rgba(0, 0, 0,0.5)), url(images/maclav_background.JPG);
		background-size: cover;
		background-position: left;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	
	
}



.contact_card{
	width: 50%;
	padding-top: 100px;
	margin-left: auto;
	margin-right: auto;
	
	
	display: flex;
	flex-flow: row wrap;
	align-content: center;
	align-items: center;
	justify-content: center;
	
	position: relative;
	
	margin-bottom: 50px;
}

.contact_logo{
	width: 100%;
	text-align: center;
}
.work_photo_contact_logo_img{width: 100px; margin-bottom: 20px;}
.work_photo_contact_logo_txt{
	font-family: "guyon";
	font-size: 30px;
	color: antiquewhite;
	text-transform: uppercase;
	letter-spacing: 3px;
	margin: 0;
	padding: 0;
	margin-bottom: 30px;
}


.contact_form{
	width: 50%;
}
form{
	width: 90%;
	
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	
	padding-top: 10px;
	padding-bottom: 10px;
	
	border-radius: 10px;
	
	text-align: center;
}
form p{
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	
	font-family: "guyon";
	font-size: 20px;
	letter-spacing: 1px;
	color: antiquewhite;
	
	
	
}
form input{
	width: 90%;
	border: none;
	border-radius: 5px;
	
}
form textarea{
	width: 90%;
	border: none;
	border-radius: 5px;
}
form button{
	margin-top: 30px;
	margin-bottom: 30px;
	
	padding: 5px;
	
	font-family: 'guyon';
	font-size: 18px;
	color: sandybrown;
	letter-spacing: 2px;
	text-transform: uppercase;
	border-radius: 10px;
	
	background-color: antiquewhite;
	
	border: none;
	border-radius: 2px;
	
	cursor: pointer;
}



@media only screen and (max-width: 43rem){
	.contact_bg{
		padding: 0;
		margin: 0;

		width: 100%;
		height: auto;
		min-height: 100vh;

		position: relative;
	
		background-image: linear-gradient(rgba(0, 0, 0,0) , rgba(0, 0, 0,0.5)), url(images/maclav_background.JPG);
		background-size: cover;
		background-position: left;
	
		display: flex;
		flex-flow: column wrap;
		align-items: center;
		align-content: center;
		justify-content: center;


}
	.contact_card{
	width: 100%;
	padding-top: 150px;
	
}
	.contact_form{
	width: 100%;
		margin-bottom: 200px;
}
}



.messageenvoye{
	width: 100%;
	height: 100%;
	min-height: 100vh;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
}
.messageenvoye p{
	color: antiquewhite;
	font-family: "guyon";
	font-size: 30px;
}










































/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*---------------------------------------- FOOTER -------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/

footer{
	width: 100%;
	position: fixed;
	bottom: 0;
	height: 70px;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	transition: 1s;
	margin: 0;
	padding: 0;
	
}


.footer{
	display: none;
	z-index: 1500;}
.footer_invert{
	filter: invert();
}

.footer_block{
	width: 100%;
	height: 100vh;
	background-color: black;
	
	color: aliceblue;
	font-family: "nunito";
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
}
.footer_info{
	width: 70%;
	height: 100%;
	margin-left: auto;
	
	text-align: center;
	
	display: flex;
	flex-flow: column wrap;
	align-items: center;
	justify-content: center;
	
}
.footer_title{
	font-family: "guyon";
	font-size: 30px;
	letter-spacing: 2px;
	text-transform: uppercase;
	
	padding: 0;
	margin: 5px;
}
.footer_text{
	font-family: "nunito";
	font-size: 14px;
	letter-spacing: 2px;
	text-transform: uppercase;
	
	padding: 0;
	margin: 0;
}

.socialmedia_buttons{
	padding: 19px;
	top: 50%;
	vertical-align: middle;}

.footer_shortroom_socialmedia_buttons{
		cursor: pointer;
		margin: 0;
		padding: 0px;
		margin-left: 20px;
		justify-content: center;}
.footer_shortroom_socialmedia_buttons2{
		cursor: pointer;
		margin: 0;
		padding: 0px;
		margin-left: 0px;
		justify-content: center;
	
}
.footer_shortroom_socialmedia_buttons2 img{
margin: 15px;
	margin-top: 0;
	margin-bottom: 0;
}

.main_socialmedias{
	position: absolute;
	right: 50px;
	display: flex;
	flex-flow: row wrap;
}
.main_socialmedias img{height: 20px;}
.main_socialmedias2{
	position: static;
	right: 0px;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	text-align: center;
}

@media only screen and (max-width: 43rem){
	.main_socialmedias{right: 30px;}
	
}
@media only screen and (max-width: 600px){
	footer{display: none;}
}


































































.down_arrow{
	width: 25px;
	bottom: 0px;

}

			/* ------- Down Arrow -------- */

			.downarrow{
			width: 30px;
			position: absolute;
			right: 50%;
			transform: translateX(50%);
			bottom: 20px;
		}

			.downarrow_black{
				width: 30px;
				position: absolute;
				right: 50%;
				transform: translateX(50%);
				bottom: 20px;
				filter: invert();
			}

			
			.black{color: black}

			.invert {
					filter: invert();
}

			.difference{mix-blend-mode: difference;}


			@media only screen and (max-width: 600px){
	
	.downarrow{
			display: none;
		}
	
}











/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*------------------------------ LIGHTBOX STRUCTURE -----------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/




	.content{
				width: 250px;
				min-height: 250px;
				aspect-ratio: 1 / 1 ;
				margin: 10px;
				margin-left: auto;
				margin-right: auto;
				display: flex;
				flex-flow: column wrap;
				align-items: center;
				justify-content: center;

				flex-basis: 1;

				cursor: pointer;
		text-decoration: none;
		
		position: relative;
			}
	.content h5{
				font-family: "guyon";
				text-align: center;
				color: white;
				padding: 0;
				margin: 0;
			}
	.content p{
		width: 95%;
		font-family: "guyon";
		letter-spacing: 3px;
		font-size: 26px;
		text-transform: uppercase;
		text-align: center;
		color: white;
		padding: 0;
		margin: 0;
					}
	.content_details {
		width: 95%;
		font-family: "proxima";
		letter-spacing: 2px;
		font-size: 10px;
		text-transform: uppercase;
				text-align: center;
				color: white;
				padding: 0;
				margin: 0;
		
		position: absolute;
		bottom: 20px;
					}
	.content_detail{
		font-family: "proxima";
		text-transform: none;
		font-size: 12px;
	}
	.content_detail2{
		font-family: "proxima";
		font-size: 12px;
		text-transform: uppercase;
		margin: 0;
		padding: 0;
		display: flex;
		align-items: center;
		justify-content: center;
	}


	.content2{
				width: 250px;
				min-height: 250px;
				aspect-ratio: 1 / 1 ;
				margin: 10px;
				margin-left: auto;
				margin-right: auto;
				display: flex;
				flex-flow: column wrap;
				align-items: center;
				justify-content: center;

				flex-basis: 1;

				cursor: pointer;
		text-decoration: none;
		
		position: relative;
			}

	@media only screen and (max-width: 43rem){
		.content{
			width: 100%;
			min-height: auto;
			aspect-ratio: 3/2 ;
		}
	}



	.modal2 {
	  display: none;
		position: fixed;
		top: 0;
		left: 0;

	  z-index: 5000;
	  padding: 0;

	  width: 100%;
	  height: 100%;
	  overflow: auto;

		background-color: white;
		background-size: cover;
		background-position: center;
		box-shadow: 1px 3px 4px black;
	}
	.modal-content {
		  position: relative;
		  display: flex;
		  flex-direction: row;
			align-items: center;
			align-content: center;
		  justify-content: center;
		  margin: 0;
		  padding: 0 0 0 0;
		  width: 100%;
		  height: 100%;
		overflow: hidden;

		position: fixed;
		top: 0;
	}
	#modal_slider{
				display: flex;
				flex-direction: row;
				align-items: center;
				align-content: center;
				width: 	100%;
				height: calc(100vh - 140px);
				position: relative;
				flex-wrap: wrap;
				justify-content: center;
				text-align: center;
				overflow: hidden;

			}

	.slide {	

					width: 100%;
					height: 100%;
						/*
						display: flex;
						flex-direction: row;
						align-items: center;
							align-content: center;
						position: relative;
							flex-wrap: wrap;
							justify-content: center;
							text-align: center;
						*/

				}

	.slide_content{
		width: 100%;
		height: 100%;
		position: relative;

		display: flex;
		flex-flow: row wrap;
		align-items: center;
		align-content: center;
		justify-content: center;

		overflow: scroll;

			}


	.slide_photo{
						width: 90%;
						height: 100%;
						margin-left: auto;
						margin-right: auto;
						-webkit-touch-callout: none;    /* prevent callout to copy image, etc when tap to hold */
						-webkit-user-select: none; 		/* prevent copy paste, to allow, change 'none' to 'text' */

						margin-top: 10px;
						margin-bottom: 10px;

						display: flex;
						flex-flow: row wrap;
						align-items: center;
						justify-content: center;

						 }
	.slide_photo img{
		max-width: 100%;
		max-height: 500px;
	}

	.slide_photo2{
						width: 90%;
						height: 100%;
						margin-left: auto;
						margin-right: auto;
						-webkit-touch-callout: none;    /* prevent callout to copy image, etc when tap to hold */
						-webkit-user-select: none; 		/* prevent copy paste, to allow, change 'none' to 'text' */

						margin-top: 10px;
						margin-bottom: 10px;

						display: flex;
						flex-flow: row wrap;
						align-items: center;
						justify-content: center;

						 }
	.slide_photo2 img{
		max-width: 100%;
		max-height: 500px;
		border-radius: 10px;
	}

	.lightbox_menu{
		width: 50%;
		height: 100%;

		display: flex;
		flex-flow: column nowrap;
		align-items: center;
		align-content: flex-start;
		justify-content: flex-start;
		

	}
	.lightbox_menu img{
		width: 50%;
		margin-bottom: 20px;

	}
	.lightbox_menu_title{
		width: 80%;
		font-family: "guyon";
		font-size: 40px;
		text-transform: uppercase;
		letter-spacing: 1px;
		padding: 0;
		margin: 0;
		margin-top: 50px;
	}
	.lightbox_menu_brand{
		width: 70%;
		font-family: "proxima";
		font-size: 12px;
		letter-spacing: 1px;
		text-transform: uppercase;
		margin: 0;
	}
	.lightbox_menu_work{
		width: auto;
		font-family: "guyon";
		font-size: 12px;
		letter-spacing: 2px;
		text-transform: uppercase;
	}
	.lightbox_menu_details{
		width: 50%;
		font-family: "proxima";
		font-size: 12px;
		letter-spacing: 1px;
	}
	.lightbox_menu_details a{text-decoration: underline; color: inherit;}
	.lightbox_menu_details2{
		width: 50%;
		font-family: "proxima";
		font-size: 10px;
		letter-spacing: 1px;
	}
	.lightbox_menu_price{
		width: 70%;
		font-family: "guyon";
		color: black;
		letter-spacing: 1px;
		padding: 0;
		margin: 0;
	}
	.lightbox_menu_contact{
		width: 50%;
		font-family: "guyon";
		text-transform: uppercase;
		font-size: 12px;
		color: black;
		letter-spacing: 2px;
		padding: 0;
		margin: 0;
	}
	.lightbox_menu_contact a{color: inherit; text-decoration: none;}



@media only screen and (max-width: 43rem){
	.slide{overflow: scroll;}
	
	.slide_content{
		width: 100%;
		min-height: 100%;
		position: relative;

		display: flex;
		flex-flow: row wrap;
		align-items: flex-start;
		align-content:  flex-start;
		justify-content:  flex-start;

		overflow: scroll;

			}
	
	.lightbox_menu{
		width: 100%;
		height: auto;
	}
	.lightbox_menu_details{
		width: 80%;
	}
}




.pointer{
	cursor: pointer;
}
.previous{
	position: absolute;
	left: 20px;
	cursor: pointer;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5));
	width: 40px;
	height: 40px;
}
.previous img{
	width: 20px;
	filter: invert();
}
.next{
	position: absolute;
	right: 20px;
	cursor: pointer;
	
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5));
	width: 40px;
	height: 40px;
}
.next img{
	width: 20px;
	filter: invert();
}

.close{
	position: absolute;
	right: 30px;
	top: 40px;
	z-index: 6000;
	
	
}





















