@charset "UTF-8";
/**
 * Top Level Cascading Style Sheets: New TYPO3 site
 *   
 * Top Level Cascading Style Sheets for New TYPO3 site
 * website. Style sheets are defined in structured, content
 * element and global part which will be held in named files.
 *
 * @author Joerg Mathuszczyk            
 * @link http://www.tcworld.info
 * @copyright tcworld GMBH
 * @version 1.0
 * @date 2017-03-09
 *
 */


/* =======================
   CONTENT ELEMENTS 
   ======================= */ 
/* ELEMENTS */


/* HEADERS */

/* P paragraphs */
p { 
	font-size: 1rem;
	line-height: 1.5rem;
	margin: 0 0 16px;
}

/* TEASER */
p.teaser{ 
	font-size: 1.4rem;
	line-height: 1.5em;
	margin-bottom: 50px;
}

/* CENTER */
p.text-center { 
	text-align: center;
}

/* SUBTITLE */
p.subtitle{ 
	font-size: 1.2rem;
}

/* RUNNING TEXT */
p.runningtext{ 
	line-height: 1.2rem;
}

/* COMPACTTEXT */
p.compacttext{ 
	line-height: 1rem;
}

/* BLOCKQUOTE */
blockquote > p { 
	font-size: 2rem;
	padding-left: .5em;
	line-height: 1.1em;
	font-family: 'Times New Roman',Times,serif;
	font-style: italic;
	color: rgb(80,80,80);
}
blockquote > p::before {
    content: open-quote;
    margin: 8px 0 0 -15px;
}
blockquote > p::before, 
blockquote > p::after {
    font: bold 30px/1px Times,serif;
    position: absolute;
}
blockquote > p::after {
    content: close-quote;
    margin: 10px 0 0 3px;
}

p.more-line-height {
	line-height: 2.2em !important;
}

p.serif-only{ 
  font-family:'Times New Roman',Times,serif;
  line-height: 1.2em;
}


/* SMALLTEXT */
p.smalltext{ 
  font-size: .85rem;
  line-height:110%;
}

/* FOOTNOTE */
p.footnote{ 
  font-size: .7rem;
  line-height:120%;
} 

div.indent{ padding-left:15px;}

/* ===============================
   SPAN - inline elements
   =============================== */
span.corporatecolor{ color: rgb(115,177,221); }
span.nobreak{  white-space:nowrap; }
span.notice{ color:rgb(239,1,1); }
span.linethrough { text-decoration: line-through; }

sub{ font-size:75%; line-height:0.75em; }
sup{ font-size:75%; line-height:0.75em; }


/* ICONS */
span.phoneIcon,
span.mailIcon,
span.faxIcon,
span.mapIcon,
span.clockIcon {
	display: inline-block;
	position: relative;
	padding-left: 20px;
}

span.phoneIcon::before,
span.mailIcon::before,
span.faxIcon::before,
span.mapIcon::before,
span.clockIcon::before {
	font-family: 'FontAwesome';
	position: absolute;
	top: 0;
	left: 0;
}

span.phoneIcon::before { content: "\f095"; }
span.mailIcon::before { content: "\f0e0"; }
span.faxIcon::before { content: "\f1ac"; }
span.mapIcon::before { content: "\f041"; }
span.clockIcon::before { content: "\f017"; }

/* ======================================
	A-TAGS
   ====================================== */
a:link{
    color: rgb(115,177,221);
	text-decoration: none;
	outline: none;
	transition: all 0.2s cubic-bezier(0.75, 0.25, 0.25, 0.75) 0s; /* animate text color */
}

a:visited{
    color: rgb(150,150,150);
	text-decoration: none;
}

a:hover{
	color: rgb(115,177,221);
	text-decoration: none;
	transition: all 0.2s cubic-bezier(0.75, 0.25, 0.25, 0.75) 0s; /* animate text color */
}

