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

html
		{
			/* killing 300ms touch delay in IE */
			-ms-touch-action: manipulation;
			touch-action: manipulation;
		}

html,body{
	margin:0;
	padding:0;
	min-height:100%;
	width:100%;
	font-size:100%;}

em{
	color:#444;
	line-height:150%;
	font-style:normal;}

p{
	margin-top:0;}

body{
	 background-color:#fff;
	 background-image:url(../media/nappa.png);}

header {
		background-size:cover;
		background-position:top center;
    background-image:url(../media/header.jpg);}

footer{
		background-size:cover;
		background-repeat:no-repeat;
		background-position:top center;
    background-image:url(../media/sockel.jpg);}

header,footer {
		height:120px;}

header,footer,.darkline {
    background-color: #404040;}

#content{
	hyphens:auto;
	background-color:#ffffff;}

#innercontent ul{
	padding:0;}

#innercontent ul li{
	list-style:none;
	margin-left:1rem;
	text-indent:-.65rem;
	margin-bottom:.75rem;}

#innercontent ul li:before{
	content:"-  ";}

#left{
	padding:0px 0 20px 20px;
	background-image:url(../media/schwertknauf.png);
	background-size:contain;
	background-repeat:no-repeat;
	background-position:left bottom;
	background-color:#F5F5F5;}

#left ul{
	margin:1rem 0 0 0;
	padding:0;}

#left ul li{
	list-style:none;
	margin-left:0rem;}

#left h3{
	margin:20px 0 0px 0;
	padding:0 0 20px 0;
	width:90%;
	font-weight:300;
	color:#555;
	border-bottom:1px solid #ccc;}

#left ul li,
#innercontent p,
#innercontent div{
	line-height:150%;}

#innercontent{
	margin:10px 30px 0 30px;}

#innercontent p{
	margin-bottom:30px;}

#logo{
 height:inherit;}
 
#logo img{
 height:95%;}

.darkline{
	background-color: #404040;
	width:100%;
	margin:auto;
	min-height:20px;}

header.row,
footer.row,
#content.row{
	font-size:1.2rem;
	font-family:"Barlow Condensed";
	margin:auto;
	width:100%;
	font-weight:300;
	max-width:1150px;}

h1,h2,h3,h4,h4,h5,h6,strong,b{
 font-weight:500;}

h1{
	margin:12px 0 0px 0;
	padding:0 0 19px 0;
	font-size:1.4rem;
	line-height:1.5rem;}

h1 blockquote{
	margin-top:.5rem;
	margin-bottom:0;}

h4{
	font-size:1.2rem;
	color:#333;
	line-height:1.5rem;}

h3{
 margin:0 0 .5rem 0;}

h3,.orange{
	color:#F49306;}

#produktkopf strong,
h3>strong{ /* VERKAUFT, RESERVIERT */
	float:right;
	color:#CC0000;}

.biglink{
	font-weight:400;
	font-size:1.6rem;}

.block{
	display:block;}

.bordered{
	line-height:110% !important;
	padding:5px;
	margin-bottom:2rem;
	border:1px solid #ccc;}

.bordered .bild{
	background-size:cover;
	background-position:center;
	display:block;
	height:150px;}

.bordered .title{
	margin-top:.2rem;
	display:block;
	line-height:110%;
	height:4.5rem;overflow:hidden !important;
	font-size:1rem;}

.bordered .text{
	margin-top:.2rem;
	display:block;
	line-height:110%;
	height:4.5rem;overflow:hidden !important;
	font-size:1rem;}

.title,
.text,
.bild,
.title:hover,
.text:hover,
.bild:hover{
 color:#333 !important;
 text-decoration:none !important;}

.last{
	clear:after !important;}

img.passend{
	max-width:100% !important;}

.mbild{
 cursor:pointer;
 border:1px solid #ccc;
 margin:.5rem 0;}

.produkttext{
	line-height:125%;
	font-size:1rem;}

#bmain{
	cursor:pointer !important;
	margin-bottom:1rem;
	max-height:200px;
	max-width:100%;}

#dark{
	text-align:center;
	display:none;
	background-color:rgba(0,0,0,.7);
	position:absolute;
 	top:0;left:0;
	width:100%;
	height:100%;
	overflow:hidden;}

a{
	text-decoration:none;
	color:#404040;}

#innercontent a:hover{
	text-decoration:underline;}

.row{
	max-width:1150px;
	width:100%;
	margin:auto; }

.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

[class*="col-"] {
    float: left;
    padding: 0 15px;}

.row::after {
    content: "";
    clear: both;
    display: table;}

#sticky {
	position: sticky;
	position: -webkit-sticky;}
	
