/* ============================ Foundation Original Styles Layout Override ==========================*/

html,
body {
		color: #555555;
		font-size: 16px;
		line-height: 150%;
		font-family: arial;
		width: 100%;
		background: #c2c2c2;
}

h1,
h2,
h3,
h4 {
		line-height: 150%;
		padding-top: 1rem;
		text-transform: uppercase;
		font-family: arial;
}

h1 {
		font-size: 1.625rem;
		padding: 50px 0;
}

h2 {
		font-size: 1.25rem;
}

h3 {
		font-size: 1.125rem;
}

.row {
		margin: 0 auto;
		/*max-width: 1024px;*/
		width: 100%;
}

.row .row {
		margin: 0;
		max-width: 100%;
		width: 100%;
}

.columns {
		padding: 0px 30px;
}

#topics-section .large-9 {
		height: 750px;
		z-index: 2;
}

#topics-section .large-3 {
		z-index: 1;
}

#content-section .large-9 {
		top: -85px;
		height: 670px;
		z-index: 5;
}

#content-section .large-3 {
		height: 585px;
		z-index: 4;
}

#references-section .large-9 {
		height: 1350px;
		top: -215px;
		z-index: 2;
}

#references-section .large-3 {
		height: 1155px;
		top: -215px;
		z-index: 1;
}

#about-section .large-9 {
		top: -410px;
		height: 800px;
		z-index: 5;
}

#about-section .large-3 {
		top: -285px;
		z-index: 4;
}

#topics-section .button-topics,
#content-section .button-content,
#references-section .button-references,
#about-section .button-about {
		width: 120px;
		height: 120px;
		font-size: 1.125rem;
}

.sections-move {
		height: 3390px;
}


/* ============================== CIS Brandcolors & Elements ================================*/

#topics-section .bg-img-tablet {
		background: url("../img/tablet_was_wir_tun.png") no-repeat scroll center -25px;
		height: 210px;
		position: relative;
		z-index: 5;
}

#content-section .bg-img-tablet {
		background: url("../img/tablet_mit_was_arbeiten.png") no-repeat scroll center -95px;
		height: 210px;
		position: relative;
		z-index: 5;
}

#references-section .bg-img-tablet {
		background: url("../img/tablet_was_man-sieht.png") no-repeat scroll center -250px;
		height: 210px;
		position: relative;
		z-index: 5;
}

#about-section .bg-img-tablet {
		background: url("../img/tablet_wer_wir_sind.png") no-repeat scroll center -130px;
		height: 210px;
		position: relative;
		z-index: 5;
}


/* =========================== CIS Layout Classes ================ */


/* Verschachtelung der Themen */


/* Hover Effekt customized */


/* =====================  Landing Page Classes ===================== */

#landing-section .columns {
		padding: 0;
}

.landing-top-left-bg {
		background: rgba(0, 0, 0, 0) url("../img/tablet_was_wir_tun.png") no-repeat scroll -40px bottom / auto 97%;;
}

.landing-top-right-bg {
		background: rgba(0, 0, 0, 0) url("../img/tablet_mit_was_arbeiten.png") no-repeat scroll center bottom;
}

.landing-bottom-left-bg {
		background: rgba(0, 0, 0, 0) url("../img/tablet_was_man-sieht.png") no-repeat scroll -60px -60px;
}

.landing-bottom-right-bg {
		background: rgba(0, 0, 0, 0) url("../img/tablet_wer_wir_sind.png") no-repeat scroll center bottom;
}


/* ===================== Modified Foundation Navbar Classes ===================== */

/*.container-menu-section {
		max-width: 964px;
}

#menu-section .logo {
		padding: 10px 30px 20px;
}

#menu-section .logo img {
		position: relative;
		z-index: 99;
		background: #fff;
		padding: 0;
		width: 150px;
		height: auto;
}

#menu-section .top-bar {
		height: 66px;
}

#menu-section .top-bar,
#menu-section .top-bar-section li:not(.has-form) a:not(.button) {
		font-size: 0.825rem;
		line-height: 1.4;
}

#menu-section .top-bar-section li:not(.has-form) a:not(.button) {
		padding: 0.3rem;
}*/

.menu-wrap {
	display: none;
}

.menu-positioner {
	width: 100%;
	padding: 0 10px;
}

.navigation-list {
	display: none;
}

.navigation-list li {
	margin-left: 7px;
}

@media (min-width: 960px) {
	.navigation-list li {
		margin-left: 25px;
	}
}