a:focus {
	color: #666;
	text-decoration: none;
}

/* MOUSE DOWN */
a:active {
	color: rgb(0, 0, 0) !important;
	text-decoration: none;
}


/* ============================
   INTERNAL/EXTERNAL - LINKS
   ============================ */
.ce-bodytext a {
	/*
	color: rgb(0, 0, 0) !important;
	border-bottom: 1px dotted rgb(178,178,178);
	*/
}

.ce-bodytext a:hover {
	color: rgb(115,177,221) !important;
}

/* FONT AWESOME LINK STYLING */
.link-internal:after,
.link-internal-blank:after,
.link-external:after,
.link-external-blank:after,
.link-mail:after,
.link-download:after {
	font-family:'FontAwesome';
	height: auto;
	line-height: normal;
	display: inline-block;
	margin-top: 0;
	text-decoration: inherit;
	padding: 0 3px 0 2px; 
	vertical-align: top; 
	font-size: .8rem;
	color: rgb(178,178,178);
	text-indent: 0;
}

.link-internal:after,
.link-internal-blank:after,
.link-external:after,
.link-external-blank:after {
	-moz-transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
	-o-transform: rotate(-30deg);
	-webkit-transform: rotate(-30deg);
}

.link-internal:after,
.link-internal-blank:after{
	content:"\f090";
}

.link-external:after,
.link-external-blank:after {
	content:"\f08b";
}

.link-mail:after{
	content:"\f0e0";
}

.link-download:after{
	content:"\f019";
}
/* ========================
   ADDITINALBUTTON 
   ======================== */
.additionalButton {
	position: relative;
	display: inline-block;
	width: 100%;
	max-width: 350px;
	font-size: 1.4rem !important;
	line-height: 40px;
	color: rgb(255,255,255) !important;
    text-align: center;	
	overflow: hidden;
	z-index: 1; /* needed for before/after background */
	border-top: 1px solid rgb(115,177,221);
	border-bottom: 1px solid rgb(115,177,221);
}

.additionalButton::before,
.additionalButton::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	transition: left 0.5s cubic-bezier(0.75, 0.25, 0.25, 0.75) 0s;	
	z-index: -1;
	background-color: rgb(115,177,221);
}

.additionalButton::after{
	left: -102%;
	background-color: rgb(255,255,255) !important;
}

.additionalButton:hover::after {
	left: 0%;
}

/* ANIMATION FOR ADDITINALBUTTON */
.additionalButton:hover {
	color: rgb(115,177,221) !important;
	-webkit-animation: blink 2.5s infinite linear 1.5s; /* Safari 4+ */
	-moz-animation: blink 2.5s infinite linear 1.5s; /* Fx 5+ */
	-o-animation: blink 2.5s infinite linear 1.5s; /* Opera 12+ */
	animation: blink 2.5s infinite linear 1.5s; /* IE 10+, Fx 29+ */ 
}

/* PARALLAX CONTAINER */
.parallax .additionalButton,
[class*="bg"] .additionalButton {
	font-family: inherit;
	border: 1px solid rgb(255,255,255);
}
.parallax .additionalButton::before,
.parallax .additionalButton::after {
	background-color: rgba(255,0,0,0.25);
}

.parallax .additionalButton:hover,
[class*="bg"] .additionalButton:hover {
	color: rgba(0,0,0,.5) !important;
}

@-webkit-keyframes blink {
	0% {
		opacity: 1;
	}
	50% {
		opacity: .4;
	}
	100% {
		opacity: 1;
	}
}

@keyframes blink {
	0% {
		opacity: 1;
	}
	50% {
		opacity: .4;
	}
	100% {
		opacity: 1;
	}
}

/* =======================================================
   UL / OL / DL - unsorted, sorted and definition lists 
   BASIC SETTINGS
   ======================================================= */
ul {
	list-style-type: none;
	font-size: 1rem;
	margin: 0 0 0 15px;
}