#kopfbild{
	height:400px;
	background-image:url(../media/kopfbild.jpg);
	background-position:center top;
	background-size:cover;}

@media all and (max-width: 35em) {
  #sticky {
    position: static;
  }
}

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

.clearfix::after {
  clear: both;}

.clearfix {
  *zoom: 1;} /* Für den IE6 und IE7 */

/* NAV */
#topnav{
	text-align:center;
	margin:auto;
	display:block;
	height:40px;
	width:100%;
	width:1150px;}

#topnav ul{
	margin:0;
	padding:0;
	list-style:none;}

#topnav ul li{
	display:inline-block;}

#topnav li>ul{display:none;} /* Submenüs verstecken */

#topnav ul li:first-child{
	display:none;}
	
#topnav ul li a:first-child{
	text-align:center;}


#innercontent{
	font-family:"Barlow Semi Condensed";}

input,textarea{
	padding:2px 5px;
	font-family:"Barlow Semi Condensed";
	font-weight:300;
	font-size:1.2rem;

	text-decoration:none;}

#topnav a{
	padding:0 20px;
	font-family:"Barlow Semi Condensed";
	font-weight:300;
	font-size:1.5rem;
	line-height:37px;
	text-decoration:none;
	color:#fff;}

#topnav li:after{
	margin:0 5px;
	display:inline-block;
	color:#fff;
	font-size:2rem;
	content:"|";}

#topnav ul li.tpl-active>a{
	background-color:#F5F5F5 !important;
	width:100%;
	color:#505050 !important;}

#topnav li:last-child:after{
	content:"";}

#left li{ width:100%;display:block;}
#left a{ width:100%;display:inline-block;}

#left a.active{
	font-weight:400;}

#left a:hover{
	color:#000;
	width:100%;}

#left>ul>li{
	width:90%;
 border-bottom:1px solid #ccc;}

ul .laender{
	margin:.5rem 0 .75rem 0 !important;}

ul .laender  li.tpl-active a{
	color:#333;
	font-weight:400;}

ul .laender .tpl-active a:before{
	margin-left:-11px;
	content:"> ";}

.laender li{
	font-size:1rem;
	line-height:1.2rem !important;
	padding-left:1rem;
}

/* FONTS */
/*condensed*/
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/barlow-condensed-v1-latin-300.eot');
  src: local('Barlow Condensed Light'), local('BarlowCondensed-Light'),
       url('fonts/barlow-condensed-v1-latin-300.eot?#iefix') format('embedded-opentype'),
       url('fonts/barlow-condensed-v1-latin-300.woff2') format('woff2'),
       url('fonts/barlow-condensed-v1-latin-300.woff') format('woff'),
       url('fonts/barlow-condensed-v1-latin-300.ttf') format('truetype'),
       url('fonts/barlow-condensed-v1-latin-300.svg#BarlowCondensed') format('svg');}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: italic;
  font-weight: 300;
  src: url('fonts/barlow-condensed-v1-latin-300italic.eot');
  src: local('Barlow Condensed Light Italic'), local('BarlowCondensed-LightItalic'),
       url('fonts/barlow-condensed-v1-latin-300italic.eot?#iefix') format('embedded-opentype'),
       url('fonts/barlow-condensed-v1-latin-300italic.woff2') format('woff2'),
       url('fonts/barlow-condensed-v1-latin-300italic.woff') format('woff'),
       url('fonts/barlow-condensed-v1-latin-300italic.ttf') format('truetype'),
       url('fonts/barlow-condensed-v1-latin-300italic.svg#BarlowCondensed') format('svg');}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/barlow-condensed-v1-latin-regular.eot');
  src: local('Barlow Condensed Regular'), local('BarlowCondensed-Regular'),
       url('fonts/barlow-condensed-v1-latin-regular.eot?#iefix') format('embedded-opentype'),
       url('fonts/barlow-condensed-v1-latin-regular.woff2') format('woff2'),
       url('fonts/barlow-condensed-v1-latin-regular.woff') format('woff'),
       url('fonts/barlow-condensed-v1-latin-regular.ttf') format('truetype'),
       url('fonts/barlow-condensed-v1-latin-regular.svg#BarlowCondensed') format('svg');}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/barlow-condensed-v1-latin-italic.eot');
  src: local('Barlow Condensed Italic'), local('BarlowCondensed-Italic'),
       url('fonts/barlow-condensed-v1-latin-italic.eot?#iefix') format('embedded-opentype'),
       url('fonts/barlow-condensed-v1-latin-italic.woff2') format('woff2'),
       url('fonts/barlow-condensed-v1-latin-italic.woff') format('woff'),
       url('fonts/barlow-condensed-v1-latin-italic.ttf') format('truetype'),
       url('fonts/barlow-condensed-v1-latin-italic.svg#BarlowCondensed') format('svg');}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/barlow-condensed-v1-latin-500.eot');
  src: local('Barlow Condensed Medium'), local('BarlowCondensed-Medium'),
       url('fonts/barlow-condensed-v1-latin-500.eot?#iefix') format('embedded-opentype'),
       url('fonts/barlow-condensed-v1-latin-500.woff2') format('woff2'),
       url('fonts/barlow-condensed-v1-latin-500.woff') format('woff'),
       url('fonts/barlow-condensed-v1-latin-500.ttf') format('truetype'),
       url('fonts/barlow-condensed-v1-latin-500.svg#BarlowCondensed') format('svg');}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: italic;
  font-weight: 500;
  src: url('fonts/barlow-condensed-v1-latin-500italic.eot');
  src: local('Barlow Condensed Medium Italic'), local('BarlowCondensed-MediumItalic'),
       url('fonts/barlow-condensed-v1-latin-500italic.eot?#iefix') format('embedded-opentype'),
       url('fonts/barlow-condensed-v1-latin-500italic.woff2') format('woff2'),
       url('fonts/barlow-condensed-v1-latin-500italic.woff') format('woff'),
       url('fonts/barlow-condensed-v1-latin-500italic.ttf') format('truetype'),
       url('fonts/barlow-condensed-v1-latin-500italic.svg#BarlowCondensed') format('svg');}

