@charset "utf-8";
/* PDW CSS Document */


/*##############################----------------   Allgemein   */
* { margin: 0px; padding: 0px; background: none; }
html { position: relative; min-height: 100%;
    font-size: 14px; font-family: 'Roboto Condensed', sans-serif; color: #444; }
body { width: 100%; min-height: 100%;
    background-color: #000; }
h1 { font-size: 18px; }
h2 { font-size: 16px; }
h3 { font-size: 14px; }
.h1cl { font-size: 18px; font-weight: bold; }
.h2cl { font-size: 16px; font-weight: bold; }
.h3cl { font-size: 14px; font-weight: bold; }
dt { font-weight: bold; }
dd { padding: 9px 0 0 50px; }
.tl { text-align: left; }
.tc { text-align: center; }
.tr { text-align: right; }
.tj { text-align: justify; }
.tk { font-variant: small-caps; white-space: nowrap; display: inline; }
.einr { text-indent: 20px; }
.cl { clear: both; }


/*##############################----------------   Header   */
header {
    position: absolute; /* entfernen */
    width: 100%; height: 130px;
    background: none;
}
#logo { position: absolute;
    width: 350px; height: 113px; margin-top: 5px;
    background: url(ssrc/logo.png);
}
#slogan { position: absolute;
    width: 850px; height: 50px; margin: 40px 0 0 350px;
    font-family: 'Audiowide', cursive; font-size: 16px; line-height: 30px;
    text-align: center; color: #0c41aa;
}


/*##############################----------------   Main   */
main {
/*    width: 1150px; height: auto; margin: 25px auto 150px auto; padding: 25px;*/
    position: absolute;
    width: 100%; height: 100%; margin: 0 auto;
}
#logpltzh {
    position: absolute;
	width: 50%; height: auto; left: 50%; top: 50%;
    transform: translateX(-50%) translateY(-50%);
}
.txt {
    position: absolute;
	width: 69%; height: auto; left: 50%; top: 50%;
    transform: translateX(-50%) translateY(-50%);
    color: #fff; font-size: 20px; text-align: center;
    text-shadow: #000 0 0 3px, #000 0 0 9px;
    animation: txt1 6s infinite;
    -webkit-animation: txt1 6s infinite;
}
@keyframes txt1 {
    0%     { opacity: 1; }
    40%    { opacity: 1; }
    60%    { opacity: 1; }
    100%   { opacity: 1; }
}
.sti {
    animation: st2 1.3s infinite;
    -webkit-animation: st2 1.3s infinite;
}
@keyframes st2 {
    0%     { opacity: 0; }
    30%    { opacity: 0; }
    40%    { opacity: 1; }
    50%    { opacity: 0.2; }
    60%    { opacity: 1; }
    70%    { opacity: 0; }
    100%   { opacity: 0; }
}
.details {
    width: calc(100% - 30px); padding: 0 0 0 30px;
}
.mailum {
	text-decoration: none; color: #444;
    transition: all 0.3s cubic-bezier(.5, 0, .5, 1);
    -webkit-transition: all 0.3s cubic-bezier(.5, 0, .5, 1);
}
.mailum:hover {
	color: #fff;
}
.kondat {
	width: 200px; height: 40px;
    float: left;
}
.symmail {
    position: absolute;
	width: 30px; height: 21px; margin-top: 4px;
}
.symfon {
    position: absolute;
	width: 35px; height: 25px; margin-top: 2px;
}
.konfl {
    position: absolute;
	width: 150px; height: 21px; margin: 5px 0 0 40px;
}


/*##############################----------------   Footer   */
footer {
    position: absolute;
    width: 100%; height: 25px; bottom: 0px; padding-bottom: 50px;
    background: none;
    text-align: center;
}


/*##############################----------------   @media L.DESK - MAX 1200   */
@media screen and (max-width: 1275px) {
/*    main { width: 950px; }*/
    #slogan { width: 650px; font-size: 18px; }
}


/*##############################----------------   @media TABLET - MAX 925   */
@media screen and (max-width: 1075px) {
/*    main { width: 650px; }*/
    #slogan { display: none; width: 0; }
}


/*##############################----------------   @media MOBILE - MAX 740   */
@media screen and (max-width: 740px) {
/*    main { width: calc(100% - 50px); }*/
    #logo { position: static; margin: 5px auto; }
    #slogan { font-size: 18px; margin: 0px 0 0 350px; }
}




/*###########################################################################*/
/*###########################################################################*/
/*###########################################################################*/
/*####################### Primaer Design Webdesign ##########################*/
/*###########################################################################*/
/*###########################################################################*/
/*###########################################################################*/