/* ------------------------------------------------------------------
 Override
 */


/* ------------------------------------------------------------------
 General
 */
html {
	font-size: 13px; /* Overwriting possible user (browser) setting may be sensible, because it might be optimally derived from media query's determined real device width and the pixel width (i.e. density pixels/m). Nevertheless one can also upscale accordingly if the density is high, e.g. via %, 100% on the body node, 120% if high density, and so on, which still will respect user settings! Only pitfall: The default in browsers may change, which may require one absolute default setting for the first/largest media query's result. All above this query is guessing, the user setting may be anything! So just use an as wide spread default absolute value as possible (which will prevent pages looking different in browsers with different default font sizes) and rely on the user finding a working zoom instead of expecting a correction of the font-size in the browser settings (to adapt this for every site is an endless task) and ensure the used dimensins within the page live in harmony with respect to each other. Once the first media query size is reached, the density can be used for figuring a sensible absolute value that may live without requiring an adaption in the browser zoom. */
}

body
{
	color: white;
	font-family: 'Open Sans', 'SourceSansPro', 'Verdana', 'Arial', sans-serif;
	font-size: 1.0rem;
	line-height: 1.2rem;
	margin: 0;
}

div#wrapper
{
	height: 100%;
	overflow: hidden;
	width: 100%;
	position: relative; /* To be reference for absolute pos of child. */
}


header
{
	z-index: 99999;
	position: relative;
}

section
{
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 55%;
	min-height: 60rem;
	z-index: 1000;
}

section:nth-of-type(2n+1)
{
	background-color: rgba(255,255,255, .5);
	background-color: rgba(100,200,255, .5);
	background-position: center center;
}
section:nth-of-type(2n+1)
,section:nth-of-type(2n+1) a
{
	color: black;
	text-shadow: 1px 1px 2px white;
}

section:nth-of-type(2n)
{
	background-position: center center;
	background-size: auto 155%;
	border-top: .05rem solid #AAA;
	background-color: rgba(0,0,0, .5);
	background-color: rgba(255,175,255, .5);
}
section:nth-of-type(2n)
,section:nth-of-type(2n) a
{
	color: white;
	text-shadow: 1px 1px 1px black;
}

section:last-of-type
{
	background-color: transparent;
}

iframe
{
	width: 100%;
	min-height: 50rem;
}

figure
{
	margin-left: 0;
}

div h2 + p:before
{
	content: "⇡";
}
div h2 + p
{
	z-index: 1001;
	position: absolute;
	top: 2.1rem;
	right: -14rem;
	width: 5rem;
	height: 5rem;
	background: transparent url("");
}

.loader_bar_horizontal {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: .2rem;
	z-index: 100;
	background-color: rgb(2, 2, 2);
}

.container
{
	font-size: 1.4rem;
	line-height: 1.6rem;
	margin: auto;
	overflow: hidden;
	padding: 0;
	text-align: center;
	width: 80%;
}

.row
{
	margin-bottom: 2.31rem;
}

h1
{
	color: white;
	font-size: 1.8rem;
	line-height: 2.1rem;
	text-align: center;
	font-weight: normal;
	text-shadow: .05rem .05rem .1rem black;
}

h2
,sup
h2 ~ div
{
	color: black;
	text-shadow: 1px 1px 1px white;
}


h1::before
,h1::after
{
	background-repeat: no-repeat;
	content: "";
	display: inline-block;
	height: 64px;
	position: relative;
	top: 14px;
	width: 32px;
}
h1::before
{
	background-image: url('../.images/unicorn_mini_black.png');
}
h1::after
{
	background-image: url('../.images/unicorn_mini_white.png');
}

h3
{
	font-size: 2rem;
	color: royalblue;
}

ul
, ol
{
	padding: 0;
	margin: 0 0 0 0;
}

p
{
}

li, a, img
{
	outline: none !important;
}

.section-title {
	font-family: 'NovecentowideBookBold';
	font-size: 50px;
	line-height: 50px;
	margin-bottom: 40px;
	font-weight: normal;
}
.border {
	border-top: 1px solid #f0f0f0;
	padding-top: 20px;
}
a {
	color: #dde;
}
a:hover {
	text-decoration: underline;
	color: #fff;
}
#footer,
footer {
	bottom: .25rem;
	margin-bottom: 0;
}
#footer a,
footer a {
	color:#fff;
	text-decoration:underline;
}
#footer img,
footer img {
		max-height: 50pt;
}
footer ul
{
	list-style: none;
}

