@CHARSET "UTF-8";



* {
	color: inherit;
	direction: inherit;
	font-family: inherit;
	font-style: inherit;
	font-variant: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
	line-height: inherit;
	text-align: inherit;
	text-transform: inherit;
	word-spacing: inherit;
	text-decoration: none;
	text-indent: 0;
	unicode-bidi: normal;
	vertical-align: baseline;
	word-wrap: normal;
	background-color: transparent;
	border-width: 0;
	font-size: 100%;
	zoom: 1;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	font-family: 'Open Sans', sans-serif;
	color: #e8e8e8;
	font-size: 62.5%;
	direction: ltr;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	letter-spacing: 0;
	line-height: 1em;
	text-align: left;
	text-transform: none;
	white-space: normal;
	word-spacing: 0;
	margin: 0;
	padding: 0;
	overflow-y: scroll;
}

a:link, a:visited, a:focus, a:hover, a:active {
	outline: none;
	text-decoration: none;
}

textarea {
	overflow: auto;
	resize: none;
	vertical-align: top;
}

input[type="search"] {
	-webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

::-moz-placeholder, :-moz-placeholder {
	color: #CC91AE !important;
	opacity: 1;
}

::-webkit-input-placeholder {
	color: #CC91AE !important;
}

:-ms-input-placeholder {
	color: #CC91AE !important;
}

select {
	background-color: transparent;
}

select[multiple], select[size] {
	height: auto;
}

button::-moz-focus-inner, input::-moz-focus-inner {
	padding: 0;
	border: 0;
}

input {
	line-height: normal;
}

input[type="checkbox"], input[type="radio"] {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0;
}

input[type="submit"] {
	cursor: pointer;
	-webkit-appearance: button;
}

input[type="file"] {
	-moz-appearance: none;
	white-space: nowrap;
	cursor: default;
	-moz-binding: none;
	padding: 0 !important;
}

input[type="file"]>input[type="text"] {
	border-color: inherit;
	background-color: inherit;
	color: #24000A;
	font-size: inherit;
	height: inherit;
	letter-spacing: inherit;
}

input[type="file"]>input[type="button"] {
	height: inherit;
	font-size: inherit;
	letter-spacing: inherit;
}

img {
	border: none;
	vertical-align: middle;
}

table, th, td {
	vertical-align: top;
}

body[role="window"] {
	height: auto;
	overflow: hidden;
}

html {
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-font-smoothing: antialiased !important;
	font-smoothing: antialiased !important;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

article, aside, details, dialog, figcaption, figure, footer, header,
	hgroup, menu, nav, section {
	display: block;
}

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

html, body {
	height: 100%;
}

/****************************/
body {
	font-family: 'Open Sans', sans-serif;
	color: #fff;
	background-color: rgba(43, 43, 43, 1);
}

/* STRUCTURE */
#pagewrap {
	padding: 0;
	width: 100vw;
	height: 100vh;
	margin-top: 0.5%;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0;
	background-color: rgba(43, 43, 43, 1);
}

header {
	text-align: center;
}

header h1 {
	color: #E80C7A;
	font-size: 28px; /*fallback*/
	font-size: 3.3vw;
}

#left {
	width: 20%;
	float: left;
	margin-left: 2%;
}

#middle {
	width: 52%;
	float: left;
	margin: 0 2%;
}

#right {
	width: 20%;
	float: left;
	margin-right: 2%;
}

.img-link {
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
}

.img-link:hover {
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%);
	filter: grayscale(0%);
}

/*nav*/
nav {
	
}

#nav {
	position: absolute;
	top: 1.5vw;
	left: 2vw;
	z-index: 500;
	_font-size: 20px !important;
	_font-size: 2vw !important;
	_color: white;
}

#nav a.n {
	padding: 0 20px 0 0;
	padding: 0 2vw 0 0;
	_text-decoration: none;
	_color: white;
}

/*ul#navigation {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 500;
	font-size: 20px !important; 
	font-size: 2vw !important;
	list-style-type: none;
	color: white;

}

ul#navigation li {
	float: left;
	padding: 0;
	margin:0;
	display:inline;
}

ul#navigation li a.n {
	display: inline-block;
	padding: 0 21px 0 0;
	padding: 0 2.1vw 0 0;
	text-decoration: none;
	color: white;
	text-indent: -15px;
	text-indent: -1.5vw;
}*/

/*slider*/

/* Bare minimum styles */
.slider {
	-ms-touch-action: pan-y;
	/* Prevent default touch actions on Windows 8. Only required for IE10 */
	overflow: auto;
	/* Not required but recommended for accessibility when JavaScript is turned off */
	position: relative;
	touch-action: pan-y;
	/* Prevent default touch actions on Windows 8. Supported in IE11+ */
}

.as-prev-arrow {
	background: url(../img/preview.svg) no-repeat;
	cursor: pointer;
	_filter: alpha(opacity = 0);
	height: 200px;
	_opacity: 0;
	overflow: hidden;
	position: fixed;
	text-indent: 100%;
	top: 50%;
	white-space: nowrap;
	width: 50px;
	z-index: 10;
}