ul ul ,
ol ul {
	font-size: 1rem;
}

main ul li {
    list-style-type: none !important;
    text-indent: -16px !important;
    padding-left: 30px !important;
    margin: 0 0 10px -25px !important;
}

main ul li:before{
  content: "\f0da";
  /*content: '→';*/
  font-family: 'FontAwesome';
  font-style: normal;
  margin-right: 10px;
  color: rgb(0,91,172);
}

main li li { 
  margin: 5px 0 0;
}

nav ul.csc-menu li::before {
	content: "";
    display: none;
    margin-right: 0;
}

/* =============
   LINED LIST 
   ============= */
ul.lined{
  border-top: 1px solid rgb(200,200,200);
}
ul.lined li{ 
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid rgb(200,200,200);
}

/* ================
   LINED LIST OK
   ================ */
ul.ok{ 
	margin-left: 30px;
}
ul.ok li{
	text-indent: -29px !important;
}
ul.ok li:before{
    content: "\f00c" !important;
}
/* ====================
   LINED LIST OK BIG 
   ==================== */
ul.okBig{ 
	margin-left: 30px;
}
ul.okBig li {
	font-size: 1rem;
	margin-bottom:.5em;
	text-indent: -32px !important;
}
ul.okBig li:before {
	font-size:1.6rem;
	content: "\f14a" !important;
	position:relative;
	top:.15em;
}

/* =============
   ATTENTION
   ============= */
ul li.attention:before {
	content: "\f06a" !important;
	color:rgb(239, 1, 1);
}

/* =========================
   ORDERED LIST 
   ========================= */
ol {
    margin: 5px 0 0 20px;
}

ol li {
	font-size:1.2rem;
	padding:2px 0px;
}

ol li ol li {
	font-size:.95rem;
}

/* =======================
   OL DECIMAL (default)
   ======================= */
ol,
ol.decimal {
    list-style-type: decimal;
}
 
/* ===================
   OL ROMAN
   =================== */
ol.upperRoman{
   list-style-type: upper-roman;
}

ol.upperRoman li ol{
    list-style-type: upper-roman;
}

ol.lowerRoman {
    list-style-type: lower-roman;
}

ol.lowerRoman li ol{
    list-style-type: lower-roman;
}


/* ===================
   OL ALPHA 
   =================== */
ol.upperAlpha {
    list-style-type: upper-alpha;
}

ol.upperAlpha li ol{
    list-style-type: lower-alpha;
}

ol.lowerAlpha {
    list-style-type: lower-alpha;
}

ol.lowerAlpha li ol{
    list-style-type: lower-alpha;
}


/* ===================
   OL footnote
   =================== */
ol.footnote { 
	margin-top: 0px; 
	margin-bottom: 0px;
}

ol.footnote:hover{ 
	color: rgb(91,92,75) 
}

ol.footnote li {
    font-size: .75rem;
    padding: 0px 0px 0px 0px;
    margin-top: 0px; margin-bottom: 0px;
}
ol.footnote li ol { 
	margin-top: 0px; 
	margin-bottom: 0px;
}

ol.footnote li ol li { 
	font-size: 100%; 
}

/* dl */
dl {
	font-size: 1rem;
}

/* =====================================
   TABLES - DEFAULT TABLE DEFINITONS 
   ===================================== */
table caption {
    border: 1px solid rgb(236,236,233);
    padding: 3px;
    margin-bottom: 2px;
    font-size: .9rem;
}

table {
    border-collapse: collapse;
	border-spacing: 2px;
}

table tr th {
	position: relative;
    background-color: rgb(29,167,254);
    border: 1px solid rgb(236,236,233);
    padding: 5px;
    color: rgb(255,255,255);
    font-weight: normal;
}

table tr td {
    border: 1px solid rgb(236,236,233);
    padding: 5px;
}

table tr th.hightlight {
    color: rgb(255,255,255);
    background-color: rgb(80,80,80);
}