ul#links
{
	position: fixed;
	right: 3rem;
	bottom: .25rem;
	padding: .5rem;
	text-align: right;
}


input, textarea {
	border-radius: 0;
}

span.arrow {
	display:block;
	background:url(img/arrow.png) no-repeat;
	width:18px;
	height:9px;
	margin-left:-9px;
	position:absolute;
	bottom:20px;
	left:50%;
	z-index: 3;
}



/* ------------------------------------------------------------------
 Menu
 */
#manual_menu
,#main-nav
{
	font-size: 1.2rem;
	z-index: 1002;
	font-variant: small-caps;
	/*
	margin-left: -150pt;
	left: 50%;
	*/
}
#manual_menu li,
#main-nav li {
	border-radius: 1rem;
	display: inline-block;
	padding: .4rem;
	position: absolute;
	width: 20%;
	text-align: center;
	background-color: darkorange;
}
#main-nav li:nth-child(5n+1) {
	background-color: royalblue;
}
#main-nav li:nth-child(5n+2) {
	background-color: cornflowerblue;
}
#main-nav li:nth-child(5n+3) {
	background-color: olivedrab;
}
#main-nav li:nth-child(5n+4) {
	background-color: yellowgreen;
}
#main-nav li:nth-child(5n+5) {
	background-color: hotpink;
}
#main-nav li.current
{
	top: .5rem;
	left: 7%;
	margin-left: 0;
	margin-top: 0;
	position: fixed;
	background: none;
	width: auto;
	text-align: left;
}

#manual_menu li a,
#main-nav li a {
	color: rgb(0, 0, 0);
	text-shadow: 0px 0px 0px white;
	text-decoration: none;
	-webkit-transition: color 0.5s ease;
	-moz-transition: color 0.5s ease;
	-o-transition: color 0.5s ease;
	transition: color 0.5s ease;
}

#manual_menu li:hover a,
#main-nav li:hover a
{
	color: white;
	text-shadow: 1px 1px 1px black;
}
#main-nav li a {
	color: white;
}
#main-nav li+li+li a {
	color: white;
}

#main-nav li  ul {
	display: none;
	position: relative;
	top: 15pt;
	margin-left: -100pt;
}
/*
#manual_menu li {
	border-bottom: .1rem solid red;
}
#manual_menu li+li {
	border-bottom: .1rem solid orange;
}
#manual_menu li+li+li {
	border-bottom: .1rem solid olive;
}
#manual_menu li+li+li+li {
	border-bottom: .1rem solid lightblue;
}
#manual_menu li+li+li+li+li {
	border-bottom: .1rem solid magenta;
}
*/
#manual_menu li a {
	-moz-text-decoration-color: red;
	text-decoration-color: red;
}
#manual_menu li+li a {
	-moz-text-decoration-color: orange;
	text-decoration-color: orange;
}
#manual_menu li+li+li a {
	-moz-text-decoration-color: olive;
	text-decoration-color: olive;
}
#manual_menu li+li+li+li a {
	-moz-text-decoration-color: lightblue;
	text-decoration-color: lightblue;
}
#manual_menu li+li+li+li+li a {
	-moz-text-decoration-color: magenta;
	text-decoration-color: magenta;
}

#manual_menu li.active + li ul,
#main-nav li.active + li ul,
.nav_ul li.current + li ul
{
	display: inline;
}
#manual_menu li.current,
#manual_menu li:hover,
#manual_menu li.active,
#main-nav li.current,
#main-nav li:hover,
#main-nav li.active
{
	color: rgb(255,255,255);
}

#manual_menu li:target,
#manual_menu li::target,
#main-nav li:target,
#main-nav li::target
{
	color: #fff;
	background-color: rgba(0,0,0, .5);
	border: .1rem solid white;
}
.navbar .nav {
	float: right;
}
#manual_menu li a,
#main-nav li a,
.navbar .nav > li > a {
	padding: .5rem;
	/*
	background-color: inherit;
	font-family: 'Open Sans', 'Verdana', 'Arial', sans-serif;
	text-transform:uppercase;
	*/
}

