﻿
/* ==========================================================
// Box Layout
// ========================================================== */

/* ----------------------------------------------------------
// General Box Styles
// ---------------------------------------------------------- */

html
{
    height: 100%;
}

body
{
    background-color: #ffffff;
    margin: 156px 0px 0px 0px; /* Responsive */
}

div#Creativity
{
    width: 100%;
}

div#Creativity > div
{
	padding-left: 25px;		/* Responsive */
	padding-right: 25px;	/* Responsive */
}

div#Creativity > div > div.Content
{
	/*border: solid 1px black;*/
	/*background-color: aquamarine;*/

	position: relative;
	/*max-width: 960px;*/		/* Responsive */
	margin: 0px auto;
}

div.Smaller
{
	/*border: dashed 1px red;*/
	/*background-color: greenyellow;*/

	/*width: 31.36%;*/
	/*width: 120px; /* Logo width + half of NaviSeparator */ /* Responsive */
	float: left;
}

div.Wider
{
	/*border: dashed 1px blue;*/
	/*background-color: azure;*/

	/*width: 68.64%;*/
	/*width: 659px;		/* Responsive */
	float: right;
}


/* ----------------------------------------------------------
// Box Styles for selected areas 
// ---------------------------------------------------------- */

a.Logo
{
	display: block;
	float: left;
	background-image: url('../images/Logo.png');	/* Responsive */
	width: 115px;		/* Responsive */
	height: 36px;		/* Responsive */
	background-repeat: no-repeat;

	border: 0px none;
	margin-top: 21px;								/* Responsive */
	margin-left: -4px;

    -webkit-print-color-adjust: exact;
    color-adjust: exact;
}

div#Creativity > div#Balance
{
	/*background-color: aquamarine;*/
	/*border: solid 1px red;*/

	height: 78px; /* Responsive */
	background-color: #f0f0f2;
    background-image: url('../images/HeaderLevel1.jpg');	
	background-repeat: no-repeat;
	background-position: center top;

	/* Default scrolling behaviour: */
	/*position: relative;*/

	/* Fixed scrolling behaviour: */
	position: fixed;
	z-index: 201;
	left: 0px;
	right: 0px;
	top: 0px;

    -webkit-print-color-adjust: exact;
    color-adjust: exact;
}

@media print
{
    div#Creativity > div#Balance
    {
        position: absolute;
    }
}

.Level2 div#Creativity > div#Balance
{
    background-image: url('../images/HeaderLevel2.jpg');
}

div#Creativity div.Title
{
	line-height: 78px;			/* Responsive */
	vertical-align: middle;
	color: #ffffff;
}

div#Creativity div.Title a
{
    color: #ffffff;
}

div#Creativity div.Title a.IconLink
{
    margin-left: 10px;
    font-family: 'Font Awesome 5 Free';
    font-size: 16px;
    vertical-align: top;
    font-weight: bold;
}

div#Creativity div.Title a.IconLink:hover
{
    text-decoration: none;
    color: #000000;
}

div#Creativity div.Title select
{
    color: #ffffff;
    background-color: #ffffff1c;
    border: none;
}

div#Creativity div.Title select option
{
    color: #40668a;
}



div#Creativity div.Smaller > div.Title
{
	float: left;
	margin-left: 10px;			/* Responsive */
}

div#Creativity > div#Balance > div.Content
{
	/*background-color: aquamarine;
	border: dotted 1px blue;*/

	height: 100%;
	position: relative;
}

div#Creativity > div#Balance > div.Content > div.ZeroGravity
{
	/*border: dotted 1px red;*/
	/*background-color: aquamarine;*/

	position: absolute;
	top: 50%;
	margin-top: -39px; /* Responsive */
	height: 78px;  /* Responsive */
	left: 0px;
	right: 0px;
}

div#Creativity > div#Visualization
{
	/*margin-top: 226px;*/

	background-color: #dedede;
	overflow: hidden;
	position: relative; /* Needed for lte IE7 */

	margin-bottom: 78px; /* Responsive */
}

div#Creativity > div#Visualization > div.Content
{
	/*position: relative;*/
}

div#Creativity > div#Visualization > div.Content > div.Slider
{
	height: 397px;			/* Responsive */
	width: 1680px;
	margin-left: -360px;	/* Responsive */
}

div#Creativity > div#Visualization > div.Content > div.Slider > ul > li
{
	background-color: #98b4ca;
}

div.Slider div.Slide
{
	/*background-color: azure;*/

	margin-left: 661px;  /* Responsive */ /* 360px + (345px/1100*960) */
	margin-top: 70px;    /* Responsive */ /* 78px - 8px */
	margin-right: 440px; /* Responsive */
}

@media only screen and (max-width: 921px)
{
	/* Show slider content left if on the right hand is too less space */
	
	div.Slider div.Slide
	{
		margin-left: 360px;
		margin-right: 740px;
	}

	div#Creativity > div#Visualization > div.Content > div.Slider li.panel
	{
		background-position: 230px 0px;
	}
}

div#Creativity > div.Ruler
{
	height: 39px;				/* Responsive */

	/* Fixed scrolling behaviour: */
	position: fixed;
	z-index: 200;
	left: 0px;
	right: 0px;
	margin-top: 0px;
}