table tr td.hightlight {
    color: rgb(255,255,255);
    background-color: rgb(80,80,80);
}

/* =========================================================
   ZEBRA TABLES - TABLES WITH ALTERNATING BACKGROUND COLORS
   ========================================================= */
table.zebra, table.zebra100 {
    border-collapse: separate;
    border: 0px solid rgb(236,236,233);
    border-width: 1px 0px;
}
table.zebra100{
    width: 100%;
}

table.zebra tr td, table.zebra100 tr td{
    padding: 5px;
    border-width: 0px;
}  

table.zebra tr th, table.zebra100 tr th{
	background-color: rgb(29,167,254);
	color: rgb(255,255,255);
	border: 1px solid rgb(29,167,254);
}

/*
table.zebra tr.row-even th, table.zebra100 tr.row-even th {
	background-color: rgb(250,179,30);
	color: rgb(255,255,255);
}

table.zebra tr.tr-even td, table.zebra100 tr.tr-even td,
table.zebra tr.row-even td, table.zebra100 tr.row-even td {
	background-color: rgb(234,234,230);
}

table.zebra tr.tr-odd td, table.zebra100 tr.tr-odd td,
table.zebra tr.row-odd td, table.zebra100 tr.row-odd td {
	background-color: rgb(249,249,246);
}

*/

table.zebra tr:nth-child(2n+0) th, table.zebra100 tr:nth-child(2n+0) th {
	background-color: rgba(29,167,254,.8);
	color: rgb(255,255,255);
}

table.zebra tr:nth-child(2n+0) td, table.zebra100 tr:nth-child(2n+0) td,
table.zebra tr:nth-child(2n+0) td, table.zebra100 tr:nth-child(2n+0) td {
	background-color: rgb(249,249,246);
}

table.zebra tr:nth-child(2n+1) td, table.zebra100 tr:nth-child(2n+1) td,
table.zebra tr:nth-child(2n+1) td, table.zebra100 tr:nth-child(2n+1) td {
	background-color: rgb(234,234,230);
}


/* ======================
   BACKGROUNDED TABLES 
   ====================== */
table.backgrounded {
    border-collapse: separate;
}
table.backgrounded tr th {
    color: rgb(255,255,255);
    font-weight: normal;
    border: none;
    padding: 5px;
}
table.backgrounded tr td {
    background-color: rgb(236,236,233);
    border: none;
    padding: 5px;
}

/* ===============
   BLIND TABLES 
   =============== */
table.blind caption{
    border-width: 0px;
}

table.blind {
    border-collapse: collapse;
}

table.blind tr th {
    background-color: transparent;
    border: none;
    padding: 0px 10px 0px 0px;
    text-shadow: none;
    font-weight: normal;
    color: rgb(50,50,50);
}

table.blind tr th:after {
    border: 0 none;
}

table.blind tr td {
    background-color: transparent;
    border: none;
    padding: 0px 5px 0px 0px;
}
/* ======================
   TABLES END
   ====================== */


/* ======================
   LAYOUTS
   ====================== */
section.lined-top-bottom {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: rgb(201,201,201);
    border-image: none;
    border-style: solid;
    border-width: 1px 0;
	padding: 15px 0 0 !important;
	position: relative;
}

.ceLinedLeft {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: rgb(178,191,51);
    border-image: none;
    border-style: solid;
    border-width: 0 0 0 2px;
    padding: 20px 0 20px 20px !important;
}

section.lined-around-grey {
    border: 3px solid rgb(238, 238, 238);
    overflow: hidden;
    padding: 20px !important;
}

section.lined-around-white {
    border: 3px solid rgb(255, 255, 255);
    overflow: hidden;
    padding: 20px !important;
}

section.lined-around-corporate {
    border: 3px solid rgb(255,134,0);
    overflow: hidden;
    padding: 20px !important;
}

