﻿
/* ==========================================================
// Box Layout
// ========================================================== */

/* ----------------------------------------------------------
// General Box Styles
// ---------------------------------------------------------- */

/*html
{
    -ms-overflow-style: -ms-autohiding-scrollbar;
}*/

html, body
{
    height: 100%;
}

body
{
	background-color: #ffffff;
	margin: 0px 0px 0px 0px; /* old-Responsive */
}

form#ppadmin
{
    height: 100%;
}

div#Creativity
{
	width: 100%;
    height: 100%;
}

div#Creativity > div
{
	padding-left: 25px;		/* Responsive */
	padding-right: 25px;	/* Responsive */

    z-index: 5;
}

div#Creativity > div > div.Content
{
	/*border: solid 1px black;*/
	/*background-color: aquamarine;*/

	position: relative;
	max-width: 1100px;      /* Responsive */
	margin: 0px auto;
}

div.Smaller
{
    /*border: solid 1px green;*/
	/*float: left;*/
    position: absolute;
    left: 0px;             /* old-Responsive */
    top: 0px;
    bottom: 0px;
    width: 402px;
    overflow: hidden;
}

div.Wider
{
    /*border: solid 1px yellow;*/

    /*float: right;
    height: 100%;*/

    position: absolute;
    top: 50%;
    margin-top: -24px;      /* Responsive */
    /*bottom: 0px;*/
    height: 48px;           /* For Chrome only */ /* Responsive */
    right: 0px;             /* old-Responsive */
    /*bottom: 57%;*/
    /*margin-bottom: -80px;*/   /* old-Responsive */

    text-align: right;
    /*padding-left: 15px;*/     /* old-Responsive */
    /*padding-right: 0px;*/    /* old-Responsive */

    /*background-color: #0c2b1b;*/
    /*background-image: url('../images/TransparentBrown.png');*/
    /*background-color: rgba(43, 16, 13, 0.52);*/

    color: #ffffff;
}

div.Wider.Vertical
{
    height: 170px;
    margin-top: -89px;

    width: 300px;
}

br.Clearfix
{
    clear: both;
}


/* ----------------------------------------------------------
// Box Styles for selected areas
// ---------------------------------------------------------- */

a.Logo
{
    display: block;
    position: absolute;
	background-image: url('../images/Logo.svg?v=2');    /* old-Responsive */
	width: 400px;						            /* old-Responsive */			
	/*height: 287px;*/					                /* old-Responsive */
    /*max-height: 301px;*/
	background-repeat: no-repeat;
    background-size: contain;
    background-position: left center;

	border: 0px none;
    left: 0px;
    /*top: 43%;*/                                       /* old-Responsive */
    /*margin-top: -60px;*/                              /* old-Responsive */

    top: 0px;
    bottom: 0px;

    /*border: solid 1px red;*/

    /*background-color: rgba(230, 110, 118, 0.24);*/
}

@media (max-width: 869px)
{
    a.Logo
    {
        width: 300px;
    }
}

div#Creativity > div#Balance
{
	height: 315px;      /* old-Responsive */

	/* Default scrolling behaviour: */
	/*position: relative;*/

	/* Fixed scrolling behaviour: */
	position: fixed;
	z-index: 201;
	left: 0px;
	right: 0px;
	top: 0px;

    
    
    /*overflow: hidden;*/   /* old-Responsive */
    
    /*border: solid 1px blue;*/
}

div#Creativity > div#Balance > div#Pattern
{
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
   
    background-color: #d3e8dd;
    background-color: rgba(73, 145, 107, 0.85);

    /*background-image: url(../images/Pattern.jpg);
    background-repeat: repeat;
    background-position: center top;*/

    /*opacity: 0.4;*/

    /*border: solid 1px red;*/
}

@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
    div#Creativity > div#Balance > div#Pattern
    {
        

        /*opacity: 0.5;*/

                backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }
}

div#Creativity > div#Balance > div.Content
{
	height: 100%;
	position: relative;

    z-index: 202;
}

div#Creativity > div#Balance > div.Content > div.ZeroGravity
{
    /*border: solid 1px red;*/
	position: absolute;
    top: 0px;
    bottom: 0px;
	left: 0px;
	right: 0px;
}

div#Creativity > div#Visualization
{
	background-color: #dedede;
	overflow: hidden;
	position: relative; /* Needed for lte IE7 */

    margin-top: -101px;     /* old-Responsive */
}

html.lt-ie8 div#Creativity > div#Visualization
{
    top: -101px;            
    margin-bottom: -101px;  
}

