@font-face {
    font-family: MasterFont;
    src: url(../font/SourceSansPro-Regular.ttf);
}

@font-face {
    font-family: FontBold;
    src: url(../font/SourceSansPro-SemiBold.ttf);
}
@font-face {
    font-family: FontKursiv;
    src: url(../font/SourceSansPro-Italic.ttf);
}


@font-face {
    font-family: WelcomeFont;
    src: url(../font/VINCHAND.ttf);
}

body {
	font: 95%/1.2 SourceSansPro-Regular.ttf; 
}

p, a, ul, li {
line-height: 1.2;
}

.max-side {
	max-width: 1000px;
}


.BackGray {
    background-color: #e3e3e3;
	
}

.BackYellow {
    background-color: #ffecd8;
	
}

.BackBlue {
    background-color: #d8dfe9;
	
}

.BackTurk {
    background-color: #d8f1ed;
	
}



.BackWhite{
    background-color: #FFF;
}

.contentbox {
    padding-top: 0rem;
    margin-right: 0.0rem;
}

.contentbox p, .contentbox h1, .contentbox h2, .contentbox h3 {
    padding-left: 1rem;
    padding-right: 1rem;
}
.top {
	margin-top: 2rem;
	margin-left: 1rem;
	margin-right: 1rem;
	padding-bottom: -1rem;	
}

.topT {
	margin-top: -1rem;
	margin-left: 1rem;
	margin-right: 1rem;
	padding-bottom: -1.5rem;	
}


.BackOrange100{
    background: url('../img/Quadrate/Orange_100.jpg') no-repeat center center;

}

.BackOrange80{
    background: url('../img/Quadrate/Orange_80.jpg') no-repeat center center;
}
.BackOrange80Full{
    background: url('../img/Quadrate/Orange_80.jpg');
}

.box200 {
    min-height: 200px;
}

.max_half {
	max-width: 900px;	
}

.box_klein {
	
  position: relative;
  text-align: center;
  color: white;
}
.box_kleinLeft {
  margin-right: 0px;		
  margin-left: 0px;
  position: relative;
  text-align: center;
  color: white;
}

.box_mid {
  position: relative;
  
  color: white;
}

.box_text {
	position: absolute;
	top: 50%;
	left: 50%;
	text-align: center;
	transform: translate(-50%, -50%);
	font-size: 24px;
	line-height: 1.2;
}

.box_textO {
	position: absolute;
	top: 50%;
	left: 50%;
	text-align: center;
	transform: translate(-50%, -50%);
	font-size: 24px;
	line-height: 1.2;
	color: #df460a;
}


.box_textLeft {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	font-size: 24px;
	line-height: 1.2;

}

.box_text_mid {
	position: absolute;
	text-align: center;
	vertical-align: middle;
	display: flex;
	justify-content: center;
    align-items: center;	
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-family: WelcomeFont;
	font-size: 2em;
	color: #df460a;

}

.Text1 {
	color: #FFF;
}
.Text2 {
	color: #002e6f;
	font-family: WelcomeFont;
	font-size: 24px;
}

.Text3 {
	color: #FFF;
	font-size: 22px;
}
.Text4 {
	color: red;
	font-size: 24px;
}
.geschwText {
    background-color: rgba(227, 227, 227, 0.8);
    font-family: WelcomeFont;
   	font-size: 24px;
}

.schrift2 {
	font-family: WelcomeFont;	
}

.TextO {
	color: #df460a;	
}
.TextO_klein {
	color: #df460a;
	font-size: 26px;		
}

.TextKontakt {
	color: #FFF;
	font-size: 22px;	
}

.TextNewsD3S {
	color: #FFF;
	font-size: 30px;	
	font-family: WelcomeFont;
	line-height: 1.2;
}

.TextNewsD3ST {
	color: #1d766f;
	font-size: 30px;	
	font-family: WelcomeFont;
	line-height: 1.2;
}

.TextW {
	color: #FFF;	
}

.TextAo {
	color: #df460a;
	font-size: 18px;
	font-family: FontBold;
}


.TextOGesch {
	color: #df460a;
	font-family: WelcomeFont;
	font-size: 30px;
	line-height: 1.2;
}

.TextBGesch {
	color: #012e6f;
	font-family: WelcomeFont;
	font-size: 30px;
	line-height: 1.2;
}

.TextTGesch {
	color: #1d766f;
	font-family: WelcomeFont;
	font-size: 30px;
	line-height: 1.2;
}

.TextBb {
	color: #FFF;
	font-size: 18px;
	font-family: FontBold;
}
.TextAt {
	color: #1d766f;
	font-size: 18px;
	font-family: FontBold;
}

.TextAb {
	color: #9aabc5;
	font-size: 18px;
}

