@font-face {
    font-family: 'Fakt';
    src: url('../fonts/FaktPro-Normal.eot');
    src: url('../fonts/FaktPro-Normal.eot?#iefix') format('embedded-opentype'),
         url('../fonts/FaktPro-Normal.woff') format('woff'),
         url('../fonts/FaktPro-Normal_web.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    }
    @font-face {
    font-family: 'Fakt';
    src: url('../fonts/FaktPro-Bold.eot');
    src: url('../fonts/FaktPro-Bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/FaktPro-Bold.woff') format('woff'),
         url('../fonts/FaktPro-Bold_web.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    }


meta.foundation-version {
	font-family: "/5.5.2/"; }

meta.foundation-mq-small {
	font-family: "/only screen/";
	width: 0; }

meta.foundation-mq-small-only {
	font-family: "/only screen and (max-width: 40em)/";
	width: 0; }

meta.foundation-mq-medium {
	font-family: "/only screen and (min-width:40.0625em)/";
	width: 40.0625em; }

meta.foundation-mq-medium-only {
	font-family: "/only screen and (min-width:40.0625em) and (max-width:64em)/";
	width: 40.0625em; }

meta.foundation-mq-large {
	font-family: "/only screen and (min-width:64.0625em)/";
	width: 64.0625em; }

meta.foundation-mq-large-only {
	font-family: "/only screen and (min-width:64.0625em) and (max-width:90em)/";
	width: 64.0625em; }

meta.foundation-mq-xlarge {
	font-family: "/only screen and (min-width:90.0625em)/";
	width: 90.0625em; }

meta.foundation-mq-xlarge-only {
	font-family: "/only screen and (min-width:90.0625em) and (max-width:120em)/";
	width: 90.0625em; }

meta.foundation-mq-xxlarge {
	font-family: "/only screen and (min-width:120.0625em)/";
	width: 120.0625em; }

meta.foundation-data-attribute-namespace {
	font-family: false; }


html {
	box-sizing: border-box; }

*,
*:before,
*:after {
	-webkit-box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-sizing: inherit; }

html,
body {
	font-size: 100%; }


body {
	background: #fff;
	color: #222;
	cursor: auto;
	font-family: "Fakt", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-style: normal;
	font-weight: normal;
	line-height: 1.5;
	margin: 0;
	padding: 0;
	position: relative; 
	font-size: 14pt;
	}

a:hover {
	cursor: pointer; }

img {
	max-width: 100%;
	height: auto; }

img {
	-ms-interpolation-mode: bicubic; }

#map_canvas img,
#map_canvas embed,
#map_canvas object,
.map_canvas img,
.map_canvas embed,
.map_canvas object,
.mqa-display img,
.mqa-display embed,
.mqa-display object {
	max-width: none !important; }

.left {
	float: left !important; }

.right {
	float: right !important; }

.clearfix:before, .clearfix:after {
	content: " ";
	display: table; }
.clearfix:after {
	clear: both; }

.hide {
	display: none; }

.invisible {
	visibility: hidden; }

.antialiased {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale; }

img {
	display: inline-block;
	vertical-align: middle; }

textarea {
	height: auto;
	min-height: 50px; }

select {
	width: 100%; }

.row {
	margin: 0 auto;
	max-width: 100rem;
	width: 100%; }
.row:before, .row:after {
	content: " ";
	display: table; }
.row:after {
	clear: both; }
.row.collapse > .column,
.row.collapse > .columns {
	padding-left: 0;
	padding-right: 0; }
.row.collapse .row {
	margin-left: 0;
	margin-right: 0; }
.row .row {
	margin: 0 -0.9375rem;
	max-width: none;
	width: auto; }
.row .row:before, .row .row:after {
	content: " ";
	display: table; }
.row .row:after {
	clear: both; }
.row .row.collapse {
	margin: 0;
	max-width: none;
	width: auto; }
.row .row.collapse:before, .row .row.collapse:after {
			content: " ";
			display: table; }
		.row .row.collapse:after {
			clear: both; }

.column,
.columns {
	padding-left: 0.9375rem;
	padding-right: 0.9375rem;
	width: 100%;
	float: left; }

.column + .column:last-child,
.columns + .column:last-child, .column +
.columns:last-child,
.columns +
.columns:last-child {
	float: right; }
.column + .column.end,
.columns + .column.end, .column +
.columns.end,
.columns +
.columns.end {
	float: left; }




a:link, a:visited {
	text-decoration: none;
	color: black;
	border-bottom: 2px solid black;
	}
a:hover, a:focus {
	border-bottom: 2px solid transparent;
	}

html, .home, .project {
	height: 100%;
	background: white;
	position: relative;
	}

.row {
	width: 100%;
	}
.animsition {
	height: 100%;
	}
.row.content {
	margin-top: 5rem;
	opacity: 1;
	}
.contact .row.content,
.about .row.content {
	width: 90%
	}


.project .row.content {
	margin-top: 5rem;
	}
.about .row.content{
	margin-top: 5rem;
	}
.contact .row.content{
	margin-top: 5rem;
	}
.animsition {
	height: 100%;
}

/* HEADER */

.row.header {
	position: fixed;
	top: 0;
	padding-top: 1rem;
	font-weight: bold;
	width: 100%;
	left: 0%;
	z-index: 9999;
	font-size: 1rem;
	}

.header a.logo {
	border: none;
	}
.header .logo:before {
	content: "LVR";
	}
.header .mainmenu {
	text-align: right;
	z-index: 999;
	}
.header .mainmenu a:link, 
.header .mainmenu a.visited {
	padding: 0.2rem 0.2rem;
	border: 3px solid transparent;
	margin-left: 0.3rem;
	}
.header .mainmenu a.active {
	border: 3px solid black;
	} 

/* HOME */

html.fsvs {
	height: 100%;
	width: 100%;
	position: relative;
	overflow: hidden;
	}
html.fsvs body {
	width: 100%;
	height: 100%;
	}
.slideshow {
	position: absolute;
	padding-left: 0.9375rem;
	padding-right: 0.9375rem;
	height: 75%;
	bottom: 0;
	overflow: hidden;
	width: 100%;
	left: 0%;
	}
html.fsvs #fsvs-body {
	-webkit-backface-visibility: hidden;
	-webkit-perspective: 1000;
	height: 100%;	
	z-index: 1;
	}
html.fsvs #fsvs-body>* {
	height: 100%;
	width: 100%;
	overflow: hidden;
	-webkit-backface-visibility: hidden;
	-webkit-perspective: 1000;
	}
a.slidelink {
	height: 50%;
	width: 100%;
	display: block;
	}	
.slide {
	width: 100%;
	height: 100%;
	cursor: pointer;
	}
.slide .projlink {
	height: 100%;
	width: 100%;
	}	


html.fsvs #fsvs-pagination {
/*
	margin: 0;
	position: fixed;
	height: auto;
	right: 0;
	top: 50%;
	z-index: 999;
	width: 6%;
	padding: 0;
*/
	display: none;
	}
html.fsvs #fsvs-pagination li {
	list-style: none;
	width: 100%;
	height: 25px;
	text-align: center;
	cursor: pointer;
	border-bottom: 2px solid #bbb;
	}
