@import "../fonts/font.css";

/*-----------------------------------------------------------------------------------*/
/*        RESET
/*-----------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
         margin: 0;
         padding: 0;
         border: 0;
         outline: 0;
         font-size: 100%;
         font-weight: inherit;
         font-style: inherit;
         font-family: inherit;
         vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary,
audio, canvas, command, datalist, embed, keygen, meter, output, progress, source, video {
         display: block;
}
html, body {
         height:100%;
         width:100%;
}
body {
         font: normal normal 100%/1.5 'UbuntuRegular', Tahoma, Arial, Helvetica, Verdana, sans-serif;
         color: #868889;
}
html {   overflow-x:hidden
}

.fullheightbg {
         position: fixed;
         top: 0px;
         left: 0px;
         width: 100%;
         height: 100%;
         z-index: -1;
         background: url(../images/layout/pattern_012_1.png) repeat,
                     radial-gradient(ellipse farthest-corner at right bottom, #031a2a  30%, #060a0c 150%);
       /* 33 43 45 47 50 87 94 100
          pattern 001 003 004 007 008 011 012 033 037 044 048 066 201
       */
}
#wrapper {
         min-height:100%;
         position:relative;
         margin: 0 auto;
         max-width:1500px;
         }

header {
         padding:100px 10px 50px;
         text-align:center;
}
footer {
         display:block;
         clear:both;
         padding:10px;
         text-align:center;
         background: radial-gradient(ellipse farthest-corner at right bottom, rgba(0,0,0,0.5)  30%, rgba(0,0,0,0.95) 150%);
         border-top:solid 0.25px #4a4b4b;
}
.logo {
         background: none;
}
.logo img {
         max-width:80vw;
}
.navigation {
         margin-top:50px;
}
ul.menu {
         overflow:hidden;
         list-style:none;
         display:inline-block;
         width:auto;
}
ul.menu li {
         float:left;
         padding:7px 10px;
         margin:2.5px;
         border-radius:5px;
         border:solid 1px #4a4b4b;
         background-color:rgba(0,0,0,0.3);
}
ul.menu li a {
         text-decoration:none;
         color:#f19028;
}
ul.menu li:hover {
         border:solid 1px #2a98d0;
         background-color:rgba(255,255,255,0.3);
}
ul.menu li:hover a {
         color:#2a98d0;
}
.content {

}
.cols:after,
.cols:before {
         content:"";
         display:table;
         clear:both;
}
.drittel,
.halb {
         margin:5px auto;
         width:calc(80% - 10px);
}

.drittel img {
         -webkit-filter: contrast(0.75);                /* brightness(0.5) / sepia(0.5) */
         filter: contrast(0.75);                        /* brightness(0.5) / sepia(0.5) */
         cursor: pointer;
         margin-bottom:5px;
         box-shadow:2px 2px 4px rgba(0,0,0,0.7);
         width:100%;
}
.drittel img:hover {
         -webkit-filter: contrast(1);               /* brightness(1) / sepia(0) */
         filter: contrast(1);                       /* brightness(1) / sepia(0) */
}

h1,h2,h3,h4,h5,h6 {
         font-family:"UbuntuBold",Arial,sans-serif;
         font-weight:400;
         margin:10px 0;
}
h1 {     font-size:36px;
}
h2 {     font-size:30px;
}
h3 {     font-size:24px;
}
h4 {     font-size:20px;
}
h5 {     font-size:18px;
}
h6 {     font-size:16px;
}
p {
         padding:1.5em 0;
}

hr {
         margin:10px 0;
         box-shadow:2px 2px 3px rgba(0,0,0,0.95);
         background: #0e71b4 none repeat scroll 0%;
         border:0pt none;
         height:1px;
}
small {
         font-size:0.8em;
}
b, strong {
         font-weight:bold;
}
a {
         color: #c5c7c8;
}
a:hover {
         color: #2a98d0;
}
/* #### Formulare #### */

