/*  
Theme Name: Ghalingo
Theme URI: http://ghalingo.de
Version: 1.0
Author: Veronika Sattler
Author URI: http://websache.de
*/

/* --------------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------------

	INHALT:
	
	1. BASICS
		1.1. HTML5
		1.2. Reset
		1.3. Basics
			1.3.1. Links
			1.3.2. Listen
			1.3.3. Typographie
			1.3.4. Formulare
			1.3.5. Media
			1.3.6. Media
		1.4. Sprungmarken
		1.5. Icons
	2. SEITENSTRUKTUR
		2.1. Allgemeines
		2.2. Header mit Logo, Navigation und Kontaktlink
		2.3. Hauptspalte
		2.4. Footer
	3. BESONDERHEITEN
	4. MEDIA QUERIES

/* 1. BASICS
-----------------------------------------------------------------------------------------------
===============================================================================================*/
/* pt-sans-regular - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/pt-sans-v9-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('PT Sans'), local('PTSans-Regular'),
       url('fonts/pt-sans-v9-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/pt-sans-v9-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/pt-sans-v9-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/pt-sans-v9-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/pt-sans-v9-latin-regular.svg#PTSans') format('svg'); /* Legacy iOS */
}

/* pt-sans-700 - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/pt-sans-v9-latin-700.eot'); /* IE9 Compat Modes */
  src: local('PT Sans Bold'), local('PTSans-Bold'),
       url('fonts/pt-sans-v9-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/pt-sans-v9-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/pt-sans-v9-latin-700.woff') format('woff'), /* Modern Browsers */
       url('fonts/pt-sans-v9-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/pt-sans-v9-latin-700.svg#PTSans') format('svg'); /* Legacy iOS */
}

/* 1.1. HTML 5
-----------------------------------------------------------------------------------------------*/

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }

/* 1.2. Reset
-----------------------------------------------------------------------------------------------*/
html, body, 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, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent; box-sizing: border-box;}

.hidden {display: none;}
.invisible, .screenreader {
   clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
	}	


/* 1.3. Allgemeines
-----------------------------------------------------------------------------------------------*/
* {
	box-sizing: border-box;
	}
html, body {
	height: 100%;
	}
body {
	color:#3d3d3f;
	background: #ffffff;
	font-family: 'PT Sans', sans-serif;
	font-size: 0.95em;
	-webkit-text-size-adjust: none;
	line-height: 1.6;
	}
.inside {
	position:relative;
	padding: 0 90px;
	margin:auto;
	}	
.inside:after {
    content: ".";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
}		

/* 1.3.1. Links
-----------------------------------------------------------------------------------------------*/
a {
	text-decoration:none; 
	-webkit-transition: all 300ms linear;
	-moz-transition: all 300ms linear;
	-ms-transition: all 300ms linear;
	-o-transition: all 300ms linear;
	transition: all 300ms linear;
	color:#3fad79;
		}
a:visited {text-decoration:none;}
a:visited, a:hover, a:focus, a:active {color: #7ecac4;}
a:focus {text-decoration: underline;}
a:hover, a:active, a:focus {outline: 0;}


p {
	padding-bottom: 20px;
	}

/* 1.3.2. Listen
-----------------------------------------------------------------------------------------------*/
ul {list-style: none;}

#main ul {
	padding-left: 16px;
	padding-bottom: 15px;
	}				
#main li {
	text-indent:-6px;
	}
#main li:before {
	content: '\2022';
	display: inline-block;
	margin-right: 5px;
	color:#3cad7a;
 }
.arabic #main li:before {
	margin-right: 0px;
	margin-left: 5px;
 } 


/* 1.3.3. Typographie
-----------------------------------------------------------------------------------------------*/
h1 {
	font-size: 200%;
	margin-bottom: 25px;
	font-weight: normal;
	text-align: center;
	}
h2 {
	font-size: 160%;
	margin-bottom: 25px;
	font-weight: normal;
	}	
h3 {
	margin-bottom: 5px;
	}