html.fsvs #fsvs-pagination li.active {
	border-bottom: 2px solid black;
}
html.fsvs #fsvs-pagination li:last-child {
	margin: 0;
}


.slide .projtitle {
	position: absolute;
	top: 40%;
	width: 100%;
	line-height: 1em;
	color: white;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 2rem;
	min-height: 6rem;
	display: block;
	text-align: left;
	overflow: hidden;
	z-index: 999;
	padding: 1rem;
	}
.slide .projtitle .titling {
	}
.slide .projtitle .titling .titler{
	position: relative;
	transition: all 1s;
	}
.slide.active-slide .projtitle .titling .titler{
	}


/* PROJECTS */

.projects .row.content {
	margin-top: 7rem;
}

.projectoverview {
	width: 102%;
	margin-left: -1%;
	}
.projectoverview .project{
	float: left;
	width: 48%;
	margin: 1%;
	margin-bottom: 4rem;
	position: relative;
	opacity: 1;
	}
.projectoverview .project.hidden{
	opacity: 0.1;
	transition: all 0.3s;
	}	
.projectoverview .project .title {
	position: absolute;
	bottom: -3.5rem;
	height: 3rem;
	font-weight: bold;
	display: block;
	transition: all 0.3s;
	line-height: 1.2em;
	font-size: 1rem;
	overflow: hidden;
	}