@media (min-width: 1024px) {
	.navigation-list {
		padding-right: 25px;
	}

	.navigation-list li {
		margin-left: 35px;
	}
}

@media (min-width: 1100px) {
	.navigation-list {
		padding-right: 40px;
	}

	.navigation-list li {
		margin-left: 50px;
	}
}

.logo-box {
	left: 20px;
}


/* ============================ CIS-Topics Classes ====================*/

#topics-section .button-topics {
		top: 160px !important;
		left: 130px !important;
}

#topics-section .bg-topics {
		height: 379px !important;
		max-width: 429px !important;
		width: 429px !important;
		background: url("../img/tablet_was_wir_tun.png") no-repeat;
		left: -145px;
		top: 285px;
}

#topics-section #topic-tabs.tabs {
		padding: 220px 0 0 0;
		width: 730px;
}

.arrow_box {
	margin-right: 2px;
}

#topics-section .topic-tabs-position .tabs-content {
		position: relative;
		top: 35px;
}

/* ============================ CIS-Content  Classes ====================*/
#content-section .button-content {
		top: 70px !important;
		left: 5px !important;
}

#content-section .bg-content {
	left: -335px;
	max-width: 622px;
	top: 126px;
	width: 622px;
	height: 459px;
	background: url("../img/tablet_mit_was_arbeiten.png") no-repeat;
}

.content-box {
	width: 100px;
}

.content-box .quad_bg {
		width: 80px;
		height: 80px;
}

.content-box  h3{
  font-size: 0.6rem;
}


@-webkit-keyframes quad-grow {
	from {
		 -webkit-transform: scale(1);
						 transform: scale(1);
	}
	to {
		 -webkit-transform: scale(3.6);
						 transform: scale(3.6);
	}
}

@keyframes quad-grow {
	from {
		 -webkit-transform: scale(1);
						 transform: scale(1);
	}
	to {
		 -webkit-transform: scale(3.6);
						 transform: scale(3.6);
	}
}

@-webkit-keyframes quad-shrink {
	from {
		 -webkit-transform: scale(3.6);
						 transform: scale(3.6);
	}
	to {
		 -webkit-transform: scale(1);
						 transform: scale(1);
	}
}

@keyframes quad-shrink {
	from {
		 -webkit-transform: scale(3.6);
						 transform: scale(3.6);
	}
	to {
		 -webkit-transform: scale(1);
						 transform: scale(1);
	}
}

/* ============================  References and Modified Foundation Orbit Slider Classes ====================*/
#references-section .button-references {
		top: 70px !important;
		left: 130px !important;
}

#references-section .bg-references {
	left: -330px;
	max-width: 595px;
	top: 560px;
	width: 595px;
	height: 595px;
	background: url("../img/tablet_was_man-sieht.png") no-repeat;
}

#references-section .button.small {
		width: 110px;
		-moz-hyphens: auto;
		-o-hyphens: auto;
		-webkit-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
}
#references-section .button.small.active {
		-moz-hyphens: auto;
		-o-hyphens: auto;
		-webkit-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
}
#references-section .orbit-bullets-container {
		position: relative;
		z-index: 10px;
}
#references-section .tabs .button a {
		font-size: 0.8rem;
		padding: 0;
}

/* =========================== About us Classes ================ */

#about-section .bg-about{
	left: -95px;
	max-width: 353px;
	top: 250px;
	width: 353px;
	height: 427px;
	z-index: 1;
	background: url("../img/tablet_wer_wir_sind.png") no-repeat;
}

.about-box{
	width:180px;
}

@-webkit-keyframes circle-grow-box {
	from {
		width:180px;
	}
	to {
		width:340px;
	}
}

@keyframes circle-grow-box {
	from {
		width:180px;
	}
	to {
		width:340px;
	}
}

@-webkit-keyframes circle-shrink-box {
	from {
		width:340px;
	}
	to {
		width:180px;
	}
}

@keyframes circle-shrink-box {
	from {
		width:340px;
	}
	to {
		width:180px;
	}
}

/* =========================== CIS Contact Slider Classes ================ */

/* =========================== CIS Footer & Impressum Classes ================ */
#footer-section {
		bottom: 0;
		margin: 0 auto;
		max-width: 100%;
		position: absolute;
		width: 100%;
		z-index: 10;
}
#footer-section,
#footer-section a {
		color: #ffffff;
}
#footer-section a {
		float: left;
		margin-left: 0px;
		padding-right: 20px;
}