/*1.3.4. Media
-----------------------------------------------------------------------------------------------*/
img {
	display: block;
	max-width: 100%;
	height: auto;
	width: 100%;
	}
iframe {
	max-width: 100%;
	margin-bottom: 15px;
	}

/*1.3.5. Formulare
-----------------------------------------------------------------------------------------------*/
form {
	position: relative;
	width: 100%;
	overflow: hidden;
	margin-left:-5%;
	}
.arabic form {
	margin-left:0;
	margin-right:-5%;
	}	
input, textarea, select {
	-webkit-border-radius: 0px;
	border-radius: 0px;
	-webkit-appearance: none;
	width: 100%;
	font-size: 0.95em;
	color:#3d3d3f;
	border: none;
	background:#f8f8f8;
	padding: 4px 8px;
	font-family: 'PT Sans', sans-serif;
	}
input:focus, textarea:focus, select:focus {
	background:#64bfb8;
	} 	
input, select {
	height: 42px;
	}
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color:#f8f8f8;
  background-image:url(../images/select.svg);
  background-position: 97%;
  background-repeat: no-repeat;
} 
.arabic select {
	  background-position: 3%;
	  }
option {
  background:#3cad7a;
  border-top:1px solid #fff;
  padding:.3em 1em .3em 1em;
}		
.widget-textarea, .widget-upload, .widget-submit {
	margin-left: 5%;
	margin-bottom: 12px;
	}	
.arabic .widget-textarea, .arabic .widget-upload, .arabic .widget-submit {
	margin-left: 0px;
	margin-right: 5%;
	}			
label {
	display: block;
	margin-bottom: 3px;
	}
.widget-text, .widget-select {
	float: left;
	position: relative;
	width: 45%;
	margin-left: 5%;
	margin-bottom: 12px;
	}
.arabic .widget-text, .arabic .widget-select {
	float: right;
	margin-left: 0;
	margin-right: 5%;
	}		
.widget-checkbox {
	padding-top: 10px;
	float: left;
	position: relative;
	width: 95%;
	margin-left: 5%;
	margin-bottom: 12px;
	}
.arabic .widget-checkbox {
	margin-left: 0%;
	margin-right: 5%;
	}		
.widget-explanation {
	float: left;
	position: relative;
	width: 95%;
	margin-left: 5%;
	margin-bottom: 12px;
	}
.arabic .widget-explanation {
	margin-left: 0%;
	margin-right: 5%;
	}			
.widget-checkbox input, .widget-checkbox label {
	height: auto;
	width: auto;
	display: inline;
	vertical-align:middle;
	}		
.submit.more {
	float: right;
	margin-top: 20px;
	border: none;
	}

	
/* 2. Seitenstruktur
-----------------------------------------------------------------------------------------------
===============================================================================================*/
/* 2.1. Allgemeines
-----------------------------------------------------------------------------------------------*/
#wrapper {
	position: relative;
	min-height: 100%;
	height: auto;
	box-sizing:border-box;
	max-width: 100%;
	overflow: hidden;
	}
* html #wrapper {
	min-height: 100%;
	}	
.margin {
	margin: 70px auto;
	}
.margin_sans {
	margin: 0px auto;
	}	

/* 2.2. Header 
-----------------------------------------------------------------------------------------------*/
#header {
	}
#logo {
	position: relative;
	float: left;
	margin-left: 40px;
	padding: 10px 0;
	}
.arabic #logo {
	position: relative;
	float: right;
	margin-left: 0px;
	margin-right: 40px;
	padding: 10px 0;
	}		
/* 2.2.1. Navi
-----------------------------------------------------------------------------------------------*/			
.navi_main {
	float: right;
	font-size: 95%;
	}
.arabic .navi_main {
	float: left;
	}	
.navi_main li {
	display: block;
	float: left;
	margin-left: 40px;
	text-transform:uppercase;
	position:relative;
	height: 90px;
	text-align:center;
	}
.arabic .navi_main li {
	float: right;
	margin-left: 0px;
	margin-right: 40px;
	}	
