@width-main: 1300px;

@color-yellow: #f8ae00;
@color-yellow-dark: #c18802;
@color-gray: #727272;
@color-gray-dark: #444;
@color-gray-light: #b5b5b5;
@color-gray-lightest: #d1d1d1;

///////////////////////////////
// Classes
///////////////////////////////
.centered {
	margin-left: auto;
	margin-right: auto;
}
.bold {
	font-weight: 600;
}
.txtfont {
	font-family: "arial",sans-serif;
	font-size: 13px;
	line-height:1.4em;
}
.txtsmall {
	.txtfont;
	font-size: 12px;
}
.txtsmallest {
	.txtfont;
	font-size: 10px;
}
.big {
	.txtfont;
	font-size: 17px;
}
.bigger {
	.txtfont;
	font-size: 23px;
}
.biggest {
	.txtfont;
	font-size: 35px;
}
.block {
	display: block;
}
.black {
	color: #000;
}
.displayfloat {
	display: block;
	float: left;
}
.displayfloatright {
	display: block;
	float: right;
}
.not-a-style {
	color: inherit;
	text-decoration: none;
	font-weight: normal;
	&:hover {
		color: @color-yellow;
	}
}
.header {
	font-size: 17px;
	text-transform: uppercase;
	font-weight: normal;
	display: block;
}
a.header {
	text-transform: none;
	.not-a-style;
}
a .header {
	color: #000;
}
.header-big {
	.header;
	font-size: 19px;
}
.gray {
	color: @color-gray;
}
.gray-dark {
	color: @color-gray-dark;
}
.clearfix-me {
	clear: both;
	height: 0;
	line-height: 0;
	padding: 0;
	margin: 0;
}
.justify {
	text-align: justify;
}
.with-arrow {
	display: block;
	position: relative;
	left: -18px;
	padding: 5px 0 5px 45px;
	background: url(/files/images/arrow-double.png) 0 center no-repeat;
	&.move-full {
		left: -45px;
	}
	&.header {
		margin-bottom: 10px;
	}
}
.with-arrow-left {
	display: block;
	padding: 5px 0 5px 25px;
	color: #000;
	background: url(/files/images/arrow-left.png) 0 center no-repeat;
}
.ico-115 {
	display: block;
	width: 115px;
	height: 109px;
	background: url(/files/images/ico-articles.jpg) 0 0 no-repeat;
	&.ico-bulb {
		background-position: 0 0;
	}
	&.ico-chart {
		background-position: -115px 0;
	}
	&.ico-globe {
		background-position: -230px 0;
	}
	&.ico-note {
		background-position: -345px 0;
	}
}
.button-25 {
	.not-a-style;
	.bold;
	.txtsmallest;
	line-height: 1em;
	display: inline-block;
	margin-right: 7px;
	color: @color-gray-dark;
	text-transform: uppercase;
	background: url(/files/images/button25.png) 0 0 no-repeat;
	min-height: 25px;
	span {
		display: block;
		background: url(/files/images/button25.png) right 0 no-repeat;
		position: relative;
		right: -7px;
		padding: 7px 20px 7px 13px;
	}
	&:hover {
		color: #fff;
	}
}
.img-left {
	float: left;
	margin: 0 15px 15px 0;
}
.img-right {
	float: right;
	margin: 0 0 15px 15px;
}
.container {
	border-bottom: 1px solid #b5b5b5;
	text-align: center;
	width: 100%;
	z-index: 1;
	> .inner {
		.centered;
		text-align: left;
		position: relative;
/*		width: 900px;*/
	}
	&.container-1300 {
		width: 1300px;
	}
	&.container-1300 > .inner {
		width: 1300px;
	}
	&.container-1100 {
		width: 1100px;
	}
	&.container-100 > .inner {
		width: 1100px;
	}
	&.container-948 > .inner {
		width: 948px;
	}
	&.container-900 > .inner {
		width: 900px;
	}
	&.container-regular > .inner {
		padding: 40px 0;
		> .left, > .right {
			.displayfloat;
			width: 50%;
			.header {
				margin-bottom: 10px;
			}
		}
		> .content {
			.displayfloat;
			width: 683px;
			> ul li {
				list-style: none;
				display: block;
				padding-bottom: 10px;
				position: relative;
				p {
					.gray;
					.justify;
				}
			}
			.step-left {
				display: inline-block;
				width: 48%;
				margin-left: 1%;
				text-align: left;
			}
			.step-right {
				display: inline-block;
				width: 49%;
				text-align: right;
			}
			.more-link {
				.header;
				.not-a-style;
				.gray;
				display: inline-block;
				margin-top: 30px;
				padding: 5px 45px 5px 0;
				background: url(/files/images/arrow-double.png) right center no-repeat;
			}
			.prev-link {
				.header;
				.not-a-style;
				.gray;
				display: inline-block;
				margin-top: 30px;
				padding: 5px 0 5px 45px;
				background: url(/files/images/arrow-left-double.png) 0 center no-repeat;
			}
		}
	}
	&.container-team-item > .inner {
		padding: 20px 0;
	}
}
///////////////////////////////
// Reset
///////////////////////////////
body {
	background: #fff;
	text-align: center;
	padding: 0;
	margin: 0;
	.txtfont;
	color: #000;
}
h1, h2, h3, h4 {
	margin: 0;
	padding: 0;
	font-size: 1em;
	font-weight: normal;
}
a {
	outline: none;
	color: @color-yellow-dark;
	text-decoration: none;
}
p a {
	font-weight: bold;
	color: #000;
	&:hover {
		color: @color-yellow-dark;
	}
}
img, a img {
	border: none;
}
p, li, strong {
	text-align: left;
	margin: 0;
	.txtfont;
}
p {
	margin-bottom: 1em;
}
abbr, acronym {
	font-family: inherit;
	color: inherit;
	cursor: help;
}
ul, div {
	margin: 0;
	padding: 0;
}
b {
	.bold;
}
h1, .container-h2 h2 {
	.header;
	.biggest;
	padding: 15px 0;
	margin: 0;
}
h2 a {
	color: #000;
	&:hover {
		color: @color-yellow;
	}
}
input, textarea, input:focus, textarea:focus {
	.txtfont;
	outline: none;
}
input[type='text'], textarea {
	color: @color-gray-light;
	background: #f9f9f9;
	padding: 5px;
	border: 1px solid #c3c3c2;
}
.about-us, .blog, .portfolio {
	.container-regular p, .two-columns p {
		.gray;
	}
}
.frontpage, .portfolio {
	.four-columns p, #featured-companies p {
		.gray;
	}
}
///////////////////////////////
// Layout
///////////////////////////////
#header {
	border-color: #000;
	border-top: 8px solid @color-yellow;
	#logo {
		.displayfloat;
		background: url(/files/images/logo.png) 0 0 no-repeat;
		width: 250px;
		height: 72px;
		margin: 30px 20px;
		overflow: hidden;
		span {
			display: none;
		}
	}
	#menu-main {
		position: absolute;
		right: 0;
		bottom: 15px;
		text-transform: uppercase;
		li {
			list-style: none;
			display: inline-block;
			padding: 0;
			&.last {
				margin-right: 20px;
			}
			a {
				.not-a-style;
				display: inline-block;
				padding: 10px 20px;
				&:hover {
					color: #000;
				}
			}
		}
	}
	.menu-active-img {
		display: block;
		width: 115px;
		height: 12px;
		background: url(/files/images/menu-active.png) 0 0 no-repeat;
		position: absolute;
		bottom: 0;
		left: 70%;
	}
	.search-link {
		display: block;
		padding: 0 140px 0 50px;
		height: 33px;
		position: absolute;
		top: -1px;
		left: 850px;
		> .bg-left, > .bg-right {
			display: block;
			width: 50%;
			height: 33px;
			background: url(/files/images/bg-search.png) 0 0 no-repeat;
			position: absolute;
			top: 0;
			z-index: 0;
		}
		> .bg-left {
			right: 50%;
		}
		> .bg-right {
			left: 50%;
			background-position: right 0;
		}
		.search-box {
			display: inline-block;
			width: 192px;
			height: 32px;
			background: url(/files/images/bg-search-box.png) 0 0 no-repeat;
			z-index: 2;
			position: relative;
			top: -8px;
			input {
				border: 0;
				background: transparent;
				display: block;
				width: 138px;
				color: #000;
				margin: 3px 25px 0 25px;
			}
		}
		a {
			position: absolute;
			top: 1px;
			right: 55px;
			padding: 3px 8px;
			text-transform: uppercase;
			.not-a-style;
			z-index: 2;
		}
		&:hover a {
			color: #fff;
		}
	}
}
#flash-teaser {
	height: 381px;
	overflow-y: hidden;
	> .inner {
		height: 381px;
		text-align: center;
		#credo-flash-header {
		  height: 381px;
		  width: 100%;
		  display: block;
		}
		#credo-flash-header-small {
		  height: 260px;
		  width: 100%;
			display: none;
		}
	}
}
@media all and (max-height: 750px) {
	#flash-teaser, #flash-teaser > .inner { height: 260px }
	#flash-teaser > .inner {
		#credo-flash-header { display: none }
		#credo-flash-header-small { display: block }
	}
}
.four-columns {
	li {
		.displayfloat;
		width: 188px;
		min-height: 295px;
		position: relative;
		margin: 40px 24px;
		text-align: center;
		.ico-115 {
			.centered;
			margin-bottom: 10px;
			position: relative;
		}
		.header {
			display: block;
			text-align: left;
			padding: 10px 0;
			background: url(/files/images/arrow-read-more.png) right center no-repeat;
		}
		p {
			.txtsmall;
			padding: 5px 0;
			text-align: justify;
		}
		.button-wrap {
			width: 100%;
			position: absolute;
			bottom: 0;
			left: 0;
			text-align: center;
		}
		&:hover {
			.header {
				color: @color-yellow;
			}
			.ico-bulb {
				background-position: 0 -119px;
			}
			.ico-chart {
				background-position: -115px -119px;
			}
			.ico-globe {
				background-position: -230px -119px;
			}
			.ico-note {
				background-position: -345px -119px;
			}
		}
	}
}
#featured-companies {
	> .inner {
		overflow: hidden;
		padding: 40px 0;
		.inner-slider {
			padding: 0 45px;
		}
		&:hover {
			.company-text .header {
				color: @color-yellow;
			}
		}
	}
	li {
		.displayfloat;
		width: 810px;
		.company-logo {
			float: left;
			width: 330px;
			text-align: center;
			img {
				.centered;
			}
		}
		.company-text {
			float: left;
			width: 375px;
			p {
				text-align: justify;
			}
		}
	}
	.bx-prev, .bx-next {
		display: block;
		width: 35px;
		height: 68px;
		background: url(/files/images/arrow-slider.png) 0 0 no-repeat;
		position: absolute;
		top: 25%;
	}
	.bx-next {
		background-position: -35px 0;
		right: -45px;
		&:hover {
			background-position: -35px -68px;
		}
	}
	.bx-prev {
		left: -45px;
		&:hover {
			background-position: 0 -68px;
		}
	}
}
.container.two-columns {
	> .inner {
		> .left, > .right {
			width: 426px;
			margin: 40px 24px;
			.displayfloat;
			.item-text {
				p {
					text-align: justify;
					margin-right: 220px;
				}
			}
		}
	}
}
#filter {
	border-bottom: 0;
	> .inner {
		margin-top: 10px;
		margin-bottom: 10px;
		li {
			list-style: none;
			.header;
			float: left;
			margin-right: 40px;
			a {
				font-size: 0.9em;
				color: #000;
				&:hover, &.current {
					color: @color-yellow;
				}
			}
		}
	}
}
#footer-top {
	background: #fff url(/files/images/bg-gradient-gray-white.png) 0 0 repeat-x;
	min-height: 518px;
	margin-top: 80px;
	border-color: @color-gray-lightest;
	> .inner {
		padding: 10px 0;
	}
	.col {
		.displayfloat;
		width: 280px;
		min-height: 438px;
		padding-top: 30px;
		margin-right: 54px;
		position: relative;
		&.last {
			margin-right: 0;
		}
		> strong a {
			color: #000;
			&:hover {
				color: @color-yellow-dark;
			}
		}
		.header-big {
			font-size: 18px;
			padding: 0 0 30px 0;
		}
		.ico-footer {
			display: block;
			width: 83px;
			height: 135px;
			position: absolute;
			top: -70px;
			right: 0;
			float: right;
			background: url(/files/images/ico-footer.png) 0 0 no-repeat;
			&.ico-phone {
				background-position: 0 0;
			}
			&.ico-twitter {
				background-position: -90px 0;
			}
			&.ico-facebook {
				background-position: -180px 0;
			}
		}
		.contact {
			.txtsmall;
			.big.block {
				padding-bottom: 5px;
			}
			a {
				.not-a-style;
			}
		}
		.bottom-wrap {
			position: absolute;
			bottom: 40px;
			left: 0;
			.rss-box {
				.header {
					padding: 25px 0 0 40px;
					line-height: 1em;
					color: @color-gray;
					background: url(/files/images/ico-rss.png) 0 bottom no-repeat;
				}
				p {
					margin-top: 1em;
				}
				input {
					margin-bottom: 1em;
				}
			}
		}
	&:hover {
		.ico-footer {
			&.ico-phone {
				background-position: 0 -135px;
			}
			&.ico-twitter {
				background-position: -90px -135px;
			}
			&.ico-facebook {
				background-position: -180px -135px;
			}
		}
	}
	}
}
#footer-bottom {
	border-bottom: 0;
	color: @color-gray-light;
	> .inner {
		padding: 40px 0;
		overflow-x: visible;
	}
	p {
		.txtsmall;
		.displayfloat;
		width: 270px;
		margin: 0 30px 0 0;
	}
	.sitemap {
		.displayfloat;
		line-height: 1em;
		> li {
			list-style: none;
			float: left;
			margin-right: 25px;
			&:hover strong {
				color: #000;
			}
			li {
				list-style: none;
				a {
					.not-a-style;
					font-size: 11px;
					&:hover {
						color: #000;
					}
				}
				strong a {
					font-size: 14px;
				}
			}
		}
	}
	.copyright {
		clear: both;
		width: 100%;
		margin: 30px 0 0 0;
		.txtfont;
		text-align: center;
		color: #363636;
	}
}