form {
  background:rgba(0,0,0,0.3);
  box-shadow: 1px 1px 3px rgba(0,0,0,0.5);
  border-radius: 3px;
  margin: 5px;
  padding:20px;
}
input[type="text"],
input[type="submit"],
textarea {
  padding: 10px;
  margin-left:1%;
  margin-bottom:2%;
  border-radius: 3px;
  box-shadow: 2px 2px 4px rgba(0,0,0,0.3), inset 1px 1px 3px rgba(0,0,0,0.3);
  border: 0.5px solid #2a98d0;
}
input[type="text"],
textarea {
  background-color:  rgba(255,255,255,0.7);
  color: rgba(0,0,0,0.95);
}
input[type="text"],
textarea {
  width:calc(100% - 50px);
}
textarea {
  height:7em;
  }
input[type="checkbox"] {
    display:none;
}
input[type="checkbox"] + label::before {
  width: 20px;
  height: 20px;
  margin:0 10px;
  background-color: rgba(255,255,255,0.7);
  border: 0.5px solid #2a98d0;
  border-radius: 3px;
  box-shadow: 2px 2px 4px rgba(0,0,0,0.3), inset 1px 1px 3px rgba(0,0,0,0.3);
  display: block;
  content: "";
  float: left;
}
input[type="checkbox"]:checked+label::before {
  background-color: #e7501e;
}
input[type="submit"] {
  font-size:1.1em;
  text-shadow: 0 0 1px rgba(255,255,255,0.95),  1px 1px 2px rgba(0,0,0,0.3);
  cursor: pointer;
  width: auto;
  border-radius: 3px;
  border:none;
  background-color: #2a98d0;
  background-image: -ms-radial-gradient(left top, ellipse farthest-corner, #2a98d0 40%, #0e71b4 120%);
  background-image: -moz-radial-gradient(left top, ellipse farthest-corner, #2a98d0 40%, #0e71b4 120%);
  background-image: -o-radial-gradient(left top, ellipse farthest-corner, #2a98d0 40%, #0e71b4 120%);
  background-image: -webkit-radial-gradient(left top, ellipse farthest-corner, #2a98d0 40%, #0e71b4 100%);
  background-image: radial-gradient(ellipse farthest-corner at left top, #2a98d0 40%, #0e71b4 120%);
  color:rgba(0,0,0,0.7);
}
input[type="submit"]:hover {
  background-color: #f19028;
  background-image: -ms-radial-gradient(left top, ellipse farthest-corner, #f19028 10%, #f8b333 100%);
  background-image: -moz-radial-gradient(left top, ellipse farthest-corner, #f19028 10%, #f8b333 100%);
  background-image: -o-radial-gradient(left top, ellipse farthest-corner, #f19028 10%, #f8b333 100%);
  background-image: -webkit-gradient(radial, left top, 0, left top, 1000, color-stop(0.1, #f19028), color-stop(1, #f8b333));
  background-image: -webkit-radial-gradient(left top, ellipse farthest-corner, #f19028 10%, #f8b333 100%);
  background-image: radial-gradient(ellipse farthest-corner at left top, #f19028 10%, #f8b333 100%);
  color: rgba(0,0,0,0.7);
}

input.fail, textarea.fail, checkbox.fail {
  border: 1px solid #f8b333;
  background-color: rgba(255,255,255,0.5);
}
p.fail {
  color: #f19028;
  padding:5px;
}


/* #### Icons #### */
[class*="icon-"]:before {
         font-family: 'FontAwesome', sans-serif;
         font-size:1em;
}
.icon-home:before {
  content: "\f015";
}
.icon-mail:before {
  content: "\f003";
}
.icon-mobile:before {
  content: "\f095";
}
.icon-menu:before {
  content: "\f0c9";
}
.icon-totop:before {
  content: "\f062";
}



@media (min-width:601px){
.drittel   { width:calc(33.33333% - 10px); float:left; margin:5px; }
.halb    { width:calc(50% - 10px); float:left; margin:5px; }
}
@media (min-width:993px){

}
@media (max-width:1205px){

}
@media (max-width:600px){

}
@media (max-width:768px){

}
@media (min-width:993px){

}
@media (max-width:992px) and (min-width:601px){

}
@media (max-width:992px){

}