.navi_main strong, .navi_main .trail {
	color:#3fad79;
	font-weight: normal;
	}	
.navi_main a, .navi_main strong {
	display: block;
	color:#3d3d3f;
	height: 90px;
	position:relative;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	}
.navi_main a.contact, .navi_main .contact strong {
	background:#3cad7a;
	color:#fff;
	width: 90px;
	position:fixed;
	right:0;
	top:0;
	z-index:100;
	}
.arabic .navi_main a.contact, .navi_main .contact strong {
	right:auto;
	left:0;
	}	
.navi_main a.contact span {
	position: relative;
	z-index: 300;
	}	
.navi_main a.contact:after {
	content:'';
	display: block;
	position: absolute;
	top:0px;
	left:0;
	background:#7ecac4;
	width: 100px;
	height: 0px;
	z-index: 200;
	-webkit-transition: all 330ms ease-in-out;
	-moz-transition: all 330ms ease-in-out;
	-ms-transition: all 330ms ease-in-out;
	-o-transition: all 330ms ease-in-out;
	transition: all 330ms ease-in-out;
		}
.navi_main a.contact:hover, .navi_main a.contact:focus {
	color:#fff;
	}	
.navi_main a.contact:hover:after, .navi_main a.contact:focus:after {
	height: 90px;
	}					
.navi_main a:hover, .navi_main a:focus, .navi_main strong, .navi_main .trail {
	color:#3fad79;
	}

/* 2.2.1.1 Scrollheader
-----------------------------------------------------------------------------------------------*/			
.scroll .navi_main {
	background: rgba(60,173,122,0.98);
	z-index:980;
	width: 100%;
	height: 100%;
	position: fixed;
	display: none;
	top:0px;
	visibility: hidden;
	-webkit-transition: visibility 0s .2s;
	transition: visibility 0s .2s;
	}
.scroll .navi_main ul {
	text-align: center;
	position: relative;
	top: -100%;
	height: 60%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-transition: top .6s;
	transition: top .6s;
	z-index:800;
	}
.scroll .navi_main.magic {	
   visibility: visible;
   display: block;
}	
.scroll .navi_main.magic ul {
	top: 45%;
	height: 60%;
	}
.scroll .navi_main a.contact:after {
	display: none;
	}	
.scroll .navi_main a, .scroll .navi_main strong {
	height: auto;
	color:#fff;
	display: block;
	}	
.scroll .navi_main li {
	float: none;
	display: block;
	display: block;
	height: 16.6%;
	height: calc(100% / 6);
	min-height: 40px;
	font-size:130%;
	}	
.scroll .navi_main a.contact, .scroll .navi_main .contact strong {
	background:none;
	width: auto;
	position: static;
	}		

/* 2.2.2. Hamburger
-----------------------------------------------------------------------------------------------*/			
.menu_open {
  position: absolute;
  background:#3cad7a;
  width: 90px;
  height: 90px;
  right:0;
  top:0;
  border: none;
  padding:0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  display: none;
  z-index:999;
  overflow: hidden;
  outline: 0px solid transparent;
  -webkit-appereance: none;
}
.arabic .menu_open {
  right:auto;
  left:0px;
}
.menu_open:before {
	content: url('../images/menu.svg');
	padding: 30px;
	display: inline-block;
	text-align: center;
}
.scroll .menu_open {
	display: block;
	position: fixed;
	}

/* 2.2.3. Sprachwechsler
-----------------------------------------------------------------------------------------------*/			
.mod_changelanguage {
	position: fixed;
	right:0;
	top: 90px;
	z-index: 2000;
	}
.arabic .mod_changelanguage {
	right:auto;
	left:0px;
	}	
.mod_changelanguage .active {
	display: block;
	color:#3d3d3f;
	height: 90px;
	width: 90px;
	position:relative;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
    justify-content: center;
	align-items: center;
	border-bottom: 1px solid #e0dede;
	cursor: pointer;
	}