.navbar .nav > li > a:hover {
	background:transparent!important;
}
.navbar .nav > li.active > a {
	background:transparent!important;
}



/* ------------------------------------------------------------------
 Harbor
 */
#slogan h1
{
	text-align: center;
}
#title {
	/* Novecento font not working font-family: 'NovecentowideLightRegular', sans;*/
	padding-top: 0;
	font-size: 3.5rem;
	line-height: 3rem;
	margin-bottom: .1rem;
	margin-top: 30rem;
	font-weight: normal;
	text-shadow: .05rem .05rem .1rem black;
	/*no javascript display:none;*/
}

.circle-nav a,
.circle-menu {
	width: 170px;
	height: 170px;
	display:block;
	background-color: #000;/*#01a3b2;*/
	-moz-border-radius: 85px;
	-webkit-border-radius: 85px;
	border-radius: 85px;
	text-align:center;
	color:#fff;
	display:table-cell;
	vertical-align:middle;
	margin:auto;
	position:relative;
	font-size:16px;
	z-index: 1;
	font-family: 'NovecentowideLightRegular';
	background-image: url("../.images/i8_logo.png");
	background-repeat: no-repeat;
	background-size: 40%;
}
.circle-nav a {
	width: 74pt;
	height: 10pt;
	font-size: 90%;
}
.circle-black {
	background: #000!important;
}
.label-link {
	position:relative;
	display:inline-block;
	-moz-transition: all 1s ease;
	-webkit-transition: all 1s ease;
	-o-transition: all 1s ease;
	transition: all 1s ease;
	color:#fff;
}
.circle-menu:hover .label-link {
	-moz-transform:  rotate(360deg);
	-webkit-transform: rotate(360deg);
	-o-transform:  rotate(360deg);
	transform:  rotate(360deg);
	color:#fff;
}



/* ------------------------------------------------------------------
 Gallery Template
 */

.magnifier {
	opacity: 1;
	position: relative;
	height: auto;
	display: block;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	text-align:center;
}
.magnifier:hover {
	opacity: 0.7;
}
.magnifier:after {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	opacity: 0;
	left: 0;
	top: 0;
	background: url('img/magnifier.png') center center no-repeat;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.magnifier:hover:after {
	opacity: 1;
}



/* ------------------------------------------------------------------
 Contact Template
 */

.email-link {
	font-family: 'Open Sans', 'Verdana', 'Arial', sans-serif;
	color:#000000;
	text-decoration:underline;
}
#find-us h3, #contact-info h3 {
	margin-bottom:30px;
}
#find-us ul li {
	line-height:30px;
	font-size:15px;
}
#find-us ul li .contact-icon {
	margin:4px 3px 0;
}
#contact ul li {
	margin-bottom: 10px;
}
ul.social {
	margin-top:20px;
}
ul.social li {
	margin-right:10px;
	float:left;
}
.sprite-social {
	background:url(img/sprite-social.png) no-repeat;
	height:20px;
	display:block;
}
.fb-icon {
	background-position: 0 0 ;
	width:9px;
}
.tw-icon {
	background-position: -12px 0 ;
	width:22px;
}
.gp-icon {
	background-position: -36px 0 ;
	width:23px;
}
.pt-icon {
	background-position: -61px 0 ;
	width:16px;
}
.ln-icon {
	background-position: -80px 0 ;
	width:21px;
}
.yt-icon {
	background-position: -104px 0 ;
	width:20px;
}
input[type="text"],input[type="email"], textarea {
	border: none;
	background: transparent;
	border-bottom: 1px solid #999;
	box-shadow: none;
	margin-bottom: 20px;
	border-radius: 0;
	font-family: 'Open Sans', 'Verdana', 'Arial', sans-serif;
}
textarea:focus, input[type="text"]:focus,input[type="email"]:focus {
	border-bottom: 1px solid #f0f0f0;
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	border-radius: 0;
}
input[type="submit"] {
	border: 0;
	background: #01a3b2;
	color: #fff;
	font-family: 'NovecentowideLightRegular';
	padding: 10px 20px;
}
input[type="submit"]:hover {
	background: #000000;
}