/*semicondensed*/
@font-face {
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/barlow-semi-condensed-v1-latin-300.eot');
  src: local('Barlow Semi Condensed Light'), local('BarlowSemiCondensed-Light'),
       url('fonts/barlow-semi-condensed-v1-latin-300.eot?#iefix') format('embedded-opentype'),
       url('fonts/barlow-semi-condensed-v1-latin-300.woff2') format('woff2'),
       url('fonts/barlow-semi-condensed-v1-latin-300.woff') format('woff'),
       url('fonts/barlow-semi-condensed-v1-latin-300.ttf') format('truetype'),
       url('fonts/barlow-semi-condensed-v1-latin-300.svg#BarlowSemiCondensed') format('svg');}

@font-face {
  font-family: 'Barlow Semi Condensed';
  font-style: italic;
  font-weight: 300;
  src: url('fonts/barlow-semi-condensed-v1-latin-300italic.eot');
  src: local('Barlow Semi Condensed Light Italic'), local('BarlowSemiCondensed-LightItalic'),
       url('fonts/barlow-semi-condensed-v1-latin-300italic.eot?#iefix') format('embedded-opentype'),
       url('fonts/barlow-semi-condensed-v1-latin-300italic.woff2') format('woff2'),
       url('fonts/barlow-semi-condensed-v1-latin-300italic.woff') format('woff'),
       url('fonts/barlow-semi-condensed-v1-latin-300italic.ttf') format('truetype'),
       url('fonts/barlow-semi-condensed-v1-latin-300italic.svg#BarlowSemiCondensed') format('svg');}

@font-face {
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/barlow-semi-condensed-v1-latin-regular.eot');
  src: local('Barlow Semi Condensed Regular'), local('BarlowSemiCondensed-Regular'),
       url('fonts/barlow-semi-condensed-v1-latin-regular.eot?#iefix') format('embedded-opentype'),
       url('fonts/barlow-semi-condensed-v1-latin-regular.woff2') format('woff2'),
       url('fonts/barlow-semi-condensed-v1-latin-regular.woff') format('woff'),
       url('fonts/barlow-semi-condensed-v1-latin-regular.ttf') format('truetype'),
       url('fonts/barlow-semi-condensed-v1-latin-regular.svg#BarlowSemiCondensed') format('svg');}

@font-face {
  font-family: 'Barlow Semi Condensed';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/barlow-semi-condensed-v1-latin-italic.eot');
  src: local('Barlow Semi Condensed Italic'), local('BarlowSemiCondensed-Italic'),
       url('fonts/barlow-semi-condensed-v1-latin-italic.eot?#iefix') format('embedded-opentype'),
       url('fonts/barlow-semi-condensed-v1-latin-italic.woff2') format('woff2'),
       url('fonts/barlow-semi-condensed-v1-latin-italic.woff') format('woff'),
       url('fonts/barlow-semi-condensed-v1-latin-italic.ttf') format('truetype'),
       url('fonts/barlow-semi-condensed-v1-latin-italic.svg#BarlowSemiCondensed') format('svg');}