.projectoverview .project:hover img{
	opacity: 0;
	transition: all 0.3s;
	}
.projectoverview .project:hover .title{
	display: block;
	transition: all 0.3s;
	}


.hiddensub {
	display: inline-block;
	}
.hiddensub:hover .filtermenu {
	}

.filtermenu {
	font-size: 0.9rem;
	margin-bottom: 2rem;
	position: absolute;
	padding: 0;
	top: 1.95rem;
	right: 3.5%;
	width: 100%;
	z-index: 800;
	padding: 0rem;
	background: none;
	display: block;
	margin-top: 0.5rem;
	}
#filter {
	padding: 0;
	text-align: right;
	margin: 0;
	}
#filter span { 
	display: inline;
	margin-bottom: 0rem;

	}
#filter a { 
	color: black; 
	text-decoration: none; 
	border: none; 
	font-weight: normal;
	}
#filter .current a, #filter a:hover { background: none;}
#filter .current a { font-weight: bold; }



/* PROJECT */

.headimage {
	width: 100%;
	height: 100%;
	background-size: cover;
	}

h1 {
	padding: 0.5rem 0.5rem;
	border: 3px solid black;
	display: inline-block;
	font-size: 1em;
	background: white;
	margin-bottom: 2rem;
	}
.infos {
	font-size: 0.9rem;
	}
.text {
	margin-bottom: 3rem;
	}

.images {
	width: 102%;
	margin-left: -1%;
	}
.images .image {
	float: left;
	display: block;
	margin: 1%;
	}
.images img {
	width: 100%;
	height: auto;
	}
.images.row-4 .image {
	width: 23%;
	}
.images.row-3 .image {
	width: 31.3333333%;
	}
.images.row-2 .image {
	width: 48%;
	}
.images.row-1 .image {
	width: 98%;
	}
.images .image .caption {
	margin-top: 0.5rem;
	display: none;
	}
.images.row-1 .image .caption {
	display: block;
	}
.images .image .caption p{
	margin: 0;
	font-size: 0.9rem;
	}



/* CONTACT */

.contactbox {
	padding: 2rem 1rem;
	border: 3px solid black;
	}
.contactbox p {
	margin: 0;
	}
.emailbox {
	}

/* FOOTER */

.row.footer {
	position: relative;
	margin-top: 10rem;
	margin-bottom: 2rem;
	font-size: 0.9rem;
	padding-bottom: 2rem;
	}
.home .row.footer {
	position: absolute;
	top: 100%;
	left: 5%;
	}
.footer p {
	margin: 0;
	}
.footer a:link,
.footer a:visited {
	border: none;
	}