form#fullHolder
{
	height: 100%;
	left: 0;
	overflow-y: scroll;
	overflow-x: hidden;
	position: fixed;
	top: 0;
	width: 101%;
}
form#fullHolder section
{
	filter: alpha(opacity=0);
	left: 0;
	margin: 0;
	opacity: 0;
	padding: 0;
	position: absolute;
	top: 100%;
	transition: all 3s;
	width: 100%;
}

/* opposite order to as only succeding nodes can be selected via css */
form#fullHolder section:nth-of-type(3)
{
	background-image: url(../.images/worlddevelopment_nested.png);
	top: 0%;
	filter: alpha(opacity=100);
	opacity: 1;
	z-index: 300;
}
form#fullHolder section:nth-of-type(2)
{
	top: 100%;
	filter: alpha(opacity=100);
	opacity: 1;
	z-index: 211;
}
form#fullHolder section:nth-of-type(1)
{
	top: 200%;
	filter: alpha(opacity=100);
	opacity: 1;
	z-index: 100;
}



form#fullHolder input
{
	display: none;
}
form#fullHolder input:checked + section
{
	position: fixed;
	top: 0;
	filter: alpha(opacity=100);
	opacity: 1;
	z-index: 1001;
}
form#fullHolder input:checked + section ~ section
{
	top: 100%;
}
form#fullHolder input:checked + section ~ section ~ section
{
	top: 200%;
}

form#fullHolder section img
{
	display: block;
	padding-bottom: .3rem;
	width: 100%;
	border: 1px solid #DDD;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0, 0.4);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0, 0.4);
	box-shadow: 0 1px 3px rgba(0,0,0, 0.4);
}
form#fullHolder section span img
{
	height: auto;
	width: 3rem;
	margin: auto;
}
form#fullHolder section span
{
	display: block;
	font: normal 1rem/1.1rem 'open sans' helvetica arial sans-serif;
	text-shadow: .01rem .01rem .01rem #eee;
	text-rendering: optimizelegibility;
	/*
	text-align: center;
	position: absolute;
	z-index: 1003;
	top: .1rem;
	left: .1rem;
	*/
	font-variant-caps: all-small-caps;
}


div#thumbHolder
{
	width: 93%;
	text-align: center;
	overflow: hidden;
	padding-top: 1rem;
	position: fixed;
	top: 0rem;
	z-index: 2000;
}
div#thumbHolder a
{
	float: left;
	text-decoration: none;
}
div#thumbHolder ul
{
	float: right;
	padding: 0;
	margin: 0;
	list-style: none;
	white-space: nowrap;
	overflow-y: hidden;
	overflow-x: auto;
	text-align: center;
	-webkit-overflow-scrolling: touch;
	scroll-behavior: smooth;
}
div#thumbHolder li:first-child
{
	padding-left: 0;
}

div#thumbHolder li
{
	display: inline-block;
	vertical-align: top;
	margin: .38rem .31rem;
	height: 1.5rem;
	width: 8.5rem;
	overflow: hidden;
	box-shadow: 0 0 3px rgba(0,0,0, 0.4);
}
div#thumbHolder label
{
	display: block;
	height: 100%;
	width: 100%;
	cursor: pointer;
}
div#thumbHolder img
{
	cursor: pointer;
	display: inline;
	height: 1.2rem;
	margin: 0 auto;
	width: auto;
}

div#thumbHolder li:last-child
{
	padding-right: 0;
}

.logo
{
	background-image: url("../.images/worlddevelopment.png");
	background-position: center center;
	background-repeat: no-repeat;
	color: transparent;
	display: block;
	height: 141px;
	text-align: center;
	text-shadow: none;
}
.logo:hover
{
	background-image: url("../.images/worlddevelopment_inverted.png");
	color: white;
	text-shadow: 0px 0px 1px white;
}
div#mini-logo
{
	background-size: auto 2rem;
	height: 2rem;
}
div#mini-logo span
{
	font-size: .5rem;
	position: relative;
	top: 1rem;
}


/* ------------------------------------------------------------------
 Uber mich
 */
input#uber_mich + section figure
{
	display: inline-block;
	position: relative;
	vertical-align: top;
	border: 1px solid #DDD;
	background-color: #EEE;
	background-color: transparent;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0, 0.4);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0, 0.4);
	box-shadow: 0 1px 3px rgba(0,0,0, .4);
	width: 300px;  /* image width */
	height: 445px;
	overflow: hidden;
}

