/* W3.CSS 4.06 Januar 2018 by matrixx */

html{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-ms-text-size-adjust:100%;
	-webkit-text-size-adjust:100%;
	overflow-x:hidden;
}
*,*:before,*:after{
	-webkit-box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-sizing: inherit;
}

html,body{
	font-family:Helvetica,Verdana,sans-serif; 
	font-size:0.95rem; 
	line-height:1.5; 
	font-family: Helvetica, "Roboto", sans-serif; 
	width: 100%;
	min-height:100%;
	height:100%; 
    width: 100%;
    margin: 0;
    padding: 0;
}




/**************** Tag & Class Styles ****************/

article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}
audio,canvas,progress,video{display:inline-block}
progress{vertical-align:baseline}
audio:not([controls]){display:none; height:0}
[hidden],template{display:none}
a{background-color:transparent; -webkit-text-decoration-skip:objects;text-decoration:none;}
a:active,a:hover{outline-width:0}
abbr[title]{border-bottom:none; text-decoration:underline; text-decoration:underline dotted}
dfn{font-style:italic}
mark{background:#ff0; color:#000}
small{font-size:80%}
sub,sup{font-size:75%; line-height:0; position:relative; vertical-align:baseline}
sub{bottom:-0.25em}
sup{top:-0.5em}
figure{margin:1em 40px}
img{border-style:none}
svg:not(:root){overflow:hidden}
code,kbd,pre,samp{display:inline;font-family:monospace,monospace; font-size:1em}
hr{box-sizing:content-box; height:0; overflow:visible}
button,input,select,textarea{font:inherit; margin:0}optgroup{font-weight:bold}
button,input{overflow:visible}
button,select{text-transform:none}
button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:button}
button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner{border-style:none; padding:0}
button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring{outline:1px dotted ButtonText}
fieldset{border:1px solid #c0c0c0; margin:0 2px; padding:.35em .625em .75em}
legend{color:inherit; display:table; max-width:100%; padding:0; white-space:normal}
textarea{overflow:auto}
[type=checkbox],[type=radio]{padding:0}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
[type=search]{-webkit-appearance:textfield; outline-offset:-2px}
[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-input-placeholder{color:inherit; opacity:0.54}
::-webkit-file-upload-button{-webkit-appearance:button; font:inherit}

.hidden{display: none;}
.wide{letter-spacing:4px}
.image{max-width:100%; height:auto}
.table,.table-all{border-collapse:collapse; border-spacing:0; width:100%; display:table}
.table-all{border:1px solid #ccc}
.bordered tr,.table-all tr{border-bottom:1px solid #ddd}
.striped tbody tr:nth-child(even){background-color:#f1f1f1}
.table-all tr:nth-child(odd){background-color:#fff}
.table-all tr:nth-child(even){background-color:#f1f1f1}
.hoverable tbody tr:hover,.ul.hoverable li:hover{background-color:transparent}
.centered tr th,.centered tr td{text-align:center}
.table td,.table th,.table-all td,.table-all th{padding:8px 8px; display:table-cell; text-align:left; vertical-align:top}
.table th:first-child,.table td:first-child,.table-all th:first-child,.table-all td:first-child{padding-left:16px}

.disabled,.btn:disabled,.button:disabled{cursor:not-allowed; opacity:0.3}
.disabled *,:disabled *{pointer-events:none}
.btn.disabled:hover,.btn:disabled:hover{box-shadow:none}
.badge,.tag{background-color:#000; color:#fff; display:inline-block; padding-left:8px; padding-right:8px; text-align:center}
.badge{border-radius:50%}

.tooltip,.display-container{position:relative}
.tooltip .text{display:none}
.tooltip:hover .text{display:inline-block}
.ripple:active{opacity:0.5}
.ripple{transition:opacity 0s}
.input{padding:8px; display:block; border:none; border-bottom:1px solid #ccc; width:100%}
.select{padding:9px 0; width:100%; border:none; border-bottom:1px solid #ccc}
.dropdown-click,.dropdown-hover{position:relative; display:inline-block; cursor:pointer}

.dropdown-hover:first-child,.dropdown-click:hover{background-color:#ccc; color:#000}
.dropdown-hover:hover > .button:first-child,.dropdown-click:hover > .button:first-child{background-color:#ccc; color:#000}
.dropdown-content{cursor:auto; color:#000; background-color:#fff; display:none; position:absolute; min-width:160px; margin:0; padding:0}
.check,.radio{width:24px; height:24px; position:relative; top:6px}

.center .bar{display:inline-block; width:auto}
.bar .bar-item{padding:8px 14px; float:left; width:auto; border:none; outline:none; display:block}
.bar .dropdown-hover,.bar .dropdown-click{position:static; float:left}
.bar .button{white-space:normal}
.bar-block .bar-item{width:100%; display:block; padding:8px 16px; text-align:left; border:none; outline:none; white-space:normal; float:none}
.bar-block.center .bar-item{text-align:center}
.block{display:block; width:100%}
.responsive{display:block; overflow-x:auto}
.container:after,.container:before,.panel:after,.panel:before,.row:after,.row:before,.row-padding:after,.row-padding:before,.cell-row:before,.cell-row:after,.clear:after,.clear:before,.bar:before,.bar:after{content:""; display:table; clear:both}

.rest{overflow:hidden}
.cell-row{display:table; width:100%}

.cell-top{vertical-align:top}
.cell-middle{vertical-align:middle}
.cell-bottom{vertical-align:bottom}
.hide{display:none!important}
.show-block,.show{display:block!important}
.show-inline-block{display:inline-block!important}

.display-topleft{position:absolute; left:0; top:0}.display-topright{position:absolute; right:0; top:0}
.display-bottomleft{position:absolute; left:0; bottom:0}.display-bottomright{position:absolute; right:0; bottom:0}
.display-middle{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%)}
.display-left{position:absolute; top:50%; left:0%; transform:translate(0%,-50%); -ms-transform:translate(-0%,-50%)}
.display-right{position:absolute; top:50%; right:0%; transform:translate(0%,-50%); -ms-transform:translate(0%,-50%)}
.display-topmiddle{position:absolute; left:50%; top:0; transform:translate(-50%,0%); -ms-transform:translate(-50%,0%)}
.display-bottommiddle{position:absolute; left:50%; bottom:0; transform:translate(-50%,0%); -ms-transform:translate(-50%,0%)}
.display-container:hover .display-hover{display:block}
.display-container:hover span.display-hover{display:inline-block}
.display-hover{display:none}
.display-position{position:absolute}
.circle{border-radius:50%}
.round-small{border-radius:2px}
.round,.round-medium{border-radius:4px}
.round-large{border-radius:8px}
.round-xlarge{border-radius:16px}
.round-xxlarge{border-radius:32px}
.row-padding,.row-padding>.half,.row-padding>.third,.row-padding>.twothird,.row-padding>.threequarter,.row-padding>.quarter,.row-padding>.col{padding:0 8px}


.code,.codespan{font-family:Consolas,"courier new"; font-size:16px}
.code{width:auto; background-color:#fff; padding:8px 12px; border-left:4px solid #4CAF50; word-wrap:break-word}
.codespan{color:crimson; background-color:#f1f1f1; padding-left:4px; padding-right:4px; font-size:110%}
.card,.card-2{box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)}
.card-4,.hover-shadow:hover{box-shadow:0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19)}
.spin{animation:spin 2s infinite linear}


.animate-input{transition:width 0.4s ease-in-out}
.animate-input:focus{width:100%!important}
.opacity,.hover-opacity:hover{opacity:0.60}
.opacity-off,.hover-opacity-off:hover{opacity:1}
.opacity-max{opacity:0.25}
.opacity-min{opacity:0.75}
.greyscale-max,.grayscale-max,.hover-greyscale:hover,.hover-grayscale:hover{filter:grayscale(100%)}
.greyscale,.grayscale{filter:grayscale(75%)}
.greyscale-min,.grayscale-min{filter:grayscale(50%)}
.sepia{filter:sepia(75%)}
.sepia-max,.hover-sepia:hover{filter:sepia(100%)}
.sepia-min{filter:sepia(50%)}
.tiny{font-size:10px!important}
.small{font-size:12px!important}
.medium{font-size:15px!important}
.large{font-size:18px!important}
.xlarge{font-size:24px!important}
.xxlarge{font-size:36px!important}
.xxxlarge{font-size:48px!important}
.jumbo{font-size:64px!important}


.bottombar{border-bottom:6px solid #ccc!important}
.leftbar{border-left:6px solid #ccc!important}
.rightbar{border-right:6px solid #ccc!important}
.section,.code{margin-top:16px!important; margin-bottom:16px!important}
.margin{margin:16px!important}
.margin-top{margin-top:16px!important}
.margin-bottom{margin-bottom:16px!important}
.margin-left{margin-left:16px!important}
.margin-right{margin-right:16px!important}
.padding-small{padding:4px 8px!important}
.padding{padding:8px 16px!important}
.padding-large{padding:12px 24px!important}
.padding-16{padding-top:16px!important; padding-bottom:16px!important}
.padding-24{padding-top:24px!important; padding-bottom:24px!important}
.padding-32{padding-top:32px!important; padding-bottom:32px!important}
.padding-48{padding-top:48px!important; padding-bottom:48px!important}
.padding-64{padding-top:64px!important; padding-bottom:64px!important}

.button:hover{color:#000!important; background-color:transparent!important}
.transparent,.hover-none:hover{background-color:transparent!important}
.hover-none:hover{box-shadow:none!important}


p {width:100%;}

h1{font-size:2.4em;}
h2{font-size:2em;}
h3{font-size:1.4em;}
h4{font-size:1.3em;}
h5{font-size:1.2em;}
h6{font-size:1.1em;}
h1,h2,h3,h4,h5,h6{font-family:"Segoe UI",Arial,sans-serif; font-weight:400; margin:0; padding:0.3em 0.3em; display: block; width:100%; color:#555;margin-bottom:0.5em!important;}

h1.txt_title, h2.txt_title, h3.txt_title, h4.txt_title, h5.txt_title, h6.txt_title {background: rgba(255, 255, 255, 0.35); margin:0; border-bottom:1px solid rgba(255, 255, 255, 0.35);}

img {
	max-width:100%;
	height:auto;
	width:auto\9; /* IE8 */
	max-width:100%;
	height:auto
}

a{color:inherit}

/* PDF-Links */
a[href$=".pdf"]{
	background-image: url(../icon-pdf.png);
	background-position: center left;
	background-repeat: no-repeat;
	height: 22px;
	display: inline-block;
	padding:0 0 0 27px;
}
/* tech-Links */
a.tech{
	background-image: url(../icon-tech.png);
	background-position: center left;
	background-repeat: no-repeat;
	height: 22px;
	display: inline-block;
	padding:0 0 0 27px;
}

.ul{list-style-type:none; padding:0; margin:0}
.ul li{padding:8px 5px; border-bottom:1px solid #ddd}
.ul li:last-child{border-bottom:none}
ul li {padding:0;}

hr{border-top:1px solid rgba(255, 255, 255, 0.3)!important; margin:0; clear:both; display:box; flex-grow:1; color: rgba(255, 255, 255, 0.3)}

em, figcaption, .legend {display:block; font-family: Arial, Gadget, sans-serif; font-size: 0.7em;}


.left {text-align:left!important; float:left!important;}
.align-left, .left-align {text-align:left!important;}
.right {text-align:right!important; float:right!important; justify-content:flex-end;}
.align-right, .right-align {text-align:right!important;}
.center, .align-center, .center-align {text-align:center!important; margin:0 auto!important; justify-content:space-around;}

.top {vertical-align:top; margin-top:0!important; top:0; align-items:baseline;}
.bottom {vertical-align:bottom; margin-top:auto!important; bottom:0; margin-bottom:0; align-items:baseline;}
.middle {margin:0 auto!important; align-items:baseline; align-content:center!important; height:100%; align-self:baseline;}

.align-center > figure {display: inline-block;}
.justify, .align-justify, .justify-align {text-align:justify!important}

.inline {display:inline-block!important;}
.block {display:block!important;}
.block .cell {padding: 0 0.5em 0 0.5em!important;}

.magnific-popup-gallery {
	display: flex;
	flex-wrap: wrap;
	/*flex-direction: row;
	align-items: flex-start!important;
	justify-content: space-between!important;*/
}

.magnific-popup-gallery p {padding:0.5em 0.3em 0 0.2em; margin:0 auto;}

.magnific-popup-gallery ul{width:100%; list-style-type:none; padding:0!important; margin:10px 0 0 0!important;}

ul.tablelist li{font-size:0.85em; width:100%; margin:0!important;padding:0.4em 0.25em!important; border-bottom:1px solid rgba(255, 255, 255, 0.35); background: rgba(90, 167, 215, 0.2); opacity:0.85; font-weight:600; text-align:left;}
ul.tablelist li:hover {opacity:0.7;}


.cell {
	justify-content: flex-start!important;
	/*justify-content: space-between!important;*/
	margin:0 0.45em 1em 0.5em!important;
	/*display:inline-block!important;*/
}

.cell img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	
}
.cell img:hover {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
.cell img.border:hover {
	border:3px solid #f0de6e;
	z-index:101;
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
.cell img.border {border:1px solid #eee;}






/**************** Sidebar ****************/

/*.sidebar{height:100%; width:200px; background-color:#fff; position:fixed!important; overflow:auto; z-index:3; width:350px; top:200px; bottom:0; height:inherit;}*/
nav {position:fixed!important; z-index:30;}

.sidebar{height:100%; width:200px; overflow:auto; top:250px; bottom:0;}

.sidebar {
	padding: 0;
	margin-bottom: 1em;
	font-family: Helvetica,'Trebuchet MS', 'Lucida Grande', Verdana, Arial, sans-serif;
	font-size:1.2em;
	color: #406bb2;
}

.sidebar ul {
	list-style: none;
	margin: 0;
	padding: 0;
	border: none;
}
	
.sidebar li {
	margin: 0 0 -1px 0;
	list-style: none;
	list-style-image: none;
}

.sidebar li a {
	display: block;
	padding: 0.45em;
	color: #406bb2;
	text-decoration: none;
	width: 100%;
	height:auto;
	line-height:1em;
}
.sidebar li li a {
	padding-left: 1.5em;
	font-size:0.95em;
	line-height:1.1em;
	
}
.sidebar li li li a {
	padding-left: 2.5em;
	font-size:0.8em;
	line-height:0.8em;
}
.sidebar li li li li a {
	padding-left: 4em;
	font-size:0.85em;
	line-height:0.8em;
}

.sidebar li a.rex-active, .sidebar li a.rex-current, .sidebar li a:hover {
	/*border-right: 1px solid #913c42;*/
	color: #913c42!important;
}

.sidebar a.arrow:after{
	content: "";
	width: 0;
	height: 0;
	position: absolute;
	margin-top:-1px;
	right: 0;
	border: .5rem solid transparent;
	border-right: 0;  
	border-left-color: #913c42;
	-moz-transform: scale(0.9999);
}



/**************** Wrapper ****************/

#wrapper {
	position:relative;
	margin:0 auto;
	min-height:100%;
}

#wrapper, #head_nav, #head_main {width:82%;}
#head_inside, .topbar, .topbar2, #container {margin-left:200px; width:68%;}


/**************** Header ****************/

#head_nav, #head_main{
	position: fixed;
	margin:0 auto;
	
}
#head_nav{
	top:100px;
	min-width:300px;
	height:150px;
	z-index:1;
}

#head_main{
	z-index:5;
}
#head_main a:hover {
	opacity: 0.5;
}
.logo, .logo_it{
	position:absolute;
	top:115px;
	left:5px;
	width:186px;
	height:74px;
	background: url(../logo.gif) no-repeat;
}
.logo_it{
	background: url(../logo_it.gif) no-repeat;
}

#head_main a.active{
	opacity: 0.2;
}

#head_inside {
	position:relative;
	top:0px;
	height: 100px;
	background: white;
	color: #000;
}

.head_title {
	position:absolute;
	
    left: 50%;
    transform: translate(-50%, 0);
	font-size:4.5em;
	font-weight:bold;
	color:#59A7D7;
	bottom:-0.2em;

}
.head_title a {
	text-decoration: none;
}

.head_lang {
	position:absolute;
	top:0px;
	right:0;
	padding:3px;
}

.topbar {
	position:relative;
	top:0px;
	height: 15px;
	z-index:10;
}
.topbar2 {
	position:absolute;
	top:110px;
	height: 50px;
}



/**************** Container & Content ****************/

#container{
	position:relative;
	padding: 185px 0 120px 0;
	min-height:100vh;
	z-index:3;
    background:#f0de6e;
	
	/*background: url(../bg_screen.png);
    background-repeat: no-repeat;
    background-size: cover;*/
}

#content div {padding:0; margin:0}
/*#content > div > div {padding:0 0 0.6em 0; margin:0}*/
#content p {padding:0.6em 0.6em 0 0.6em; margin:0}
#content a {color:#3d567f; font-style:italic;}
#content ul {padding:0.6em 0; margin:0 0.5em;}
#content ul li {padding:0;margin:0 2em; width:100%;}

.cell a:hover {color: #913c42;}
.cell.border, .cell.border, .cell p.border img {border:1px solid rgba(201, 226, 241, 0.3);}
.cell .bottom {margin-top:auto!important; bottom:0; margin-bottom:0;}
.cell.hover:hover, .cell .hover:hover {background-color: rgba(255, 255, 255, 0.3);}


#content {
	width: 98%;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;

	justify-content: flex-start;
	margin:0 auto;
	padding:0;
}


#content > .cell:not(.magnific-popup-gallery) {
	display: flex;
	flex-direction:column;
	margin:0;
	padding:0;
}





/**************** Column&Raw Elements ****************/

.grid-05 {width:calc(4.99999%  - 1em);}
.grid-10 {width:calc(9.99999%  - 1em);}
.grid-16 {width:calc(16.66666% - 1em);}
.grid-20 {width:calc(19.99999% - 1em);}
.grid-25 {width:calc(24.99999% - 1em);}
.grid-33 {width:calc(33.33333% - 1em);}
.grid-50 {width:calc(49.99999% - 1em);}
.grid-66 {width:calc(66.66666% - 1em);}
.grid-75 {width:calc(74.99999% - 1em);}
.grid-80 {width:calc(79.99999% - 1em);}
.grid-83 {width:calc(83.33333% - 1em);}
.grid-90 {width:calc(89.99999% - 1em);}
.grid-95 {width:calc(94.99999% - 1em);}
.grid-100{width:calc(99.99999% - 0);}

.grid-100 .cell, .grid-80 .cell, .grid-75 .cell, .grid-66 .cell, .grid-50 .cell, .grid-33 .cell, .grid-25 .cell, .grid-20 .cell, .grid-10 .cell {display:flex; justify-content:flex-start; flex-direction: column; margin:0.15em; padding:0.1em 0;}
.grid-100 .grid-100 {margin:0; padding:0.1em 0.5em;}


/**** other Tag Styles ****/









/**************** Footer ****************/

#footer {
	position:absolute;
	left:0;
	bottom: 0;
	height:80px;
	display: flex;
	align-items: flex-end;
	width:100%;
}
#footer .bottom {
	font-size:0.9em;
	padding:0 0 5px 10px!important;
}




/**************** Keyframes ****************/



@keyframes spin{
	0%{transform:rotate(0deg)}
	100%{transform:rotate(359deg)}
}
.animate-fading{animation:fading 10s infinite}
@keyframes fading{
	0%{opacity:0}
	50%{opacity:1}
	100%{opacity:0}
}
.animate-opacity{animation:opac 0.8s}
@keyframes opac{
	from{opacity:0} to{opacity:1}
}
.animate-top{position:relative; animation:animatetop 0.4s}
@keyframes animatetop{
	from{top:-300px; opacity:0} to{top:0; opacity:1}
}
.animate-left{position:relative; animation:animateleft 0.3s}
@keyframes animateleft{
	from{left:-300px; opacity:0} to{left:130px; opacity:1}
}
.animate-right{position:relative; animation:animateright 0.4s}
@keyframes animateright{
	from{right:-300px; opacity:0} to{right:0; opacity:1}
}
.animate-bottom{position:relative; animation:animatebottom 0.4s}
@keyframes animatebottom{
	from{bottom:-300px; opacity:0} to{bottom:0; opacity:1}
}
.animate-zoom {animation:animatezoom 0.6s}
@keyframes animatezoom{
	from{transform:scale(0)} to{transform:scale(1)}
}




/**************** Media Scales ****************/

@media (max-width:768px){
	
	#wrapper, #head_nav, #container, #footer{width:100%;}
	#head_nav{z-index:5; height:80px; top:0px;}
	#head_main #head_inside,  #head_main .topbar, .topbar2 {display:none;}
	#head_main .logo,  #head_main .radon {top:3px; height:74px;}
	
	.sidebar.collapse{display:none}
	.sidebar{height:100%; width:calc(50% + 40px); background-color:#fff; top:80px; font-size:1.4em;}
	.sidebar>ul{margin-top:80px;}
	
	#container, #footer{margin-left:0!important; margin-right:0!important}
	#container {padding-top: 90px;}

	#content {display: block;}
	.grid-05{width:100%;}
	.grid-10{width:100%;}
	.grid-16{width:100%;}
	.grid-20{width:100%;}
	.grid-25{width:100%;}
	.grid-33{width:100%;}
	.grid-50{width:100%;}
	.grid-66{width:100%;}
	.grid-75{width:100%;}
	.grid-80{width:100%;}
	.grid-83{width:100%;}
	.grid-90{width:100%;}
	.grid-95{width:100%;}
	.grid-100{width:100%;}
	
	.animate-left{position:relative; animation:animateleft 0.5s}
	
	@keyframes animateleft{
		from{left:-300px; opacity:0} to{left:0px; opacity:1}
	}
}


@media (min-width:768px){
	.hide-large{display:none!important}
	.sidebar.collapse{display:block!important}
}


@media (max-width:768px){
	#content {font-size:1em;}
	h1{font-size:2.6em}
	h2{font-size:2em}
	h3{font-size:1.8em}
	h4{font-size:1.4em}
	h5{font-size:1.2em}
	h6{font-size:1.1em}
}
@media (min-width:768px){
	#content {font-size:0.9em;}
	h1{font-size:1.4em}
	h2{font-size:1.2em}
	h3{font-size:1.1em}
	h4{font-size:1em}
}
@media (min-width:1080px){
	#content {font-size:1em;}
	h1{font-size:1.6em}
	h2{font-size:1.2em}
	h3{font-size:1.1em}
	h4{font-size:1em}
}
@media (min-width:1480px){
	#content {font-size:1.15em;}
	h1{font-size:2em}
	h2{font-size:1.4em}
	h3{font-size:1.2em}
	h4{font-size:1.1em}
}