section.lightgrey-backgrounded {
    background-color: rgb(238, 238, 238);
    color: rgb(80,80,80);
    overflow: hidden;
    padding: 20px !important;
}

section.darkgrey-backgrounded {
    background-color:rgb(80,80,80);
    color: rgb(255,255,255);
    overflow: hidden;
    padding: 20px !important;
}

section.black-backgrounded {
    background-color: rgb(0, 0, 0);
	color: rgb(255,255,255);
    overflow: hidden;
	padding: 20px !important;
}

section.corporate-backgrounded {
	background-color: rgb(255,134,0);
    color: rgb(255, 255, 255);
    overflow: hidden;
    padding: 20px !important;
}

/* =================================
   ALIGNMENTS OF VARIOUS ELEMENTS
   ================================= */
/* old
p.align-left,h1.align-left,h2.align-left,h3.align-left,
h4.align-left,h5.align-left,h6.align-left,td.align-left,
th.align-left,#bottomContents p.align-left{
  text-align: left;
}

p.align-center,h1.align-center,h2.align-center,h3.align-center,
h4.align-center,h5.align-center,h6.align-center,td.align-center,
th.align-center{
  text-align: center;
}

p.align-right,h1.align-right,h2.align-right,h3.align-right,
h4.align-right,h5.align-right,h6.align-right,td.align-right,
th.align-right{
  text-align: right;
}

p.align-justify,h1.align-justify,h2.align-justify,h3.align-justify,
h4.align-justify,h5.align-justify,h6.align-justify,td.align-justify{
  text-align: justify;
}

td.valign-top, th.valign-top  {
  vertical-align: top;
}

td.valign-middle, th.valign-middle{
  vertical-align: middle;
}

td.valign-bottom, th.valign-bottom{
  vertical-align: bottom;
}

*/

p.text-left,h1.align-left,h2.align-left,h3.align-left,
h4.align-left,h5.align-left,h6.align-left,td.align-left,
th.align-left,#bottomContents p.align-left{
  text-align: left;
}

p.text-center,h1.text-center,h2.text-center,h3.text-center,
h4.text-center,h5.text-center,h6.text-center,td.text-center,
th.text-center{
  text-align: center;
}

p.text-right,h1.align-right,h2.align-right,h3.align-right,
h4.align-right,h5.align-right,h6.align-right,td.align-right,
th.align-right{
  text-align: right;
}

p.text-justify,h1.align-justify,h2.align-justify,h3.align-justify,
h4.align-justify,h5.align-justify,h6.align-justify,td.align-justify{
  text-align: justify;
}

td.valign-top, th.valign-top  {
  vertical-align: top;
}

td.valign-middle, th.valign-middle{
  vertical-align: middle;
}

td.valign-bottom, th.valign-bottom{
  vertical-align: bottom;
}
/* =================
   ALIGNMENTS END
   ================= */


/* ======================
   DOWNLOAD-/FILELINKS
   ====================== */
.csc-uploads-element {
	max-width: 350px;
}

ul.ce-uploads li { 
    margin: 0 0 5px !important;
    padding: 0 !important;
    text-indent: 0 !important;
}

ul.ce-uploads img {
	max-width: 150px;
	height: auto;
	margin: 0 5px 25px 0 !important;
}

.ce-uploads span {
    display: block;
}

.ce-uploads-2 .ce-uploads-element-png img,
.ce-uploads-2 .ce-uploads-element-jpg img,
.ce-uploads-3 .ce-uploads-element-png img,
.ce-uploads-3 .ce-uploads-element-jpg img {
	margin: 0 5px 0 0 !important;
}

ul.ce-uploads li:before {
	content: none !important;
}

ul.ce-uploads li span.ce-uploads-fileName {
  text-decoration: none;
}

ul.ce-uploads li span.ce-uploads-fileName a {
  text-decoration:none;
  padding: 0px 3px;
  font-size: 100%;
}

