@charset "utf-8";
/* CSS Dokument */


/*#################### HTML TAGS ####################*/
body, html { background-color:#3f3f3f; margin:0; padding:0; width:100%; height:100%}
/*#################### HTML TAGS ####################*/
/*#################### DESIGN LOGIN ####################*/
/* color:#ffffff*/
/*#################### DESIGN LOGIN ####################*/
/*#################### TYPO ####################*/

h1 { margin:35px 0 20px 0; float:left; width:100%; font-family: 'Exo 2', sans-serif; font-size:30px; font-weight:800;}
h2 { margin:35px 0 20px 0; float:left; width:100%; font-family: 'Exo 2', sans-serif; font-size:25px; font-weight:700;}
h2 span { font-family: 'Encode Sans', sans-serif; font-size:26.5px; margin: 0px 4px 0px 4px;}
h2 span1 { margin: 0px 4px 0px 0px;}
h3 { margin:35px 0 20px 0; float:left; width:100%; font-family: 'Exo 2', sans-serif; font-size:18px; font-weight:600;}
h4 { margin:35px 0 20px 0; float:left; width:100%; font-family: 'Exo 2', sans-serif; font-size:18px; font-weight:600;}

p { color:#333; font-family: 'Exo 2', sans-serif; margin:5px 0 5px 0; font-size:16px; font-weight:300; word-spacing:5px; line-height:25px;}
/*p span { color:#0CF;}*/

img { width:100%; height:auto; float:left;}

/*#################### TYPO ####################*/

/*#################### ZUSAMMENGEFASSTE KLASSEN ####################*/
header .navbar .ud_menu ul li a, header .navbar label, footer #ud_footer_menu
{ font-family:Arial, Helvetica, sans-serif;}

footer #ud_footer_menu, header .navbar label, header .navbar .ud_menu ul li a, header #ud_slogan, footer #ud_footer_menu a, footer #ud_footer_menu span a:hover, h1, h2, h3, h4
{ color:#ffffff;}
/*#################### ZUSAMMENGEFASSTE KLASSEN ####################*/

/*#################### HEADER ####################*/
/*header { width:100%; height:100%; background:url(../image/bg_header.jpg) no-repeat center center; background-size:cover; overflow:hidden; float:left;}*/
header.ud_home { width:100%; height:100%; background:url(../image/bg_header.jpg) no-repeat center center; background-size:cover; overflow:hidden; float:left;} /*### background:url(../image/bg_header.jpg) no-repeat center center; background-color:#636363; ###*/
header.ud_unterseite { width:100%; height:50%; background:url(../image/bg_header.jpg) no-repeat center center; background-size:cover; overflow:hidden; float:left;} /*### background:url(../image/bg_header.jpg) no-repeat center center; background-color:#636363; ###*/

@media screen and (max-width:800px) {
    header.ud_home { width:100%; height:40%;}
    header.ud_unterseite { width:100%; height:30%;}
}
@media screen and (max-width:500px) {
    header.ud_home { width:100%; height:30%;}
    header.ud_unterseite { width:100%; height:20%;}
}

header .navbar #ud_logo { width:150px; float:left; padding: 5px;}
header .navbar #ud_logo img { width:100%; height:auto;}
/*header #ud_logo_background { position:absolute; background-color:#000000; opacity:0.5; width:165px; height:165px;}*/

header .navbar { display:flex; flex-wrap:wrap; justify-content:space-between; padding:10px;}
header .navbar .ud_menu ul.ud_menu_list { list-style:none; display:flex;}
header .navbar #toggler, header .navbar label { display:none;}
header .navbar label:hover { color:#00a6ff;}

header .navbar .ud_menu ul { margin:0; padding:0; float:right;}
header .navbar .ud_menu ul li { list-style:none; float:left; margin:20px 20px 0 0;}
header .navbar .ud_menu ul li a { text-transform:uppercase; font-weight:bold; font-size:20px; text-decoration:none;}
header .navbar .ud_menu ul li a:hover { color:#00a6ff;}
header .navbar .ud_menu ul li a.ud_active { color:#00a6ffa1;}
header .navbar .ud_menu ul li a.ud_active:hover { color:#00a6ff;}

@media screen and (max-width:800px) {
    header .navbar #ud_logo { z-index:50;}
    header .navbar .ud_menu ul { float:none}
    header .navbar .ud_menu { width:100%; max-height:0; overflow:hidden;}
    header .navbar .ud_menu .ud_menu_list { flex-direction:column; align-items:center; padding:20px;}
    header .navbar label { height:0%; display:block; align-items:center; cursor:pointer; z-index:50;}
    header .navbar #toggler:checked ~ .ud_menu { max-height:100%; position:absolute; left:0%; top:0%; width:100%; background:rgba(0,0,0,0.3); padding-bottom:15px;}
    header .navbar #toggler:checked ~ label {color:#00a6ffa1;}
}

@media screen and (max-width:500px) {
    header .navbar #ud_logo { width:30%;}
}

@media screen and (max-width:450px) {
    header .navbar #ud_logo { width:28%;}
}

@media screen and (max-width:400px) {
    header .navbar #ud_logo { width:26%;}
}

/*header #ud_slogan { width:650px; padding:25px; text-align:center; position:absolute; top:35%; left:50%; background:#00b4ff80; font-family:Arial, Helvetica, sans-serif; font-size:40px; text-transform:uppercase; margin:0 0 0 -325px;}*/ /*### top:75%; ###*/
header #ud_slogan .home { width:725px; padding:25px; text-align:center; position:absolute; top:75%; left:50%; background:#00b4ff80; font-family:Arial, Helvetica, sans-serif; font-size:40px; text-transform:uppercase; margin:0 0 0 -325px;}
header #ud_slogan .contact { width:725px; padding:25px; text-align:center; position:absolute; top:25%; left:50%; background:#00b4ff80; font-family:Arial, Helvetica, sans-serif; font-size:40px; text-transform:uppercase; margin:0 0 0 -325px;}
header #ud_slogan .imprint { width:725px; padding:25px; text-align:center; position:absolute; top:25%; left:50%; background:#00b4ff80; font-family:Arial, Helvetica, sans-serif; font-size:40px; text-transform:uppercase; margin:0 0 0 -325px;}
header #ud_slogan .stream { width:725px; padding:25px; text-align:center; position:absolute; top:25%; left:50%; background:#00b4ff80; font-family:Arial, Helvetica, sans-serif; font-size:40px; text-transform:uppercase; margin:0 0 0 -325px;}

@media screen and (max-width:800px) {
    /*header #ud_slogan .home { width:725px; padding:25px; text-align:center; position:absolute; top:75%; left:50%; background:#00b4ff80; font-family:Arial, Helvetica, sans-serif; font-size:40px; text-transform:uppercase; margin:0 0 0 -325px;}
    header #ud_slogan .contact { width:725px; padding:25px; text-align:center; position:absolute; top:25%; left:50%; background:#00b4ff80; font-family:Arial, Helvetica, sans-serif; font-size:40px; text-transform:uppercase; margin:0 0 0 -325px;}
    header #ud_slogan .imprint { width:725px; padding:25px; text-align:center; position:absolute; top:25%; left:50%; background:#00b4ff80; font-family:Arial, Helvetica, sans-serif; font-size:40px; text-transform:uppercase; margin:0 0 0 -325px;}
    header #ud_slogan .stream { width:725px; padding:25px; text-align:center; position:absolute; top:25%; left:50%; background:#00b4ff80; font-family:Arial, Helvetica, sans-serif; font-size:40px; text-transform:uppercase; margin:0 0 0 -325px;}*/
    header #ud_slogan { display:none;} /*### width:100%; margin:0; padding:25px 0 25px 0; left:0; ###*/
}
/*#################### HEADER ####################*/

/*#################### CONTANT ####################*/
article { margin:0 20% 5% 20%; width:60%; float:left;}
article p { color:#ffffff;}
article p span { font-family: 'Encode Sans', sans-serif; font-size:16px; margin: 0px 2px 0px 4px;}
article p span1 { margin: 0px 4px 0px 2px;}
article p span2 { margin: 0px 4px 0px 1px;}
article p span3 { font-family: 'Encode Sans', sans-serif; font-size:16px; margin: 0px 0px 0px 0px;}
article #ud_addresse p { margin: 1% 0 1% 0;}
article p a { color:#ffffff; text-decoration:none;}
article p a:hover { color:#00a6ff;}
article uber p { margin:30px 0 0 0;}
article uber p ue { font-size:10px;}
article p img { margin: 15px 0 30px 0;}
article p li a { color:#ffffff; text-decoration:none;}
article p li a:hover { color:#00a6ff;}
article ul li { color:#ffffff; font-family: 'Exo 2', sans-serif; margin:5px 0 5px 0; font-size:16px; font-weight:300; word-spacing:5px; line-height:25px;}
/*article p .video { }*/
/*#################### CONTANT ####################*/

/*#################### FOOTER ####################*/
footer { width:100%; background:url(../image/bg_footer.jpg) no-repeat center center; background-size:cover; height:350px; float:left;}

footer #ud_footer_menu { text-align:center; font-size:16px; margin:0 0 0 0;}
footer #ud_footer_menu a { text-decoration:none;}
footer #ud_footer_menu a:hover { color:#00a6ff}
footer #ud_footer_menu span { display:block; margin:15px 0 0 0;}
/*footer #ud_footer_menu span a { color:#00a6ff; text-decoration:none;}*/
/*footer #ud_footer_menu span a:hover {}*/

footer #ud_social_icons { text-align:center; width:100%; margin:175px 0 0 0;}
/*footer #ud_social_icons .ud_social { width:50px; height:50px; display:inline-table; text-align:center; margin:0 10px 0 0;}*/
/*footer #ud_social_icons .ud_social img { width:100%; height:auto;}*/
/*footer #ud_social_icons .ud_social img:hover { opacity:0.5;}*/

footer #ud_social_icons .ud_social { display:inline-table;}
footer #ud_social_icons .ud_social ul { position: relative; top: 35%; left: 50%; transform: translate(-50%, -50%); padding: 0; margin: 0; display: flex;}
footer #ud_social_icons .ud_social ul li { list-style: none; margin: 0 10px;}
footer #ud_social_icons .ud_social ul li .fa { color: #ffffff; font-size: 30px; line-height: 55px; transition: .5s;}
footer #ud_social_icons .ud_social ul li .fa:hover { color: #ffffff;}
footer #ud_social_icons .ud_social ul li a { position: relative; display: block; width: 55px; height: 55px; border-radius: 50%; background-color: #636363; text-align: center; transition: 0.5s; transform: translate(0,0px); box-shadow: 0px 7px 5px rgba(0, 0, 0, 0.5);}
footer #ud_social_icons .ud_social ul li a:hover { transform: rotate(0deg) skew(0deg) translate(0, -10px);}
footer #ud_social_icons .ud_social ul li:nth-child(1) a:hover { background-color: #3B5999;}
footer #ud_social_icons .ud_social ul li:nth-child(2) a:hover { background-color: #bb001b;} /*### #999999 #0072C6 ###*/
footer #ud_social_icons .ud_social ul li:nth-child(3) a:hover { background-color: #25D366;}

/*#################### FOOTER ####################*/