figcaption
{
	position: absolute;
	top: 5px;
	padding: 2px 4px;
	left: 0;
	height: 350px;
	width: 100%;
	display: inline-block;
	font-size: 15px;
	line-height: 16px;
	text-shadow: 1px 0px 1px white;
}

figcaption::before
{
	font-size: 19px;
	line-height: 19px;
	content: "Angelika Hirschberg";
	display: inline-block;
	padding-bottom: 380px;
	width: 100%;
	padding-left: 2px;
	padding-top: 2px;
	color: white;
	text-shadow: 1px 0px 1px black;
}

ul#links img
{
	width: 1rem;
}

ul#links + ul
{
	position: fixed;
	bottom: .25rem;
	left: 1rem
}



/* ------------------------------------------------------------------
 Media Queries
 */

@media (min-height:780px) {
	.last-section {
		min-height:750px;
	}
}

@media (max-width: 1199px) {
	.circle-menu {
		height:140px;
	}
	#mini-slogan {
		padding-top:4px;
		font-size:16px;
	}
}

@media (max-width: 979px) and (min-width: 767px) {
	.navbar .nav
	, #main-nav
	{
		float: left;
	}
	.home-col h2 {
		font-size: 30px;
		line-height: 30px;
	}
}


@media (max-width: 979px) {
	.circle-menu {
		height:104px;
	}
	.circle-menu:hover .label-link {
		/* Firefox */
		-moz-transform: scale(1) rotate(0deg) translate(0px);
		/* WebKit */
		-webkit-transform: scale(1) rotate(0deg) translate(0px);
		/* Opera */
		-o-transform: scale(1) rotate(0deg) translate(0px);
		/* Standard */
		transform: scale(1) rotate(0deg) translate(0px);
		color:#fff;
	}
}

@media (max-width: 750px) {
	body {
		padding:0;
		/*
		background-size: auto 210%;
		*/
		background-position: -970px top; /* px because it is an image */
	}
	/*TODO*/
	#body-bg
	{
		-moz-transform: scaleX(-1);
		-o-transform: scaleX(-1);
		-webkit-transform: scaleX(-1);
		-ms-transform: scaleX(-1);
		transform: scaleX(-1);
		-ms-filter: "FlipH";
		filter: FlipH;
	}
}

@media only screen
	and (min-device-width : 768px)
	and (max-device-width : 1024px)
	and (orientation : landscape) {
	.circle-menu:hover .label-link {
		/* Firefox */
		-moz-transform: scale(1) rotate(0deg) translate(0px);
		/* WebKit */
		-webkit-transform: scale(1) rotate(0deg) translate(0px);
		/* Opera */
		-o-transform: scale(1) rotate(0deg) translate(0px);
		/* Standard */
		transform: scale(1) rotate(0deg) translate(0px);
		color:#fff;
	}
}







/* WIDTH DEPENDENT */
@media (max-width:800px)
{
	.container
	{
		width: 94%;
	}
}


