@charset "utf-8";
/* LESS Document */

@font-face {
    font-family: myfont1;
    src: url("OpenSans-Regular.ttf");
    font-display: swap;
}

@font-face {
    font-family: myfont2;
    src: url("OpenSans-Light.ttf");
    font-display: swap;
}


body{
        color:#666666;
        margin:0;
        font-family:myfont1, verdana;
        font-size:110.1%;
		 		height:100%;
     		line-height: 20px;
}



@carousel-transition-duration:       .6s;

.fluid-type(@property, @min-vw, @max-vw, @min-size, @max-size) {
	@{property}: @min-size;
	@media screen and (min-width: @min-vw) {
		@{property}: calc( @min-size ~" + " unit(@max-size - @min-size) ~" * ((100vw - " @min-vw ~") /" unit(@max-vw - @min-vw) ~")" );
	}
	@media screen and (min-width: @max-vw) {
		@{property}: @max-size;
	}
}

@cFooter:#efe0b9;
@cHeader:#efe0b9;
@cfootera:#342b1b;
@chover:#2f2718;
@white:#fff;

@acolor:#212529;
@blue1:#173885;
@blue2:#1a71be;
@blue3:#1a60be;
@blue4:#3d8fc9;
@beige1:#efe9b7;
@bluelight1:#c9e6f2;
@bluelight2:#eff5f8;
@orange:#ff7f27;
@grau:#c4bfbf;
@paddingbottom:80px;
@bradius:25px;

a{
	color:#666;
	text-decoration: none;
	&.nounderline:hover{ text-decoration: none;}
	&.underline { text-decoration: underline;}
}