@media print
{
    body
    {
        margin-top: 78px;   /* Responsive */
    }

    div#Creativity > div.Ruler
    {
        display: none;
    }
}

div#Creativity > div.Ruler.Main
{
	/*border: solid 1px red;*/
	background-color: #66a3dd;
	
	/* Fixed scrolling behaviour: */
	top: 78px;					/* Responsive */
}

.Level2 div#Creativity > div.Ruler.Main
{
    background-color: #ff0900;
}

div#Creativity > div.Ruler.Sub
{
	/*border: solid 1px red;*/
	background-color: #000000;
	
	/* Fixed scrolling behaviour: */
	top: 117px;					/* Responsive */
}

div#Creativity > div#Teaser
{
	background-color: #66a3dd;
}

div#Creativity > div#Contrast
{
	background-color: #fb3f94; /* Pink */
    height: 261px;             /* Responsive */
    overflow: hidden;
}

@media print
{
    div#Creativity > div#Contrast
    {
        display: none;
    }
}

.Level2 div#Creativity > div#Contrast
{
    background-color: #ff0900; /* Red */
}

div#Creativity > div.Light
{
    min-height: calc(100vh - 417px);
}

div#Creativity > div.Light > div.Content img
{
	width: 100%;
	border: none;
}


/* ----------------------------------------------------------
// Column layout
// ---------------------------------------------------------- */

div.Light > div.Content .Columns > .column > *
{
	margin-left: 19px;	/* Responsive */
	margin-right: 19px;	/* 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 .OnlyRightColumn
{
	position: relative;
	z-index: 2; 
	
	float: right;			/* Responsive */
	width: 50%;				/* Responsive */
	margin-bottom: 20px;	/* Responsive */
}

div.Light > div.Content .OnlyRightColumn > *
{
	margin-left: 19px;	/* Responsive */
}

div.Light > div.Content .OnlyLeftColumn
{
	position: relative;
	z-index: 2; 
	
	float: left;			/* Responsive */
	width: 50%;				/* Responsive */
	margin-bottom: 20px;	/* Responsive */
}

div.Light > div.Content .OnlyLeftColumn > *
{
	margin-right: 19px;	/* Responsive */
}



/* ----------------------------------------------------------
// Footer (Contrast)
// ---------------------------------------------------------- */

div#Creativity > div#Contrast > div.Content
{
	padding-top: 39px;		/* Responsive */
	padding-bottom: 48px;	/* Responsive */
}

div#Creativity > div#Contrast > div.Content > div
{
	float: left;
}

div#Creativity > div#Contrast > div.Content > div.Separator
{
	height: 1px;
	width: 4%;
}

div#Creativity > div#Contrast > div.Content > div.What
{
	width: 12%;			/* Responsive */
}

div#Creativity > div#Contrast > div.Content > div.Who
{
	width: 13%;			/* Responsive */
}

div#Creativity > div#Contrast > div.Content .OneChar
{
    display: inline-block;
    width: 15px;
}

div#Creativity > div#Contrast > div.Content > div.Where
{
	width: 12%;			/* Responsive */
}

div#Creativity > div#Contrast > div.Content > div.Functions
{
	width: 23%;			/* Responsive */
}

div#Creativity > div#Contrast > div.Content > div.More
{
	width: 20%;			/* Responsive */
}

div#Creativity > div#Contrast > div.Content img.LogoWhite
{
	margin-left: -3px;
}

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;
}

div#Creativity > div#Contrast > div.Content a,
div#Creativity > div#Contrast > div.Content a:visited
{
	text-decoration: underline;
}

div#Creativity > div#Contrast > div.Content a:hover
{
	text-decoration: none;
}

div#Creativity > div#Contrast > div.Content h6
{
	margin-top: 0px;
	margin-bottom: 10px; /* Responsive */
	color: #000000;
}



/* ==========================================================
// Navigation
// ========================================================== */

/* ----------------------------------------------------------
// Main Navigation (Hierarchy Level 1)
// ---------------------------------------------------------- */

div#MainNavigation
{
	height: 39px;			/* Responsive */
	line-height: 39px;		/* Responsive */
	vertical-align: middle;
	/*text-align: right;*/
}

div#MainNavigation div.MenuOpener
{
	display: none;		/* Responsive */
}

div#MainNavigation a
{
	text-decoration: none;
	color: #ffffff;
}

div#MainNavigation span.Separator
{
	/*background-color: #ff6600;*/

	width: 10px;	/* Responsive */
	display: inline-block;
	height: 1px;
}

div#MainNavigation a.Active,
div#MainNavigation a.Opened
{
	text-decoration: underline;
}

div#MainNavigation a:hover
{
	text-decoration: underline;
	-moz-text-decoration-style: dotted;
	-ie-text-decoration-style: dotted;
	-webkit-text-decoration-style: dotted;
	text-decoration-style: dotted;	
}

/* ----------------------------------------------------------
// Sub Navigation (Hierarchy Level 2 + 3)
// ---------------------------------------------------------- */