.mod_changelanguage .active:after {
	display: inline-block;
	content: url('../images/down-arrow.svg');
	margin-left:8px;
	-webkit-transition: all 200ms linear;
	-moz-transition: all 200ms linear;
	-ms-transition: all 200ms linear;
	-o-transition: all 200ms linear;
	transition: all 200ms linear;
	}
.arabic .mod_changelanguage .active:after {
	margin-left:0px;
	margin-right:8px;
	}	
.mod_changelanguage .active.close:after {
	-moz-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
	}		
			
.language-switch {
	display: none;
	opacity:0;
	z-index: 9999;
	width: 100%;
	text-align: center;
	position: absolute;
	-webkit-transition: all 333ms ease;
	-moz-transition: all 333ms ease;
	-ms-transition: all 333ms ease;
	-o-transition: all 333ms ease;
	transition: all 333ms ease;
	}
.language-switch a {
	display: block;
	border-bottom: 1px solid #fff;
	color:#fff;
	padding: 5px 0;
	background: #3cad7a;
	}
.language-switch a:hover, .language-switch a:focus {
	border-bottom: 1px solid #3cad7a;
	color:#3cad7a;
	padding: 5px 0;
	background:#fff;
	}			
.language-switch.show {
	display: block;
	opacity:1;
	}	

/* 2.3. Start
-----------------------------------------------------------------------------------------------*/
/* 2.3.1. Startbild
-----------------------------------------------------------------------------------------------*/
.cover_start figure {
	position:relative;
	width: 100%;
	height: 620px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top right;
	}
.cover_start img {
	clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
	}
.cover_start figcaption {
	position: absolute;
	top: 50%;
	text-align: right;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 40px;
	}
.cover_start figcaption p {
	font-size: 200%; 
 }
.cover_start .more {
	margin-top: 50px;
	} 
.more {
	position: relative;
	display: inline-block;
	color:#fff;
	background:#7ecac4;
	border-radius: 30px;
	padding: 10px 20px;
	}
.more span {
	position: relative;
	z-index: 300;
	color:#fff;
	}
.more:hover, .more:focus {
	color:#fff;
	}		
.more:after {
	content:'';
	display: inline-block;
	position: absolute;
	top:0px;
	left:0;
	background:#3cad7a;
	width: 100%;
	height: 0%;
	z-index: 200;
	border-radius: 30px;
	-webkit-transition: all 330ms ease-in-out;
	-moz-transition: all 330ms ease-in-out;
	-ms-transition: all 330ms ease-in-out;
	-o-transition: all 330ms ease-in-out;
	transition: all 330ms ease-in-out;
	}
.more:hover:after, .more:focus:after {
	height: 100%;
	}			


/* 2.3.2. Center
-----------------------------------------------------------------------------------------------*/
.center {
	max-width: 900px;
	font-size: 140%;
	text-align: center;
	}
.left {
	max-width: 1100px;
	font-size: 120%;
	margin:0px;
	}	


/* 2.3.3. Teaser
-----------------------------------------------------------------------------------------------*/
.teaser h1 {
	text-align: left;
	}
.arabic .teaser h1 {
	text-align: right;
	}	
.teaser {
	-webkit-box-shadow: 0 23px 50px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 23px 50px 0 rgba(0, 0, 0, 0.12);
	padding: 50px;
	background:#fff;
	}
.holder	{
	position: relative;
	padding: 70px 0;
	height: auto;
	}
.holder:after {
    content: ".";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
}		
.half {
	width: 60%;
	float: left;
	z-index:100;
	position: relative;
	z-index:10;
	}
.arabic .half {
	float: right;
	}	
.half li {
	width: 45%;
	margin-right: 5%;
	float: left;
	}
.arabic .half li {
	width: 45%;
	margin-right: 0%;
	margin-left: 5%;
	float: right;
	}			
.third {
	width: 28%;
	float: left;
	z-index:100;
	position: relative;
	z-index:10;
	}	
.holder:before {
	content:'';
	display: block;
	position: absolute;
	top: 0px;
	width: 50%;
	background:#f8f8f8;
	z-index:-1;
	right: 0px;
	}
.arabic .holder:before {
	right: auto;
	left:0px;
	}	