.container-team-item {
	img {
		float: left;
		width: 200px;
		margin-right: 20px;
	}
	.text {
		float: left;
		width: 680px;
	}
}

#container-h1 {
	position: relative;
	> .inner {
		position: static;
	}
	.with-menu2 h1 {
		padding-right: 410px;
	}
	#menu2 {
		position: absolute;
		left: 50%;
		top: 25px;
		text-transform: uppercase;
		li {
			list-style: none;
			display: inline-block;
			padding: 0;
			a {
				.not-a-style;
				display: inline-block;
				padding: 0 20px 10px 20px;
			}
			&.current a, a:hover {
				color: @color-yellow;
			}
		}
	}
	.meta {
		padding: 0;
	}
}

#share-box {
	display: block;
	width: 68px;
	position: fixed;
	top: 210px;
	right: -5px;
	background: url(/files/images/bg-sharebox.png) 0 0 repeat-y;
	z-index: 999;
	ul {
		margin: 5px 35px 0 15px;
		li {
			list-style: none;
			margin: 0;
			padding: 0 0 5px 0;
			width: 68px;
			a {
				display: block;
				width: 41px;
				height: 41px;
				background-image: url(/files/images/ico-share.png);
				background-repeat: no-repeat;
				&.twitter {
					background-position: 0 0;
					&:hover {
						background-position: -41px 0;
					}
				}
				&.facebook {
					background-position: 0 -46px;
					&:hover {
						background-position: -41px -46px;
					}
				}
				&.email {
					background-position: 0 -92px;
					&:hover {
						background-position: -41px -92px;
					}
				}
				&.myspace {
					background-position: 0 -138px;
					&:hover {
						background-position: -41px -138px;
					}
				}
				&.rss {
					background-position: 0 -185px;
					&:hover {
						background-position: -41px -185px;
					}
				}
			}
		}
	}
	.bg-top, .bg-bottom {
		position: absolute;
		left: 0;
		display: block;
		width: 68px;
		height: 10px;
		background: url(/files/images/bg-sharebox.png) 0 0 no-repeat;
	}
	.bg-top {
		top: -10px;
		background-position: -100px 0;
	}
	.bg-bottom {
		bottom: -10px;
		background-position: -200px 0;
	}

}