a:hover{color:#666;}
b { font-weight: bold;}

.underline{ text-decoration: underline;}
.nounderline{ text-decoration: none;}
.pad5 { padding:5px;}
.pad10 { padding:10px;}
.padB50 { padding-bottom:50px;}
.padB60 { padding-bottom:60px;}
.padB70 { padding-bottom:70px;}
.padB90 { padding-bottom:80px;}
.padB120 { padding-bottom:120px;}
.padB150 { padding-bottom:150px;}
@media only screen and (min-width: 450px) and  (max-width : 576px) {.padB150{ padding-bottom:190px;}}
@media only screen and (max-width : 449px) {.padB150{ padding-bottom:220px;}}

.padB220 { padding-bottom:220px;}

.mar5 { margin:5px;}
.mar10 { margin:10px;}
.marB40 { margin-bottom:40px;}
.marB50 { margin-bottom:50px;}
.marB60 { margin-bottom:60px;}
.marB70 { margin-bottom:70px;}
.marB90 { margin-bottom:90px;}
.marB120 { margin-bottom:120px;}
.mb-6 {margin-bottom:  calc(30px + 5vw);}


.marT-60{ margin-top:-60px;}
.marT60{ margin-top:60px;}
.marT80{ margin-top:80px;}
.marT100 { margin-top:100px;}
.mt-6 {margin-top:  calc(30px + 5vw);}

.marT200 {margin-top:200px}
@media only screen and (max-width : 790px) {	.marT200 {margin-top:100px}	}

.bgBlue1{ background-color:@blue1; color:@white; a{color:white;}}
.bgBlue2{ background-color:@blue2; color:@white;}
.bgBlue3{ background-color:@blue3; color:@white;}
.bgF4{ background-color:#666; color:@white;}
.bgF5{ background-color:#00152d; }

.hColorW{color:white;}
.glow {
  color: #fff;
  text-decoration: none;
  transition: box-shadow 0.2s ease, text-shadow 0.2s ease;
}

.glow:hover {
  color:#fff;
  text-shadow: 0 0 6px rgba(255,255,255,0.9);
}

.hColorB1{color:@blue1;}

.pCol1{color:#444;}

.bgWhite{ background-color: #fff;}
.bgBluelight1{ background-color:@bluelight1; color:@blue1;  }
.bgOrange{background-color: @orange;}
.bgSOrange {background-color: @orange; color:white;}

.width100 {width:100%;}
.width100px {width:100px;}
.width200px {width:200px;}

.height50 { height:50px;}
.height80 { height:80px;}
.height100{ height:100px;}
.height120{ height:120px;}
.height150{ height:150px;}
.height200{ height:200px;}
.height300{ height:300px;}
.height500{ height:500px;}
.h100 { height:100%;}

.maxWHead { 
	max-width:800px;
	@media only screen and (max-width : 768px) {max-width:100%;}
}

.minheight50 { min-height:50px;}
.minheight100{ min-height:100px;}
.minheight150{ min-height:150px;}
.minheight250{ min-height:250px;}
.minheight400{ min-height:400px;}

.op50{opacity: 0.5;}

.mittelBlock{
	bottom:30%;
	right:20%;
	}

.mpoint{cursor: pointer;}
.bt{
	border-style:solid none none none;
	border-color:white;
	border-width:1px;
}

.clear{ clear:both;}

header{
position: relative;
	//height:150px;
	//.fluid-type(height, 500px, 1920px, 50px, 150px);
}

.tcenter{text-align: center;}
h1,.h1 {	.fluid-type(font-size, 500px, 1920px, 25px, 45px); color:#333; font-family: myfont2,verdana; background-color: #fff;padding: 10px;}
h2,.h2 {	.fluid-type(font-size, 500px, 1920px, 22px, 30px); color:#555; margin-top:20px;font-family: myfont2,verdana; margin-bottom: 0.6rem;}
.carousel-caption p {.fluid-type(font-size, 500px, 1920px, 17px, 30px); color:#333; margin-top:20px;font-family: myfont2,verdana; 
	background-color: #fff;padding: 10px;}

.carousel-caption h2 {.fluid-type(font-size, 500px, 1920px, 16px, 30px); color:#eee; margin-top:20px;font-family: myfont2,verdana;}
// teste mal font-size: clamp(16px, 1.5vw, 24px);


h3,.h3 {	.fluid-type(font-size, 500px, 1920px, 20px, 23px); margin-top:20px;font-family: myfont2,verdana; color:#666;}
p,li  {
	.fluid-type(font-size, 500px, 1920px, 18px, 20px);
	.fluid-type(line-height, 500px, 1920px, 26px, 30px);
}
div {
  .fluid-type(font-size, 500px, 1920px, 13px, 18px);
	.fluid-type(line-height, 500px, 1920px, 20px, 28px);
}

.arrow-link::before {

  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 10px solid #00152d;
  margin-left: 0.6em;
  margin-right: 0.5em;
}

@media (max-width : 768px) {
	h1,.h1 { color: #000;}
	h2,.h2 { color: #222; margin-bottom: 2rem; font-weight: 400;}
	h3,.h3 { color: #444; margin-left:10px; }
	p { color:#333; margin-bottom: 2rem;}
	
	.carousel-caption p { font-weight:bold;}
}

.rot  { transform: rotate(-26deg);}

td{padding:5px;}
input{
	background-color: #eee;
	padding:5px 10px 5px 10px;

	&.inp{width:80%;}

}
input[type="submit"]{
	cursor: pointer;

}

.dropdown-menu li{ padding-left:10px; padding-right:10px;}
li {
	padding-left: 18px;
	line-height:30px;
}

.dropdown-menu-light .dropdown-item.active, .dropdown-menu-dark .dropdown-item:active{
  color: #fff !important;
  background-color: #00152d !important;
}


.line{
	border-style: solid none none none;
	border-width: 1px;
	border-color:#eee;
}
.line2{
	border-style: solid none none none;
	border-width: 1px;
	border-color:#888;
}

footer {

	height:100px;
	a{
		color:#666;
		padding: 5px 0 5px 0;
    line-height: 30px;
    font-size:18px;

		&:hover{color:black; text-decoration: none;}

	}
}

.sectionmain{}

#infotext{
	background-color:#fff;
	min-width:300px;
	min-height:200px;
	margin:auto;
	padding:15px;
	border-radius:10px;
}

.center{
	display: flex;
	justify-content : center;
	align-items:center;
}
.jusleft{
	display: flex;
	justify-content : start;
	align-items:center;
}

.bgOverlay{
	position:absolut;
	background-color:@white;
	background-position: 50%;
	background-repeat: no-repeat;

	margin: 1.5em auto 2.5em;

}

.bgLogin{

	position:relative;
	background-color: #fff;
	margin: 1.5em auto 2.5em;
	height:500px;
}

.overlayimg{
    position: absolute;
    color:@white;
    padding:20px 10px 20px 10px;
		z-index:2;
		.fluid-type(font-size, 500px, 1600px, 15px, 22px);

		@media only screen and (max-width : 768px) {
			 position: relative;
			 padding:20px 10px 20px 30px;
			 background-color: @blue1;
		}


}


.carousel-caption {
  background-color:transparent;
	text-align: left;
	padding: 15px 20px 15px 20px;
	@media only screen and (max-width : 768px) {
		bottom:inherit;
    	position: relative;
	}
}


.pos2{
	right:2%;
	left:inherit;
}

.loginText{
    position: absolute;

	//	z-index:2;
		.fluid-type(font-size, 500px, 1600px, 12px, 22px);

		@media only screen and (max-width : 768px) {
			 position: relative;
			 left:0; bottom:0;
		}



}

.imgLogin{
    position:absolute;
	width: 100%;
    max-height: 600px;
    vertical-align: middle;
    border: 0;
    z-index:2;
}


.relativ{
	position:relative;
}
.absolut{
	position:absolute;
}

button{
	border:0;
	background-color: transparent;
}

.button {
  .fluid-type(min-width, 500px, 1900px, 120px, 180px);
  .fluid-type(font-size, 500px, 1900px, 14px, 16px);


  //background-color: @blue1;
  border: none;
  color: white;

  text-align: center;
  text-decoration: none;
  //display: inline-block;

  margin: 4px 10px 4px 0px;
  cursor: pointer;
  border-radius:@bradius;

  transform: scale(1);
 &.normal {
	   padding: 10px 25px 10px 25px;
 }
 &.with100 {
	  // .fluid-type(font-size, 500px, 1900px, 15px, 24px);
		font-size:24px;
		width: 100%;
		 padding: 10px 25px 10px 25px;
 }


 &.color2{
	  background-color: @blue4;
	}

	&.colorwhite{  background-color: white; color:@blue1;}

  &:hover{
	  //transform: scale(1.1);// perspective(1px);
	  color:white;
	  text-decoration:none;
	  background-color:@orange;
  }
	&.in{ display:inline-block;}

}

.small{
  .fluid-type(font-size, 500px, 1900px, 11px, 14px)
}


.footer{padding:20px; height:100px;}
.awhite{ color:white; padding:20px ; text-decoration:underline;}
.awhite:hover{ color:white;}


.over{	overflow: hidden; }

div.buttonTarget:hover{
	background-color:  @orange;
	cursor:pointer;

}

.dis{
	pointer-events: none;
  cursor: default;
}

.left{ float:left;}
.right { float:right;}
.secDreieck{
		.fluid-type(font-size, 500px, 1920px, 11px,18px);

}


.navbar{
	z-index:5;
  margin-left:10px;
}

.nav-item.active a.nav-link{
color:#333;
}
.nav-link, .dropdown-item  {
	font-size:20px;
}

.bgC1{background-color: #537e8a;}
.bgC2{background-color: #5b94ae;}


.line{
	border-style: solid none none none;
	border-width: 1px;
	border-color:#eee;
}

.navbar-toggler:focus{
	box-shadow: none;
}

.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.info{
  background-color: #0d632b;
  color:#fff;
  padding:10px;
}