@import url('https://fonts.googleapis.com/css?family=Orbitron:700');
/* Basic Elements */
footer {background-color:whitesmoke; width: 100%;height:60px;position: fixed;left: 0;bottom: 0;border-top:#666 solid 1px;z-index:3000}
header {width: 100%;height:130px;position: fixed;left: 0;top: 0;border: none;background:#FFF;display: table; text-align:center; padding-top:5px;z-index:3000 }
div{font-family:Arial;}

h1 {text-align:left;transition:.3s;padding-left:15px;transition:.5s;color: #000000;background: rgb(204,204,204);background: -moz-linear-gradient(left, rgba(204,204,204,1) 0%, rgba(238,238,238,1) 100%);background: -webkit-linear-gradient(left, rgba(204,204,204,1) 0%,rgba(238,238,238,1) 100%);background: linear-gradient(to right, rgba(204,204,204,1) 0%,rgba(238,238,238,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#eeeeee',GradientType=1 ); webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;}
h1{font-size:24px;line-height:30pt;font-family: 'Orbitron', sans-serif; text-transform:capitalize}
h2{color:#333;font-size:13pt;font-weight:100;padding-top:10px;padding-left:13px; background-color:transparent;background-color:transparent;}
h1.LogoType{color:#000000;font-family: 'Orbitron', sans-serif;font-size:34px;line-height:30pt;background-color:transparent; text-align:center;width:90%;}

#unten{height:40px;background:#000;width:100%;position:fixed;left:0;top:130px;}
#logotype{font-family:verdana;font-weight:700;font-size:30pt;text-decoration:none;color:#000;}
#matt{display:inline;}


/* NAVIGATION ANFANG */ 
#navigation{height:40px;width:100%;position:fixed;left:0;top:130px;}
#navigation nav{width:1000px;margin:0 auto;}
#navigation nav ul{list-style:none;padding:0; margin:0;}
#navigation nav a{display:inline;line-height:40px;text-decoration:none;color:#FFF;float:left; width:125px; text-align:center; background:#000;font-size:11pt;font-family:'Arial', serif;transition:.3s;position:relative;}
#navigation nav a:hover{color:#FFF;background:#999;}
nav ul li #aktuelleseite{color:#FFF;background:#999;}
/*  NAVIGATION ENDE  */

/* SEITENNAVIGATION ANFANG  */
#sidenav{height:270px;width:180px;position:fixed;left:0;top:290px;z-index:1000;}
#sidenav nav ul{list-style:none;padding:0; margin:0;}
#sidenav nav li a{font-family: 'Orbitron', sans-serif; text-transform:capitalize;display:inline;line-height:40px;width:180px;text-align:left;transition:.3s;padding-left:15px;transition:.5s;font-size:14pt;color: #000000;background-color: #ffffff;text-decoration:none}
#sidenav nav a:hover{color:#000;padding-left:20px;}
nav ul li #aktuellhome{color:#666666;}
/*   SEITENNAVIGATION ENDE  */

#fl{width:100%;height:50px;position:fixed;bottom:0;display:table;}
#fl2{font-family:'Arial', serif;font-size:11pt;color:#000;text-decoration:none;display: table-cell;vertical-align: middle;text-align: center;}
#fr{text-align:right;height:50px;position:fixed;bottom:0;right:0;}
.icon{padding-right:7px;}
#face{padding-top:10px;}
#youtube{padding-bottom:2px;}
#imp{padding-right:25px;padding-top:15px;padding-left:3px;float:right;}
#imp2{font-family:'Arial', serif;font-size:8pt;color:#333;text-decoration:none;}

/*Main Content*/
#main{width:700px;position:absolute; left:50%; top:210px;z-index:1; margin-left:-350px;}

#hp{float:right;top:230px;position:fixed; width:320px;}
#homecont {float: left;height: 480px; width: 680px;text-align: center; position:fixed; top:230px; left:760px;  line-height: 20pt;font-size: 13pt;background: rgb(204,204,204);background: -moz-linear-gradient(left, rgba(204,204,204,1) 0%, rgba(238,238,238,1) 100%);background: -webkit-linear-gradient(left, rgba(204,204,204,1) 0%,rgba(238,238,238,1) 100%);background: linear-gradient(to right, rgba(204,204,204,1) 0%,rgba(238,238,238,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#eeeeee',GradientType=1 );}
#fotobox{width:700px;height:500px;}
#vid{text-align:center;font-size:24px;font-family: 'Orbitron', sans-serif;}
#vid p{font-size:32px;font-family:Arial, Helvetica, sans-serif;text-align:center;}

/*BLOG*/
.blog-head{width:700px;height:20px;background-color:#fff;font-family:Arial; font-size:30px; border-bottom-color:darkgray; border-bottom-style:inset; border-bottom-width:2px; padding-bottom:10px; text-align:right; transition:.5s;background-color: #ffffff;text-shadow: #cccccc 0 1px 0, #c9c9c9 0 1px 0, #bbb 0 1px 0, #b9b9b9 0 2px 0, #aaa 0 2px 0,rgba(0,0,0,.1) 0 6px 1px, rgba(0,0,0,.1) 0 0 5px, rgba(0,0,0,.3) 0 1px 3px, rgba(0,0,0,.15) 0 3px 5px, rgba(0,0,0,.2) 0 5px 10px, rgba(0,0,0,.2) 0 10px 10px, rgba(0,0,0,.1) 0 20px 20px; text-decoration:none}
.date{font-size:24px;margin-bottom:10px;padding-bottom:0px;margin-top:10px;padding-left:0px;font-weight:bold}
.blog{font-size:20px;line-height:18pt;width:700px;padding-left:0px;padding-top:0px;margin-top:0px;margin-bottom:30px;color:#333;text-align:justify; background-color:ghostwhite;}
/*End Blog*/

/* References */
#refcontainer{width:99%;margin-top:5px;margin-bottom:70px; text-align:center; padding-left:10px;}
.refbox{width:99%;height:60px;margin:0;padding-bottom:0;}
.ref{width:33%;height:60px;float:left;margin:0;text-align:center;color:#000;font-family:'Orbitron', sans-serif;font-size:16px;}
.ref p{padding-top:3px;font-weight:bold;}
.refbg{width:33%;height:60px;float:left;margin:0;text-align:center;color:#000;font-family:Arial;font-size:12pt;background-image:url(img/refbg.jpg);background-repeat:no-repeat; background-position:top left;font-weight:bold;}
.refbg p{padding-top:3px;font-weight:bold;}
/* End of References */

/* Contact Form */
form {width:750px;padding-left:35px;padding-top:20px;}
label {display: block;cursor: pointer;padding-bottom:5px;font-size:20px; font-weight:bold}
input#absender,input#absendername,input#betreff{width: 550px;height:25px;border: 1px solid #CCC;margin-bottom: 1em;font-size:11pt;padding-top:2px;color:#000;font-family:Arial, Helvetica, sans-serif;padding-left:7px;}
textarea {width: 550px;border: 1px solid #CCC;margin-bottom: 1em;height:130px;font-size:11pt;color:#000;font-family:Arial, Helvetica, sans-serif;padding:5px 7px;}
button{width:120px;height:35px;border:none;background:#F0F0F0;font-family:Arial, Helvetica, sans-serif;font-size:24px;cursor: pointer;}
#imptext{margin-left:25px;margin-top:20px; font-size:24px;}

/*Download*/
#dload{width:750px;margin-top:45px;margin-bottom:70px; text-align:center;}
#dloadbutton1{width:220px;height:100px;float:left;}
#dloadbutton2{width:220px;height:100px;float:right;}
.dltext{text-align:center;font-size:14pt;font-family: 'Orbitron', sans-serif;}

/* Memories */
.mempic{width:540px;text-align:center;}
.memtext p{text-align:center;font-size:24px;line-height:28pt;font-family: 'Orbitron', sans-serif;padding-top:10px;}

/*Media*/
#med{margin-top:10px; text-align:center; margin-bottom:100px;}
.medtext{font-size:24px;text-align:center;margin-bottom:50px;font-family: 'Orbitron', sans-serif;}
#med1{width:318px; height:580px;}
#med2{text-align:center}
#med3{text-align:center}
/* End of Memories */

/* show loading page */
div#loadingpage {position: absolute;font-family: Tahoma;font-size: 14px;left: 0;top: 40%;background-color: white;height: 100%;width: 100%;z-index: 3000;text-align: center;}
/* End showing load page */

/* Image Slide Show */
div.scrollingHotSpotLeft{min-width: 75px;width: 10%;height: 100%;background-image: url(http://www.mattphillips.at/scroll/images/big_transparent.gif);background-repeat: repeat;background-position: center center;position: absolute;z-index: 200;left: 0;cursor: url(scroll/images/cursors/cursor_arrow_left.png), url(../images/cursors/cursor_arrow_left.cur),w-resize;}
div.scrollingHotSpotLeftVisible{background-image: url(http://www.mattphillips.at/scroll/images/arrow_left.gif);background-color: #fff;background-repeat: no-repeat;opacity: 0.35;-moz-opacity: 0.35;filter: alpha(opacity = 35);zoom: 1;}
div.scrollingHotSpotRight{min-width: 75px;width: 10%;height: 100%;background-image: url(http://www.mattphillips.at/scroll/images/big_transparent.gif);background-repeat: repeat;background-position: center center;position: absolute;z-index: 200;right: 0;cursor: url(scroll/images/cursors/cursor_arrow_right.png), url(../images/cursors/cursor_arrow_right.cur),e-resize;}
div.scrollingHotSpotRightVisible{background-image: url(http://www.mattphillips.at/scroll/images/arrow_right.gif);background-color: #fff;background-repeat: no-repeat;opacity: 0.35;filter: alpha(opacity = 35);-moz-opacity: 0.35;zoom: 1;}
div.scrollWrapper{position: relative;overflow: hidden;width: 100%;height: 100%;}
div.scrollableArea{position: relative;width: auto;height: 100%;}
#makeMeScrollable {width: 1000px;height: 500px;position: fixed; z-index:300;}
#makeMeScrollable div.scrollableArea img {position: relative;float: left;margin: 0;padding: 0;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-o-user-select: none;user-select: none;}
/* End Image Slide Show */

/* Styles for mobile*/
#untenmobile{height:40px;background:#fff;width:100%;position:fixed;left:0;top:100px;text-align:center;z-index:5000;}
#navigationmobile{height:auto; width:100%; text-align:center;z-index:5000;}
#navigationmobilecontainer{height:auto; width:250px; text-align:center; background-color:lightgray; position:absolute; left: 50%; margin-left: -350px;z-index:5000;top:60px;}
#navigationmobile a {text-decoration: none; font-size: 32px; color: #818181; transition: 0.3s;line-height:60px;}
#navigationmobile li {list-style:none; list-style-image:none; list-style-position:unset; list-style-type:none; padding:0; margin-left:-25px;}
#navigationmobile a:hover, .offcanvas a:focus{color: #f1f1f1;}
nav ul li #aktuelleseitemobile{color:#FFF;background:#000; list-style-image:none}

#imagesMobile {width:640px;height:auto;position:absolute; z-index:1; top:20px; left:50%; margin-left:-320px; z-index:1;}


#sidenavmobile {height:auto; width:250px; text-align:center; background-color:gray; position:fixed; left:50%; margin-left:-150px;z-index:3000; top:150px;}
#sidenavmobile nav ul{list-style:none;padding:0; margin:0;}
#sidenavmobile nav li a{font-family: 'Orbitron', sans-serif; text-transform:capitalize;display:inline;line-height:60px;width:180px;text-align:left;font-size:32px; color: #000000;background-color: gray;text-decoration:none}
#sidenavmobile nav a:hover{color:#fff;padding-left:0;}

#sidenavmobilebook {height:auto; width:300px; text-align:center; background-color:gray; position:fixed; left:50%; margin-left:-150px;z-index:3000; top:140px;}
#sidenavmobilebook nav ul{list-style:none;padding:0; margin:0;}
#sidenavmobilebook nav li a{font-family: 'Orbitron', sans-serif; text-transform:capitalize;display:inline;line-height:60px;width:180px;text-align:left;font-size:32px;color: #000000;background-color: gray;text-decoration:none}
#sidenavmobilebook nav a:hover{color:#fff;padding-left:0;}

#mainmobile{width:100%; text-align:center; height:auto;}
#headermobile {width: 100%;height:130px;position: fixed;left: 0;top: 0;border: none;background:#FFF;display: table; text-align:center; padding-top:45px;z-index:2000 }