
/* default styles for extension "tx_cssstyledcontent" */
	/* Headers */
	.csc-header-alignment-center { text-align: center; }
	.csc-header-alignment-right { text-align: right; }
	.csc-header-alignment-left { text-align: left; }

	div.csc-textpic-responsive, div.csc-textpic-responsive * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;  }

	/* Clear floats after csc-textpic and after csc-textpic-imagerow */
	div.csc-textpic, div.csc-textpic div.csc-textpic-imagerow, ul.csc-uploads li { overflow: hidden; }

	/* Set padding for tables */
	div.csc-textpic .csc-textpic-imagewrap table { border-collapse: collapse; border-spacing: 0; }
	div.csc-textpic .csc-textpic-imagewrap table tr td { padding: 0; vertical-align: top; }

	/* Settings for figure and figcaption (HTML5) */
	div.csc-textpic .csc-textpic-imagewrap figure, div.csc-textpic figure.csc-textpic-imagewrap { margin: 0; display: table; }

	/* Captions */
	figcaption.csc-textpic-caption { display: table-caption; }
	.csc-textpic-caption { text-align: left; caption-side: bottom; }
	div.csc-textpic-caption-c .csc-textpic-caption, .csc-textpic-imagewrap .csc-textpic-caption-c { text-align: center; }
	div.csc-textpic-caption-r .csc-textpic-caption, .csc-textpic-imagewrap .csc-textpic-caption-r { text-align: right; }
	div.csc-textpic-caption-l .csc-textpic-caption, .csc-textpic-imagewrap .csc-textpic-caption-l { text-align: left; }

	/* Float the columns */
	div.csc-textpic div.csc-textpic-imagecolumn { float: left; }

	/* Border just around the image */
	div.csc-textpic-border div.csc-textpic-imagewrap img {
		border: 2px solid black;
		padding: 0px 0px;
	}

	div.csc-textpic .csc-textpic-imagewrap img { border: none; display: block; }

	/* Space below each image (also in-between rows) */
	div.csc-textpic .csc-textpic-imagewrap .csc-textpic-image { margin-bottom: 10px; }
	div.csc-textpic .csc-textpic-imagewrap .csc-textpic-imagerow-last .csc-textpic-image { margin-bottom: 0; }

	/* colSpace around image columns, except for last column */
	div.csc-textpic-imagecolumn, td.csc-textpic-imagecolumn .csc-textpic-image { margin-right: 10px; }
	div.csc-textpic-imagecolumn.csc-textpic-lastcol, td.csc-textpic-imagecolumn.csc-textpic-lastcol .csc-textpic-image { margin-right: 0; }

	/* Add margin from image-block to text (in case of "Text & Images") */
	div.csc-textpic-intext-left .csc-textpic-imagewrap,
	div.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap {
		margin-right: 10px;
	}
	div.csc-textpic-intext-right .csc-textpic-imagewrap,
	div.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap {
		margin-left: 10px;
	}

	/* Positioning of images: */

	/* Center (above or below) */
	div.csc-textpic-center .csc-textpic-imagewrap, div.csc-textpic-center figure.csc-textpic-imagewrap { overflow: hidden; }
	div.csc-textpic-center .csc-textpic-center-outer { position: relative; float: right; right: 50%; }
	div.csc-textpic-center .csc-textpic-center-inner { position: relative; float: right; right: -50%; }

	/* Right (above or below) */
	div.csc-textpic-right .csc-textpic-imagewrap { float: right; }
	div.csc-textpic-right div.csc-textpic-text { clear: right; }

	/* Left (above or below) */
	div.csc-textpic-left .csc-textpic-imagewrap { float: left; }
	div.csc-textpic-left div.csc-textpic-text { clear: left; }

	/* Left (in text) */
	div.csc-textpic-intext-left .csc-textpic-imagewrap { float: left; }

	/* Right (in text) */
	div.csc-textpic-intext-right .csc-textpic-imagewrap { float: right; }

	/* Right (in text, no wrap around) */
	div.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap { float: right; }

	/* Left (in text, no wrap around) */
	div.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap { float: left; }

	div.csc-textpic div.csc-textpic-imagerow-last, div.csc-textpic div.csc-textpic-imagerow-none div.csc-textpic-last { margin-bottom: 0; }

	/* Browser fixes: */

	/* Fix for unordered and ordered list with image "In text, left" */
	.csc-textpic-intext-left ol, .csc-textpic-intext-left ul { padding-left: 40px; overflow: auto; }

	/* File Links */
	ul.csc-uploads { padding: 0; }
	ul.csc-uploads li { list-style: none outside none; margin: 1em 0; }
	ul.csc-uploads img { float: left; margin-right: 1em; vertical-align: top; }
	ul.csc-uploads span { display: block; }
	ul.csc-uploads span.csc-uploads-fileName { text-decoration: underline; }

	/* Table background colors: */

	table.contenttable-color-1 { background-color: #EDEBF1; }
	table.contenttable-color-2 { background-color: #F5FFAA; }
	table.contenttable-color-240 { background-color: black; }
	table.contenttable-color-241 { background-color: white; }
	table.contenttable-color-242 { background-color: #333333; }
	table.contenttable-color-243 { background-color: gray; }
	table.contenttable-color-244 { background-color: silver; }
/* default styles for extension "tx_felogin_pi1" */
		.tx-felogin-pi1 label {
			display: block;
		}

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style-position: inside;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* own extension */
a:active, a:visited { 
    border: none;
    outline: none;
}

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}

/* ==========================================================================
    @author             : Bahne Claussen;
    @creator            : visuellverstehen UG;
    @contact            : http://www.visuellverstehen.de;
    @title              : styles.css;
    @date               : 2013;
    @lang               : German;
    ========================================================================== */

/*  ==========================================================================
    @section            : STANDARD;
    @media              : ALL;
    ========================================================================== */

html                    {
    background          : transparent url('../../fileadmin/assets/images/headerbg.jpg') 0px 150px repeat-x;
}

body                    {
    font-family         :sans-serif;
    font-size           : 16px;
    line-height         : 1.4em;
    color               : #000000;
    margin              : 0 auto;
}


header.site             {
    width               : 960px;
    margin              : 0 auto;
}

img                     {
    max-width           : 100%;
    height              : auto;
    vertical-align      : bottom;
}

h2                      {
    font-family         : sans-serif;
    font-weight         : bold;
    font-size           : 1.5em;
    margin-bottom       : 6px;
    color               : #0073b4;
    line-height         : 30px;

}

b                       {
    font-family         : sans-serif;
    font-weight         : bold;
    color               :#0073b4;

}

article                 {
    font-family         :sans-serif;
    font-size           : 16px;
    line-height         : 1.4em;
    color               : #000000;
    margin              : 0 auto;
}


a                       {
    text-decoration     : underline;
    color               : #000000;
}

a:hover                 {
    color               : #0073b4;
}


header,
.csc-header
h3,
.csc-default
p,
.csc-default
ul,
.csc-default
ol,
p.bodytext              {
    padding-bottom      : 1em;

}


/*  ==========================================================================
    @section            : HEADER;
    @media              : ALL;
    ========================================================================== */



h1                      {
    margin-top          : 3%;
    width               : 368px;
    height              : 89px;
    background          : transparent url('../../fileadmin/assets/images/logo.png') 0px 0px no-repeat;

}

h1 a                    {
    height              : 89px;
}
header.site             {

    height              :350px;

}
header.site
nav                     {
    font-size           : 16px;
    clear               : both;
}

header.site
nav
ul                      {
    list-style          : none;
    padding-left        : 60px;
    text-align          : left;


}

header.site
nav
ul
li                      {
    display             : inline;
    margin              : 0 15px;
    height              : 70px;
    line-height         : 50px;

}

header.site
nav
ul
li
a                       {
    color               : #323232;
    text-decoration     : none;

}

header.site
nav
ul
li:hover
a,
header.site
nav
ul
li.active
a                       {
    color               : #0073b4;
}


/*  ==========================================================================
    @section            : HEADERSLIDER;
    @media              : ALL;
    ========================================================================== */

aside.headerpic         {
    overflow            : hidden;
    float               : right;
    margin-right        : 50px;
    margin-top          : -118px;
    border              : 5px solid white;
    box-shadow          : 0px 1px 20px 2px #323232;
    margin-bottom       : 30px;
    background-color    : white;
}



/*  ==========================================================================
    @section            : Body;
    @media              : ALL;
    ========================================================================== */




div.wrap-right          {

    float               : right;
    width               : 500px;
    padding             : 45px 30px 30px 30px;
    position            : relative;
    z-index             : 5000;


}

div.wrap-left           {
    float               : left;
    width               : 250px;
    padding             : 45px 30px 30px 50px;
}

div.wrap-standard           {
    float               : left;
    width               : 90%;
    padding             : 45px 30px 30px 50px;
    margin-top          : -80px;
}

.error                  {
    padding-top         : 10px;
    color               : #0073b4;

}

section#main            {
    width               : 100%;
    border-top          : 3px  solid #0073b5;
    border-bottom       : 3px  solid #0073b5;
    margin-bottom       : 100px;
}

.content_box            {

    width               : 900px;
    margin              : 0 auto;
}



div.wrap-standard
ul
li                      {
    list-style          : url('../../fileadmin/assets/images/dirkjohannsen-aufzaehlung.png') outside;
    margin-left         : 23px;

}

#inputMessage           {
    max-width           : 320px;
    max-height          : 300px;
}