///////////////////////////////
// Page specific
///////////////////////////////
.frontpage {
	.container.two-columns {
		border-bottom: 0;
		> .inner {
			> .left .item-text {
				background: url(/files/images/pic-health.jpg) right center no-repeat;
			}
			> .right .item-text {
				background: url(/files/images/pic-dna.jpg) right center no-repeat;
			}
			.item-text {
				margin-right: 20px;
			}
		}
	}
	.container.four-columns {
		li {
			margin-top: 30px;
			.ico-115 {
				height: 119px;
			}
		}
	}
}
.about-us {
	p {
		.gray;
		.justify;
		margin-bottom: 0;
	}
	.container-regular {
		/* display: none; */
	}
}
.investments {
	p {
		.gray;
		.justify;
		.header {
			color: #000;
			font-size: 15px;
			padding-bottom: 0;
		}
	}
}
.portfolio {
	.four-columns {
		> .inner {
			margin-top: 20px;
			margin-bottom: 20px;
			ul {
				li {
					min-height: auto;
					margin-top: 10px;
					margin-bottom: 10px;
					a .img {
						display: block;
						height: 140px;
					}
				}
			}
		}
	}
}
.search_results {
	.result {
		clear: both;
		margin-bottom: 2em;
		h2 {
			margin-bottom: 1em;
			a {
				font-weight: bold;
			}
		}
		img {
			float: left;
			margin: 0 1em 1em 0;
		}
	}
}
///////////////////////////////
// Elements
///////////////////////////////
#contact-form {
	width: 400px;
	float: right;
	input[type='text'] {
		display: block;
		width: 215px;
		margin-bottom: 5px;
	}
	textarea {
		width: 385px;
	}
	.button-submit {
		text-align: right;
		padding: 15px 25px 0 0;
	}
	.error {
		color: #930;
		border: 1px solid #930;
	}
	#error, #notification {
		clear: both;
		padding: 10px 0;
		display: none;
		width: 385px;
	}
	#notification {
		padding: 5px;
		width: 380px;
		color: @color-yellow-dark;
	}
	#error {
		color: #930;
	}
}