.as-next-arrow {
	background: url(../img/next.svg) no-repeat;
	cursor: pointer;
	_filter: alpha(opacity = 0);
	height: 200px;
	_opacity: 0;
	overflow: hidden;
	position: fixed;
	text-indent: 100%;
	top: 50%;
	white-space: nowrap;
	width: 50px;
	z-index: 10;
}

.as-prev-arrow {
	left: 20px;
}

.as-next-arrow {
	right: 20px;
}

.slider:hover .as-prev-arrow, .slider:hover .as-next-arrow {
	filter: alpha(opacity = 1);
	opacity: 1;
}

.as-nav {
	_bottom: -10px;
	_left: 40%;
	_margin: 0;
	_padding: 1% 0;
	_position: absolute;
	text-align: center;
	_width: 54px;
	z-index: 1;
}

.as-nav a {
	height: 16px;
	display: inline-block;
	margin: 0 1px;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	width: 16px;
}

.as-nav .as-active, .as-nav a:hover {
	background-position: 0 -16px;
}

.slider {
	text-align: center;
}

#moveschu {
	width: 100%;
}

.img-headerlink {
	-webkit-filter: grayscale(80%);
	-moz-filter: grayscale(80%);
	-ms-filter: grayscale(80%);
	-o-filter: grayscale(80%);
	filter: grayscale(80%);
}

.img-headerlink:hover {
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%);
	filter: grayscale(0%);
}

.img-100 {
	width: 100%;
}

/*
input[type=checkbox]:checked ~ div.slider{
	_background-color:red;
     -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
}

input[type=checkbox] {
   position: absolute;
   top: -9999px;
   left: -9999px;
}

label { 
	position:fixed;
	top:50px;
	left:10px;
  -webkit-appearance: push-button;
  -moz-appearance: button; 
  display: inline-block;
  margin: 60px 0 10px 0;
  cursor: pointer;
  color:black;
  overflow:scroll;
}*/


a[data-title]:hover:after {

  content: attr(data-title);
  padding: 14px 18px;
  color: white;
  position: absolute;
  left: 50px;
  top: 20px;
  white-space: nowrap;
  z-index: 700;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 0px 0px 4px #E80C7A;
  -webkit-box-shadow: 0px 0px 4px #E80C7A;
  box-shadow: 0px 0px 4px #E80C7A;
  background-image: -moz-linear-gradient(top, #E80C7A, #cccccc);
  background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #E80C7A),color-stop(1, #cccccc));
  background-image: -webkit-linear-gradient(top, #E80C7A, #cccccc);
  background-image: -moz-linear-gradient(top, #E80C7A, #cccccc);
  background-image: -ms-linear-gradient(top, #E80C7A, #cccccc);
  background-image: -o-linear-gradient(top, #E80C7A, #cccccc);
  background-image: url(tip.png);
  background-repeat: no-repeat;
}
    
    
.slider-img {
	width:85%;
	_width: 1200px;
	_border: 4px dotted grey;
}


/* breakpoints
   
     480px;   
     768px;     
     1048px;    
    1200px; */

/* for 1200px or less */
@media screen and (max-width: 1200px) {
	.slider-img {
		_border: 4px dotted red;
	}
}

/* for 1048px or less */
@media screen and (max-width: 1048px) {
	.slider-img {
		_border: 4px dotted blue;
	}
}

/* for 980px or less */
@media screen and (max-width: 980px) {
	#nav {
		width: 300px;
		_background-color:yellow;	
	}
	.slider-img {
		_border: 4px dotted yellow;
	}
}

/* for 768px or less */
@media screen and (max-width: 768px) {
	#nav {
		position:relative;
		width: 100px;
	
	}
	.slider-img {
		_border: 4px dotted yellow;
	}
	#left {
		width: 0px;
		_float: left;
		margin-left: 0;
		display: none;
		
	}
	#middle {
		width: 100%;
		float: left;
		margin: 0;
	}
	#right {
		width: 0px;
		_float: left;
		margin-right: 0;
		display: none;
	}

}

/* for 550px or less */
@media screen and (max-width: 550px)
{
	#nav {
		position:relative;
		width: 100px;
	}
	.slider-img {
		_border: 4px dotted grey;
	}
	#left {
		width: 0;
		float: left;
		margin-left: 0;
		display: none;
		
	}
	#middle {
		width: 100%;
		float: left;
		margin: 0;
	}
	#right {
		width: 0;
		float: left;
		margin-right: 0;
		display: none;
	}

}

/* for 480px or less */
@media screen and (max-width: 480px) {
	#nav {
		position:relative;
		width: 100px;
	}
	.slider-img {
		_border: 4px dotted dark-grey;
	}
	#left {
		width: 0;
		float: left;
		margin-left: 0;
		display: none;
		
	}
	#middle {
		width: 100%;
		float: left;
		margin: 0;
	}
	#right {
		width: 0;
		float: left;
		margin-right: 0;
		display: none;
	}
	.schu{
		width:70%;
	}
}