.TextKursiv {
	font-family: FontKursiv;
}
.TextG {
	color: #ffcd9a;
	font-size: 18px;
	font-family: FontBold;
}
.TextB {
	color: #002e6f;	
}

.TextHB {
	color: #9aabc5;	
}

.TextT {
	color: #1d766f;	
}

.TextKlein {
	font-size:14px;	
}


.BackOrange100, .BackOrange80 {
    background-size: contain;
    min-height: 271px;
    margin: 0.5rem;
}

.NavBar {
    background-color: #FFF;
    background-size: cover;
    background-attachment: fixed;
    min-height: 190px;
}


.textNavi {
    coror: #df460a;
  	font-family: FontBold;  
}

.WelcomeBox {
    background: url('../img/Startseite.jpg') no-repeat center center;
    
    background-attachment: fixed;
    height: 800px;
    /* margin-top: 2rem;*/

}


.WelcomeText {
    background-color: rgba(227, 227, 227, 0.8);
    font-size: 3rem;
    min-height: 8rem;
    text-align: center;
    padding-top: 2rem;
    font-family: WelcomeFont;
}

.StartNewsText {
    background-color: rgba(227, 227, 227, 0.8);
    font-size: 1rem;
    min-height: 8rem;
    text-align: center;
    padding-top: 2rem;
    font-family: MasterFont;
}

.primary, .callout.primary, .button.primary {
    background-color: #ff8400;
}

.button.primary.rand {
    margin-bottom: 0.5rem;
}
.column, .columns {

  padding-right: 0.0rem;
  padding-left: 0.0rem; 
  }


.columns.NavRand {
    padding-top: 1.5rem;
    text-transform: uppercase;
}

.columns.PfeilRand {
    padding-top: 0px;
    vertical-align: top;
    height: 11px;
}

.columns.Pfeil {
    background: url('../img/Pfeil.png') no-repeat center center;
    height: 11px;
}

.text-right a {
    text-align: right;
}

.primary_two, .callout.primary_two {
    background-color: #e3e3e3;
}

.secondary, .callout.secondary {
    background-color: #002e6f;
}

.secondary_two, .callout.secondary_two {
    background-color: #00a289;
}

p, a, ul, li, h1, h2, h3, h4, h5, h6, .accordion-title, .button {
    font-family: MasterFont;
    color: #002e6f;
}

.top-bar-left .centered {
    justify-content: center;
}

.row .row-spacer-bottom {
	padding-top: 4rem;	
    padding-bottom: 6rem;

}

.row .row-top {
	padding-top: 4rem;	
    

}


.row .row-margin {
    max-width: 100%;
    margin-bottom: 0rem;
    margin-right: 0px;		
  	margin-left: 0px;
 }


.news {
    background: url('../img/news.png') no-repeat center center;
    height: 61px;
    width: 70px;
    padding-top: 20px;
    text-align: center;
    float: right;
}

.news a {
    color: #FFF;
}

.news a:hover {
    color: #efefef;
}

.subbanner {
    background-color: #FFF;
    font-family: MasterFont;
    color: #002e6f;
    width: 100%;
    height: 5rem;
    position: fixed;
    bottom: 0;
    padding-top: 1rem;
    z-index: 25;
}




.B40{
    background: url('../img/Quadrate/B40.png') repeat;
}

.B60 {
    background: url('../img/Quadrate/B60.png') repeat;
}

.B80{
    background: url('../img/Quadrate/B80.png') repeat;
}

.B100 { /* kleine Spiele */
    background: url('../img/Quadrate/B100.png') repeat;
}

.O40 { /*  */
    background: url('../img/Quadrate/O40.png') repeat;
}

.O60 { 
	background: url('../img/Quadrate/O60.png') repeat;
}

.O80 { 
	background: url('../img/Quadrate/O80.png') repeat;
}

.O100 { /* TWD */
    background: url('../img/Quadrate/O100.png') repeat;
}


.T60 { 
	background: url('../img/Quadrate/T60.png') repeat;
}

.T80 { 
	background: url('../img/Quadrate/T80.png') repeat;
}

.T100 { /* TWD */
    background: url('../img/Quadrate/T100.png') repeat;
}



.B40 { /* kleine Spiele */
    background: url('../img/Quadrate/B40.png') repeat;
}
.B60 { /*  */
    background: url('../img/Quadrate/B60.png') repeat;
}
.B80 { /* */
    background: url('../img/Quadrate/B80.png') repeat;
}
.B100 { /* e */
    background: url('../img/Quadrate/B100.png') repeat;
}