.map {
	> .left {
		.displayfloat;
		width: 210px;
	}
	> .right {
		.displayfloatright;
		width: 690px;
	}
}
.submenu {
	background: #fff url(/files/images/bg-gradient-graylight-white.png) 0 0 repeat-x;
	min-height: 518px;
	width: 230px;
	.displayfloat;
	margin-right: 35px;
	position: relative;
	top: -30px;
	.header {
		padding: 15px 30px 0 30px;
		.bold;
		.gray;
	}
	ul {
		padding: 15px 30px 30px 30px;
		li {
			list-style: none;
			padding-bottom: 20px;
			font-size: 1.1em;
			a {
				.not-a-style;
			}
		}
	}
}

.meta {
	display: block;
	padding: 0 0 0 27px;
	position: relative;
	top: -8px;
	.txtsmall;
	.gray;
	a {
		.not-a-style;
	}
}

.list {
	padding: 0;
	margin: 0;
	li {
		list-style: none;
		padding-left: 20px;
		margin-bottom: 1em;
		background: url(/files/images/li-square.png) 8px center no-repeat;
	}
}

#header #logo #logo-hover {
	display: block;
	background-color: #fff;
	padding-top: 32px;
	padding-bottom: 32px;
	padding-right: 5px;
	position: relative;
	left: -250px;
}

