body
        {            
          margin:0;
          background-color:white;
          color:grey;
          font-family: 'Source Sans Pro', 'sans-serif';
          font-size:18px;
          font-weight:300;
        }
        
        /*header-wide-------------------------------*/
        
        header
        {
            height:200px;
            margin-top:24px;     
            text-align:center;
        }
        
        nav
        {
            width:80%;
            height:50px;
            margin:auto;
        }
        
        /*header-mobile----------------------------*/
                
        header.header-mobile
        {
            position:fixed;
            top:0;
            left:0;
            margin:0;
            width:100%;
            height:50px;          
            z-index:1;
            background-color:white;
            display:none;
            box-shadow: black 0 0 8px;
        }
        
        nav.nav-mobile
        {
            position:fixed;
            z-index:1;
            top:50px;
            width:100%;
            height:200px;
            background-color:white;
            display:none;
        }
        
        footer
        {
            overflow:auto;
            padding-top:80px;
            padding-bottom:80px;   
            text-align:center;
        }
        
        h3
        {
            margin:auto;
            margin-top:16px;
            margin-bottom:16px;
            max-width:1080px;
        }
        
        p
        {
            margin-top:20px;
            margin:auto;
            border:solid 0px lightgrey;
            max-width:1080px;            
        }

        p.space-p
        {
            
            margin-top:40px;
            margin-bottom:80px;
            max-width:960px;
        }
        
        p.center-p
        {
           text-align:center;        
        }

        p.undertitle
        {
           margin-top:20px;
           text-align:left;   
           max-width:99%;
        }
       
        /*links-------------------------------------*/
       
        a
        {
           color:#333;
           text-decoration:none;
           transition:0.35s;
        }
        
        a:hover
        {
            text-decoration:underline;
        }
        
        /*button------------------------------------*/
        
        button
        {
            height:50px;
            float:left;
            margin:0;
            padding:0;
            border:none;
            background-color:transparent;
            color:#333;
            font-size:22px;
            font-family:'Source Sans Pro','sans-serif';
            font-weight:300;
            cursor:pointer;
            transition:0.35s;
        }
        
        button:hover
        {
            text-decoration:underline;
            outline:none;
        }
        
        button:focus
        {
            outline:none;            
        }
        
        button.nav-btn
        {
            width:25%;
        }
        
        button.btn-active
        {
            text-decoration:underline;
        }

        button.nav-btn-mobile
        {
            width:100%;
            float:none;   
            font-size:18px;
            background-color:#eee;
        }
        
        button.nav-btn-mobile:hover
        {
            background-color:lightgrey;   
            text-decoration:none;
        }
        
        /*images-------------------------------------*/
        
        img.logo
        {
            height:200px;
            margin:auto;
            cursor:pointer;
        }
        
        img.logo-mobile
        {
            position:absolute;
            top:0;
            left:5%;
            height:50px;
            cursor:pointer;
        }
        
        img.footer-logo
        {
            height:80px;
            cursor:pointer;
        }

        img.small
        {
            position:relative;
            width:25%;
            left:37.5%;
            margin-top:30px;
            margin-bottom:30px;
            display: block;
        }

        img.medium
        {
            width:33%;
            position:relative;
            left:33%;
            margin-top:30px;
            margin-bottom:30px;
            display: block;
        }

        img.big
        {
            width:50%;
            position:relative;
            left:25%;
            margin-top:30px;
            margin-bottom:30px;
            display: block;
        }

        img.full
        {
            width:100%;
            margin-top:30px;
            margin-bottom:30px;
            display: block;
        }

        /*divs---------------------------------------*/
        
        div.container
        {
            display:none;
            width:80%;
            margin:auto;
            padding-top:40px;
            padding-bottom:80px;       
        }
        
        div#media
        {
            display:block;       
        }
                
        div#circus-video-item
        {
            padding-top:40px;           
        }
        
        div#contact
        {           
            text-align:center;
        }        
        
        div.tile
        {
            position:relative;
            width:24%;
            min-height:100px;
            min-width:100px;
            margin:0.5%;
            border:solid 0px lightgrey;
            box-sizing:border-box;
            float:left;
            cursor:pointer;
            opacity:0.60;
            transition:0.7s;
            
            background-position:center;
            background-size:cover;
            background-repeat:no-repeat;
        }
        
        div.tile:hover
        {
            opacity:1;   
        }
        
        div.tile-text
        {
            position:absolute;
            bottom:8px;
            right:16px;
            width:100%;
            height:32px;
            box-sizing:border-box;
            line-height:32px;
            color:white;
            text-align:right;
            font-size:20px;
            font-weight:400;            
        }
        
        div.container-video
        {
            clear:both;
            width:100%;
            margin:auto;
            padding-top:80px;
            padding-bottom:80px;
        }
        
        div.container-video-top
        {
            padding-top:240px;
        }
        
        div.video-item
        {
            text-align:center;
            margin:auto;
            margin-bottom:0px;
            width:99%;          
        }
        
        div.navicon
        {
            position:absolute;
            top:0;
            right:0;
            width:38px;
            height:26px;
            transition:0.35s;
            opacity:0.5;
            background:linear-gradient(
                grey 0%,
                grey 5%,
                white     5%,
                white     49%,
                grey 49%,
                grey 53%,
                white     53%,
                white     95%,
                grey 95%,
                grey 100%);
            border:solid 6px white;
            border-top:solid 12px white;
            border-bottom:solid 12px white;
            transition:0.35s;
            cursor:pointer;
        }

        div.navicon:hover
        {   
            opacity:1;
        }
                
        div.overlay
        {
            position:fixed;
            top:0;
            left:0;
            right:0;
            bottom:0;
            background-color:rgba(255,255,255,0.85);		
            display:none;
        }
        
        /*media-queries-----------------------------*/
                
        @media screen and (max-width: 1080px)
        {
            div.tile
            {
                width:32%;
                opacity:1;
            }
            
            div.tile-text
            {
                height:24px;
                right:4px;
                bottom:0px;
                line-height:24px;
                font-weight:300;
                font-size:16px;
            }
            
            div.container-video
            {
                padding-top:40px;
                padding-bottom:40px;
            }
                        
            div.container
            {
                width:92%;   
            }
        
            body
            {
                padding-top:50px;   
            }
            
            header
            {
                display:none;                
            }
            
            nav
            {
                display:none;                
            }
            
            header.header-mobile
            {
                display:block;
            }
        }

        @media screen and (orientation : landscape)
        {
            .tile
            {
                width:32%;
            }
        }        

        @media screen and (max-width:600px)
        {
            div.tile
            {
                width:49%;
            }
        }