@font-face {
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/barlow-semi-condensed-v1-latin-500.eot');
  src: local('Barlow Semi Condensed Medium'), local('BarlowSemiCondensed-Medium'),
       url('fonts/barlow-semi-condensed-v1-latin-500.eot?#iefix') format('embedded-opentype'),
       url('fonts/barlow-semi-condensed-v1-latin-500.woff2') format('woff2'),
       url('fonts/barlow-semi-condensed-v1-latin-500.woff') format('woff'),
       url('fonts/barlow-semi-condensed-v1-latin-500.ttf') format('truetype'),
       url('fonts/barlow-semi-condensed-v1-latin-500.svg#BarlowSemiCondensed') format('svg');}


/* SLIDES */
.slides {
	overflow:hidden;
	padding: 0;
	width: 100%;
	height: 400px;
	display: block;
	padding:0;
	margin: 0;
	position: relative;}

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

.slides input { display: none; }

.slide-container { display: block; }

.slide {
	top: 0;
	opacity: 0;
	height: 400px;
	display: block;
	position: absolute;
	transform: scale(0);
	transition: all .7s ease-in-out;}

.slide img {
	min-width: 105%;
	height: 100%;}

.nav label {
	width: 10%;
	height: 100%;
	display: none;
	position: absolute;
  opacity: 0;
	z-index: 9;
	cursor: pointer;
	transition: opacity .2s;
	color: rgba(0,0,0,.5);
	font-size:5rem;
	text-align: center;
	line-height: 380px;
	background-color: rgba(255,255,255,.3);}

.slide:hover + .nav label { opacity: 0.5; }

.nav label:hover { opacity: 1; }

.nav .next { right: 0; }

input:checked + .slide-container  .slide {
	opacity: 1;
	transform: scale(1);
	transition: opacity 1s ease-in-out;}

input:checked + .slide-container .nav label { display: block; }

.nav-dots {
	min-width: 100%;
	bottom: 9px;
	height: 11px;
	display: block;
	display:none;
	position: absolute;
	text-align: center;}

.nav-dots .nav-dot {
	top: -5px;
	width: 11px;
	height: 11px;
	margin: 0 4px;
	position: relative;
	border-radius: 100%;
	display: inline-block;
	background-color: #505050;
	border:1px solid #fff;}

.nav-dots .nav-dot:hover {
	cursor: pointer;
	background-color: #fff;
	border:1px solid #505050;}

input#img-1:checked ~ .nav-dots label#img-dot-1,
input#img-2:checked ~ .nav-dots label#img-dot-2,
input#img-3:checked ~ .nav-dots label#img-dot-3,
input#img-4:checked ~ .nav-dots label#img-dot-4,
input#img-5:checked ~ .nav-dots label#img-dot-5,
input#img-6:checked ~ .nav-dots label#img-dot-6,
input#img-7:checked ~ .nav-dots label#img-dot-7,
input#img-8:checked ~ .nav-dots label#img-dot-8,
input#img-9:checked ~ .nav-dots label#img-dot-9,
input#img-10:checked ~ .nav-dots label#img-dot-10,
input#img-11:checked ~ .nav-dots label#img-dot-11,
input#img-12:checked ~ .nav-dots label#img-dot-12,
input#img-13:checked ~ .nav-dots label#img-dot-13,
input#img-14:checked ~ .nav-dots label#img-dot-14,
input#img-15:checked ~ .nav-dots label#img-dot-15,
input#img-16:checked ~ .nav-dots label#img-dot-16,
input#img-17:checked ~ .nav-dots label#img-dot-17,
input#img-18:checked ~ .nav-dots label#img-dot-18,
input#img-19:checked ~ .nav-dots label#img-dot-19,
input#img-20:checked ~ .nav-dots label#img-dot-20,
input#img-21:checked ~ .nav-dots label#img-dot-21,
input#img-22:checked ~ .nav-dots label#img-dot-22,
input#img-23:checked ~ .nav-dots label#img-dot-23,
input#img-24:checked ~ .nav-dots label#img-dot-24,
input#img-25:checked ~ .nav-dots label#img-dot-25,
input#img-26:checked ~ .nav-dots label#img-dot-26,
input#img-27:checked ~ .nav-dots label#img-dot-27,
input#img-28:checked ~ .nav-dots label#img-dot-28,
input#img-29:checked ~ .nav-dots label#img-dot-29,
input#img-30:checked ~ .nav-dots label#img-dot-30{
	background: #fff;
	border:1px solid #505050;}

@font-face{
	font-weight:normal;
	font-style:normal;}


/* ANFRAGE, FORMULAR */

#anfrage{
	display:block;
	padding:20px 10px;
	border:1px solid #ccc;
	background-color:#f0f0f0 !important;
	width:100%;}

/*
#anfrage input[type="email"]{ display:none !important;}
*/

#anfrage dt{
	display:inline-block;float:left;
	font-weight:400;
	width:35%;}

