﻿
/* ==========================================================
// Box Layout
// ========================================================== */

/* ----------------------------------------------------------
// General Box Styles
// ---------------------------------------------------------- */

body
{
    /*margin: 70px 0px 0px 0px;*/
}

div#Creativity > div
{
	/*padding-left: 10px;*/		
	/*padding-right: 10px;*/	
}

div#Creativity > div > div.Content
{
    max-width: 640px;
}

div.Wider,
div.Wider.Vertical
{
    height: 94px;
    margin-top: -48px;

    width: 180px;

    /*border: solid 1px lightgreen;*/
}


/* ----------------------------------------------------------
// Box Styles for selected areas
// ---------------------------------------------------------- */

a.Logo
{
    width: 300px;
}

@media (max-width: 409px)
{
    a.Logo
    {
        width: 200px;
    }
}

@media (max-width: 349px)
{
    a.Logo
    {
        width: 150px;
    }
}


/* ----------------------------------------------------------
// Column layout
// ---------------------------------------------------------- */

div.Light > div.Content .Columns > .column
{
    float: none !important;
    /*border: solid px red;*/
}

/* ----------------------------------------------------------
// Regular light content layout
// ---------------------------------------------------------- */

div.Light > div.Content
{
    padding-top: 48px;
}


/* ----------------------------------------------------------
// Parallax Scrolling
// ---------------------------------------------------------- */

div#Creativity > div.Parallax > div
{
    background-size: auto 180%; /* Responsive */
}


/* ----------------------------------------------------------
// Footer (Contrast)
// ---------------------------------------------------------- */

div#Creativity > div#Contrast > div.Content
{
    padding-top: 14px;
    padding-bottom: 14px;
}

div#Creativity > div#Contrast > div.Content > div,
div#Creativity > div#Contrast > div.Content > div.First,
div#Creativity > div#Contrast > div.Content > div.Second,
div#Creativity > div#Contrast > div.Content > div.Third,
div#Creativity > div#Contrast > div.Content > div.Fourth
{
    width: 100%;
    /*margin-top: 0px;*/
}

div#Creativity > div#Contrast > div.Content > div > *
{
    line-height: 25px;
}

    div#Creativity > div#Contrast > div.Content > div.Separator
    {
        /*border: solid 1px pink;*/
        height: 24px;
        clear: both;
        float: none;
    }


/* ==========================================================
// Navigation
// ========================================================== */

/* ----------------------------------------------------------
// Main Navigation (Hierarchy Level 1)
// ---------------------------------------------------------- */

div#MainNavigation .Level1
{
    padding-top: 8px;
    height: 25px;
    /*line-height: 25px;*/
}

div#MainNavigation span
{
    display: block;
    /*border: solid 1px red;*/
}

div#MainNavigation span a
{
    display: block;

    /*border: solid 1px blue;*/
}

div#MainNavigation span a,
div#MainNavigation.Vertical span a
{
    font-size: 16px;
    line-height: 20px;
}

div#MainNavigation span.Separator
{
    /*line-height: 1px;*/
    display: none;
}


/* ==========================================================
// Fonts and Text
// ========================================================== */

h1
{
    font-size: 24px;
    line-height: 30px;
    padding-bottom: 48px;
}

h2
{
    font-size: 17px;		
    line-height: 24px;
}


/* ==========================================================
// Picture Styles (for Picture list)
// ========================================================== */

div.Picture
{
    width: 100%;
    max-width: 360px;
    float: none;

    margin-right: 0%;
}