div#SubNavigation
{
	/*border: 1px solid red;*/

	max-height: initial;
	line-height: 39px;		/* Responsive */
	height: 39px;			/* Responsive */
	/*overflow: hidden;*/
	/*white-space: nowrap;*/
}

div#SubNavigation > div.Bar
{
	/*border: 1px dotted black;*/

	white-space: nowrap;
	overflow: hidden;
	position: relative;
	height: 39px;				/* Responsive */
	/*margin-left: 36px;		/* = 16px + 20px for separator */ /* Responsive */
	/*margin-right: 36px;		/* = 16px + 20px for separator */ /* Responsive */
}

div#SubNavigation a,
div#SubNavigation .SeparatorLine
{
	text-decoration: none;
	color: #ffffff;
}

div#SubNavigation *
{
	/*line-height: 78px;		/* Responsive */ /* TEST */
	/*height: 78px;				/* Responsive */ /* TEST */
}

div#SubNavigation .SeparatorLine
{
	line-height: 39px;		/* Responsive */
	vertical-align: top;
}

div#SubNavigation span.Separator,
div#SubNavigation span.MiniSeparator
{
	/*background-color: #ff6600;*/

	width: 10px;			/* Responsive */
	display: inline-block;
	height: 78px;
	height: 1px;
}

div#SubNavigation span.MiniSeparator
{
    width: 6px;             /* Responsive */
}

div#SubNavigation a.Active
{
	text-decoration: underline;
}

/*div.Ruler:hover div#SubNavigation .Active a
{
	text-decoration: none;
}*/

div#SubNavigation a:hover
{
	text-decoration: underline;
	-moz-text-decoration-style: dotted;
	-ie-text-decoration-style: dotted;
	-webkit-text-decoration-style: dotted;
	text-decoration-style: dotted;	
}

div#SubNavigation .Level2,
div#SubNavigation .Level2Separator
{
	vertical-align: top;
}

div#SubNavigation div.NavigateLeft,
div#SubNavigation div.NavigateRight
{
	/*border: 1px dotted green;*/

	/*display: none;		/* Modified via JS */
	width: 61px;		/* = 16px + 20px for separator + 25px for margin */ /* Responsive */
	height: 39px;		/* 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.gif');
	background-position: 25px center;	/* Responsive */
	float: left;
	margin-left: -25px;	/* Responsive */
}

div#SubNavigation div.NavigateRight
{
	background-image: url('../images/ArrowRightActive.gif');
	background-position: 20px center;	/* Responsive */
	float: right;
	margin-right: -25px;	/* Responsive */
}


/* ----------------------------------------------------------
// Extra (for right-aligned admin bars)
// ---------------------------------------------------------- */

div#SubNavigation div.Extra,
div#MainNavigation div.Extra
{
    float: right;
    padding-left: 20px;
    /*line-height: 35px;*/
    vertical-align: middle;

    color: #ffffff;
}

div.Extra a.Username
{
    color: #ffffff;
    margin-right: 10px;
}

div.Extra select.LanguageChooser
{
    font-family: 'Gill Sans W01 Medium', 'SourceSansProRegular', 'Trebuchet MS', Arial, Helvetica, sans-serif;
	font-size: 16px;
    display: inline-block;
    height: 22px;
}

div.Extra img.Flag
{
    border: 0px none;
    height: 18px;
    width: 18px;
    display: inline-block;
    /*line-height: 39px;*/
    vertical-align: text-bottom;
    top: 2px;
    margin-left: 10px;
}






/* ==========================================================
// Fonts and Text
// ========================================================== */

body, h1, h2, h3, h4, h5, h6, p,
#MainNavigation a,
#SubNavigation a,
#SubNavigation .SeparatorLine,
p.Pager select
{ 
	/*font-family: 'SourceSansProRegular', Arial, Helvetica, sans-serif;*/
	font-family: 'Gill Sans W01 Medium', 'SourceSansProRegular', 'Trebuchet MS', Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: normal;
	line-height: 25px;
	color: #000000;
}

::selection
{
	color: #ffffff;
	/*background-color: #66a3dd*/
	Background-color: #ff6600;
}

div#Contrast ::selection
{
	color: #fb3f94;
	background-color: #ffffff;
}

.Level2 div#Contrast ::selection
{
    color: #ff0900;
}

h1,
div.Slide div.Headline,
div.Slide div.Claim,
div.Title,
div.Title select,
h1 select
{
	/*font-family: 'SourceSansProLight', Arial, Helvetica, sans-serif;*/
	font-family: 'Gill Sans W01 Light', 'SourceSansProLight', Calibri, Arial, Helvetica, sans-serif;
	font-size: 24px;		/* Responsive */
	font-weight: normal;
}

div.Slide,
div.Slide a
{
	line-height: normal;
	color: #ffffff;
}

div.Slide div.Headline
{
	font-size: 44px;		/* Responsive */
	margin-bottom: 31px;	/* Responsive */
}

div.Slide div.Claim
{	
	line-height: 33px;		/* Responsive */
	margin-bottom: 33px;	/* Responsive */
	
}

div.Slide a.Link
{
	text-decoration: none;
}

div.Slide a.Link:hover
{
	text-decoration: underline;
}