@media (max-width:400px)
{
	html
	{
		font-size: 9px;
	}
}
@media (min-width:400px) and (max-width:450px)
{
	html
	{
		font-size: 9.5px;
	}
}
@media (min-width:450px) and (max-width:500px)
{
	html
	{
		font-size: 10px;
	}
}
@media (min-width:500px) and (max-width:550px)
{
	html
	{
		font-size: 10.5px;
	}
}
@media (min-width:550px) and (max-width:600px)
{
	html
	{
		font-size: 11px;
	}
}
@media (min-width:600px) and (max-width:700px)
{
	html
	{
		font-size: 11.5px;
	}
}
@media (min-width:700px) and (max-width:750px)
{
	html
	{
		font-size: 12px;
	}
}
@media (min-width:750px) and (max-width:800px)
{
	html
	{
		font-size: 12.5px;
	}
}
@media (min-width:800px) and (max-width:850px)
{
	html
	{
		font-size: 13px;
	}
}
@media (min-width:850px) and (max-width:900px)
{
	html
	{
		font-size: 13.5px;
	}
}
@media (min-width:900px) and (max-width:950px)
{
	html
	{
		font-size: 14px;
	}
}
@media (min-width:950px) and (max-width:1000px)
{
	html
	{
		font-size: 14.5px;
	}
}
@media (min-width:1000px) and (max-width:1050px)
{
	html
	{
		font-size: 15px;
	}
}
@media (min-width:1050px) and (max-width:1100px)
{
	html
	{
		font-size: 15.5px;
	}
}
@media (min-width:1100px) and (max-width:1150px)
{
	html
	{
		font-size: 16px;
	}
}
@media (min-width:1150px) and (max-width:1200px)
{
	html
	{
		font-size: 16.5px;
	}
}
@media (min-width:1200px) and (max-width:1250px)
{
	html
	{
		font-size: 17px;
	}
}
@media (min-width:1250px) and (max-width:1300px)
{
	html
	{
		font-size: 17.5px;
	}
}
@media (min-width:1300px) and (max-width:1350px)
{
	html
	{
		font-size: 18px;
	}
}
@media (min-width:1350px) and (max-width:1400px)
{
	html
	{
		font-size: 18.5px;
	}
}
@media (min-width:1400px) and (max-width:1450px)
{
	html
	{
		font-size: 19px;
	}
}
@media (min-width:1450px) and (max-width:1500px)
{
	html
	{
		font-size: 19.5px;
	}
}
@media (min-width:1500px) and (max-width:1550px)
{
	html
	{
		font-size: 20px;
	}
}
@media (min-width:1550px) and (max-width:1600px)
{
	html
	{
		font-size: 20.5px;
	}
}
@media (min-width:1600px) and (max-width:1650px)
{
	html
	{
		font-size: 21px;
	}
}
@media (min-width:1650px) and (max-width:1700px)
{
	html
	{
		font-size: 21.5px;
	}
}
@media (min-width:1700px) and (max-width:1750px)
{
	html
	{
		font-size: 22px;
	}
}
@media (min-width:1750px) and (max-width:1800px)
{
	html
	{
		font-size: 22.5px;
	}
}
@media (min-width:1800px) and (max-width:1850px)
{
	html
	{
		font-size: 23px;
	}
}
@media (min-width:1850px) and (max-width:1900px)
{
	html
	{
		font-size: 23.5px;
	}
}
@media (min-width:1900px) and (max-width:1950px)
{
	html
	{
		font-size: 24px;
	}
}
@media (min-width:1950px)
{
	html
	{
		font-size: 24.5px;
	}
}



/* HEIGHT DEPENDENT */
	section div.overflowy
	{
		overflow-y: auto;
		height: 30rem;
	}