#anfrage dd{
	font-weight:500;
	display:inline-block;float:left;
	width:64%;}

#anfrage dd:before{display:none;}

#anfrage input[type="text"],
#anfrage input[type="email"],
#anfrage textarea{
	width:100%; }

#anfrage textarea{
	height:120px;
	overflow:auto; }

#anfrage dt,
#anfrage dd{
 margin-top:.3rem;}

#anfrage small{ 
	display:block;
	line-height:1.25rem !important;
	margin-top:.3rem;
	font-size:1rem;
	line-height:100%;}

#anfrage small:before{ content:"„"; }
#anfrage small:after{ content:"”";  }


@media screen and (min-width: 1300px) {
	footer{
			background-size:contain;}
}

@media screen and (min-width: 680px) {
	#topnav a{
		border-radius:37px 5px 37px 5px;}
}

@media screen and (max-width: 1150px) {
	#innercontent a { /*white-space:nowrap;*/}

	#topnav{
	 width:100%;}

	#topnav a{
		font-size:1.2rem;}

	#topnav ul li a{
		padding:0 10px;}

	#topnav li:after{
		color:#fff;
		font-size:1.4rem;}

	#innercontent {
    margin: 10px 20px 0 20px;}

	#left{
    padding: 10px 10px 0 10px;}

	#left h3{
		margin: 10px 0 0px 0;
    width:95%;}
	#produkte .col-4{width:50%;}
}

@media screen and (max-width: 850px) {
	#innercontent {
	   margin: 10px 10px 0 10px;}

	#left li a{
		font-size:1.0rem;}

	#left li a{
		line-height:125%;}

	#topnav a{
		font-size:1rem;}

	#topnav ul li a{
		padding:2px 10px;}

	#topnav li:after{
		color:#fff;
		font-size:1.2rem;}
}

/* ab hier Menü4Mobil */

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

	#content .col-8{
		width:95%;}

	#left{
	 display:none;}

	#topnav{ height:40px;overflow:hidden;}

	#topnav li>ul{display:block;}
	#topnav li>ul li{display:block;}

	#topnav li a{
		font-size:1rem;}

	#topnav li:first-child{
		width:100%;
		display:block !important;}

	#topnav li a{
		width:100%;
		display:inline-block;
		cursor:pointer;
		font-weight:normal;
		font-size:1.5rem;}

	#topnav>ul>li:first-child a{
		cursor:pointer;
		padding-top:0;
		font-weight:normal;
		font-size:3rem;}

	#topnav li{
		width:100%;
		display:block;}

	#topnav li:after{
		display:none;}

	#topnav li>ul li a{
		line-height:1.7rem;
		font-size:1rem;}

	#topnav>ul>li a{
		border-bottom:1px solid #505050;}

	#topnav>ul>li>ul>li a,
	a.hassub{
    background-color: #505050;
		border-bottom:1px dashed #606060 !important;}
	
	#topnav>ul>li>ul>li:last-child a{
			border-bottom:1px solid #606060 !important;}

	#topnav li a:hover{
		color:#333;
		background-color:#F5F5F5;}

	#topnav ul li.tpl-active>a{
		color:#333 !important;
		background-color:#F5F5F5 !important;}
}

@media screen and (max-width: 480px) {
	#produkte .col-4{width:100%;}
}


#effekt {
    position: relative;
    cursor: none;}

#lupe {
    width: 42rem;
    height: 35rem;
    left: -40px;
    top: -45px;
    position: absolute;}

#lupen {
    width: 19.5rem;
    height:19.5rem;
    border-radius: 50%;
    box-shadow: 3px 3px 5px #111;
    background: no-repeat;
    position: absolute;
    display: none;}