.O40 { /*  */
    background: url('../img/Quadrate/O40.png') repeat;
}
.O60 { /*  */
    background: url('../img/Quadrate/O60.png') repeat;
}
.O80 { /*  */
    background: url('../img/Quadrate/O80.png') repeat;
}
.O100 { /*  */
    background: url('../img/Quadrate/O100.png') repeat;
}

.NavTextUnder {
    text-align: center;
    vertical-align: middle;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -1em;
    margin-bottom: 1em;
}  

.BoxTopic, .BoxTopic .blue{
    height: 257px;
    text-align: center;
    vertical-align: middle;
    display: flex;
    justify-content: center;
    align-items: center;  
}

.BoxTopic a{
    color: #FFF;
    font-size: 2rem;
    text-decoration: none;
    
}


/* Boxen auf der linken Seite */

.contentbox-SchuleTop, .contentbox-KitaTop, .contentbox-skating, .contentbox-HipHop, .contentbox-Capoeira, .contentbox-inlinSkating, .contentbox-KitaStart, .contentbox-TWD, .contentbox-gewaltPV, .contentbox-tanzen, .contentbox-inhaber   {
    height: 257px;
    vertical-align: middle;
    display: flex;
    align-items: center;
    
}


.contentbox-right {
    display: inline;
    float: right;
}

.contentbox-inhaber {
    background: url('../img/anspartn/KOK_UeberUns_AP_Figuren_01.png') no-repeat left center;
    text-align: center;
    justify-content: center;
}


.contentbox-KitaStart {
    background: url('../img/kita/KOK_Kita_Startseite_Figuren_01.png') no-repeat left center;
    text-align: center;
    justify-content: center;
}
.contentbox-skating {
    background: url('../img/schule/InlineSkating/KOK_Schule_InlineSkating_Figuren.png') no-repeat left center;
    text-align: center;
    justify-content: center;
}
.contentbox-HipHop {
    background: url('../img/schule/HipHop/KOK_Schule_HipHop_quadrat.jpg') no-repeat left center;
    text-align: right;
    justify-content: flex-end;

}

.contentbox-TWD {
    background: url('../img/schule/TWD/KOK_Schule_TWD_quadrat.jpg') no-repeat left center;
    text-align: right;
    justify-content: flex-end;
}

.contentbox-Capoeira {
    background: url('../img/kita/Angebote_Kita/TWD/KOK_Schule_TWD_quadrat.jpg') no-repeat left center;
    text-align: right;
    justify-content: flex-end;
}

.contentbox-gewaltPV {
    background: url('../img/kita/Angebote_Kita/Gewaltpraevention/KOK_Kita_GewaltP_quadrat.jpg') no-repeat left center;
    text-align: right;
    justify-content: flex-end;
}

.contentbox-tanzen {
    background: url('../img/kita/Angebote_Kita/tanzen/KOK_Kita_Tanzen_quadrat.jpg') no-repeat right center;
    text-align: right;
    justify-content: flex-end;
}


.contentbox-inlinSkating {
	background: url('../img/schule/InlineSkating/KOK_Schule_InlineSkating_quadrat.jpg') no-repeat right center;
    text-align: right;
    justify-content: flex-end;
}

.contentbox-KitaTop {
	background: url('../img/kita/KOK_Kita_Startseite_Figuren_01.png') no-repeat left center;
    text-align: right;
    justify-content: flex-end;	
}

.contentbox-SchuleTop {
	background: url('../img/kita/Angebote_Kita/kinderturnen/KOK_Kita_Turnen_Figuren.png') no-repeat left center;
    text-align: right;
    justify-content: flex-end;
}
/* Boxen auf der rechten Seite */

.contentbox-Fussball {
    background: url('../img/schule/Fussball/KOK_Schule_Fussball_quadrat.jpg') no-repeat right center;
    text-align: right;
    justify-content: flex-end;
}



.contentbox-freiflaeche, .contentbox-kleine-spiele, .contentbox-Fussball, .contentbox-GewaltP, .contentbox-turnen, .contentbox-GewaltPV  {
    height: 257px;
    text-align: left;
    vertical-align: middle;
    display: flex;
    justify-content: left;
    align-items: center;
}
.contentbox-freiflaeche {
    background: url('../img/Quadrate/KOK_quer_transparent.png') no-repeat left center;
    text-align: center;
    justify-content: center;
}

.contentbox-kleine-spiele {
    background: url('../img/schule/KleineSpiele/KOK_Schule_KleineSpiele_quadrat.jpg') no-repeat right center;
}

.contentbox-turnen {
    background: url('../img/kita/Angebote_Kita/kinderturnen/KOK_Kita_Turnen_quadrat.jpg') no-repeat right center;
}

.contentbox-GewaltP {
    background: url('../img/schule/GewaltP/KOK_Schule_GewaltP_quadrat.jpg') no-repeat right center;
}