@media (max-height:400px)
{
	section
	{
		min-height: 400px;
	}
}
@media (min-height:400px) and (max-height:425px)
{
	section
	,div#wrapper
	{
		min-height: 425px;
	}
}
@media (min-height:425px) and (max-height:450px)
{
	section
	,div#wrapper
	{
		min-height: 450px;
	}
}
@media (min-height:450px) and (max-height:475px)
{
	section
	,div#wrapper
	{
		min-height: 475px;
	}
}
@media (min-height:475px) and (max-height:500px)
{
	section
	,div#wrapper
	{
		min-height: 500px;
	}
}
@media (min-height:500px) and (max-height:525px)
{
	section
	,div#wrapper
	{
		min-height: 525px;
	}
}
@media (min-height:525px) and (max-height:550px)
{
	section
	,div#wrapper
	{
		min-height: 550px;
	}
}
@media (min-height:550px) and (max-height:575px)
{
	section
	,div#wrapper
	{
		min-height: 575px;
	}
}
@media (min-height:575px) and (max-height:600px)
{
	section
	,div#wrapper
	{
		min-height: 600px;
	}
}
@media (min-height:600px) and (max-height:625px)
{
	section
	,div#wrapper
	{
		min-height: 625px;
	}
}
@media (min-height:625px) and (max-height:650px)
{
	section
	,div#wrapper
	{
		min-height: 650px;
	}
}
@media (min-height:650px) and (max-height:675px)
{
	section
	,div#wrapper
	{
		min-height: 675px;
	}
}
@media (min-height:675px) and (max-height:700px)
{
	section
	,div#wrapper
	{
		min-height: 700px;
	}
}
@media (min-height:700px) and (max-height:725px)
{
	section
	,div#wrapper
	{
		min-height: 725px;
	}
}
@media (min-height:725px) and (max-height:750px)
{
	section
	,div#wrapper
	{
		min-height: 750px;
	}
}
@media (min-height:750px) and (max-height:775px)
{
	section
	,div#wrapper
	{
		min-height: 775px;
	}
}
@media (min-height:775px) and (max-height:800px)
{
	section
	,div#wrapper
	{
		min-height: 800px;
	}
}
@media (min-height:800px) and (max-height:825px)
{
	section
	,div#wrapper
	{
		min-height: 825px;
	}
}
@media (min-height:825px) and (max-height:850px)
{
	section
	,div#wrapper
	{
		min-height: 850px;
	}
}
@media (min-height:850px) and (max-height:875px)
{
	section
	,div#wrapper
	{
		min-height: 875px;
	}
}
@media (min-height:875px) and (max-height:900px)
{
	section
	,div#wrapper
	{
		min-height: 900px;
	}
}
@media (min-height:900px) and (max-height:925px)
{
	section
	,div#wrapper
	{
		min-height: 925px;
	}
}
@media (min-height:925px) and (max-height:950px)
{
	section
	,div#wrapper
	{
		min-height: 950px;
	}
}
@media (min-height:950px) and (max-height:975px)
{
	section
	,div#wrapper
	{
		min-height: 975px;
	}
}
@media (min-height:975px) and (max-height:1000px)
{
	section
	,div#wrapper
	{
		min-height: 1000px;
	}
}
@media (min-height:1000px) and (max-height:1025px)
{
	section
	,div#wrapper
	{
		min-height: 1025px;
	}
}
@media (min-height:1025px) and (max-height:1050px)
{
	section
	,div#wrapper
	{
		min-height: 1050px;
	}
}
@media (min-height:1050px) and (max-height:1075px)
{
	section
	,div#wrapper
	{
		min-height: 1075px;
	}
}
@media (min-height:1075px) and (max-height:1100px)
{
	section
	,div#wrapper
	{
		min-height: 1100px;
	}
}
@media (min-height:1100px) and (max-height:1125px)
{
	section
	,div#wrapper
	{
		min-height: 1125px;
	}
}
@media (min-height:1125px) and (max-height:1150px)
{
	section
	,div#wrapper
	{
		min-height: 1150px;
	}
}
@media (min-height:1150px) and (max-height:1175px)
{
	section
	,div#wrapper
	{
		min-height: 1175px;
	}
}
@media (min-height:1175px) and (max-height:1200px)
{
	section
	,div#wrapper
	{
		min-height: 1200px;
	}
}
@media (min-height:1200px) and (max-height:1225px)
{
	section
	,div#wrapper
	{
		min-height: 1225px;
	}
}
@media (min-height:1225px) and (max-height:1250px)
{
	section
	,div#wrapper
	{
		min-height: 1250px;
	}
}
@media (min-height:1250px) and (max-height:1275px)
{
	section
	,div#wrapper
	{
		min-height: 1275px;
	}
}
@media (min-height:1275px) and (max-height:1300px)
{
	section
	,div#wrapper
	{
		min-height: 1300px;
	}
}
@media (min-height:1300px) and (max-height:1325px)
{
	section
	,div#wrapper
	{
		min-height: 1325px;
	}
}
@media (min-height:1325px) and (max-height:1350px)
{
	section
	,div#wrapper
	{
		min-height: 1350px;
	}
}
@media (min-height:1350px) and (max-height:1375px)
{
	section
	,div#wrapper
	{
		min-height: 1375px;
	}
}
@media (min-height:1375px) and (max-height:1400px)
{
	section
	,div#wrapper
	{
		min-height: 1400px;
	}
}
@media (min-height:1400px)
{
	section
	,div#wrapper
	{
		min-height: 1400px;
	}
}

.vertical_bar
{
	background-repeat: no-repeat;
	background-position: bottom;
	background-size: 100%;
	position: absolute;
	bottom: 0;
	min-height: 2px;
	width: 100%;


}


.arrow::before
{
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    transition: all 218ms ease 0s;
    transform: rotate(180deg) scale(2);
    transform-origin: 50% 50%;
    background-image: url(./images/arrow.svg);
    background-size: contain;
    background-repeat: no-repeat;
}
.arrow::before
{
    background-color: #ddd;
    border-radius: 50%;
/*
	border: 1px solid #979797;
*/
}