@media (max-width:830px){
	#effekt{
		border:none;
		box-shadow:none}
}

#imagelightbox
{
    position: fixed;
    z-index: 9999;
    -ms-touch-action: none;
    touch-action: none;
}

/* ARROWS */

	.imagelightbox-arrow
		{
 cursor:pointer;
			width: 3.75em; /* 60 */
			height: 7.5em; /* 120 */
			background-color: #444;
			background-color: rgba( 0, 0, 0, .5 );
			vertical-align: middle;
			display: none;
			position: fixed;
			z-index: 10001;
			top: 50%;
			margin-top: -3.75em; /* 60 */
		}
		.imagelightbox-arrow:hover,
		.imagelightbox-arrow:focus	{ background-color: rgba( 0, 0, 0, .75 ); }
		.imagelightbox-arrow:active { background-color: #111; }

			.imagelightbox-arrow-left	{ left: 2.5em; /* 40 */ }
			.imagelightbox-arrow-right	{ right: 2.5em; /* 40 */ }

			.imagelightbox-arrow:before
			{
				width: 0;
				height: 0;
				border: 1em solid transparent;
				content: '';
				display: inline-block;
				margin-bottom: -0.125em; /* 2 */
			}
				.imagelightbox-arrow-left:before
				{
					border-left: none;
					border-right-color: #fff;
					margin-left: -0.313em; /* 5 */
				}
				.imagelightbox-arrow-right:before
				{
					border-right: none;
					border-left-color: #fff;
					margin-right: -0.313em; /* 5 */
				}

#imagelightbox-overlay
		{
			background-color: #fff;
			background-color: rgba( 255, 255, 255, .9 );
			position: fixed;
			z-index: 9998;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
		}


		/* "CLOSE" BUTTON */

		#imagelightbox-close
		{
			width: 2.5em; /* 40 */
			height: 2.5em; /* 40 */
			text-align: left;
			background-color: #666;
			border-radius: 50%;
			position: fixed;
			z-index: 10002;
			top: 2.5em; /* 40 */
			right: 2.5em; /* 40 */

			-webkit-transition: color .3s ease;
			transition: color .3s ease;
		}
		#imagelightbox-close:hover,
		#imagelightbox-close:focus { background-color: #111; }

			#imagelightbox-close:before,
			#imagelightbox-close:after
			{
				width: 2px;
				background-color: #fff;
				content: '';
				position: absolute;
				top: 20%;
				bottom: 20%;
				left: 50%;
				margin-left: -1px;
			}
			#imagelightbox-close:before
			{
				-webkit-transform: rotate( 45deg );
				-ms-transform: rotate( 45deg );
				transform: rotate( 45deg );
			}
			#imagelightbox-close:after
			{
				-webkit-transform: rotate( -45deg );
				-ms-transform: rotate( -45deg );
				transform: rotate( -45deg );
			}

#imagelightbox-loading,
		#imagelightbox-overlay,
		#imagelightbox-close,
		#imagelightbox-caption,
		#imagelightbox-nav,
		.imagelightbox-arrow
		{
			-webkit-animation: fade-in .25s linear;
			animation: fade-in .25s linear;
		}
			@-webkit-keyframes fade-in
			{
				from	{ opacity: 0; }
				to		{ opacity: 1; }
			}
			@keyframes fade-in
			{
				from	{ opacity: 0; }
				to		{ opacity: 1; }
			}

		@media only screen and (max-width: 41.250em) /* 660 */
		{
			#container
			{
				width: 100%;
			}
			#imagelightbox-close
			{
				top: 1.25em; /* 20 */
				right: 1.25em; /* 20 */
			}
			#imagelightbox-nav
			{
				bottom: 1.25em; /* 20 */
			}

			.imagelightbox-arrow
			{
				width: 2.5em; /* 40 */
				height: 3.75em; /* 60 */
				margin-top: -2.75em; /* 30 */
			}
			.imagelightbox-arrow-left	{ left: 1.25em; /* 20 */ }
			.imagelightbox-arrow-right	{ right: 1.25em; /* 20 */ }
		}

		@media only screen and (max-width: 20em) /* 320 */
		{
			.imagelightbox-arrow-left	{ left: 0; }
			.imagelightbox-arrow-right	{ right: 0; }
		}


		#imagelightbox-caption
		{
			text-align: center;
			color: #fff;
			background-color: #666;
			position: fixed;
			z-index: 10001;
			left: 0;
			right: 0;
			bottom: 0;
			padding: 0.625em; /* 10 */
			font-family:arial;
		}