/*  ==========================================================================
    @section            : FOOTER;
    @media              : ALL;
    ========================================================================== */

footer.footer           {
    background          : #0073b5 url('../../fileadmin/assets/images/footerbg.jpg') center 0px repeat-y;
    background-size     : 100% auto;
    width               : 100%;
    height              : 10px;
    position: relative;
    bottom: -33px;
    z-index             : 10;
}


/*  ==========================================================================
    @section            : HELPER;
    @media              : ALL;
    ========================================================================== */

.hide-text              {
    display             : block;
    text-indent         : 100%;

    white-space         : nowrap;
    overflow            : hidden;
}

.hidden                 {
    display             : none;
    visibility          : hidden;
}

.clear                  {
    clear               : both;
}


/*  ==========================================================================
    @section            : ALL;
    @media              : MAX-WIDTH 960
    ========================================================================== */

@media all and (max-width:960px) {

    header.site         {
        height          : auto;
    }

    h1                  {
        margin          : 60px auto 0 auto;
    }

    aside.headerpic     {
        float           : none;
        margin          : 20px auto;
        width           : 80%;
        max-width       : 480px;
    }

    .content_box        {
        width           : 100%;
        margin          : 0 auto;
    }

    div.wrap-left       {
        width           : 30%;
        padding         : 5% 2% 5% 5%;
    }

    div.wrap-right      {
        width           : 55%;
        padding         : 5% 3% 5% 5%;
        position        : relative;
        z-index         : 5000;
    }

    div.wrap-standard   {
        width           : 90%;
    }


}