@media only screen {
	.small-push-0 {
	position: relative;
	left: 0;
	right: auto; }

	.small-pull-0 {
	position: relative;
	right: 0;
	left: auto; }

	.small-push-1 {
	position: relative;
	left: 8.33333%;
	right: auto; }

	.small-pull-1 {
	position: relative;
	right: 8.33333%;
	left: auto; }

	.small-push-2 {
	position: relative;
	left: 16.66667%;
	right: auto; }

	.small-pull-2 {
	position: relative;
	right: 16.66667%;
	left: auto; }

	.small-push-3 {
	position: relative;
	left: 25%;
	right: auto; }

	.small-pull-3 {
	position: relative;
	right: 25%;
	left: auto; }

	.small-push-4 {
	position: relative;
	left: 33.33333%;
	right: auto; }

	.small-pull-4 {
	position: relative;
	right: 33.33333%;
	left: auto; }

	.small-push-5 {
	position: relative;
	left: 41.66667%;
	right: auto; }

	.small-pull-5 {
	position: relative;
	right: 41.66667%;
	left: auto; }

	.small-push-6 {
	position: relative;
	left: 50%;
	right: auto; }

	.small-pull-6 {
	position: relative;
	right: 50%;
	left: auto; }

	.small-push-7 {
	position: relative;
	left: 58.33333%;
	right: auto; }

	.small-pull-7 {
	position: relative;
	right: 58.33333%;
	left: auto; }

	.small-push-8 {
	position: relative;
	left: 66.66667%;
	right: auto; }

	.small-pull-8 {
	position: relative;
	right: 66.66667%;
	left: auto; }

	.small-push-9 {
	position: relative;
	left: 75%;
	right: auto; }

	.small-pull-9 {
	position: relative;
	right: 75%;
	left: auto; }

	.small-push-10 {
	position: relative;
	left: 83.33333%;
	right: auto; }

	.small-pull-10 {
	position: relative;
	right: 83.33333%;
	left: auto; }

	.small-push-11 {
	position: relative;
	left: 91.66667%;
	right: auto; }

	.small-pull-11 {
	position: relative;
	right: 91.66667%;
	left: auto; }

	.column,
	.columns {
	position: relative;
	padding-left: 0.9375rem;
	padding-right: 0.9375rem;
	float: left; }

	.small-1 {
	width: 8.33333%; }

	.small-2 {
	width: 16.66667%; }

	.small-3 {
	width: 25%; }

	.small-4 {
	width: 33.33333%; }

	.small-5 {
	width: 41.66667%; }

	.small-6 {
	width: 50%; }

	.small-7 {
	width: 58.33333%; }

	.small-8 {
	width: 66.66667%; }

	.small-9 {
	width: 75%; }

	.small-10 {
	width: 83.33333%; }

	.small-11 {
	width: 91.66667%; }

	.small-12 {
	width: 100%; }
	 }


@media only screen and (min-width: 40em) {

  .column,
  .columns {
	position: relative;
	padding-left: 0.9375rem;
	padding-right: 0.9375rem;
	float: left; }

  .medium-1 {
    width: 8.33333%; }

  .medium-2 {
    width: 16.66667%; }

  .medium-3 {
    width: 25%; }

  .medium-4 {
    width: 33.33333%; }

  .medium-5 {
    width: 41.66667%; }

  .medium-6 {
    width: 50%; }

  .medium-7 {
    width: 58.33333%; }

  .medium-8 {
    width: 66.66667%; }

  .medium-9 {
    width: 75%; }

  .medium-10 {
    width: 83.33333%; }

  .medium-11 {
    width: 91.66667%; }

  .medium-12 {
    width: 100%; }
 	}


