/*
Theme Name: flimgo by silectra
Theme URI: http://flimgo.de
Description: Template zu flimgo.de im Auftrag an Sielctra - Medien & Design
Author: Florian Hofmann
Author URI: http://silectra.de
*/

@font-face {
    font-family: 'jenna_sueregular';
    src: url('fonts/JennaSue/JennaSue-webfont.eot');
    src: url('fonts/JennaSue/JennaSue-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/JennaSue/JennaSue-webfont.woff') format('woff'),
         url('fonts/JennaSue/JennaSue-webfont.ttf') format('truetype'),
         url('fonts/JennaSue/JennaSue-webfont.svg#jenna_sueregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
	font-family: 'AvenirNext-UltraLight';
	src: url('fonts/AvenirNext/AvenirNext-UltraLight.eot?') format('eot'), 
	     url('fonts/AvenirNext/AvenirNext-UltraLight.woff') format('woff'), 
	     url('fonts/AvenirNext/AvenirNext-UltraLight.ttf')  format('truetype'),
	     url('fonts/AvenirNext/AvenirNext-UltraLight.svg#AvenirNext-UltraLight') format('svg');
}

@font-face {
    font-family: 'AvenirNextRegular';
    src: url('fonts/AvenirNextRegular/avenirnext-regular.eot');
    src: url('fonts/AvenirNextRegular/avenirnext-regular.eot') format('embedded-opentype'),
         url('fonts/AvenirNextRegular/avenirnext-regular.woff') format('woff'),
         url('fonts/AvenirNextRegular/avenirnext-regular.ttf') format('truetype'),
         url('fonts/AvenirNextRegular/avenirnext-regular.svg#AvenirNextRegular') format('svg');
}


a:link    {color: black; background-color:transparent; text-decoration:none}
a:visited {color: black; background-color:transparent; text-decoration:none}
a:hover   {color:rgba(0, 0, 0, 0.81); background-color:transparent; text-decoration:none}

#main {width: 100%; height: 100%; margin: auto; text-aling: center; position: relative}
#logowc{width: 100%; height: 100%; position: absolute;}
#til:hover{ -webkit-filter: blur(0px);box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.4);z-index: 3; opacity: 80%;}
#tiles{width: 100%; height: 100%; z-index: 1; background-color: #000;}
#til{width: 20%; -webkit-filter: blur(8px);z-index: 2;}

#navbar{width: 100%; height: 45px; background-color: #fff; position: absolute; bottom: 0; box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.17);z-index: 2100;}
#navbarmobile{display: none;}
#mum{display: none;}

#ss{background-color: #fff; height: 90%; width: 100%; z-index: 10; position: absolute;}
#navbartextcomp{width: 500px; position: absolute; left: 50%; margin-left: -250px; top: 9px; display:inherit;}
#bubbles{width: 1100px; position: absolute;left: 50%;margin-left: -550px;bottom: 10%;}

#bub{}




t1{ color: #000; font-size: 20px; font-family: 'AvenirNext-UltraLight';}
t2{ color: #000; font-size: 14; font-family: 'AvenirNext-UltraLight';line-height: 225%;}

#ind{width: 280px; z-index: 10; top: 25%; position: absolute;left: 50%; margin-left: -140px;}
#icon{height: 200%; bottom: -13px; position: absolute;}

#cont{top: 25%; float: right;margin-top: 8%;
margin-right: 9%; margin-right: 5%; width: 150px; height: 150px;}


#txtblock {width: 800px;
float: left;
position: absolute;
left: 50%;
margin-left: -400px;
margin-top: 15%;
text-align: justify;
z-index: 1000;}







@media only screen and (min-width: 200px) and (max-width: 440px) { /*Handy*/
    #navbartextcomp{width: 500px; position: absolute; left: 50%; margin-left: -250px; top: 9px; display:none;}
    #navbarmobile{display: block; width: 100%; height: 100%; position: absolute; text-align: center; color: #000; font-size: 25px; font-family: 'AvenirNext-UltraLight'; z-index: 2300;}
    
    #navbar{height: 7%;}
    #navbarmobile:hover > #mum{top 0;}
    
    #menu{width: 100%; padding-top: 4px;}
    
    #menu:hover + #mum{top: 0;}
    
    #navbarmobile:active > #mum{top: 0;}
    #mum{
        
        width: 300px;
        height: 520px;
        left: 50%; margin-left: -150px;
        background-color: rgba(255, 255, 255, 0.95);
        z-index: 100;
        position: fixed;
        display: block;
        font-family: 'AvenirNext-UltraLight';
        padding-top: 10%;
        text-align: center;
        font-size: 40px;
        line-height: 180%;
        top: -10000px;
        box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.4);

    }
    #ende:active > #mum{top: -4000;}
    
    #txtblock{width: 78%;
position: relative;
margin: 0;
left: 0;
padding-top: 50px;
padding-left: 13%;
padding-right: 10%;
text-align: left; }
    
    #bubbles{display: none;}
    t2{ color: #626262;
font-size: 14px;
font-family: 'AvenirNextRegular';
line-height: 210%;}

    
}

@media only screen and (min-width: 440px) and (max-width: 1000px){ /*Tablet*/
    
    #navbartextcomp{width: 500px; position: absolute; left: 50%; margin-left: -250px; top: 9px; display:none;}
    #navbarmobile{display: block; width: 100%; height: 100%; position: absolute; text-align: center; color: #000; font-size: 25px; font-family: 'AvenirNext-UltraLight'; z-index: 2300;}
    #navbar{height: 4.5%;}


    
    #menu{width: 100%; padding-top: 4px;}
    
    #navbarmobile:focus, #navbarmobile:hover #mum{top: 0;}
    
    #menu:focus #mum{top: 0;}
    

    
    #mum{
        
        width: 300px;
        height: 520px;
        left: 50%; margin-left: -150px;
        background-color: rgba(255, 255, 255, 0.95);
        z-index: 100;
        position: fixed;
        display: block;
        font-family: 'AvenirNext-UltraLight';
        padding-top: 10%;
        text-align: center;
        font-size: 40px;
        line-height: 180%;
        top: -10000px;
        box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.4);

    }
    #ende:focus, #ende:hover > #mum{top: -32340;}
    
    #txtblock{width: 70%;
position: relative;
margin: 0;
left: 0;
padding-top: 50px;
padding-left: 15%;
padding-right: 15%;
    text-align:left; }
    
    #bubbles{display: none;}
    t2{ color: #000; font-size: 15px; font-family: 'AvenirNextRegular';line-height: 210%;}
}