div#Creativity > div#Visualization > div.Content > div.Slider
{
	height: 650px;			/* old-Responsive */
	width: 1680px;          /* old-Responsive */
	margin-left: -290px;	/* old-Responsive */
}

@media only screen and (max-height: 1040px)
{
    div#Creativity > div#Visualization > div.Content > div.Slider
    {
        height: 600px;
        margin-top: -50px;
    }
}

div#Creativity > div#Visualization > div.Content > div.Slider > ul > li
{
	background-color: #f3f1f1;
}

div.Slider div.Slide
{
	margin-left: 0px; 
	margin-top: 0px;
	margin-right: 0px;
}

div#Creativity > div#PreRuler
{
    height: 70px;       /* old-Responsive */
}

div#Creativity > div#Ruler
{
    position: relative;
	background-image: url('../images/TransparentRed.png');
    height: 70px;				/* old-Responsive */
	margin-top: -70px;			/* old-Responsive */
    z-index: 20;
}

div#Creativity > div#Ruler.Fixed
{
	/* Fixed scrolling behaviour: */
	position: fixed;
	/*z-index: 210;*/
	left: 0px;
	right: 0px;
	top: 101px;					/* old-Responsive */
	margin-top: 0px;
}

div#Creativity > div#Contrast
{
	background-color: #0c2b1b;
    background-image: url(../images/Footer.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}


/* ----------------------------------------------------------
// Column layout
// ---------------------------------------------------------- */

div.Light > div.Content .Columns > .column > *
{
	/*margin-left: 48px;*/	/* old-Responsive */
	/*margin-right: 48px;*/	/* old-Responsive */
}

div.Light > div.Content .Columns > .column.first > *
{
	/*margin-left: 0px;*/
}

div.Light > div.Content .Columns > .column.last > *
{
	/*margin-right: 0px;*/
}

div.Light > div.Content .Columns > .column
{
    box-sizing: border-box;
    padding-left: 48px;
    padding-right: 48px;
    /*border: solid 1px red;*/
}

div.Light > div.Content .Columns > .column.first
{
    padding-left: 0px;
}

div.Light > div.Content .Columns > .column.last
{
    padding-right: 0px;
}

div.Light > div.Content .Columns > .column > p > img:first-child,
div.Light > div.Content .Columns > .column > p > iframe:first-child
{
    /*color: red;*/
    margin-top: 5px;
}



/* ----------------------------------------------------------
// Regular light content layout
// ---------------------------------------------------------- */

div.Light > div.Content
{
    /*padding-top: 16px;*/
    padding-top: 96px;      /* Responsive */
    padding-bottom: 0px;

    /*-moz-columns: 2 auto;
    -webkit-columns: 2 auto;
    columns: 2 auto;

    -moz-column-gap: 96px;
    -webkit-column-gap: 96px;
    column-gap: 96px;

    margin-right: -96px;*/

    /*border: solid 1px black;*/
}

/*div.Light > div.Content > *
/*{
/*    width: 65%;         /* old-Responsive */
/*}
*/

/*div.Light > div.Content p:first-of-type
{
    color: red;
}*/

/*
/*div.Light > div.Content > *:last-child
/*{
/*    margin-bottom: 0px;
/*    padding-bottom: 0px;
/*}
/*
/*div.Light[id] > div.Content > *:first-child
/*{
/*    padding-top: 70px;  /* old-Responsive */
/*}
*/

div.Light > div.Content img
{
	width: 100% !important;
    height: inherit !important;
	border: none !important;
}

/*div.Light > div.Content img.RightSide
/*{
/*    position: absolute;         /* old-Responsive */
/*    width: 29%;                 /* old-Responsive */
/*    right: 0px;                 /* old-Responsive */
/*    margin-top: 7px;            /* old-Responsive */
/*}
*/

div.Light > div.Content > h4:first-child
{
    /* Parallax picture titel */
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: 100;

    /*font-size: 20px;*/
	/*line-height: 30px;*/
    
    color: #505050;
    
    display: block;
    position: absolute;
    top: 0px;

    margin-top: -2px;
    margin-bottom: 0px;

    /*color: red;*/
}



/* ----------------------------------------------------------
// Parallax Scrolling
// ---------------------------------------------------------- */

div#Creativity > div.Light
{
    background-color: rgba(255, 255, 255, 0.90);
    /*background-color: rgba(182, 234, 145, 0.5);*/
    background-color: #ffffff;

    position: relative;
}

div#Creativity > div.Parallax
{
    /*background-color: yellow;*/
    
    /*height: 50%;*/
    width: 100%;

    padding-left: 0px;
    padding-right: 0px;

    margin-top: 0px;
    margin-bottom: 0px;
    
    padding-top: 0px;
    padding-bottom: 0px;

    display: none;
}

div#Creativity > div.Parallax#Parallax-0
{
    display: block;
}

/*
div#Creativity > div:nth-of-type(2n)
{
    border: solid 5px red;
}*/

div#Creativity > div.Parallax > div
{
    /*display: none;*/
    /*background-color: green;*/
    /*border: solid 10px black;*/

    position: fixed;

    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
    
    background-repeat: no-repeat;
    background-size:  cover;        /* Responsive */
    z-index: 1;
    padding-top: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}


/* ----------------------------------------------------------
// Footer (Contrast)
// ---------------------------------------------------------- */

div#Creativity > div#Contrast
{
    margin-top: 96px;      /* old-Responsive */
}

div#Creativity > div#Contrast > div.Content
{
    padding-top: 38px;		/* Responsive */
	padding-bottom: 38px;	/* Responsive */

    /*background-color: red;*/
}

div#Creativity > div#Contrast > div.Content > div
{
	float: left;    /* old-Responsive */
    width: 22%;     /* Responsive */
    position: relative;

    /*border: solid 1px white;*/

    /*background-color: blue;*/
}

div#Creativity > div#Contrast > div.Content > div.First
{
    width: 32%;     /* Responsive */
}

div#Creativity > div#Contrast > div.Content > div.Second
{
    width: 33%;     /* Responsive */
}

div#Creativity > div#Contrast > div.Content > div.Third
{
    width: 25%;     /* Responsive */
}

div#Creativity > div#Contrast > div.Content > div > *
{
    line-height: 34px;
}

div#Creativity > div#Contrast > div.Content > div.Separator
{
	height: 1px;    /* Responsive */
	width: 0%;
    /*background-color: red;*/
}


div#Creativity > div#Contrast > div.Content .OneChar
{
    display: inline-block;
    width: 15px;
}

div#Creativity > div#Contrast > div.Content p,
div#Creativity > div#Contrast > div.Content a,
div#Creativity > div#Contrast > div.Content a:visited
{
	margin-top: 0px;
	margin-bottom: 0px;
	color: #ffffff;

    -moz-hyphens: none;
    -o-hyphens: none;
    -webkit-hyphens: none;
    -ms-hyphens: none;
    hyphens: none; 
}

div#Creativity > div#Contrast > div.Content a,
div#Creativity > div#Contrast > div.Content a:visited
{
	text-decoration: none;
}

div#Creativity > div#Contrast > div.Content a:hover
{
	text-decoration: underline;
}

div#Creativity > div#Contrast > div.Content strong
{
	margin-top: 0px;
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: bold;
}

div#Creativity > div#Contrast > div.Content span.Love
{
    font-family: 'Font Awesome 5 Free';
    font-weight: normal;
}


/* ==========================================================
// Navigation
// ========================================================== */

/* ----------------------------------------------------------
// Main Navigation (Hierarchy Level 1)
// ---------------------------------------------------------- */

div#MainNavigation
{
	/*line-height: 134px;		
	vertical-align: middle;*/
}

div#MainNavigation div.MenuOpener
{
	display: none;		/* old-Responsive */
}

div#MainNavigation .Level1
{
    /*border: solid 1px blue;*/
    display: block;
    position: relative;
    height: 48px;
    line-height: 48px;
    vertical-align: middle;
    
    /*top: 50%;*/
    /*margin-top: -13px;*/
}

div#MainNavigation a
{
    /*text-transform: uppercase;*/

    font-weight: bold;
	text-decoration: none;
	color: #ffffff;
}

div#MainNavigation span.Separator
{
	width: 5px;	            /* old-Responsive */
	display: inline-block;  /* Responsive */
	height: 1px;
}

div#MainNavigation a.Active,
div#MainNavigation .Active a
{
    font-family: Nexa, Arial, Helvetica, sans-serif;
    text-decoration: underline;

    /*border-bottom: 5px solid #0c2b1b;
    border-bottom: 5px solid rgba(43, 16, 13, 0.52);*/
}

div#MainNavigation a:hover
{
    /*border-bottom: 5px solid #ffffff;*/
    text-decoration: underline;
    /*opacity: 0.8;*/
}

div#MainNavigation.Vertical span
{
    display: block;
}

div#MainNavigation.Vertical span a
{
    display: block;
    /*background-color: rgba(211, 33, 33, 0.39);*/

    font-size: 33px;
    line-height: 33px;

    -moz-hyphens: none;
    -o-hyphens: none;
    -webkit-hyphens: none;
    -ms-hyphens: none;
    hyphens: none; 
}

div#MainNavigation.Vertical span.Separator
{
    height: 15px;
}

div#MainNavigation.Vertical a.Active,
div#MainNavigation.Vertical .Active a
{
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: bold;
}

div#MainNavigation.Vertical a:hover
{
    font-family: Nexa, Arial, Helvetica, sans-serif;
    text-decoration: underline;
}



/* ----------------------------------------------------------
// Sub Navigation (Hierarchy Level 2 + 3)
// ---------------------------------------------------------- */

div#SubNavigation
{
	max-height: initial;
	line-height: 70px;		/* old-Responsive */
	height: 70px;			/* old-Responsive */
}

div#SubNavigation > div.Bar
{
	white-space: nowrap;
	overflow: hidden;
	position: relative;
	height: 70px;			/* old-Responsive */
}

div#SubNavigation a,
div#SubNavigation .SeparatorLine
{
	text-decoration: none;
	color: #ffffff;
}

div#SubNavigation .SeparatorLine
{
	line-height: 70px;		/* old-Responsive */
	vertical-align: top;
}

div#SubNavigation span.Separator
{
	width: 20px;			/* old-Responsive */
	display: inline-block;
	height: 1px;
}

div#Ruler div#SubNavigation .Active > a
{
	text-decoration: underline;
}

div#SubNavigation a:hover
{
	text-decoration: underline;
}

div#SubNavigation .Level2,
div#SubNavigation .Level2Separator
{
	vertical-align: top;
}

html.lt-ie8 div#SubNavigation .Level2,
html.lt-ie8 div#SubNavigation .Level2Separator
{
    vertical-align: auto;
}

div#SubNavigation div.NavigateLeft,
div#SubNavigation div.NavigateRight
{
	/*display: none;		/* Modified via JS */
	width: 59px;		/* = 14px + 20px for separator + 25px for margin */ /* old-Responsive */
	height: 70px;		/* old-Responsive */
	background-repeat: no-repeat;
}

div#SubNavigation div.NavigateLeft:hover,
div#SubNavigation div.NavigateRight:hover
{
	cursor: hand;
	cursor: pointer;
}

div#SubNavigation div.NavigateLeft
{
	background-image: url('../images/ArrowLeftActive.png');
	background-position: 25px center;	/* old-Responsive */
	float: left;
	margin-left: -25px;	                /* old-Responsive */
}

div#SubNavigation div.NavigateRight
{
	background-image: url('../images/ArrowRightActive.png');
	background-position: 20px center;	/* old-Responsive */
	float: right;
	margin-right: -25px;	            /* old-Responsive */
}


/* ==========================================================
// Slider
// ========================================================== */

/* ----------------------------------------------------------
// Header slider
// ---------------------------------------------------------- */

/*div.Slider #HeaderSlider
/*{
/*    width: 1680px;
/*	height: 650px;
/*}
/*
/*div.Slider #HeaderSlider div.Slide
/*{
/*    position: relative;
/*    background-repeat: no-repeat;
/*    background-position: center top;
/*}
/*
/*div.Slider #HeaderSlider div.Slide a.Box,
/*div.Slider #HeaderSlider div.Slide a.Box:hover
/*{
/*    position: absolute;
/*
/*    right: 290px;           /* old-Responsive */
/*    bottom: 25px;           /* old-Responsive */
/*    height: 140px;          /* old-Responsive */
/*    min-width: 450px;       /* old-Responsive */
/*    padding-left: 15px;     /* old-Responsive */
/*    padding-right: 15px;    /* old-Responsive */
/*
/*    background-image: url('../images/TransparentWhite.png');
/*
/*    text-decoration: none;
/*}
/*
/*@media only screen and (max-width: 1149px)
/*{
/*	/* Show slider box left if on the right hand is too less space */
/*
/*    div.Slider #HeaderSlider div.Slide a.Box,
/*    div.Slider #HeaderSlider div.Slide a.Box:hover
/*    {
/*        right: auto;
/*        left: 290px;
/*    }
/*}
/*
/*@media only screen and (max-height: 1040px)
/*{   
/*    /* New box position if height is too low */
/*    div.Slider #HeaderSlider div.Slide a.Box,
/*    div.Slider #HeaderSlider div.Slide a.Box:hover
/*    {
/*        bottom: 75px;           /* old-Responsive */
/*    }
/*}
/*
/*
/*div.Slider #HeaderSlider div.Slide a.Box:hover
/*{
/*    background-image: none;
/*    background-color: #ffffff;
/*}
/*
/*div.Slider #HeaderSlider div.Slide a.Box div.Title
/*{
/*	font-family: 'Swiss_721 W01 Black', 'Arial Black', Arial, Helvetica, sans-serif, sans-serif;
/*    font-weight: normal;
/*    font-size: 42px;            /* old-Responsive */
/*    line-height: 42px;          /* old-Responsive */
/*    margin-top: 34px;           /* old-Responsive */
/*    margin-bottom: 7px;         /* old-Responsive */
/*    vertical-align: text-bottom;
/*    color: #d3e8dd;
/*    text-decoration: none;
/*}
/*
/*div.Slider #HeaderSlider div.Slide a.Box div.Subtitle
/*{	
/*    font-family: 'Swiss_721 W01 Black', 'Arial Black', Arial, Helvetica, sans-serif, sans-serif;
/*    font-weight: normal;
/*    font-size: 18px;        /* old-Responsive */
/*    line-height: 18px;      /* old-Responsive */
/*    margin-top: 0px;
/*    margin-bottom: 0px;
/*    color: #d3e8dd;
/*    text-decoration: none;
/*}
*/


/* ==========================================================
// Fonts and Text
// ========================================================== */

body, h1, h2, h3, h4, h5, h6, p
{ 
	/*font-family: 'Swiss_721 W01 Light', Arial, Helvetica, sans-serif;*/
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-style: normal;
    
	font-size: 17px;
	line-height: 28px;
	color: #0c2b1b;

    margin-top: 0px;
    /*margin-bottom: 0px;*/

    -moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto; 
}

p
{
    /*margin-left: -2px;*/
    /*margin-right: -2px;*/
}

::selection
{
	color: #ffffff;
	background-color: #d3e8dd;
}

div#Contrast ::selection
{
	color: #d3e8dd;
	background-color: #ffffff;
}

#MainNavigation a
{
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: 100;

    font-size: 17px;        /* old-Responsive */
}

#SubNavigation a,
#SubNavigation .SeparatorLine
{
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: 100;

    font-size: 20px;
}

h1
{
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: bold;

	font-size: 50px;		/* Responsive */
    line-height: 60px;      /* Responsive */
	color: #0c2b1b;
	margin-top: -11px;
    margin-bottom: -11px;
    padding-bottom: 96px;   /* Responsive */
	/*padding-top: 35px;*/
    margin-left: -3px;      /* old-Responsive */

    clear: both;
}

h2
{
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: bold;

	font-size: 30px;		    /* Responsive */
    line-height: 35px;          /* Responsive */
    margin-left: -1px;
    margin-right: -3px;
    margin-top: 0px;
	margin-bottom: 20px;        /* Responsive */
    color: #0c2b1b;

    clear: both;

    /*border: solid 1px red;*/
}

h3
{
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: bold;

	font-size: 23px;		    /* Responsive */
    line-height: 30px;          /* Responsive */
    margin-left: -1px;
    margin-right: -3px;
    margin-top: 0px;
	margin-bottom: 18px;        /* Responsive */
    color: #0c2b1b;

    /*border: solid 1px red;*/
}

h4, h5, h6
{
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: 100;

    font-size: 17px;            /* Responsive */
	line-height: 28px;          /* Responsive */
    margin-top: -28px;          /* Responsive */
    margin-bottom: 10px;
    color: #505050;

    /*border: solid 1px blue;*/
}

h4 > a
{
    background-image: url(../images/ButtonFullScreen.png);
    background-repeat: no-repeat;
    background-position: right center;
    padding-right: 19px;
}

h4 > a,
h4 > a:active,
h4 > a:visited
{
    color: #505050;
}

a,
a:active,
a:visited
{
	color: #d3e8dd;
	text-decoration: none;
}

a:hover
{
	text-decoration: underline;
}

ul,
ol
{
	margin-left: 0px;
	list-style-position: outside;
	text-indent: 0px;
	padding-left: 0px;
}

ul
{
	list-style-image: url(../images/BulletPoint.gif);
}

li
{
	margin-left: 16px;
	padding-left: 0px;
	/*color: #231f20;*/
}

em a,
em a:active,
em a:visited
{
     text-decoration: underline;
     color: #0c2b1b;
}

em a:hover
{
    color: #d3e8dd;
}

strong, b
{
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: bold;
}


/* ==========================================================
// Data Table (for BackEnd Data Listing)
// ========================================================== */

table.Data
{
    width: 100%;
    border-collapse: collapse;
}

    table.Data thead
    {
        
    }

        table.Data thead td
        {
            /*border: 1px solid #40668a;*/
            border-top: none;
            color: #505050;
            font-weight: normal;
            /*text-transform: uppercase;*/
            background-color: #f2f2f2;
        }

    table.Data tbody tr:hover td
    {
        background-color: #d3e8dd;
    }

    table.Data tbody tr.Highlighted td
    {
        background-color: #d3e8dd;
    }

    table.Data td
    {
        border-top: 1px solid #cecece;
        padding: 3px;
        padding-top: 3px;
        padding-bottom: 3px;
        padding-left: 7px;
        padding-right: 8px;
        white-space: nowrap;
        vertical-align: top;

        -moz-hyphens: none;
        -o-hyphens: none;
        -webkit-hyphens: none;
        -ms-hyphens: none;
        hyphens: none; 
    }

    table.Data td:first-child
    {
        padding-left: 3px;
    }

    table.Data td:last-child
    {
        padding-right: 3px;
    }

        table.Data td.Status
        {
            width: 1%;
        }

        table.Data td.QuarterWidth
        {
            width: 20%;
            white-space: normal;
        }

        table.Data td.HalfWidth
        {
            width: 45%;
            white-space: normal;
        }

        table.Data td.OneThirdWidth
        {
            width: 30%;
            white-space: normal;
        }

        table.Data td.TwoThirdsWidth
        {
            width: 60%;
            white-space: normal;
        }

        table.Data td.FullWidth
        {
            width: 95%;
            white-space: normal;
        }

        table.Data td.Text
        {
            white-space: normal;
        }

        table.Data td.Number
        {
            text-align: right;
        }

        table.Data td.Center
        {
            text-align: center;
        }

        table.Data td.NoRightSpace
        {
            padding-right: 0px;
        }

        table.Data td.NoLeftSpace
        {
            padding-left: 0px;
        }

        table.Data td a,
        table.Data td a:link,
        table.Data td a:active
        {
            color: #d3e8dd;
            text-decoration: underline;
        }

            table.Data td a:visited
            {
                color: #d3e8dd;
            }

                table.Data td a:hover,
                table.Data td a:visited:hover
                {
                    color: #505050;
                    text-decoration: underline;
                }

        div.Light > div.Content table.Data td img.Icon,
        div.Light > div.Content table.Data td .Icon img
        {
            /*vertical-align: text-bottom;*/
            /*margin-right: 0px;*/
            width: 20px !important;
            height: 20px !important;
        }
        
        table.Data + br.Clearfix
        {
            display: none;
        }

@media (max-width: 769px)
{

    table.Data, 
    table.Data thead,
    table.Data tbody,
    table.Data th,
    table.Data td,
    table.Data tr
    {
        display: block;
    }

    table.Data thead
    {
        display: none;
    }

    table.Data tbody tr:hover td,
    table.Data tbody tr.Highlighted td
    {
        background-color: inherit;
    }

    table.Data td,
    table.Data td:first-child,
    table.Data td:last-child
    {
        padding: 7px 0px 7px 0px;
        float: left; /* for IE9 */

        clear: both;
        width: inherit;

        text-align: left;
        border-top: none;

        margin-left: 135px;
    }

    table.Data td:before
    {
        content: attr(data-label) ": ";
        display: block;
        float: left;
        margin-left: -135px;
        font-weight: bold;
        color: #d3e8dd;
        width: 125px;
        text-align: left;
    }

    table.Data tr
    {
        border-top: 1px solid #cecece;
        clear: both;
    }

    table.Data tr:first-of-type
    {
        border-top: none;
    }

    table.Data + br.Clearfix
    {
        display: inherit;
    }
}


/* ==========================================================
// Teaser
// ========================================================== */

div#Creativity > div#Teaser > div.Content
{
    padding-top: 36px;
    padding-bottom: 46px;
}

div#Creativity > div#Teaser > div.Content > div
{
    /*border: solid 1px green;*/
	float: left;
	width: 22%;				/* old-Responsive */
}

div#Creativity > div#Teaser > div.Content > div.Separator
{
	float: left;
	width: 4%;				
	height: 1px;
}

div#Creativity > div#Teaser > div.Content *
{
	color: #231f20;
}

div#Creativity > div#Teaser > div.Content h2
{
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: normal;

    font-size: 20px;
    line-height: 20px;
	margin-bottom: 24px;        /* old-Responsive */
}

div#Creativity > div#Teaser > div.Content p
{
	margin-top: 0px;
	margin-bottom: 0px;
}

div#Creativity > div#Teaser > div.Content p.Description
{
	margin-bottom: 0px;	
}

div#Creativity > div#Teaser > div.Content p.Picture
{

}

div#Creativity > div#Teaser > div.Content p.Link
{
    text-align: right;
}

div#Creativity > div#Teaser > div.Content img
{
	width: 100%;
}

div#Creativity > div#Teaser > div.Content a,
div#Creativity > div#Teaser > div.Content a:visited 
{
    
	/*color: #ffffff;*/
	text-decoration: underline;
}

div#Creativity > div#Teaser > div.Content a:hover
{
	text-decoration: none;
}


/* ==========================================================
// News Styles (for News and Archive)
// ========================================================== */

div.News p.Date,
div.Light > div.Content .Columns > .column > p.Date
{
	float: left;
	display: inline-block;
	margin-right: 5px;
	margin-bottom: 0px;
}


/* ==========================================================
// Picture Styles (for Picture list)
// ========================================================== */

div.Pictures
{
    /*border: solid 1px green;*/
    /*margin: -2%;*/
}

div.Pictures h2
{
    /*margin: 2%;*/
}

div.Picture
{
    /*display: inline-block;*/
    /*vertical-align: top;*/

    width: 30.6%;       /* Responsive */
    float: left;        /* Responsive */

    margin-right: 4%;   /* Responsive */

    /*margin: 2%;*/
    
    /*clear: both;*/

    /*background-color: lightcoral;*/
}

div.Picture:nth-of-type(3n+2)
{
    margin-right: 0%;
    /*border: solid 1px red;*/
}

div.PictureSeparator
{
    /*display: inline-block;*/
    /*width: 1%;*/
    float: left;

    background-color: blue;
    width: 4%;
    height: 4%;
    /*height: 20px;
    width: 20px;*/

    display: none;
}

div.Light > div.Content div.Picture img
{
    /*width: auto !important;*/
}



/* ==========================================================
// Form Table (for Guestbook Entry, ...)
// ========================================================== */

table.FormTable
{
	display: block;
	clear: both;	
	/*width: 100%;*/
}

table.FormTable td
{
	width: auto;
}

table.FormTable td.LabelColumn
{
	padding-right: 15px;
	vertical-align: top;
	/*white-space: nowrap;*/
	width: 25%;
}

table.FormTable .Validator,
table.SimpleTable .Validator
{
	color: #b6260c;
	float: left;
	display: block;
	clear: both;
}

table.FormTable .InputField
{
	/*width: 220px;				*/
	width: 100%;
	font-weight: normal;
	font-size: 16px;
	color: #231f20;
}

table.FormTable .Button,
table.FormTable .Submit
{
	font-weight: normal;
	font-size: 16px;
	color: #231f20;
}

table.FormTable .CheckboxField
{
	display: inline-block;
	width: 110px;
	white-space: nowrap;
}


/* ==========================================================
// Form Div (for Registration, ...)
// ========================================================== */

div.Form *
{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

div.Form > div
{
    /*clear: both;*/
    overflow: hidden;
    padding: 1px;
    margin: 0 0 20px 0;
}

div.Form > div > fieldset
{
    border: 0;
    padding: 0;
}

    div.Form > div > fieldset > div > div
    {
        margin: 0 0 5px 0;
    }

    div.Form > div > label,
    div.Form > div > span.Label,
    legend
    {
        width: 43%;
        float: left;
        padding-right: 48px;
        padding-top: 6px;
        /*text-align: right;*/
    }

        div.Form > div > span.Label > .Description
        {
            display: block;
            color: #0c2b1b;
        }

    div.Form > div > div,
    div.Form > div > fieldset > div
    {
        /*background-color: yellow;*/
        width: 57%;
        float: right;
        padding-top: 5px;
        padding-left: 48px;
    }

    /*div.Form > div > fieldset label
    {
        font-size: 90%;
    }*/


div.Form input[type=text],
div.Form input[type=password],
div.Form input[type=submit],
div.Form input[type=button],
div.Form input[type=file],
div.Form textarea,
div.Form select
{
    width: 100%;
    
    border: none;
    height: 32px;
    line-height: 30px;
    padding-left: 7px;
    padding-right: 7px;
    font-size: 20px;
    font-family: Nexa, Arial, Helvetica, sans-serif;
    font-weight: normal;
	color: #0c2b1b;

    background-color: #f2f2f2;

    /*-moz-box-shadow: 0px 0px 5px #0c2b1b;
	-webkit-box-shadow: 0px 0px 5px #0c2b1b;
	box-shadow: 0px 0px 5px #0c2b1b;*/

}

div.Form input[type=checkbox]
{
    width: auto;
}

    div.Form *::-ms-clear,
    div.Form *::-ms-reveal
    {
        display: none;
    }

div.Form input[type=file]
{
    border: 1px solid rgba(255, 255, 255, 0.00);
    background-color: #0c2b1b;
}

    div.Form input.Button.Submit
    {
        background-color: #505050;
        color: #ffffff;
        cursor: hand;
        cursor: pointer;
    }

    div.Form input[type=text],
    div.Form input[type=password],
    div.Form input[type=submit],
    div.Form input[type=button],
    div.Form input[type=file],
    div.Form select
    {
        width: 100%;
    }

        div.Form input.Small
        {
            width: 20%;
        }

        div.Form input.Medium
        {
            width: 49%;
        }

        div.Form input[type=text]:focus,
        div.Form input[type=password]:focus,
        div.Form input[type=submit]:focus,
        div.Form input[type=button]:focus,
        div.Form input[type=file]:focus,
        div.Form .LinkField:focus,
        div.Form textarea:focus,
        div.Form select:focus
        {
            /*outline: 0;*/
            /*border: 1px solid #058be0;*/
            /*-moz-box-shadow: 0px 0px 5px #058be0;
            -webkit-box-shadow: 0px 0px 5px #058be0;
            box-shadow: 0px 0px 5px #058be0;*/
            background-color: #b7cfd7;
        }

div.Form input.HalfSize
{
    width: 34%;
}

div.Form input[readonly="readonly"],
div.Form input[disabled="disabled"],
div.Form select[disabled="disabled"],
div.Form .ReadOnly,
div.Form input[disabled="disabled"]:focus,
div.Form select[disabled="disabled"]:focus,
div.Form .ReadOnly:focus
{
    color: #0c2b1b;
    border: 1px solid #0c2b1b;
    
}

div.Form select
{
    padding-right: 0px;
}

div.Form > div > div.Text
{
    margin-top: 6px;
}

/*div.Form p 
{
    color: #4e565c;
}*/

.Validator
{
    color: #b6260c;
}

div.Form .Validator
{
    float: left;
    width: 100%;
}

.Okay
{
    color: #0eb62e;
}

.Error
{
    color: #b6260c;
}


@media (max-width: 769px)
{
    div.Form > div
    {
        margin: 0 0 20px 0;
    }

        div.Form > div > label,
        div.Form > div > span.Label,
        legend
        {
            width: 100%;
            float: none;
            margin: 0 0 5px 0;
            /*text-align: left;*/
        }

        div.Form > div > span.Label > .Description
        {
            margin-bottom: -20px;
        }

        div.Form > div > div,
        div.Form > div > fieldset > div
        {
            width: 100%;
            float: none;
            padding-left: 0px;
        }

    div.Form input,
    div.Form input[type=text],
    div.Form input[type=password],
    div.Form textarea,
    div.Form select
    {
        width: 100%;
    }

    div.Form input.Small
    {
        width: 20%;
    }

    div.Form input.Medium
    {
        width: 77%;
    }

}

@media (min-width: 991px)
{
    div.Form > div > label,
    div.Form > div > span.Label,
    legend
    {
        text-align: right;
    }
}


/* ==========================================================
// Gallery Styles (for Gallery Tables, Gallery Links, ...)
// ========================================================== */

table.GalleryTable
{
	display: block;
	clear: both;
    margin-top: 20px;
}

table.GalleryTable td.DateColumn
{
	padding-right: 10px;
	vertical-align: top;
	white-space: nowrap;	
}

div.Light > div.Content > div.GalleryItems
{
    width: auto;
}

div.GalleryItems
{
	margin-top: 20px;
    margin-right: -25px;    /* old-Responsive */
}

a.GalleryImage
{
	display: block;
	float: left;
    width: 200px;           /* old-Responsive */
	height: 200px;          /* old-Responsive */
    background-repeat: no-repeat;
	background-position: center center;
	background-color: #0c2b1b;
	margin-right: 25px;     /* old-Responsive */
	margin-bottom: 25px;    /* old-Responsive */
}


/* ==========================================================
// Blog
// ========================================================== */

.BlogTitle
{
    margin-bottom: 12px;
}

.BlogStatusLine
{
    margin-top: 12px;
}

.BlogCommentSection
{
    padding: 0px 0px 0px 0px;
    margin: 0 0 0 0;
}

.Comments
{
    padding-top: 50px;
    margin-bottom: 25px;
}

.NoSpaceAfter
{
    margin-bottom: -11px;
}

hr
{
	display: block;
	
	height: 1px;
	border-top: none;
	border-right: none;
	border-left: none;
	border-bottom: solid 1px #0c2b1b;
	
	margin-top: 12px;
	margin-bottom: 0px;
}