@media only screen and (min-width: 60em) {



.row {
	width: 80%;
	}
.row.content {
	margin-top: 6rem;
	opacity: 1;
	width: 80%;
	}
.project .row.content {
	margin-top: 6rem;
	}
.about .row.content{
	margin-top: 10rem;
	width: 80%;
	}
.contact .row.content{
	margin-top: 10rem;
	width: 80%;
	}

/* HEADER */

.row.header {
	position: fixed;
	top: 0;
	padding-top: 2rem;
	font-weight: bold;
	width: 90%;
	left: 5%;
	z-index: 9999;
	font-size: 1.3rem;
	}
.header .mainmenu {
	z-index: 9999;
	}	

.header .mainmenu a:link, 
.header .mainmenu a.visited {
	padding: 0.5rem 0.5rem;
	border: 3px solid transparent;
	margin-left: 0.3rem;
	}
.header .mainmenu a.active {
	border: 3px solid black;
	} 
.project .header .mainmenu a:hover {
	color: white;
	background: none;
	border: 3px solid white;
	}
.project .header a.logo:hover {
	color: white;
	background: none;
	}

.header .mainmenu a:hover {
	color: black;
	background: none;
	border: 3px solid black;
	}

.header .logo:before {
	content: "Laura V Rave";
	}


/* HOME */

html.fsvs {
	height: 100%;
	width: 100%;
	position: relative;
	overflow: hidden;
	}
html.fsvs body {
	width: 100%;
	height: 100%;
	}
.slideshow {
	position: absolute;
	padding-left: 0.9375rem;
	padding-right: 0.9375rem;
	height: 85%;
	width: 100%;
	bottom: 0;
	overflow: hidden;
	width: 90%;
	left: 5%;
	}
html.fsvs #fsvs-body {
	-webkit-backface-visibility: hidden;
	-webkit-perspective: 1000;
	height: 100%;	
	z-index: 1;
	}
html.fsvs #fsvs-body>* {
	height: 100%;
	width: 100%;
	overflow: hidden;
	-webkit-backface-visibility: hidden;
	-webkit-perspective: 1000;
	}
a.slidelink {
	height: 50%;
	width: 100%;
	display: block;
	}	
.slide {
	width: 100%;
	height: 100%;
	cursor: pointer;
	position: relative;
	}
.slide .projlink {
	height: 100%;
	width: 100%;
	}	



html.fsvs #fsvs-pagination {
	margin: 0;
	position: fixed;
	height: auto;
	right: 0;
	top: 50%;
	z-index: 999;
	width: 3%;
	padding: 0;
	display: block;
	}
html.fsvs #fsvs-pagination li {
	list-style: none;
	width: 100%;
	height: 25px;
	text-align: center;
	cursor: pointer;
	border-bottom: 2px solid #bbb;
	}
html.fsvs #fsvs-pagination li.active {
	border-bottom: 2px solid black;
}
html.fsvs #fsvs-pagination li:last-child {
	margin: 0;
}


.slide .projtitle {
	position: absolute;
	top: 45%;
	width: 300%;
	color: white;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 4rem;
	height: 4rem;
	display: block;
	text-align: left;
	overflow: hidden;
	z-index: 999;
	padding: 1rem;
	}
.slide .projtitle .titling {
	}
.slide .projtitle .titling .titler{
	position: absolute;
	top: -200%;
	transition: all 1s;
	}
.slide.active-slide .projtitle .titling .titler{
	top: 0%;
	}


/* PROJECTS */


.projectoverview {
	width: 102%;
	margin-left: -1%;
	}
.projectoverview .project{
	float: left;
	width: 23%;
	margin: 1%;
	position: relative;
	opacity: 1;
	}
.projectoverview .project.hidden{
	opacity: 0.2;
	transition: all 0.3s;
	}	
.projectoverview .project .title {
	position: absolute;
	top: 45%;
	font-weight: bold;
	display: none;
	transition: all 0.3s;
	line-height: 1.2em;
	font-size: 1rem;
	}
.projectoverview .project:hover img{
	opacity: 0;
	transition: all 0.3s;
	}
.projectoverview .project:hover .title{
	display: block;
	transition: all 0.3s;
	}

.hiddensub {
	display: inline-block;
	position: relative;
	}
.hiddensub:hover .filtermenu {
	display: block;
	opacity: 1;
	}

.filtermenu {
	font-size: 0.9rem;
	margin-bottom: 2rem;
	position: absolute;
	padding: 0;
	top: 1.8rem;
	left: 0rem;
	width: 10rem;
	z-index: 50;
	padding: 0.5rem;
	background: rgba(255,255,255,0.8);
	padding-top: 1rem;
	display: none;
	opacity: 0;
	}
#filter {
	padding: 0;
	text-align: left;
	margin: 0;
	}
#filter span { 
	display: block;
	margin-bottom: 0.5rem;
	}
