/* Theme Name: MEKO Neukoelln */

/* ------------------------ 
GLOBAL RESET
------------------------ */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,dialog,figure,footer,header,hgroup,menu,nav,section,time,mark,audio,video{
		margin:0;padding:0;border:0;outline:0;vertical-align:baseline;/*background:transparent*/
	}
	article,aside,dialog,figure,footer,header,hgroup,nav {
		display:block
	}
	nav ul { list-style:none }
	a { margin:0;padding:0;border:0;vertical-align:baseline;background:transparent }
	
	
	/* ------------------------ 
	GLOBAL RULES
	------------------------ */
	* {
		padding: 0px; 
		margin: 0px;
		border: 0px;
		
		-webkit-box-sizing: border-box;
   		-moz-box-sizing: border-box;
    	box-sizing: border-box;
	}
	
	/* ------------------------ 
	BASICS GRID
	------------------------ */
	.col-12 { width: 100%;  }
	.col-11 { width: 91.66666666666666%; }
	.col-10 { width: 83.33333333333334%; }
	.col-9 { width: 75%; }
	.col-8 { width: 66.66666666666666%; }
	.col-7 { width: 58.333333333333336%; }
	.col-6 { width: 50%; }
	.col-5 { width: 41.66666666666667%; }
	.col-4 { width: 33.33333333333333%; }
	.col-3 { width: 25%; }
	.col-2 { width: 16.666666666666664%; }
	.col-1 { width: 8.333333333333332%; }
	.col { 
		font-size: 0px; 
		line-height: 0px;
		padding: 0px; 
		display: inline-block;
		vertical-align: middle;
		margin: auto;
	}
	
	/* ------------------------ 
	STUFF
	------------------------ */	
	.flex { display: flex; }
	.block { display: block; }
	
	.fix { position: fixed; }
	.abs { position: absolute; }
	.rel { position: relative; }
	
	.m-auto { margin: auto; }
	
	.hyphen {
	/* hyphenate-limit-chars: 10 3 4;*/
	  overflow-wrap: break-word;
	  word-wrap: break-word;
	  
	  -webkit-hyphens: auto;
	 	 -moz-hyphens: auto;
	  	  -ms-hyphens: auto;
	  		  hyphens: auto;
	}
	
	.nbr { white-space: nowrap;}

	ul, li { list-style: none; }
	.inline { display: inline-block; }
	
	.bold { font-weight: 600; }
	.normal { font-style: normal; }
	
	.center { text-align: center; }
	.t-left { text-align: left; }
	.t-right { text-align: right; }
	
	.underline,
	.underline:hover { 
		text-decoration: underline !important; 
	 }
	 b {font-weight: 600;}
	 
	.upper { text-transform: uppercase; }
	.lower { text-transform: none; }
	
	.left { float: left; }
	.right { float: right; }
	.clear { clear: both; } 

	.v-top { vertical-align: top; }
	.v-middle {vertical-align: middle;}
	.v-bottom {vertical-align: bottom;}
	
	.hidden { overflow: hidden; }
	
	.f-light{ font-weight: 300; }
	.f-bold { font-weight: 500; }
	.italic { font-style: italic; }
	
	
	/* ------------------------ 
	image style
	------------------------ */	
	img { 
		width: 100%; 
		height: auto; 
		object-fit: cover; 
	}
	.image.round img { border-radius: 25px; }
	
	/* ------------------------ 
	archive style
	------------------------ */	
	.archive-label {
		top: 13.6rem;
		top: 335px;
		left: 1rem;
		background: #FF6E00;
		color: #fff;
		padding: 15px 15px;
		display: inline-block;
		width: auto;
		border-radius: 30px;
		font-size: 16px;
	}
	
	/* ------------------------ 
	list style
	------------------------ */	
	.list { 
		position: relative; 
		margin-left: 15px;
	 }
	.list:before {
		content: '';
		position: absolute;
		top: 10px;
		left: -15px;
		width: 5px;
		height: 5px;
		background-color: #000;
		border-radius: 50%;
	}
	
	/* ------------------------ 
	z-index
	------------------------ */	
	header { z-index: 2; }
	section#teaser.intro { z-index: 1;} 
	.aktuelles section#aktuelles { z-index: 2;}
	
	/* ------------------------ 
	DISPLAY
	------------------------ */	
	#searchform,
	.comments,
	.mobile { display: none; }
	.desk {display: block; }
	.desk.col {display: inline-block; }
	
	/* ------------------------ 
	TRANSITION
	------------------------ */	
	a, .but, .readmore {
		transition: .2s ease all;
		-moz-transition: .2s ease all;
		-webkit-transition: .2s ease all;
	}
	
	.trans-2 {
		transition: .2s ease all;
		-moz-transition: .2s ease all;
		-webkit-transition: .2s ease all;
	}
	.trans-3 {
		transition: .3s ease all;
		-moz-transition: .3s ease all;
		-webkit-transition: .3s ease all;
	}
	.trans-5 {
		transition: .5s ease all;
		-moz-transition: .5s ease all;
		-webkit-transition: .5s ease all;
	}
	
	.trans-15 {
		transition: 1.5s ease all;
		-moz-transition: 1.5s ease all;
		-webkit-transition: 1.5s ease all;
	}
	
	
	/* ------------------------ 
	COLOR
	------------------------ */	
	.white { color: #fff; }
	.green { color: #004D4F; }
	.purple { color: #BD2EFF; }
	.orange { color: #FF6E00; }
	.yellow { color: #D9C900; }
	.blue{ color: #0101EE; }
	
	.bg-white { background: #fff; }
 	.bg-orange { background: #FF6E00; }
	.bg-purple { background: #BD2EFF; }
	.bg-lightblue { background: #E5EDED; }
	.bg-yellow { background: #DAC901;}
	
	/* ------------------------ 
	Link Style
	------------------------ */
	a:focus,
	*:focus { outline: none !important; } 
	
	a,
	a:link,
	a:visited { 
		outline:none; 
		text-decoration: none;
		cursor: pointer;
	}
	
	.editor a,
	.partner a  {
		text-decoration: underline;
		color: #BD2EFF; 
	}
	.editor a  {
		font-family: 'Raleway-Bold';
	}
	
	#netzwerklist .editor a,
	.data .repeater a { text-decoration: none;}
	
	/* a hover */
	#netzwerklist .editor a:hover,
	.data .repeater a:hover {text-decoration: underline;}
	
	
	/* ------------------------ 
	BUTTON Style
	------------------------ */
	input.but,
	button.more { 
		font-size: 1.3rem;
		line-height: 1.3em;
		background: #fff;
		font-family: 'Raleway-Regular';
	}
	
	.but,
	button.more {
		padding: 15px 30px;
		display: inline-block;
		width: auto;
		border-radius: 30px;
		border: 1px solid #BD2EFF;
		color: #BD2EFF;
		display: inline-block;
		margin: 1rem 1rem 0 0;
	}
	button.more {
		margin: 35px auto;
		display: block;
		text-align: center;
		cursor: pointer;
	}
	button.more.loading,
	button.more.done { display: none; }
	
	/* a hover */
	input.but:hover,
	.but:hover,
	button.more:hover,
	.but.active {
		background: #BD2EFF;
		color: #fff;
	}