@font-face {
    font-family: 'yantramanav';
	src: url('font/yantramanav-regular-webfont.woff');
	font-display: block;
	font-weight: 400;
}
@font-face {
    font-family: 'yantramanav';
	src: url('font/yantramanav-light-webfont.woff');
	font-weight: 300;
	font-display: block;
}
@font-face {
    font-family: 'yantramanav';
	src: url('font/yantramanav-thin-webfont.woff');
	font-weight: 100;
	font-display: block;
}


* {
	margin: 0;
	padding: 0;
	}
html {overflow-y: scroll; scrollbar-color: #333 #111;}
body {
	background-color: #000;
	font: 300 1em/140% yantramanav;
	color: #bbb;
	-webkit-text-size-adjust: none;
	}
a {color: #fff; text-decoration:none;outline: 0 none;  white-space: nowrap; transition: color 0.5s ease-in-out 0s ;}
a:hover {color: #666; transition: color 0.5s ease-in-out 0s ;}
.box-right a {color: #fff;text-decoration:none;outline: 0 none;  white-space: nowrap;position: relative; font-weight:300;}
.box-right  a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: 0;
  left: 0;
  background-color: #fff;
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0.3s;
}
.box-right a:hover:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

.content h1 {font-size: 3.5rem; font-weight: 300; margin: 0 0 10px 0; line-height:100%; 
	background-image: -webkit-linear-gradient(92deg, #f35626, #feab3a);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	-webkit-animation: hue 20s infinite linear;
	}
@-webkit-keyframes hue {
  from {    -webkit-filter: hue-rotate(0deg);  }
  to {    -webkit-filter: hue-rotate(-360deg);  }
}

h2 {font: 300 1em/140% yantramanav; margin-bottom: 0.5em;}
p {margin-bottom: 0.5em;}
.wrapper {width: 100%;}
.header {margin: 20px auto 0px auto; text-align:center; position:relative; z-index:100;}

.logo {display: inline; font-weight: 100 !important; font-size: 4rem; color: #ddd; line-height:100%;}

.navigation, .navigation h1 {line-height:180%; vertical-align:bottom; letter-spacing:1px;}
.navigation h1 {font: 300 1em/140% yantramanav;}
.navigation a{
	color: #fff;
	padding: 0 1em;
	font-size:1.3em;
	white-space: nowrap;
	font-weight: 300;
	text-transform: uppercase;
}
.navigation a:hover {color: #666;}
.navigation a.select {color: #aaa;}

.footer {position: relative; top: 0px; margin: 10px auto 120px auto; text-align:center; text-transform: uppercase;}
.footer a {font-size: 1em;color:#555;}
.footer a:hover {color:#999;}

.slider .slider-text {
	position:absolute;
	bottom: 0; right: 0; left: 0; 
	margin: 0 auto -30px auto;
	width: 80%; height: 120px; 
	padding: 5px;
    text-align: center;
	font-size: 0.8em; 
	line-height: 120%;
	font-weight: 300;
	color: #bbb;
	}
	
.content {
	margin: 30px auto 0px auto; 
	max-width:1100px;
	font-size:1.5em;
	font-weight: 300;
	line-height:140%;
	padding: 0 20px;
	}
.portrait {
	width:250px;
	height: 250px;
	border-radius: 125px;
	margin: 0 0 10px 0;
	}
.box-portrait, .box-claim {	height: 300px;	display: flex;  align-items: center; }
.box-portrait {justify-content: flex-end;}
.box-left {
	float: left;
	width: 48%;
	padding-right: 2%;
	}
.box-right {
	float: left;
	width: 48%;
	padding-left: 2%;
	margin-top: -5px;
	}
.box-row1 {margin-bottom: 20px; height:auto; }
.box-row2 {margin-bottom:50px; }
.clearfix:after {
  content: "";
  display: table;
  clear: both;
}
.data {
	unicode-bidi:bidi-override; 
	direction: rtl;
	text-align:left;
	}
.disclaimer {
	font: 400 0.66em/120% yantramanav;
	color: #555;
	text-align:justify;
	-moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto; 
	}
	
	 /*############################################### SLIDER #####################################
	        /*jssor slider loading skin spin css*/
        .jssorl-009-spin img {
            animation-name: jssorl-009-spin;
            animation-duration: 1.6s;
            animation-iteration-count: infinite;
            animation-timing-function: linear;
        }

        @keyframes jssorl-009-spin {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
        
        /*jssor slider bullet skin 032 css*/
        .jssorb032 {position:absolute; margin-right: 30px;}
        .jssorb032 .i {position:absolute;cursor:pointer;}
        .jssorb032 .i .b {fill:#333;fill-opacity:0.7;stroke:#000;stroke-width:1200;stroke-miterlimit:10;stroke-opacity:0.25;}
        .jssorb032 .i:hover .b {fill:#000;fill-opacity:.6;stroke:#fff;stroke-opacity:.8;}
        .jssorb032 .iav .b {fill:#000;fill-opacity:1;stroke:#fff;stroke-opacity:.3;}
        .jssorb032 .i.idn {opacity:.3;}
        
        /*jssor slider arrow skin 051 css*/
        .jssora051 {display:block;position:absolute;cursor:pointer;}
        .jssora051 .a {fill:none;stroke:#999;stroke-width:200;stroke-miterlimit:10;}
        .jssora051:hover {opacity:.8;}
        .jssora051.jssora051dn {opacity:.5;}
        .jssora051.jssora051ds {opacity:.3;pointer-events:none;}

	
.slider {margin-top: 0px !important;}
.mobil {display:none;}

	 /*############################################### MOBIL ##################################### */


@media screen and (max-width: 1200px) { 
	body {font-size: 80% !important;}
	.slider .slider-text { font-size: 140% !important;}
	.portrait {	width:200px;	height: 200px;	border-radius: 100px;	}
	.slider {margin-top: 20px !important;}
	.jssorb032 {margin-top: 30px;}
	.box-portrait, .box-claim {	height: 240px;	}
	.logo {font-size: 3rem;}

	}
@media screen and (max-width: 768px) { 
	body {font-size: 70% !important; } 
	.slider {margin-top: 30px !important;}
	.content h1 {font-size: 1.8em;}
	.logo {font-size: 2.2rem;}
	.slider .slider-text { font-size: 250% !important;}
	.content {margin-top: 20px; font-size: 200% !important;}
	.portrait {	width:160px;	height: 160px;	border-radius: 80px;	margin: 0 0 20px 0;	}
	.jssorb032 {display:none;}
	.box-portrait, .box-claim {	height: 180px;	}
	}
@media screen and (max-width: 660px) { 
	body {font-size: 70% !important; } 
	.slider {display:none;}
	.mobil {display:block; margin: -15px 20px 20px 20px;}
	.mobil div {margin-top: 30px;}
	.mobil .slider-text { font-size: 170%; line-height:1.2; margin: 10px 0 100px 0; -moz-hyphens: auto;
   -o-hyphens: auto;   -webkit-hyphens: auto;   -ms-hyphens: auto;   hyphens: auto; word-wrap: break-word; z-index:10; position: relative;}
   a {white-space: normal; -moz-hyphens: none; -o-hyphens: none; -webkit-hyphens: none; -ms-hyphens: none; hyphens: none;}
  /*  .mobil img {z-index:1; position: relative;  -webkit-filter: brightness(0.8) sepia(1) saturate(0.4) hue-rotate(160deg););
  }
   .mobil img:hover  {filter: sepia(0) brightness(1) saturate(1.1); -webkit-filter: sepia(0) brightness(1) saturate(1.1); transition: all 0.1s ease-in-out 0s;} */
	.box-left {float:none; width: 100%;text-align:center;padding-right: 0; }
	.box-right {float:none; width: 100%;padding-left: 0;}
	.box-row2 .box-left {display:table-footer-group;}
	.box-row2 .box-right {display:table-header-group;}
	.portrait {	width:200px;	height: 200px;	border-radius: 100px;}
	.box-portrait {justify-content:center; }
	.box-portrait, .box-claim {	height: auto;}
	.box-claim {text-align:center; justify-content:center; }
	.disclaimer {margin-top: 20px;}
	.mobil img{max-width: 100%; height:auto; margin: 0 auto; border-radius: 3px;}
	}
@media screen and (max-width: 350px) {
	.navigation a {padding: 0 0.4rem;}
	}