h1,
h1 select
{
	color: #ff6600;
}

h1
{
	margin-top: 0px;
	padding-top: 35px;
}

h2
{
	margin-bottom: 0px;
	color: #40668a;
}

a
{
	color: #66a3dd;
	text-decoration: none;
}

a:hover
{
	text-decoration: underline;
}

a:visited
{
	color: #40668a;
}

a:active
{
	color: #ff6600;
}

ul,
ol
{
	margin-left: 0px;
	list-style-position: outside;
	text-indent: 0px;
	padding-left: 0px;
}

ul
{
	list-style-image: url(../images/BulletPoint.gif);
}

ul.NoVerticalSpace,
ol.NoVerticalSpace
{
    margin-top: 0px;
    margin-bottom: 0px;
}

li
{
	margin-left: 16px;
	padding-left: 0px;
	/*color: #000000;*/
}

.PrintPageBreak
{
    page-break-before: always;
}


/* ----------------------------------------------------------
// Color variations for other background colors (.FullWidth)
// ---------------------------------------------------------- */

.Orange,
.Orange a,
.Orange a:visited
{
    color: #ff6600;
}

.White h1,
.White a,
.White a:visited
{
	color: #ffffff;
}


/* ==========================================================
// Teaser
// ========================================================== */

div#Creativity > div#Teaser > div.Content
{
	padding-top: 17px;		/* Responsive */
	padding-bottom: 35px;	/* Responsive */
}

div#Creativity > div#Teaser > div.Content > div
{
	float: left;
	width: 19%;				/* Responsive */
}

div#Creativity > div#Teaser > div.Content > div.Separator
{
	float: left;
	width: 8%;				/* Responsive */
	height: 1px;
}

div#Creativity > div#Teaser > div.Content *
{
	color: #ffffff;
}

div#Creativity > div#Teaser > div.Content h2
{
	margin-bottom: 5px;
}

div#Creativity > div#Teaser > div.Content p
{
	margin-top: 0px;
	margin-bottom: 0px;
}

div#Creativity > div#Teaser > div.Content p.Description
{
	margin-bottom: 10px;	/* Responsive */
}

div#Creativity > div#Teaser > div.Content p.Picture
{

}

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;
    /*margin-top: 0px;*/
}


/* ==========================================================
// Form Div (for Registration, ...)
// ========================================================== */

div.Form
{
    font-size: 15px;
}