#credo-flash-header, #credo-flash-header object {
	z-index: 1;
}

#twitter-feed {
	li {
		list-style: none;
		display: block;
		padding-bottom: 10px;
		p {
			margin-bottom: 0.7em;
			.txtsmall;
			a {
				color: @color-yellow-dark;
			}
		}
		.meta {
			.gray;
			.txtsmall;
			display: block;
			padding: 7px 0 7px 27px;
			margin-left: 5px;
			background: url(/files/images/ico-twitter.png) 0 center no-repeat;
		}
	}
}
#events {
	li {
		list-style: none;
		display: block;
		padding-bottom: 10px;
		> strong {
			display: block;
			color: @color-yellow-dark;
			.bold;
		}
		p {
			margin-bottom: 0.7em;
			.txtsmall;
			a {
				color: @color-yellow-dark;
			}
		}
		.meta {
			.gray;
			.txtsmall;
			display: block;
			padding: 7px 0 7px 27px;
			margin-left: 5px;
			background: url(/files/images/ico-event.png) 0 center no-repeat;
		}
	}
}

.prev-next {
	.prev-link {
		display: inline-block;
		width: 48%;
		margin-left: 1%;
		text-align: left;
	}
	.next-link {
		display: inline-block;
		width: 49%;
		text-align: right;
	}
}

#fb-comments {
	margin-top: 15px;
}

.blog-share {
	width: 150px;
	position: absolute;
	top: 0;
	left: -145px;
	&.detail { top: 40px }
	li {
		list-style: none !important;
		margin-bottom: 5px;
		padding: 0 !important;
		display: block;
		background: none;
	}
}