/* basics */

html {
font-size:10px;
}

body {
	margin: 0;
	padding: 0;
	background:none;
}

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
}

.nobr {
white-space: nowrap;
}









/* padding */



.pad {
	padding:30px;
}

.pad2 {

}

.pad3 {

}











/* headlines, p, a, smallfont */




h1 {
font-family: 'Open Sans', verdana;
font-size:10rem;
font-weight:800;
line-height:10rem;
letter-spacing:-0.5rem;
margin:0px 0px 50px 0px;
text-align:center;
}


h2 {
font-family: 'Open Sans', verdana;
font-size:4rem;
font-weight:800;
line-height:3rem;
letter-spacing:-0.1rem;
margin:0px 0px 50px 0px;
text-align:left;
}


h3 {
font-family: 'Open Sans', verdana;
font-size:2.5rem;
font-weight:400;
line-height:2.5rem;
letter-spacing:0rem;
margin:0px 0px 40px 0px;
text-align:left;
}


h4 {
font-family: 'Open Sans', verdana;
font-size:2.2rem;
font-weight:800;
line-height:2.2rem;
letter-spacing:0rem;
margin:40px 0px 40px 0px;
text-align:left;
}


h5 {
font-family: 'Open Sans', verdana;
font-size:2.rem;
font-weight:400;
line-height:2rem;
letter-spacing:0rem;
margin:0px 0px 20px 0px;
text-align:left;
}


p {
font-family: 'Open Sans', verdana;
font-size:1.7rem;
line-height:2.6rem;
font-weight:400;
letter-spacing:0rem;
color:black;
margin:0px 0px 0px 0px;
text-align:left;
}


.small-font {
font-size:1.1rem!important;
line-height:2rem!important;
letter-spacing:0rem;
}

.nobr	{
	white-space:nowrap;
}



img {
width:100%;
margin:0px;
padding:0px;
}

a {
color:black;
}

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











/* listen */



ul {
margin:20px 0px 10px 0px;
}

li {
	font-family: 'Open Sans', verdana;
	font-size:1.7rem;
	line-height:2.6rem;
	font-weight:400;
	letter-spacing:0rem;
color:black;
margin:0 0 10px -20px;
text-align:left;
}


.list1 {
list-style-type:disc;
padding-left:20px;
}

.list2 {
list-style-type:none;
padding-left:0px;
}

.list3 {
list-style-image: url(../images/listimg.png);
}









/* center, left, right, fixed, absolute, flex, auto, centercenter */


.center, .center h1, .center h2, .center h3, .center h4, .center h5, .center p, .center a {
text-align:center!important;
}

.auto img{
width:auto!important;
}

.absolute {
position:absolute!important;
z-index:11000;
}

.right {
float:right!important;
}

.flex {
display:flex;
flex-direction:row;
}

.centercenter {
position:absolute;
width:100%;
top:50%;
left:50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}

.imgshape {
width:300px;
float:left;
shape-outside: circle(50%);
}




/* logo */


.logo {
float:right;
width:33%;
display:block;

}



.logo img{
wwidth:20%;
}





/* shadow, topchange, rounded */



.shadow {
	-webkit-text-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-moz-text-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-o-text-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	text-shadow: 0px 0px 10px rgba(0,0,0,0.5);

}

.topchange {
	-webkit-transition: all 0.3s ease-in-out;
 	-moz-transition: all 0.3s ease-in-out;
 	-o-transition: all 0.3s ease-in-out;
 	transition: all 0.3s ease-in-out;
}

.topchange2 {
	position:fixed;
	top:0px;
}

.scrollchange {
	-webkit-transition: all 0.3s ease-in-out;
 	-moz-transition: all 0.3s ease-in-out;
 	-o-transition: all 0.3s ease-in-out;
 	transition: all 0.3s ease-in-out;
}

.scrollchange2 {
	position:fixed;
	top:0px;
}

.rounded {
	border-radius: 15px 15px 15px 15px;
	-o-border-radius: 15px 15px 15px 15px;
	-moz-border-radius: 15px 15px 15px 15px;
	-webkit-border-radius: 15px 15px 15px 15px;
}





















/* colors */



.color {
background-color:#d0d0d0;
}

.color h1, .color h2, .color h3, .color h4, .color h5, .color p, .color a{
color:#fff;
}

.white h1, .white h2, .white h3, .white h4, .white h5, .white p, .white a, .white li{
color:#fff;
}

.color2 {
background-color:#000000;
}

.color2a {
background-color:grey;
}

.color3 {
background-color:#f8ea1b;
}





/* button */



.button {
position:relative;
width:auto;
margin:20px 0px 20px 0px;
padding:20px 30px;
display:inline-block;
font-family: 'Open Sans', verdana;
font-size:1.7rem;
line-height:2.6rem;
font-weight:400;
letter-spacing:0rem;
color:yellow;
text-decoration:none;
text-align:center;
cursor:pointer;
border:none;
background-color:#000000;
}


.button:hover {
background-color:darkgrey;
color:yellow;
}



.button-block {

	display:block;
	width:100%;
}











/* background-fullscreen */



.bg-fullscreen {
min-height:100vh!important;
min-height:100%;
background: url(../images/bg_fullscreen.jpg) no-repeat center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}





.mobile-on {
	display:none;
}









.selector {
float:right;
width:50%;
margin:50px 0;
}























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


html {
	font-size:8px;
}





}

































@media screen and (max-width:1000px) and (orientation:portrait) {


html {
	font-size:8px;
}



h1 {
font-family: 'Open Sans', verdana;
font-size:4.7rem;
font-weight:800;
line-height:5.2rem;
letter-spacing:-0.2rem;
margin:0px 0px 30px 0px;
text-align:center;
}


h2 {
font-family: 'Open Sans', verdana;
font-size:3.1rem;
font-weight:800;
line-height:3rem;
letter-spacing:-0.1rem;
margin:0px 0px 20px 0px;
text-align:left;
}




.flex {
	flex-direction:column;
}




.selector {
float:right;
width:100%;
margin:50px 0 0 0;
}






/* logo */


.logo img{
width:30%;
}





/* button */


.button {
width:100%;
}




.bg-mobile {

background: white!important;

}


}