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

@tailwind base;
@tailwind components;
@tailwind utilities;

body {  background-color: white; }

text, p {
        color: #555555;
        font-size: 1.0em;
        font-weight: none;
        font-style: normal;
        font-family: Arial,arial,verdana,sans-serif;
}
p2 {
        color: #333333;
        font-size: 1.0em;
        font-weight: bold;
        font-style: normal;
        font-family: Arial,arial,verdana,sans-serif;
}
h1 {
        color: #AAAAAA;
        font-size: 1.2em;
        font-weight: none;
        font-style: normal;
        font-family: Arial,arial,verdana,sans-serif;
}
h2 {
        color: #999999;
        font-size: 1.3em;
        font-weight: none;
        font-style: normal;
        font-family: Arial,arial,verdana,sans-serif;
}
h3 {
        color: #666666;
        font-size: 1.4em;
        font-weight: none;
        font-style: normal;
        font-family: Arial,arial,verdana,sans-serif;
}
h1:hover {
         color: #FF3333;
}
a, a:link, a:visited {
        color: #111111;
        font-weight: normal;
        font-style: normal;
        text-decoration:none;
        font-family: Arial,arial,verdana,sans-serif;
}
a:hover, a:active {
        color: #FF3300;
        font-weight: normal;
        font-style: normal;
        text-decoration:none;
        font-family: Arial,arial,verdana,sans-serif;
}
.ankeroben {
        position: absolute;
        top: 0px;
        height: 0px;
        margin: 0px;
        padding: 0px;
        border: 0px solid black;
        background-color: transparent;
}

/* desktop view */
@media only screen and (max-width: 1099px) {
  
    // landing page
    .startheader {
        position: absolute;
        top: 0px;
        left: 50%;
        margin-left: -300px;
        width: 600px;
        height: 100px;        
        border: 0px solid black;
        background-color: black;
    }
    .startheader table {
        position: relative;
        top: 0px;
        height: 70px;
        width: 100%;
        margin-left:auto;
        margin-right:auto;
        text-align:center;
        border: 0px solid black;
        background-color: transparent;
    }
    .startheader p1 {
        color: black;
        font-size: 1.4em;
        font-weight: normal;
        font-style: normal;
        font-family: Arial,arial,verdana,sans-serif;
    }
    .startheader span {
        color: #555555;
        font-size: 0.9em;
        font-weight: none;
        font-style: normal;
        font-family: Arial,arial,verdana,sans-serif;
    }
    .startheader p1:hover a:hover {
        color: #FF3333;
    }
    .navlinks {
        position: fixed;
        top: 70px;
        left: 0px;
        margin: 0px;
        width: 200px;
        height: auto;      
        padding: 10px;
        border: 0px solid black;
        background: rgb(255, 255, 255);
        background: linear-gradient(90deg, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%);
    }
    .cvlink {
        position: absolute;
        top: 70px;
        right: 50%;
        margin-right: -50%; 
        text-align: right;
        width: 200px;
        height: 50px;      
        padding: 10px;
        border: 0px solid black;
        background: rgb(255, 255, 255);
        background: linear-gradient(270deg, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%);
    }
    .startpic {
        position: absolute;
        top: 70px;
        left: 50%;
        margin-left: -300px;
        width: 600px;
        height: 600px;
        border: 0px solid black;
        background-image: url("images/pixel_shift.jpg");
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        z-index: -1;
    }
    .bio {
        position: absolute;
        width: 95%;
        padding: 10px;
        border: 0px solid black;
        background-color: #EFEFEF;
    }
    .bio table {
        border: 0px solid black; 
        cellspacing: 0px; 
        cellpadding: 0px;
    }  

    // header on sites
    .header {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 50px;   
        z-index: 5;
    }
    .header table {
        width: 100%;
        margin: 0px;
        padding: 0px;
        text-align:center;
        margin-left:auto;
        margin-right:auto;
        background-color: #000000;
        border: 0px solid black;
    }

    // container onm sites
    .content {
        position: relative;
        top: 50px;
        width: 100%;
        padding: 10px;
        border: 0px solid black;
        background-color: white;
    }
    .SSO {
        position: relative;
        top: 20px;
        left: 50%;
        margin-left: -50%;
        width: 90%;
    }
    .SSO  video {
        width: 100%;
    }
    .SSO  img {
        width: 50%;
    }
    .DAN {
        position: relative;
        top: 20px;
        left: 50%;
        margin-left: -50%;
        width: 90%;
    }
    .DAN  iframe {
        width: 100%;
    }
    .truth {
        position: relative;
        top: 20px;
        left: 50%;
        margin-left: -50%;
        width: 90%;
    }
    .truth img {
        width: 70%;
    }
    .linda {
        position: relative;
        top: 20px;
        left: 50%;
        margin-left: -50%;
        width: 90%;
    }
    .linda mediabox {        
        position: relative;
        top: 20px;
    }
    .linda iframe {        
        position: relative;
        left: 10%;
    }
    .papa {
        position: relative;
        top: 20px;
        left: 50%;
        margin-left: -50%;
        width: 90%;
    }
    .bricks {
        position: relative;
        top: 20px;
        left: 50%;
        margin-left: -50%;
        width: 90%;
    }
    .bricks img {
        width: 50%;
    }  
    .YYKML {
        position: relative;
        top: 20px;
        left: 50%;
        margin-left: -50%;
        width: 90%;
    }
    .YYKML img {
        width: 70%;
    }
    .YYKML video {
        width: 100%;
    }
    .wohin {
        position: relative;
        top: 20px;
        left: 50%;
        margin-left: -50%;
        width: 90%;
    }
    .media {
        position: relative;
        top: 20px;
        left: 50%;
        margin-left: -50%;
        width: 90%;
    }
    .media iframe {
        width: 90%;
    }
}