.magic:before, .green:before {
	height:0;
	-webkit-transition: all 700ms ease;
	-moz-transition: all 700ms ease;
	-ms-transition: all 700ms ease;
	-o-transition: all 700ms ease;
	transition: all 700ms ease;
	}
.magic.show:before, .green.show:before {
	height:100%;
	}		
.holder.blue:before	{
	background:#64bfb8 url(../images/preise.png) no-repeat 80% center;
	}
.holder.blue.profile:before	{
	background:#64bfb8 url(../images/bubble_por.png) no-repeat 80% center;
	}	
.holder.blue1:before	{
	background:#64bfb8 url(../images/english.png) no-repeat 80% center;
	}
.holder.green1:before	{
	background:#3cad7a url(../images/arabic.png) no-repeat 80% center;
	}
.holder.green2:before	{
	background:#3cad7a url(../images/contact.png) no-repeat 80% center;
	}			
.holder.greeny:before	{
	background:#3cad7a;
	}	
.list {
	width: 35%;
	float: right;
	}
.arabic .list {
	float: left;
	}	
#main .list ul {
	padding-left: 60px;
	}	
.arabic #main .list ul {
	padding-left: 0px;
	padding-right: 60px;
	}				
#main .list li {
	font-weight: bold;
	text-indent:-30px;
	}
#main .list li:before {
	content: url('../images/bubble.svg');
	display: inline-block;
	margin-right: 20px;
	vertical-align:-12px;
	}
.arabic #main .list li:before {
	margin-right: 0px;
	margin-left: 20px;
	}	
#main .greeny .list li:before {
	content: url('../images/bubble_white.svg');
	display: inline-block;
	margin-right: 20px;
	vertical-align:-12px;
	}			
.greeny .list a {
	color:#fff;
	}	

/* 2.3.4. Green
-----------------------------------------------------------------------------------------------*/
.green {
	margin-top: 70px;
	padding: 50px;
	position:relative;
	color:#fff;
	}
.green h2 {
	padding-left: 180px;
	font-size: 200%;
	margin-bottom: 50px;
	}	
.green img {
	width: auto;
	float: left;
	margin-right: 50px;
	}
.arabic .green img {
	float: right;
	margin-right: 0px;
	margin-left: 50px;
	}			
.green:before {
	content:'';
	display: block;
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 0px;
	background:#3cad7a;
	z-index:-1;
	}
.green .ce_text {
	overflow: hidden;
	margin-bottom: 50px;
	}		
.green .ce_text p {
	padding-top: 20px;
	}

/* 2.4. Start
-----------------------------------------------------------------------------------------------*/
/* 2.4.1. Startbild
-----------------------------------------------------------------------------------------------*/
.cover_default {
	position:relative;
	width: 100%;
	height: 620px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
	}
.cover_default a {
	color:#fff;
	}	
.cover_default img {
	clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
	}
.cover_default .text {
	font-size: 110%;
	width: 45%;
	height: 100%;
	background: #3cad7a;
	color:#fff;
	padding: 50px;
	display: -webkit-flex;
	display: flex;
    justify-content: center;
	align-items: center;
	}
.cover_default.blue .text {	
	background:#64bfb8;
	}			

/* 2.4.2. Akkordion
-----------------------------------------------------------------------------------------------*/	
.toggler {
	background:#f8f8f8;
	padding: 15px 50px;
	font-weight: normal;
	cursor: pointer;
	margin-bottom: 5px;
	position: relative;
	}
.toggler:before {
	content: url('../images/bubble.svg');
	display: inline-block;
	margin-right: 20px;
	vertical-align:-12px;
	}
.arabic .toggler:before {
	margin-right: 0px;
	margin-left: 20px;
	}
.toggler:after {
	content: url('../images/arrow_grey.svg');
	display: inline-block;
	position: absolute;
	right: 50px;
	top: 50%;
	margin-top: -10.5px;
	}