div.Form,
div.Form > div,
div.Form > div > *
{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

div.Form.Alternate,
div.Form.Important
{
    padding-top: 20px;
    padding-bottom: 1px;
    margin-bottom: 19px;
}

div.Form.Alternate
{
    background-color: #f5f5f5;
}

div.Form.Important
{
    background-color: #000000;
    color: #ffffff;
}

div.Form.Important p
{
    color: #ffffff;
}

div.Form > div
{
    /*clear: both;*/
    overflow: hidden;
    padding: 1px;
    margin: 0 0 12px 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
    {
        display: block;
        width: 40%;
        float: left;
        padding-right: 15px;
        padding-top: 4px;
    }

        div.Form > div > span.Label > .Description
        {
            display: block;
            color: #98b4ca;
            /*float: left;*/
            /*overflow: hidden;*/
            /*margin-bottom: 0px;
            padding-bottom: 0px;*/

            /*background-color: #ff6600;*/
        }

    div.Form > div > div,
    div.Form > div > fieldset > div
    {
        /*background-color: yellow;*/
        width: 60%;
        float: right;
    }

    /*div.Form > div > fieldset label
    {
        font-size: 90%;
    }*/


/*div.Form input,*/
div.Form input[type=text],
div.Form input[type=number],
div.Form input[type=password],
div.Form input[type=submit],
div.Form input[type=button],
div.Form input[type=file],
div.Form .LinkField,
div.Form textarea:not(.cke_source),
div.Form select
{
    width: 100%;
    /*border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;*/
    
    border: 1px solid #3a85c1;
    height: 30px;
    line-height: 26px;
    padding-left: 7px;
    padding-right: 7px;
    font-size: 15px;

    -moz-box-shadow: 0px 0px 5px #dedede;
	-webkit-box-shadow: 0px 0px 5px #dedede;
	box-shadow: 0px 0px 5px #dedede;

    font-family: 'Gill Sans W01 Medium', 'SourceSansProRegular', 'Trebuchet MS', Arial, Helvetica, sans-serif;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

div.Form textarea:not(.cke_source)
{
    width: 90%;
    height: 60px;
}

div.Form textarea.PlainText
{
    height: 150px;
}

div.Form input[type=file]
{
    border: 1px solid rgba(255, 255, 255, 0.00);
    background-color: #afcfed;
}

div#Creativity > div.Light > div.Content img.PreviewImage
{
    width: auto;
    height: auto;
}

div.Form .LinkField,
div.Form .LinkField.ReadOnly
{
    color: #66a3dd;
    display: inline-block;
    /*text-decoration: none*/
    /*border: 0px none;*/
}

    div.Form .LinkField:hover
    {
        /*text-decoration: none;*/
    }

    /*div.Form input,*/
    div.Form input[type=text],
    div.Form input[type=number],
    div.Form input[type=password],
    div.Form input[type=submit],
    div.Form input[type=button],
    div.Form input[type=file],
    div.Form .LinkField,
    div.Form select
    {
        width: 70%;
    }

        div.Form input.Small
        {
            width: 20%;
        }

        div.Form input.Medium
        {
            width: 49%;
        }

        /*div.Form input,*/
        div.Form input[type=text]:focus,
        div.Form input[type=number]: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:not(.cke_source),
        div.Form select:focus
        {
            outline: 0;
            border: 1px solid #66a3dd;
            -moz-box-shadow: 0px 0px 5px #66a3dd;
            -webkit-box-shadow: 0px 0px 5px #66a3dd;
            box-shadow: 0px 0px 5px #66a3dd;
        }

div.Form .ImageField,
div#Creativity > div.Light > div.Content div.Form .ImageField
{
    display: block;
    width: 150px;
}


div.Form input.HalfSize
{
    width: 24%;
}

div.Form input.WiderSize
{
    width: 30%;
}

div.Form input.FourtyPercent
{
    width: 40%;
}

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,
div.Form textarea.ReadOnly:not(.cke_source),
div.Form textarea.ReadOnly:focus:not(.cke_source),
div.Form textarea[readonly="readonly"]:not(.cke_source),
div.Form textarea[disabled="disabled"]:not(.cke_source),
div.Form textarea[readonly="readonly"]:focus:not(.cke_source),
div.Form textarea[disabled="disabled"]:focus:not(.cke_source)
{
    color: #acacb3;
    border: 1px solid #dedede;
}

div.Form select
{
    padding-right: 0px;
}

div.Form ul
{
    margin-left: 0px;
    padding-left: 0px;
    list-style-position: inside;
    list-style-type: none;
    list-style-image: none;
    margin-top: 5px;
}

div.Form ul > li
{
    margin-left: 22px;
    padding-left: 0px;
    text-indent: -22px;
}

div.Form > hr
{
    border: none;
    height: 5px;
    background-color: #66a3dd;
    margin-top: 5px;
    margin-bottom: 15px;
}

.Validator
{
    color: #ff6600;
}

div.Form .Validator
{
    float: left;
    width: 100%;
}

.Okay
{
    color: #66a3dd;
}

.Error
{
    color: #ff6600;
}

.Note
{
    color: #40668a;
}

div.Form .Title
{
    display: block;
    color: #40668a;
    padding-top: 4px;
}

div.Form .SingleLanguage
{
    clear: both;
}

    div.Form .SingleLanguage .LanguageName
    {
        /*float: left;*/
        height: 25px;
        display: block;
        color: #40668a;
        padding-top: 4px;
    }

    div.Form .SingleLanguage:hover .LanguageName
    {
        color: #fb3f94;
    }

    .Level2 div.Form .SingleLanguage:hover .LanguageName
    {
        color: #ff0900;
    }

    div.Form .SingleLanguage div.SingleValue
    {
        margin-bottom: 3px;
    }

        div.Form .SingleLanguage div.SingleValue .SingleValueButtons
        {
            display: inline-block;
            padding-top: 2px;
            padding-bottom: 2px;
            vertical-align: top;
        }

    div.Form .SingleLanguage .AutoTranslate
    {
        display: block;
        text-align: right;
        height: 25px;
        /*width: 100%;*/
        /*width: auto;*/
        /*float: right;*/
        position: absolute;
        margin-top: -25px;
        margin-left: 200px;
    }

div.Form .SingleLanguageSeparator
{
    height: 12px;
}

div.Form .TextNote
{
    display: block;
    color: #40668a;
}

@media (max-width: 700px)
{
    div.Form > div
    {
        margin: 0 0 10px 0;
    }

        div.Form > div > label,
        div.Form > div > span.Label,
        legend
        {
            width: 100%;
            float: none;
            margin: 0 0 5px 0;
        }

        div.Form > div > div,
        div.Form > div > fieldset > div
        {
            width: 100%;
            float: none;
        }

    /*div.Form input,*/
    div.Form input[type=text],
    div.Form input[type=number],
    div.Form input[type=password],
    div.Form input[type=submit],
    div.Form input[type=button],
    div.Form input[type=file],
    div.Form .LinkField,
    div.Form textarea:not(.cke_source),
    div.Form select
    {
        width: 100%;
    }

    div.Form input.Small
    {
        width: 20%;
    }

    div.Form input.Medium
    {
        width: 77%;
    }

    div.Form .SingleLanguage div.SingleValue .SingleValueButtons
    {
        display: block;
        text-align: right;
        margin-bottom: 3px;
    }

    div.Form input.HalfSize
    {
        width: 44%;
    }

}

@media (min-width: 900px)
{
    div.Form > div > label,
    div.Form > div > span.Label,
    legend
    {
        text-align: right;
    }
}


/* ----------------------------------------------------------
// Panel Box (for Profile editing)
// ---------------------------------------------------------- */

div.PanelBox
{
}

    div.PanelBox > div.Tabs
    {
        width: 100%;
        margin-bottom: 35px;
    }

        div.PanelBox > div.Tabs > a,
        div.PanelBox > div.Tabs > span.Spacer
        {
            white-space: nowrap;
            line-height: 24px;
            vertical-align: top;
            text-decoration: none;
            padding-right: 15px;
            color: #66a3dd;
        }

            div.PanelBox > div.Tabs > a:hover
            {
                color: #ff6600;
            }

            div.PanelBox > div.Tabs > a.Active,
            div.PanelBox > div.Tabs > a.Active:hover
            {
                color: #000000;
                cursor: default;
            }

        div.PanelBox > div.Tabs > span.Spacer
        {
            display: none;
        }

        div.PanelBox > div.Tabs > a.EditData
        {
            float: right;
        }

    div.PanelBox > div.Content
    {
        margin-top: 0px;
    }



/* ==========================================================
// 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: #ff6600;
	float: left;
	display: block;
	clear: both;
}

table.FormTable .InputField
{
	/*width: 220px;				/* Responsive */
	width: 100%;
	font-family: 'Gill Sans W01 Medium', 'SourceSansProRegular', 'Trebuchet MS', Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 16px;
	color: #000000;
}

table.FormTable .InputField option[disabled]
{
    color: #ff6600;
}

table.FormTable .Button,
table.FormTable .Submit
{
	font-family: 'Gill Sans W01 Medium', 'SourceSansProRegular', 'Trebuchet MS', Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 16px;
	color: #000000;
}

table.FormTable .CheckboxField
{
	display: inline-block;
	width: 110px;
	white-space: nowrap;
}


/* ==========================================================
// Data Table (for BackEnd Data Listing)
// ========================================================== */

table.Data
{
    position: relative;
    transform: translateX(-50%);
    left: 50%;
    width: 100%;
    margin: 0px auto;

    border-collapse: collapse;
    font-size: 15px;
    line-height: 20px;
}

@media (max-width: 1290px)
{
    table.Data
    {
        transform: none;
        left: 0px;
    }
}

        table.Data thead td
        {
            border: 1px solid #40668a;
            color: #40668a;
        }

    table.Data > tbody > tr:not(.Subs):hover > td
    {
        background-color: #f3f9fb;
    }

    table.Data td
    {
        border: 1px solid #66a3dd;
        padding: 2px 6px;
        white-space: nowrap;
        background-color: #ffffff;
    }

        table.Data td.Small
        {
            padding: 0px 6px;
            font-size:   13px;
            line-height: 12px;
        }

        table.Data td.Small > span
        {
            color: #98b4ca;
        }

        table.Data td.Small > span:hover,
        table.Data td.Small > span.HighlightField:hover
        {
            color: #ff6600;
        }

        table.Data td.Small > span.HighlightField
        {
            color: #000000;
        }

        table.Data tbody td.Small.Center.Status
        {
            padding-top: 2px;
            vertical-align: top;
        }

        table.Data td.Status
        {
            width: 1%;
        }

        table.Data td.Wrap
        {
            white-space: normal;
        }

        table.Data td.TenthWidth
        {
            width: 10%;
            white-space: normal;
        }

        table.Data td.FifthWidth
        {
            width: 20%;
            white-space: normal;
        }

        table.Data td.QuarterWidth
        {
            width: 25%;
            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.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 span.HierarchyIndent
    {
        display: inline-block;
        background-color: #ffffff;
        width: 32px;
        height: 23px;
        margin-left: -3px;
        margin-top: -5px;
        background-color: #66a3dd;
    }*/

    table.Data td span.HierarchyIndent
    {
        display: inline-block;
        width: 32px;
        height: 10px;
        /*margin-left: -3px;
        margin-top: -5px;*/
        /*background-color: #ffffff;*/
        /*background-color: #66a3dd;*/
    }

    table.Data td.Hierarchical
    {
        position: relative;
    }

    table.Data td span.HierarchyHideLine
    {
        display: block;
        width: 32px;
        height: 1px;
        float: left;
        position: absolute;
        left: 0px;
        top: -1px;
                
        background-color: #ffffff;
        /*background-color: #ff6600;*/

        /*display: none;*/
    }

    table.Data tr.Subs > td
    {
        /*border-top: 0px none !important;*/
        padding: 5px;
        background-color: #dedede;
    }

    table.Data tr.Subs > td > table
    {
        margin-bottom: 0px;
    }


/* ----------------------------------------------------------
// Command buttons
// ---------------------------------------------------------- */

p.CommandButtons
{
    /*display: block;*/

    /*border: 1px solid red;*/

    float: right;
    margin-top: -2px;
    /*vertical-align: top;*/
    /*position: absolute;
    right: 0px;
    top: 0px;*/
}


/* ----------------------------------------------------------
// Regular and submit buttons
// ---------------------------------------------------------- */

.Button.Regular,
.Button.Submit,
.Button.Edit,
.Button.EditText
{	
    display: inline-block;
    border: 1px solid #3a85c1;
    height: 32px;
    line-height: 28px;
    padding-left: 7px;
    padding-right: 7px;
    font-size: 15px;

    -moz-box-shadow: 0px 0px 5px #dedede;
	-webkit-box-shadow: 0px 0px 5px #dedede;
	box-shadow: 0px 0px 5px #dedede;

    /*background-color: #66a3dd; /* #98b4ca; /* #40668a; */
    color: #ffffff;
    cursor: hand;
    cursor: pointer;

    background: #afcfed; /* Old browsers */
    background: -moz-linear-gradient(top,  #afcfed 0%, #66a3dd 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#afcfed), color-stop(100%,#66a3dd)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #afcfed 0%,#66a3dd 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #afcfed 0%,#66a3dd 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #afcfed 0%,#66a3dd 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #afcfed 0%,#66a3dd 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#afcfed', endColorstr='#66a3dd',GradientType=0 ); /* IE6-9 */
}

.Button.Green,
.Button.Edit.Green
{
    background: linear-gradient(to bottom, #45a92a 0%, #317e1c 100%);
}

.Button.Orange,
.Button.Edit.Orange
{
    background: linear-gradient(to bottom, #e69719 0%, #d88d2b 100%);
}

.Button.Red,
.Button.Edit.Red
{
    background: linear-gradient(to bottom, #ff0900 0%, #d11011 100%);
}

.Button.Disabled,
.Button.Edit.Disabled
{
    cursor: not-allowed;

    background: #dedede; /* Old browsers */
    background: -moz-linear-gradient(top,  #dedede 0%, #c6c6ce 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dedede), color-stop(100%,#c6c6ce)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #dedede 0%,#c6c6ce 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #dedede 0%,#c6c6ce 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #dedede 0%,#c6c6ce 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #dedede 0%,#c6c6ce 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dedede', endColorstr='#c6c6ce',GradientType=0 ); /* IE6-9 */
}

.Button.Icon
{
    /*font: normal normal normal 1px/1 'Font Awesome 5 Free';*/
    font-family: 'Font Awesome 5 Free';
    font-size: 14px;
    font-weight: bold;
    padding: 0px 3px;
    margin: 0px 2px;
    min-width: 22px;
    box-sizing: border-box;
}

.Button.Icon.Regular
{
    padding: 0px 8px;
}

.Button.EditText.Icon
{
    vertical-align: top;
    line-height: 18px;
}

.Button.Icon.Normal
{
    font-weight: normal;
}

.Button.Submit
{
    background: #66a3dd; /* Old browsers */
    background: -moz-linear-gradient(top, #66a3dd 0%, #40668a 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#66a3dd), color-stop(100%,#40668a)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #66a3dd 0%,#40668a 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #66a3dd 0%,#40668a 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #66a3dd 0%,#40668a 100%); /* IE10+ */
    background: linear-gradient(to bottom, #66a3dd 0%,#40668a 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66a3dd', endColorstr='#40668a',GradientType=0 ); /* IE6-9 */
}

.Button.Edit,
.Button.EditText
{
    height: 20px;
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 2px;
    line-height: 20px;
}

.Button.Edit
{
    width: 40px;
}

    .Button.Submit:focus,
    .Button.Regular:focus,
    .Button.Edit:focus,
    .Button.EditText:focus
    {
        border: 1px solid #66a3dd;
        -moz-box-shadow: 0px 0px 5px #66a3dd;
        -webkit-box-shadow: 0px 0px 5px #66a3dd;
        box-shadow: 0px 0px 5px #66a3dd;
        
    }

    .Button.Submit:hover,
    .Button.Regular:hover,
    .Button.Edit:hover,
    .Button.EditText:hover
    {
        border: 1px solid #40668a;
        -moz-box-shadow: 0px 0px 5px #40668a;
        -webkit-box-shadow: 0px 0px 5px #40668a;
        box-shadow: 0px 0px 5px #40668a;
        text-decoration: none;
    }

.Button.OrderProductToggler{
    width: 8px;
    text-align: center;
}


/* ----------------------------------------------------------
// Tree View
// ---------------------------------------------------------- */

.Tree
{
    max-height: 400px;
    overflow-y: scroll;

    /*border: 1px solid #3a85c1;
    -moz-box-shadow: 0px 0px 5px #dedede;
	-webkit-box-shadow: 0px 0px 5px #dedede;
	box-shadow: 0px 0px 5px #dedede;*/
}


/* ----------------------------------------------------------
// Small quare buttons, Data Pager
// ---------------------------------------------------------- */

p.Pager
{
    text-align: left;
    cursor: default;
}

    p.Pager > span:first-of-type
    {
        margin-right: 20px;
    }

    p.Pager > span > *,
    .SingleValueButtons > *,
    .SingleValueButtons > a:visited,
    .SquareButton,
    .SquareButton:visited,
    p.Pager select
    {
        color: #66a3dd;
        display: inline-block;
        border: 1px solid #66a3dd;
        height: 26px;
        width: 26px;
        text-align: center;
        text-decoration: none;
        -moz-box-shadow: 0px 0px 5px #66a3dd;
        -webkit-box-shadow: 0px 0px 5px #66a3dd;
        box-shadow: 0px 0px 5px #66a3dd;
        cursor: pointer;
    }

    p.Pager > span > a:hover,
    .SingleValueButtons > a:hover,
    .SquareButton:hover
    {
        border: 1px solid #ff6600;
        -moz-box-shadow: 0px 0px 5px #ff6600;
        -webkit-box-shadow: 0px 0px 5px #ff6600;
        box-shadow: 0px 0px 5px #ff6600;
        text-decoration: none;
    }

    p.Pager > span > span,
    .SingleValueButtons > span
    {
        border: 0px none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        cursor: default;
    }

    p.Pager > span > a[disabled=disabled],
    .SingleValueButtons > a[disabled=disabled],
    .SquareButton[disabled=disabled]
    {
        border: 1px solid #dedede;
        text-decoration: none;
        -moz-box-shadow: 0px 0px 5px #dedede;
        -webkit-box-shadow: 0px 0px 5px #dedede;
        box-shadow: 0px 0px 5px #dedede;
        cursor: default;
    }

    p.Pager > span > *.Triple,
    .SingleValueButtons > *.Triple,
    .SingleValueButtons > a.Triple:visited,
    .SquareButton.Triple,
    .SquareButton.Triple:visited
    {
        width: 86px;
    }

p.Pager select
{
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;

    -moz-box-shadow: 0px 0px 5px #dedede;
    -webkit-box-shadow: 0px 0px 5px #dedede;
    box-shadow: 0px 0px 5px #dedede;

    cursor: default;

    border: solid 1px #66a3dd;
    width: auto;
    color: #66a3dd;
    height: 28px;
    margin-right: 20px;
}

.PagerInfo
{
    color: #afcfed;
    margin-right: 20px;
    white-space: nowrap;
    /*text-align: right;
    display: block;
    float: right;*/
}

/* ----------------------------------------------------------
// XML Import Area and Print Events Area
// ---------------------------------------------------------- */

.XmlImportArea, 
.PrintArea
{
    background-color: #dedede;
    padding: 1px 15px 1px 15px;
    display: none;
}




/* ----------------------------------------------------------
// Status image
// ---------------------------------------------------------- */

img.Status,
div#Creativity > div.Light > div.Content img.Status
{
    /*display: inline-block;*/
    width: 18px;
    height: 18px;
    border: 0px none;
    vertical-align: text-top;    
}


/* ----------------------------------------------------------
// Several smaller classes
// ---------------------------------------------------------- */

.RightAligned
{
    clear: both;
    text-align: right;
}


/* ==========================================================
// Search
// ========================================================== */

.Search
{
	/*border: 1px solid blue;*/

	/*float: right;*/

    margin-top: -2px;

    display: inline-block;
    /*display: inline;*/

	width: 323px;
	height: 28px;

    position: relative;
}

	.Search .SearchBox
	{
		/*margin-top: 20px;*/
		border: 1px solid #00457c;
		height: 28px;
		line-height: 28px;
		width: 283px;
		padding-left: 7px;
		padding-right: 30px;
		font-size: 15px;

		background-position: right center;
		background-repeat: no-repeat;

		-moz-box-shadow: 0px 0px 5px #e3ebf1;
		-webkit-box-shadow: 0px 0px 5px #e3ebf1;
		box-shadow: 0px 0px 5px #6497bf;
	}

		.Search .SearchBox::-ms-clear
		{
			display: none;
		}

    .Search .SearchButton
    {
        right: 2px;
        top: 5px;

        position: absolute;
    }


/* ==========================================================
// Special Content Formatting
// ========================================================== */

/* ----------------------------------------------------------
// Website Changer
// ---------------------------------------------------------- */

.ProjectName
{
    /*display: inline-block;*/
    /*width: 250px;*/
}

.WebsiteName
{
    color: #dedede;
}


/* ----------------------------------------------------------
// ASP Classic and VNext iframes
// ---------------------------------------------------------- */

iframe.ClassicIframe
{
    width: 100%;
    height: 6000px;
    border: none 0px;
    margin-top: 30px;
}

iframe.VNextIframe
{
    width: 100%;
    height: calc(100vh - 156px);    /* Responsive */
    border: none 0px;
    /*border: solid 3px blue;*/
    position: fixed;
    left: 0px;
    top: 156px;                     /* Responsive */
    right: 0px;
    bottom: 0px;
    z-index: 1;
    /*opacity: 0.3;*/
}



/* --------------------------------- */
/* --------------------------------- */
/* --------------------------------- */


/* ==========================================================
// Simple Tables (for News Archive, Open Job List, ...)
// ========================================================== */

/*table.Simple
{
	border: 0px none;
	padding: 0px;
	border-spacing: 0px;
	border-collapse: collapse;
	width: 100%;
}

table.Simple thead td
{
	border-top: 0px none;
	font-weight: bold;
}

table.Simple td.NoWrap
{
	white-space: nowrap;
}

table.Simple td.NoWrap.SpaceLeft
{
	padding-left: 12px;
}

table.Simple td
{
	vertical-align: top;
	border-top: 1px solid #000000;
}

table.Simple td.MaxWidth
{
	width: 99%;
}*/


/* ==========================================================
// Text formats
// ========================================================== */

/*/x
p.SmallText
{
	font-size: 17px;
}

div.InlineDiv
{
	display: inline;
}
x/*/