#filter a { 
	color: black; 
	text-decoration: none; 
	border: none; 
	font-weight: normal;
	}
#filter .current a, #filter a:hover { background: none;}
#filter .current a { font-weight: bold; }



.contactbox {
	padding: 2rem 1rem;
	border: 3px solid black;
	min-width: 25rem
	}
.contactbox p,
.emailbox p  {
	margin: 0;
	}
.emailbox {
	padding: 2rem 1rem;
	border: 3px solid transparent;
	}
.emailbox .map {
	margin-top: 12.2rem;
}



	.large-push-0 {
	position: relative;
	left: 0;
	right: auto; }

	.large-pull-0 {
	position: relative;
	right: 0;
	left: auto; }

	.large-push-1 {
	position: relative;
	left: 8.33333%;
	right: auto; }

	.large-pull-1 {
	position: relative;
	right: 8.33333%;
	left: auto; }

	.large-push-2 {
	position: relative;
	left: 16.66667%;
	right: auto; }

	.large-pull-2 {
	position: relative;
	right: 16.66667%;
	left: auto; }

	.large-push-3 {
	position: relative;
	left: 25%;
	right: auto; }

	.large-pull-3 {
	position: relative;
	right: 25%;
	left: auto; }

	.large-push-4 {
	position: relative;
	left: 33.33333%;
	right: auto; }

	.large-pull-4 {
	position: relative;
	right: 33.33333%;
	left: auto; }

	.large-push-5 {
	position: relative;
	left: 41.66667%;
	right: auto; }

	.large-pull-5 {
	position: relative;
	right: 41.66667%;
	left: auto; }

	.large-push-6 {
	position: relative;
	left: 50%;
	right: auto; }

	.large-pull-6 {
	position: relative;
	right: 50%;
	left: auto; }

	.large-push-7 {
	position: relative;
	left: 58.33333%;
	right: auto; }

	.large-pull-7 {
	position: relative;
	right: 58.33333%;
	left: auto; }

	.large-push-8 {
	position: relative;
	left: 66.66667%;
	right: auto; }

	.large-pull-8 {
	position: relative;
	right: 66.66667%;
	left: auto; }

	.large-push-9 {
	position: relative;
	left: 75%;
	right: auto; }

	.large-pull-9 {
	position: relative;
	right: 75%;
	left: auto; }

	.large-push-10 {
	position: relative;
	left: 83.33333%;
	right: auto; }

	.large-pull-10 {
	position: relative;
	right: 83.33333%;
	left: auto; }

	.large-push-11 {
	position: relative;
	left: 91.66667%;
	right: auto; }

	.large-pull-11 {
	position: relative;
	right: 91.66667%;
	left: auto; }

	.column,
	.columns {
	position: relative;
	padding-left: 0.9375rem;
	padding-right: 0.9375rem;
	float: left; }

	.large-1 {
	width: 8.33333%; }

	.large-2 {
	width: 16.66667%; }

	.large-3 {
	width: 25%; }

	.large-4 {
	width: 33.33333%; }

	.large-5 {
	width: 41.66667%; }

	.large-6 {
	width: 50%; }

	.large-7 {
	width: 58.33333%; }

	.large-8 {
	width: 66.66667%; }

	.large-9 {
	width: 75%; }

	.large-10 {
	width: 83.33333%; }

	.large-11 {
	width: 91.66667%; }

	.large-12 {
	width: 100%; }

 }



.layout {
	display: flex;
	flex-wrap: wrap;
	padding:0;
	gap: 1.5rem;
	}
.layout figure {
	margin: 0;
	padding: 0;
	}
.layout img {
	width: 100%;
	}	
.layout .layout-column {
	padding:0;
	margin-bottom: 1.5rem;
	}
.layout .layout-column.full {
	width: 100%;
	}
.layout .layout-column.half {
	width: calc(50% - .75rem);
	}
.layout .layout-column.third {
	width: calc(33.33333% - 1.5rem);
	}