ul.ce-uploads-2 li.ce-uploads-element-xlsx  > a:first-child,
ul.ce-uploads-2 li.ce-uploads-element-zip  > a:first-child,
ul.ce-uploads-2 li.ce-uploads-element-docx  > a:first-child ,
ul.ce-uploads-3 li.ce-uploads-element-xlsx  > a:first-child,
ul.ce-uploads-3 li.ce-uploads-element-zip  > a:first-child,
ul.ce-uploads-3 li.ce-uploads-element-docx  > a:first-child  {
	display: none;
}

.ce-uploads-description,
.ce-uploads-filesize {
    font-size: .8rem;
}
.ce-uploads-filesize {
    font-size: .6rem;
}


ul.ce-uploads li span.ce-uploads-fileName a {
    font-size: 1rem;
    padding: 0;
    text-decoration: none;
}

/* LAYOUT 3 */
ul.ce-uploads-3 li {
	padding: 3% !important;
	color: rgb(255,255,255);
	background-color: rgb(255, 134, 0);
}

ul.ce-uploads-3 li a {
	color: rgb(255,255,255) !important;
	font-weight: bold !important;
}

/* ==================
   TEXT /W PICTURE
   ================== */
/* ==================
   TEXT /W PICTURE
   ================== */
div.ce-column a {
	display: block;
	padding: 3px;
	overflow: hidden;
}

div.ce-column div.ce-media a {
	display: block;
	padding: 0;
	border: none;;
}

div.ce-media {
	padding: 3px;
	overflow: hidden;
	/*border: 1px solid rgb(100,100,100);*/
}

div.ce-media img,
div.ce-textpic img {
	width: 100% !important;
	height: auto !important;
	margin: 0 auto;
	transition: all 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
	-webkit-transition: all 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
	-moz-transition: all 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
	-o-transition: all 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
	-ms-transition: all 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
}

/*div.ce-textpic img:hover {
	transform: scale(1.2);
}*/

figcaption {
	font-size: 0.7rem;
    line-height: 0.8rem;
    margin: 5px 0 25px;
}

div.ce-center IMG { 
	text-align: center;
}

/* ==================
   AUDIO/VIDEO
   ================== */
audio, video {
    width: 100%;
}

/* ==================
   SOCIALMEDIA 
   ================== */
.socialMedia {
	position: relative; 
}

.socialMedia p {
    font-size: 0.8rem;
    font-weight: bold;
}

.socialMedia ul {
    margin: 0 !important;
    padding: 0 !important;
	text-align: center;
}

.socialMedia li {
    display: inline-block !important;
    margin-right: 5px;
    position: relative;
}

.socialMedia i.fa {
    border-radius: 3px;
    min-width: 35px;
    padding: 5px;
    text-align: center;
}

.socialMedia i::before {
    color: rgb(100,100,100);
    font-size: 1.3rem;
}

.socialMedia i {
    float: left;
}

.socialMedia i:hover::before {
	color: rgb(255,255,255);
}

.fa.fa-linkedin:hover {
    background: rgb(1, 119, 181) none repeat scroll 0 0 !important;
}

.fa.fa-xing:hover {
    background: rgb(0, 101, 103) none repeat scroll 0 0 !important;
}

.fa.fa-twitter:hover {
    background: rgb(29, 161, 242) none repeat scroll 0 0 !important;
}

.fa.fa-facebook:hover {
    background: rgb(62, 92, 154) none repeat scroll 0 0 !important;
}

.fa.fa-google-plus:hover {
    background: rgb(220, 78, 65) none repeat scroll 0 0 !important;
}

.fa.fa-youtube-play:hover {
    background: rgb(230, 33, 23) none repeat scroll 0 0 !important;
}

.fa.fa-rss:hover {
    background: rgb(255, 102, 0) none repeat scroll 0 0 !important;
}


@media only screen and (min-width: 790px) {	

}



