/**
 * raute-IT - CSS Styling for rte contents 
 *
 * Set styling and layout to content elements which are
 * layouted in the rte 
 *
 * @category   rteContents
 * @package    raute.IT
 * @author     Christian Brinkert <christian.brinkert@sector27.de>
 * @copyright  2014 sector27 GmbH
 * @version    1.0.0
 */


/* FONTS */
@font-face {
    font-family: 'LatoLight';
    src: url('../fonts/lato/Lato-Light.eot'); /* IE9 Compat Modes */
    src: url('../fonts/lato/Lato-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/lato/Lato-Light.woff') format('woff'), /* Modern Browsers */
    url('../fonts/lato/Lato-Light.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: 'Lato';
    src: url('../fonts/lato/Lato-Regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/lato/Lato-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/lato/Lato-Regular.woff') format('woff'), /* Modern Browsers */
    url('../fonts/lato/Lato-Regular.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: 'Lato';
    src: url('../fonts/lato/Lato-Bold.eot'); /* IE9 Compat Modes */
    src: url('../fonts/lato/Lato-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/lato/Lato-Bold.woff') format('woff'), /* Modern Browsers */
    url('../fonts/lato/Lato-Bold.ttf') format('truetype');
    font-style: normal;
    font-weight: bold;
}
@font-face {
    font-family: 'Lato';
    src: url('../fonts/lato/Lato-Italic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/lato/Lato-Italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/lato/Lato-Italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/lato/Lato-Italic.ttf') format('truetype');
    font-style: italic;
    font-weight: normal;
}
@font-face {
    font-family: 'FontAwesome';
    src: url('/fileadmin/kbo/fonts/fontAwesome/fonts/fontawesome-webfont.eot'); /* IE9 Compat Modes */
    src: url('/fileadmin/kbo/fonts/fontAwesome/fonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('/fileadmin/kbo/fonts/fontAwesome/fonts/fontawesome-webfont.woff') format('woff'), /* Modern Browsers */
    url('/fileadmin/kbo/fonts/fontAwesome/fonts/fontawesome-webfont.ttf') format('truetype');
    font-style: italic;
    font-weight: normal;
}


/**
 * CONTENT ELEMENTS 
 */

* {
    font-family: Lato, Arial, Helvetica, sans-serif;

    -moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

html,
button,
input,
select,
textarea {
    color: rgb(38,1,1);
}
/* HEADERS */




/* LAYOUT */
h1 {
    font-size: 1.25rem;
    font-weight: bold;
    line-height: 1em;
    margin-bottom: 0.4em;
    letter-spacing: 0.0625em;
}


h1 span {
    color: rgb(89, 2, 2);
    display: block;
    font-size: .9rem;
    margin: -1px 0 0 38px;
    letter-spacing: 0.0225em;
}

@media only screen and (min-width: 650px) {
    h1 {
        font-size: 3.1rem;
        font-weight: normal;
    }


    h1 span {
        font-size: 2rem;
        margin: -10px 0 0 38px;
    }
}

h2 {
    font-size: 2.7rem;
    font-weight: normal;
    /*line-height: 1em;*/
    line-height: 1.2em;
    margin-bottom: 0.25em;
    letter-spacing: 0.0225em;
}
h3 {
    font-size: 200%;
    font-weight: normal;
    /*line-height: .8em;*/
    line-height: 1.2em;
    margin-bottom: 0.25em;
}
h4 {
    font-size: 162.5%;
    font-weight: normal;
    /*line-height: .7em;*/
    line-height: 1.2em;
    margin-bottom: 0.25em;
}
h5 {
    font-size: 120%;
    font-weight: bold;
    /*line-height: 0.9em;*/
    line-height: 1.2em;
    margin-bottom: 0.25em;
}
h6 {
    display:none;
}







/* P paragraphs */
p{ 
  line-height:150%;
  margin-bottom: 16px;
}
p.teaser{ 
  font-size:130%; 
  line-height:150%;
}
p.subtitle{ 
  font-size:120%;
}
p.runningtext{ 
  line-height:120%;
}
p.compacttext{ 
  line-height:100%;
}
p.cite{ 
  font-size:200%;
  line-height:110%;
  font-family:'Times New Roman',Times,serif;
  font-style:italic;
  color:rgb(80,80,80);
}
p.citerunningtext, p.citerunningtext{
  line-height:125%;
  font-family:'Times New Roman',Times,serif;
  font-style:italic;
  color:rgb(80,80,80);
}
p.smalltext{ 
  font-size:83.333%;
  line-height:110%;
}
p.footnote{ 
  font-size:67.667%;
  line-height:120%;
}



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



/**
 * SPAN - inline elements
 */
span.kbobrown{ color:rgb(89,2,2); }
span.kbobeige{ color:rgb(166,132,70); }
span.kbologo{ 
	color:rgb(239,1,1); 
	font-style:italic;
}
span.nobreak{  white-space:nowrap; }
span.notice{ color:rgb(239,1,1); }
h5 span.notice{ padding:.2em 1em; background-color: rgba(255,255,255,0.7) }
h5 span.notice:hover{ background-color: rgb(239,1,1); color: rgba(255,255,255,0.7); cursor: pointer;}
h5 span.notice a{ color: rgb(239,1,1); }
h5 span.notice:hover a{ color: rgba(255,255,255,0.7); }

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

/* LINK - styling */
/* ======================================
	A-TAGS
   ====================================== */
a:link{
    color: rgb(89,2,2);
	text-decoration: none;
	outline: none;
}

#content a:link{
    color: rgb(89,2,2);
	text-decoration: none;
	outline: none;
}

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

a:visited:before {
   content:  "\2713 ";
}

a:hover{
	color: rgb(89,2,2);
	text-decoration: none;
}

a:focus {
	color: rgb(89,2,2);
	text-decoration: none;
}

a:active {
	color: #a68446;
	text-decoration: none;
}


/* ----- AWESOME ------ */

/* LINK-ICONS */
.internal-link:after,
.internal-link-new-window:after,
.external-link:after,
.external-link-new-window:after,
.mail:after,
.download:after,
.openContactButton:after  {
	font-family:'FontAwesome', serif;
	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(89,2,2);
}
.internal-link:after,

.internal-link-new-window:after{
	content:"\f090";
	-moz-transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
	-o-transform: rotate(-30deg);
	-webkit-transform: rotate(-30deg);
}

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

.external-link-new-window:after{
	content:"\f08b";
	-moz-transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
	-o-transform: rotate(-30deg);
	-webkit-transform: rotate(-30deg);
}

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

.download:after{
	content:"\f019";
}

.openContactButton {
	font-size: 1.5rem;
	display: inline-block;
	width: auto;
	background: rgb(255,255,255);
	color: rgb(38,1,1) !important;
	padding: 5px 12px 5px 10px;
}

/* OPENCONTACTBUTTON */
.openContactButton:after {
	content: "\f14c";
	font-size: 1.5rem;
	color: rgb(38,1,1) !important;
	margin: 0 0 0 5px; 
}

/* ANIMATION FOR OPENCONTACTBUTTON */
.openContactButton.spin:after{
	content: "\f021";
	 -webkit-animation: spin 2s infinite linear;
	animation: spin 2s infinite linear;
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}


/* UL / OL - unsorted and sorted lists */
ul{}

.htmlarea-content-body ul li,
#pageContent ul li{ 
  list-style-type:none;
  text-indent:-16px;
  padding-left:20px;
}

.htmlarea-content-body ul li:before,
#pageContent ul li:before{
  content: "\f0da";
  font-family: FontAwesome, sans-serif;
  font-style:normal;
  margin-right:10px;
}

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


/* lined */
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 ok */
ul.ok li{ }
ul.ok li:before{
    content: "\f00c" !important;
}
/* ok big */
ul.okBig{ 
	margin-left:9px;
}
ul.okBig li{
	font-size:1.2rem;
	margin-bottom:.5em;
	text-indent: -33px
}
ul.okBig li:before{
	font-size:1.6rem;
	content: "\f14a" !important;
	position:relative;
	top:.15em;
}
/* attention */
ul li.attention{}
ul li.attention:before{
	font-family: 'FontAwesome'; 
	content: "\f06a" !important;
	color:rgb(239, 1, 1);
}

	/* ordered lists */
ol{
  margin:5px 0px;
  padding: 0px 0px 0px 35px;
}
ol li{
  font-size:120%;
  padding:2px 0px;
}
ol li ol li{
  font-size:93.75%;
}

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

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

ol.footnote{ margin-top:0px; margin-bottom:0px;}
ol.footnote:hover{ color:rgb(91,92,75) }
ol.footnote li{
  font-size:75%;
  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%; }



  /* TABLES - default table definitions */
table caption{
   border:1px solid rgb(236,236,233);
   padding:3px;
   margin-bottom:2px;
   font-size:83.33%;
}
table {
  border-collapse: collapse;
}
table tr th {
  background-color: rgb(89, 2, 2);
  border: 1px solid rgb(236,236,233);
  padding:5px;
  color:rgb(255,255,255);
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
  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 caption, table.zebra100 caption{
   border:1px solid rgb(236,236,233);
   border-bottom-width:0px;
   padding:3px;
   margin-bottom:0px;
   font-size:83.33%;
}
table.zebra {
  border-collapse: separate;
  border:0px solid rgb(236,236,233);
  border-width:1px 0px;
}
table.zebra100{
  border-collapse: separate;
  border:0px solid rgb(236,236,233);
  border-width:1px 0px;   
  width:100%;
}
table.zebra tr.tr-odd, table.zebra100 tr.tr-odd{}
table.zebra tr.tr-even, table.zebra100 tr.tr-even{}
table.zebra tr.header-odd, table.zebra100 tr.header-odd{}
table.zebra tr.header-even, table.zebra100 tr.header-even{}

table.zebra tr td, table.zebra100 tr td{
  padding:5px;
  border-width:0px;
}  
table.zebra tr th, table.zebra100 tr th{
  background-color: rgb(89, 2, 2);
  color:rgb(255,255,255);
  border: 1px solid rgb(89, 2, 2);
}
table.zebra tr.row-even th, table.zebra100 tr.row-even th {
	background-color: rgb(89, 2, 2);
	color:rgb(255,255,255);
}
table.zebra tr.row-odd th, table.zebra100 tr.row-odd th {
	background-color: rgb(89, 2, 2);
	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);
}


  /* backgrounded tables */
table.backgrounded caption{
   border:1px solid rgb(236,236,233);
   padding:3px;
   font-size:83.33%;
}
table.backgrounded {
  border-collapse: separate;
}
table.backgrounded tr th {
  color:rgb(255,255,255);
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
  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{
   padding:3px;
   font-size:83.33%;
   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:#323232;
}

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

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(236, 236, 233);
    border-image: none;
    border-style: solid;
    border-width: 3px 0;
    padding: 10px;
}
section.lined-left {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: rgb(236, 236, 233);
    border-image: none;
    border-style: solid;
    border-width: 0 0 0 3px;
    padding-left: 20px;
}
section.lined-around {
    border: 3px solid rgb(236, 236, 233);
    overflow: hidden;
    padding: 15px;
}
section.whiteborder {
    border: 3px solid rgb(255, 255, 255);
    overflow: hidden;
    padding: 15px;
}
section.sitecolorborder {
    border: 3px solid #5f95a0;
    overflow: hidden;
    padding: 15px;
}

.lightgrey-backgrounded {
    background-color: rgb(238, 238, 238);
    color: rgb(91, 92, 75);
    overflow: hidden;
    padding: 1.8em;
}

.background-brown {
    background-color: rgb(38,1,1);
    color: rgb(255,255,255);
    overflow: hidden;
    padding: 1.8em;
}

.background-light-brown {
    background-color: rgb(89,2,2);
    color: rgb(255,255,255);
    overflow: hidden;
    padding: 1.8em;
}


/* alignments to various elements */
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;
}
/* END of alignments */





/* text /w picture */
figcaption.csc-textpic-caption{ 
  font-size: .8rem;
  padding: 0.4em;
  background-color:  rgb(255,255,255);
  text-align: center;
}
/* END OF: text /w picture */