/*  ==========================================================================
    @section            : ALL;
    @media              : MAX-WIDTH 400
    ========================================================================== */

@media all and (max-width:480px) {

    h1                  {
        margin-top      : 20%;
        width           : 100%;
        height          : 89px;
        background      : transparent url('../../fileadmin/assets/images/logo-responsive.png') center center no-repeat;
    }

    div.wrap-left       {
        float           : none;
        width           : 90%;
        padding         : 5% 5% 5% 5%;
    }

    div.wrap-right      {
        float           : none;
        width           : 90%;
        padding         : 5% 5% 0 5%;
    }

    div.wrap-standard   {
        width           : 80%;
    }

    #inputMessage           {
    max-width           : 360px;
    max-height          : 300px;
}

}

/*  ==========================================================================
    @section            : NAVIGATION;
    @media              : MAX-WIDTH 960;
    ========================================================================== */

@media all and (max-width:960px) {

    html                {
        background      :0;
    }

    header.site         {
        position        : relative;
        width           : 100%;
    }

    header.site
    nav                 {
        position        : fixed;
        width           : 100%;
        z-index         : 9000;
        cursor          : pointer;
        top             : 0px;
        background      : transparent url('../../fileadmin/assets/images/headerbg.jpg') 0px -138px no-repeat;

    }

    header.site
    nav
    ul                  {
        background      : #ffffff;
        list-style      : none;
        padding-left    : 15px;
        box-shadow      : 0px 3px 10px 0px #888;
    }

    nav.active:before   {
        background-image: url('../../fileadmin/assets/images/nav-arrow-reverse.png');
    }

    nav:before          {
        text-transform  : uppercase;
        background      : transparent url('../../fileadmin/assets/images/nav-arrow.png') no-repeat;
        background-position: 90% center;
        font-size       : 0.8em;
        font-family     : sans-serif;
        font-weight     : bold;
        color           : white;
        padding         : 10px 22px;
        content         : 'Navigation';
        display         : block;
        border-bottom   : 1px solid #0073b5;
    }

    header.site
    nav
    ul
    li                  {
        font-size       : 0.8em;
        display         : block;
        float           : none;
        border-top      : 1px solid #eeeeee;
        height          : auto;
    }

    header.site
    nav
    ul
    li
    a                   {
        display         : block;
        color           : #323232;
        text-decoration : none;
        line-height     : 4em;
    }

    header.site
    nav
    ul
    li:hover
    a                   {
        text-decoration : underline;
    }

    header.site
    nav
    ul
    li.active
    a                   {
        color           : #0073b5;
    }

    ul
    li.active
    a                   {
        position        : relative;
    }
}