.arabic .toggler:after {
	right: auto;
	left:50px;
	-moz-transform: rotate(-180deg);
	-webkit-transform: rotate(-180deg);
	-o-transform: rotate(-180deg);
	-ms-transform: rotate(-180deg);
	transform: rotate(-180deg);	
	}
.toggler.ui-state-active:after	{
	-moz-transform: rotate(-20deg);
	-webkit-transform: rotate(-20deg);
	-o-transform: rotate(-20deg);
	-ms-transform: rotate(-20deg);
	transform: rotate(-20deg);	
	}
.arabic .toggler.ui-state-active:after	{
	-moz-transform: rotate(-160deg);
	-webkit-transform: rotate(-160deg);
	-o-transform: rotate(-160deg);
	-ms-transform: rotate(-160deg);
	transform: rotate(-160deg);	
	}
.accordion {
	padding: 20px 50px;
	max-width: 1100px;
	}	

/* 2.4.3. Imprint
-----------------------------------------------------------------------------------------------*/	
.impressum h1 {
	background:#7ecac4;
	padding: 21px 50px;
	color:#fff;
	}



/* 3. Footer
-----------------------------------------------------------------------------------------------*/
#footer {
	margin-top: 70px;
	padding: 0 90px;
	}
#footer a {
	color:#fff;
	}
#footer strong {
	display: inline-block;
	padding-bottom: 6px;
	}	
#footer .right a:hover, #footer .right:focus {
	color: #7ecac4;
	}		
.footerteaser.left{
	float: left;
	}
.arabic .footerteaser.left{
	float: right;
	}	
.footerteaser.right{
	float: right;
	}
.arabic .footerteaser.right{
	float: left;
	}
.footerteaser.right p {
	float: left;
	padding-left: 70px;
	}	
.arabic .footerteaser.right p {
	float: right;
	padding-left: 0px;
	padding-right: 70px;
	}	
.imprint {
	padding-top: 27px;
	}
#footer .inside {
	background:#434955;
	color:#fefefe;
	padding: 70px 50px;
	}
	
#footer .more {
	background:#3cad7a;
	margin-top: 30px;
	}
#footer .more:after {
	background:#7ecac4;
	}
.phone:before {
	content: url('../images/phone.svg');
	display: inline-block;
	margin-right: 10px;
	}
.email:before {
	content: url('../images/mail.svg');
	display: inline-block;
	margin-right: 10px;
	}
.arabic .phone:before {
	margin-right: 0px;
	margin-left: 10px;
	}
.arabic .email:before {
	margin-right: 0px;
	margin-left: 10px;
	}	
	

	

/*===============================================================================================*/
/* 4. Media Queries
-----------------------------------------------------------------------------------------------
===============================================================================================*/
@media only screen and (max-width: 1280px) {
	.cover_start figcaption p {
		font-size: 180%; 
	 }
	}
@media only screen and (max-width: 1200px)   
	{
#logo {
	margin-left: 0px;
	}
.cover_start figcaption p {
	font-size: 160%; 
 }	
.navi_main li {
	margin-left: 20px;
	}
.cover_start figure, .cover_default {
	height: 520px;
	}	
.cover_default .text {
	font-size: 100%;
	width: 50%;
	padding: 30px;
	}
.footerteaser.right p {
	float: left;
	padding-left: 30px;
	}
.teaser, .green {
	padding: 30px;
	}
#footer .inside {
	background:#434955;
	color:#fefefe;
	padding: 50px 30px;
	}	
	}
@media only screen and (max-device-width: 1280px) {
	.magic:before, .green:before {
		height: 100%;
		}
	}		
@media only screen and (max-width: 1023px)   
	{
h1 {
	font-size: 180%;
	}
h2 {
	font-size: 140%;
	}	
.inside {
	padding: 0px;
	}
.center {
	font-size: 100%;
	padding: 0 30px;
	}	
.menu_open {
	   display: block;
	   }
.mod_changelanguage {
	position: absolute;
	right:90px;
	top: 0px;
	} 
.arabic .mod_changelanguage {
	right:auto;
	left:90px;
	}	
.mod_changelanguage .active	{
	border-bottom: none;
	}
#logo {
	margin-left: 30px;
	}
#navi_main {
 	    background: rgba(60,173,122,0.98);
		z-index:980;
		width: 100%;
		height: 100%;
		position: fixed;
		left: 0;
		top:90px;
		visibility: hidden;
		-webkit-transition: visibility 0s .2s;
		transition: visibility 0s .2s;
		}
#navi_main.magic {	
   visibility: visible;
}
#navi_main ul {
	text-align: center;
	position: relative;
	top: -100%;
	height: 60%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-transition: top .6s;
	transition: top .6s;
	z-index:800;
	}
#navi_main.magic ul {
	top: 45%;
	height: 60%;
	}
.navi_main a.contact:after {
	display: none;
	}	
#navi_main a {
	height: auto;
	color:#fff;
	display: block;
	}	
#navi_main li {
	float: none;
	display: block;
	display: block;
	height: 16.6%;
	height: calc(100% / 6);
	min-height: 40px;
	font-size:130%;
	}	
.margin {
	margin: 50px auto;
	}	
.magic:before, .green:before {
		height: 100%;
		}	
#footer {
	margin-top: 50px;
	padding: 0;
	}
#navi_main strong, #navi_main .trail {
	color:#f8f8f8;
	height: auto;
	display: block;
	}	
.navi_main a.contact, .navi_main .contact strong {
	background:none;
	width: auto;
	position: static;
	}
.half, .list {
	width: auto;
	margin-left: 30px;
	margin-right: 30px;
	float: left;
	clear: both;
	}
.empty {
	padding-left: 30px;
	}	
.list {
	margin-left:30px;
	margin-top: 50px;
	}
.arabic .list {
	float: right;
	}	
.green {
	margin-top: 50px;
	}
.green h2 {
	padding-left: 0px;
	font-size: 180%;
	}	
.green img {
	width: auto;
	float: left;
	max-width: 28%;
	margin-right: 6%;
	}
.green .ce_text p {
	padding-top: 0px;
	float: left;
	max-width: 66%;
	}
.arabic .green .ce_text p {
	float: right;
	}	
.holder.blue:before, .holder.blue1:before, .holder.blue2:before, .holder.green1:before, .holder.green2:before {
	background-image: none;
	}
.cover_start figure, .cover_default {
	background: #fff;
	height: auto;
	}
.cover_default img, .cover_start figure img {
	clip: rect(auto, auto, auto, auto);
    position: relative !important;
    height: auto;
    width: 100%;
	}
.cover_default .text {
	font-size: 100%;
	position: relative;
	width: 100%;
	padding: 40px;
	height: auto;
	}
.cover_start figcaption {
	width: 100%;
	right: auto;
	position: relative;
	text-align: center;
	top: auto;
	transform: translateY(0%);
	background:#f8f8f8;
	padding: 40px 40px;
	}
.cover_start figcaption br {
	display: none;
	}	
.cover_start figcaption p {
	font-size: 150%;
	padding-bottom:0;
	}
.holder:before {
	width: 100%;
	}	
.footerteaser.right{
	float: left;
	clear: both;
	margin-top: 50px;
	}
.arabic .footerteaser.right{
	float: right;
	clear: both;
	}	
.footerteaser.right p {
	padding-left: 0px;
	padding-right: 30px;
	}
.arabic .footerteaser.right p {
	padding-right: 0px;
	padding-left: 0px;
	clear: both;
	}	
.toggler {
	padding: 15px 30px;
	}
.toggler:after {
	right: 30px;
	}
.accordion {
	padding: 20px 30px;
	}									
	}

@media only screen and (max-width: 600px)
{
.mod_changelanguage .active {
	width: 60px;
	}
.toggler:before {
	display: none;
	}

.footerteaser.right p {
	float: left;
	clear: both;
	padding-left: 0px;
	padding-bottom: 5px;
	}
.widget-text, .widget-select, .widget-textarea,  .widget-upload {
	width: 96%;
	}
.half {
	margin:0;
	}
.list {
	margin-left: 30px;
	}		
}