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

	COLORS:

	default-grey		#999999
	dark-grey			#595959
	light-grey			#b3b3b3
	
	color dark			#2a3233
	colors blue			#38B9B3
	
	background-grey 	#f7f7f7
	
	ON DARK BACKGROUND
	---------------------------- 
	font-default		#9fa5a6
	font-light			#edf4f5
	font-dark			#555b5d

-----------------------------------------------------------------------------------

	0.	Reset & Clearfix
	1.	Basics (body, headers, links, etc)
	2.	Commen Classes & Id's
	3.	Header
	4.	Top
	5.	Navigation& Menus
	6.	Slider
	7.  Bottom
	8.	Footer
	9. 	PageTitle
	10. Portfolio
	11.	Entries (Blog)
	12. Pagination
	13.	Comments
	14.	Columns Grid
	15.	Map
	16.	Elements
	17.	Widgets
	18. Overlay Images
	19. Animation Section
	
-----------------------------------------------------------------------------------*/



/*---------------------------------------------- 
0. Reset
------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%; }
	
ol, ul  { list-style: none; }

:focus  { outline: 0; }

/* deleting the default appearence for form elements */
input, textarea, select { -moz-appearance: none; -webkit-appearance: none; }

.clearfix:after { content: ""; display: block; clear: both; visibility: hidden; font-size: 0;  height: 0; }
.clearfix { *display: inline-block; height: 1%; }
.clear { clear: both; display: block; font-size: 0;	height: 0; line-height: 0; width:100%; }

/* HTML5 display definitions */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, dialog { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; visibility: hidden; }



/*---------------------------------------------- 
1. Basics
------------------------------------------------*/
html {
	height: 100%;
	font-size: 100%;
	overflow-y: scroll; /* Force a scrollbar in non-IE */
	-webkit-text-size-adjust: 100%; /* Prevent iOS text size adjust on orientation change without disabling user zoom */
	-ms-text-size-adjust: 100%;
	}

body {
	font-family: 'PTSansRegular', Helvetica, Arial, sans-serif; font-size:12px; color:#999999; text-align: left; line-height:18px;
	background: transparent url(../images/background_2.png);
	}
::selection { background:#38B9B3; color:#fff; }
::-moz-selection { background:#38B9B3; color:#fff; }
::-webkit-selection { background:#38B9B3; color:#fff; }	


/* Headings
---------------------------------------- */
h1, h2, h3, h4, h5, h6 {
	font-family: 'PTSansRegular',Helvetica, Arial, sans-serif;
	color: #595959;
	font-weight: normal;
	}

.wrapperoverlay h1, .wrapperoverlay h2, .wrapperoverlay h3, .wrapperoverlay h4, .wrapperoverlay h5, .wrapperoverlay h6 {
	color: #edf4f5;
	}
	
.sectiontitle {
	color: #595959;
	text-transform: uppercase;
	margin-bottom: 35px;
	text-align: center;
	font-size: 13px;
	}

#pagetitle h1, #pagetitle h2, #pagetitle h3, #pagetitle h4, #pagetitle h4, #pagetitle h5 {
	padding-top: 0.1em;
	} 
	
.page-description {
	margin-bottom: 45px;
	}

h1 { font-size: 42px; line-height: 49px; }
h2 { font-size: 28px; line-height: 36px; }
h3 { font-size: 18px; line-height: 24px; }
h4 { font-size: 14px; line-height: 19px; }
h5 { font-size: 13px; line-height: 17px; }
h6 { font-size: 11px; line-height: 15px; }



div h1, div h2, div h3, div h4, div h5, div h6 {
	margin-top: 30px;
	}
	
div h1:first-child, div h2:first-child, div h3:first-child, div h4:first-child, div h5:first-child, div h6:first-child {
	margin-top: 0px;
	}


/* Forms
---------------------------------------- */
input[type=text], input[type=password], textarea {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 10px;
	background: #ffffff;
	border: 1px solid #e6e6e6;
	line-height: 28px;
	height: 28px;
	color: #999999;
	padding: 0 5px 0 18px;
	}

input[type=text], input[type=password] { width: 240px; }		/* padding issue (240 + 2*5 = 250) */
textarea { width: 395px; height: 150px; max-width: 95%; padding: 0 5px 5px 18px; }		/* padding issue (395 + 2*5 = 405) */

input[type=submit] {
	font-family: 'PTSansBold',Helvetica, Arial, sans-serif;
	font-size: 12px;
	line-height: 30px;
	height: 30px;
	padding: 0 15px;
	color: #ffffff;
	background: #999999;
	border: none;
	cursor: pointer;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}
input[type=submit]:hover { 
	background: #38B9B3;  
	}
	
label {
	font-family: Helvetica, Arial, sans-serif;
	display: block;
	line-height: 16px;
	font-size: 10px;
	border-left: 3px solid #b3b3b3;
	text-indent: -9999px; 
	color: red;
	text-transform: uppercase;
	position: absolute;
	top: 8px;
	left: 10px;
	}
	
label.req {
	border-left: 3px solid #595959;
	}
	
form {
	margin-top: 15px;
	}
	
form div {
	margin-top: 15px;
	position: relative;
	}
	
div form:first-child, form div:first-child 	 {
	margin-top: 0px;
	}
	

/* Chech formular */
form .checkfalse {
	width: 3px;
	height: 16px;
	background: #ca0021;
	text-indent: -9999px;
	position: absolute;
	top: 8px;
	left: 10px;
	}

#form-note {
	display: none;
	overflow: hidden;
	}
	
#form-note .confirm_message {
	color: #42d87e;
	line-height: 30px;
	display: inline-block;
	float: left;
	}
	
#form-note .error_message {
	color: #df2929;
	line-height: 30px;
	display: inline-block;
	float: left;
	}
	
#form-note .error_icon {
	background: #df3b3b url(../images/error.png) center center no-repeat;
	width: 30px;
	height: 30px;
	display: inline-block;
	text-indent: -9999px;
	margin-right: 15px;
	
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;	
	float: left;
	}
	
#form-note .confirm_icon {
	background: #1eb56c url(../images/confirm.png) center center no-repeat;
	width: 30px;
	height: 30px;
	display: inline-block;
	text-indent: -9999px;
	margin-right: 15px;
	
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;	
	float: left;
	}
	

	
/* Links
---------------------------------------- */
a {
	text-decoration: none;
	color: #595959;
	cursor: pointer;
	}

a:hover {
	color: #38B9B3;
	}
	
.wrapperoverlay a {	color: #edf4f5;	}
.wrapperoverlay a:hover {	color: #38B9B3;	}

a.color {
	text-decoration: none;
	color: #38B9B3;
	}
	
a.color:hover {
	color: #595959;
	}
	
.wrapperoverlay a.color { color: #38B9B3; }		
.wrapperoverlay a.color:hover { color: #edf4f5; }		
	
a.readmore .readmoreicon {
	background: #38B9B3 url(../images/plus.png) center center no-repeat;
	width: 11px;
	height: 11px;
	display: inline-block;
	text-indent: -9999px;
	-webkit-border-radius: 1px;
	-moz-border-radius: 1px;
	border-radius: 1px;
	float: left;
	padding: 1px;
	margin-right: 6px;
	margin-top: 2px;
	}
	
a.readmore:hover .readmoreicon {
	background-color: #595959;
	}
	
.wrapperoverlay a.readmore:hover .readmoreicon { color: #edf4f5; }		

	
a.themebutton {
	display: inline-block;
	font-family: 'PTSansBold',Helvetica, Arial, sans-serif;
	font-size: 12px;
	line-height: 30px;
	height: 30px;
	padding: 0 15px;
	color: #ffffff;
	background: #999999;
	border: none;
	cursor: pointer;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}
	
a.themebutton:hover {
	background: #38B9B3;
	}
	
.wrapperoverlay a.themebutton { background: #555b5d; color: #2a3233; }		
.wrapperoverlay a.themebutton:hover { background: #38B9B3; color: #ffffff; }		



/* Embedded content
---------------------------------------- */
img, object, video {
	max-width: 100%; 
	height: auto;
	display:block;
	}
	
img {
	width: auto;
	max-width: 100%; 
	border: 0;
	-ms-interpolation-mode: bicubic;
	}

p img { margin-top: 15px; }
p img:first-child { margin-top: 0px; }
img.alignleft { margin: 3px 30px 30px 0; float: left; }
img.alignright { margin: 3px 0px 30px 30px; float: right; }
img.aligncenter { margin-bottom: 30px; }

.embeddedvideo {
	position: relative;
	padding-bottom: 55%;
	padding-top: 15px;
	height: 0;
	overflow: hidden;
	}
	
.embeddedvideo iframe {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.media {
	margin-top: 15px;
	}
	
div .media:first-child {
	margin-top: 0px;
	}


/* Lists
---------------------------------------- */
article ul {
	margin-top: 15px;
	padding-left: 30px;
	}

article ul li {
	padding-left: 20px;
	background: transparent url(../images/arrowtoright.png) 0 8px no-repeat;
	line-height: 22px;
	}
	
article ol {
	margin-top: 15px;
	margin-left: 45px;
	list-style: decimal;
	}
	
article ol li {
	line-height: 22px;
	}
	
	


/* Others
---------------------------------------- */
strong, b, dt {
	font-weight: normal;
	font-family: 'PTSansBold';
}

i, dfn {
	font-style: normal;
	font-family: 'PTSansItalic';
	}
	
strong i, b i, dt i {
	font-style: normal;
	font-weight: normal;
	font-family: 'PTSansBoldItalic';
	}

sub, sup {
	font-size: 0.625em;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
	}

sup {
	top: -0.5em;
	}

sub {
	bottom: -0.25em;
	}

/* paragraph rules */
p { 
	margin-top: 15px; 
	}
	
div p:first-child { 
	margin-top: 0px; 
	}	
	
article > p:last-child {
	padding-bottom: 60px;
	}

blockquote {
	margin-top: 15px; 
	background: #f7f7f7 url(../images/quote.png) no-repeat 15px center;
	border: 1px solid #e6e6e6;
	padding: 15px;
	padding-left: 50px;
	}

blockquote p {
	}

div blockquote:first-child { 
	margin-top: 0px; 
	}
	
address {
	border: 1px dashed #e5e5e5;
	padding: 15px;
	margin-top: 20px;
	}
	
div address:first-child { 
	margin-top: 0px; 
	}	
	
pre {
	border: 1px dashed #e5e5e5;
	padding: 15px;
	margin-top: 20px;
	}
	
div pre:first-child { 
	margin-top: 0px; 
	}	
		

/*---------------------------------------------- 
2. Commen Classes & Id's
------------------------------------------------*/
#page {
	position: relative;
	overflow: hidden;
	}
	
#sidebar {
	width: 240px;
	padding-bottom: 60px;
	}
	
#maincontent {
	width: 660px;
	}

.wrapper {
	width: 940px; 
	background: #ffffff;
	padding: 40px 30px 0px 30px;
	margin: 0 auto;
	position: relative;
	}

.wrapper2 {
	width: 940px; 
	background: #ffffff;
	padding: 0px 30px 0px 30px;
	margin: 0 auto;
	position: relative;
	}
	
.wrapperoverlay {
	margin: 0 auto;
	width: 940px;
	max-width: 100%;
	padding: 20px 30px;
	background: #2a3233;
	color: #9fa5a6;
	}
	
.main_inner {
	padding-top: 60px; 		/* overwrites the wrapper padding */
	}
	
.sidebar_section {
	margin-top: 60px;
	}
#sidebar .sidebar_section:first-child {
	margin: 0;
	}

.left_float { 
	float: left; 
	}

.foot_float {
	text-align: center;
	padding-bottom: 10px;
}
	
.right_float { 
	float: right; 
	}
	
.seperator { 
	background: transparent url(../images/seperator.png) no-repeat top center; 
	padding-top: 62px;  /* 10 + 3px of the img */

	}
	
.seperator-section { 
	background: transparent url(../images/seperator.png) no-repeat top center; 
	padding-top: 63px;  /* 10 + 3px of the img */

	
	}



/*---------------------------------------------- 
3. Header
------------------------------------------------*/
header {
	margin-top:0px;			/* Same as height from #top */
	}
	
header .header_inner {
	z-index:10;			/* IE FIX */
	}
	
.header_top {
	padding-bottom: 40px;
	}
	
.header_tagline {
	text-align: center;
	padding-bottom: 40px;
	padding-top: 40px;
	}
	
.header_tagline h1, .header_tagline h2, .header_tagline h3, .header_tagline h4, .header_tagline h5, .header_tagline h6 {
	margin:  0 0 5px 0;
	}
	
	

/*---------------------------------------------- 
4. Top
------------------------------------------------*/
#top {		
	min-height: 70px;				/* Same as margin-top from header */
	position: absolute;
	left: 0;
	width: 100%;
	z-index:20;
	}	
	
#top .top_inner {
	position: relative;
	}
	
#top .showhidetop {
	background: #2a3233 url(../images/plus.png) center center no-repeat;
	width: 20px;
	height: 20px;
	display: inline-block;
	text-indent: -9999px;
	position: absolute;
	bottom: -18px;
	right: 60px;
	
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}
	
#top .hidetop {
	background-image: url(../images/minus.png);
	}
	


/*---------------------------------------------- 
5. Navigation & Menus
------------------------------------------------*/
nav {
	z-index: 15;
	}
	
nav ul li {
	float: left;
	margin-left: 30px;
	line-height: 75px;			/* height of the logo */
	position: relative;
	z-index: 10;
	}

nav ul li a  {
	font-family: 'PTSansBold';
	text-transform: uppercase;
	font-size: 13px;
	color: #999999;
	text-decoration: none;
	}
	
nav ul li a:hover, nav ul li a.active {
	color: #595959; text-decoration: none;
	}

nav ul li ul {
	position: absolute;
	left: 0px;
	top: 50px;
	background: #595959;
	display: none;
	min-width: 100px;
	z-index: 5;
	}
	
nav ul li ul li {
	width: 130px;
	line-height: 20px;
	margin: 0;
	padding: 6px 10px 5px 10px;
	border-top: 1px dashed #666666;
	position: relative;
	}
	
nav ul li ul li:first-child {
	border-top: none;
	}
	
nav ul li ul li a {
	font-family: 'PTSansRegular';
	font-size: 12px;
	color: #b3b3b3 !important;
	text-decoration: none; 
	text-transform: inherit;
	}
	
nav ul li ul li a:hover, nav ul li ul li a.active {
	color: #ffffff !important; text-decoration: none !important;
	}

nav ul li ul li ul {
	left: 150px;
	top: 0;
	margin: 0;
	}
	

nav select {
	display: none;
	border: 1px solid #b3b3b3;
	background: #f7f7f7 url(../images/selectbox.png) right top no-repeat;
	height: 35px;
	width: 100%;
	padding:8px;
	color: #999999;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	}
	
nav select option {
	cursor: pointer;
	padding: 5px 7px;
	}
	


/*---------------------------------------------- 
6. Slider
------------------------------------------------*/
#slider {
	overflow: hidden;
	}

#home .slidermain {
	width: 1000px;
	margin: 0 auto;
	height: auto;
	position: relative;
	z-index: 2;
	overflow: hidden;
	background: #ffffff;
	}
	
#portfolio #slider {
	margin-bottom: 60px;
	position: relative;
	z-index: 2;
	overflow: hidden;
	}
	
#pageloader #slider ul, #portfolio #slider ul, #blog #slider ul {
	margin-top: 0;
	padding-left: 0;
	}

#pageloader #slider ul li, #portfolio #slider ul li, #blog #slider ul li {
	padding-left: 0;
	background: none;
	line-height: inherit;
	}
	
#blog #slider {
	position: relative;
	z-index: 2;
	overflow: hidden;
	}
	
	

/*---------------------------------------------- 
7. Bottom
------------------------------------------------*/
#bottom {
	position: relative;
	z-index: 2;
	}

.totop {
	position:fixed;
	bottom: 30px;
	right: 30px;
	z-index: 10;
	width: 30px;
	height: 30px;
	display: none;
	background: #000000 url(../images/top.png) no-repeat center center;
	opacity: 0.5;
	filter: alpha(opacity = 50);
	text-indent: -9999px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}
	
.totop:hover {
	background-color: #38B9B3;
	opacity: 1.0;
	filter: alpha(opacity = 100);
	}
	
	
/*---------------------------------------------- 
8. Footer
------------------------------------------------*/
footer {
	margin-bottom: 60px;
	}
	
footer .footer_bottom {
	margin: 20px auto 0 auto;
	width: 1000px;
	}

footer .lightfooter {
	color: #595959;
	}


	
/*---------------------------------------------- 
9. PageTitle
------------------------------------------------*/
#pagetitle {
	position: relative;
	z-index: 2;
	}
	
#pagetitle .tagline {
	font-size: 16px;
	margin-left: 30px;
	color: #9fa5a6;
	}

	

/*---------------------------------------------- 
10. Portfolio
------------------------------------------------*/
.portfolio-entries {
	width: 110%;
	padding-bottom: 10px;
	}

.portfolio-entries_last {
	width: 110%;
	padding-bottom: 50px;
	}
	
.portfolio-entry {
	float: left;
	width: 220px;
	background: #fff;
	margin-right: 20px;
	margin-bottom: 20px;
	position: relative;
	background: #f7f7f7;
	padding-bottom: 15px;
	}

.portfolio-entry2 {
	float: left;
	width: 220px;
	background: #fff;
	margin-right: 20px;
	margin-bottom: 20px;
	position: relative;
	background: #f7f7f7;
	padding-bottom: 0px;
	}

.columns4 .portfolio-entry { width: 220px; }
.columns3 .portfolio-entry { width: 300px; }
.columns2 .portfolio-entry { width: 460px; }
	
.portfolio-meta {
	margin-top: 20px;
	text-align: center;
	}
	
.portfolio-categories {
	color: #b3b3b3;
	font-size: 11px;
	}
	

/* 	Filter
------------------------------------------------*/
.filter {
	overflow: hidden;
	margin: 0;
	padding: 0;
	margin-bottom: 30px;
	text-align: center;
	}
	
.filter li {
	display: inline-block;
	padding: 0px;
	line-height: 10px;
	background: url(../images/seperator_filter.png) no-repeat center left;
	padding-left: 8px;
	padding-right: 6px;
	margin-bottom: 5px;
	
	/* For IE 7 */
	zoom: 1;
	*display: inline;
	}
	
.filter li:first-child {
	background: none;
	}

.filter li a {
	display: inline-block;
	text-decoration: none;
	font-size: 11px;
	text-transform: uppercase;
	line-height: 10px;
	padding: 0;
	color: #999999;
	}
.filter li a:hover { color: #595959; text-decoration: none;}
.filter li a.active { color: #38B9B3; }



/*---------------------------------------------- 
11.	Entries (Blog)
------------------------------------------------*/
#blog .entry {
	background: transparent url(../images/seperator.png) no-repeat 380px 0px; 
	padding-top: 63px;  /* 40 + 3px of the img */
	margin-bottom: 60px;
	}
	
#blog .entry:first-child {
	background: none; 
	padding-top: 0;  
	margin-top: 0;
	}
	
#blog .entry-content {
	width: 540px;
	}
	
#blog .entry-thumb {
	margin-bottom: 20px;
	}

#blog .entry-meta {
	width: 100px;
	text-align: right;
	}

#home .entry-content {
	margin-top: 20px;
	}
	
#home .one_third .entry-info {	width: 255px; }
#home .one_fourth .entry-info {	width: 175px; }
	
#home .entry-info .entry-date {
	font-size: 11px;
	color: #b3b3b3;
	}
	
#home .entry-info p {
	margin-top: 10px;
	}
	
#home .entry-info .entry-meta {
	margin-top: 15px;
	}


/*	Meta Datas
------------------------------------------------*/
.entry-meta div {
	font-size: 11px;
	line-height: 18px;
	color: #b3b3b3;
	}
	
.meta_date {
	margin-bottom: 15px;
	text-transform: uppercase;
	}
	
.meta_likes a {
	background: url(../images/likes_icon.png) no-repeat right 1px;
	padding-right: 19px;
	color: #b3b3b3;
	}
.meta_likes a:hover { background-image: url(../images/likes_icon-hover.png); color: #ec8ab8; }
	
.meta_comments a {
	background: url(../images/comments_icon.png) no-repeat right 1px;
	padding-right: 19px;
	color: #b3b3b3;
	}
.meta_comments a:hover { background-image: url(../images/comments_icon-hover.png); color: #595959; }
	
.meta_views {
	background: url(../images/views_icon.png) no-repeat right 2px;
	padding-right: 19px;
	}
	
.meta_tags {
	background: url(../images/tags_icon.png) no-repeat right 3px;
	padding-right: 19px;
	}
	
.meta_readmore {
	margin-top: 15px;
	}
	
.meta_readmore a.readmore .readmoreicon {
	float: right;
	margin-right: 0px;
	margin-left: 6px;
	}

.meta_type {
	margin-bottom: 15px;
	height: 30px;
	}

.meta_type a {
	width: 30px;
	height: 30px;
	display: inline-block;
	background: #38B9B3;
	
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}
	
.meta_type a.type_quote { background: #38B9B3 url(../images/type_quote.png) no-repeat center center; }
.meta_type a.type_post { background: #38B9B3 url(../images/type_post.png) no-repeat center center; }
.meta_type a.type_image { background: #38B9B3 url(../images/type_image.png) no-repeat center center; }
.meta_type a.type_gallery { background: #38B9B3 url(../images/type_gallery.png) no-repeat center center; }
.meta_type a.type_video { background: #38B9B3 url(../images/type_video.png) no-repeat center center; }
.meta_type a.type_audio { background: #38B9B3 url(../images/type_audio.png) no-repeat center center; }
.meta_type a.type_link { background: #38B9B3 url(../images/type_link.png) no-repeat center center; }

.meta_type a:hover { 
	background-color: #999999;
}



/*---------------------------------------------- 
12. Pagination
------------------------------------------------*/
#pagination {
	width: 540px;
	margin-bottom: 60px;
	background: transparent url(../images/seperator.png) no-repeat top center; 
	padding-top: 18px;
	text-align: center;
	}
	
#pagination a {
	background: url(../images/seperator_filter.png) no-repeat center left;
	padding: 5px 5px 1px 8px; 
	font-size: 11px;
	text-transform: uppercase;
	color: #999999;
	}
	
#pagination a:first-child {
	background: none;
	}
	
#pagination a:hover {
	color: #38B9B3;
	}
	
#pageloader #pagination, #portfolio #pagination {
	width: 100%;
	margin-bottom: 0px;
	}


/*---------------------------------------------- 
Comments
------------------------------------------------*/
#comments  {
	padding-top: 60px;
	margin-bottom: 60px;
	background: transparent url(../images/seperator.png) no-repeat 380px 0px; 
	}
	
#comments .comment-list  {
	padding-bottom: 15px;
	border-bottom: 1px dashed #e6e6e6;
	width: 540px;
	}
	
#comments .comment {
	overflow: hidden;
	border-top: 1px dashed #e6e6e6;
	padding-top: 15px;
	margin-top: 15px;
	}
	
#comments .comment-list .comment:first-child {
	padding-top: 0px;
	margin-top: 0px;
	border-top: none;
	}	

#comments .comment .comment { 
	margin-left: 70px; 
	margin-bottom: 0; 
	padding-bottom: 0;
	}
	
#comments .user {
	float: left;
	width: 50px;
	}
	
#comments .comment_content {
	margin-left: 70px;
	}
	
#comments .comment_date {
	font-size: 10px;
	line-height: 12px;
	text-transform: uppercase;
	margin-top: 5px;
	}
	
#commenticon {
	width: 100px;
	text-align: right;
	}
	
#commenticon span {
	width: 30px;
	height: 30px;
	display: inline-block;
	background: #38B9B3 url(../images/comments.png) no-repeat center center;
	
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}
	

/* 	Leave Comments
------------------------------------------------*/
#leavecomment {
	padding-top: 60px;
	margin-bottom: 60px;
	background: transparent url(../images/seperator.png) no-repeat 380px 0px;
	}
	
#leavecomment .leavecomment-form {
	width: 540px;
	}
	
#leavecommenticon {
	width: 100px;
	text-align: right;
	}
	
#leavecommenticon span {
	width: 30px;
	height: 30px;
	display: inline-block;
	background: #38B9B3 url(../images/leavecomment.png) no-repeat center center;
	
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}
	

	
/*---------------------------------------------- 
14. Columns Grid
------------------------------------------------*/
.column { 
	float: left; 
	padding-bottom: 60px;
	margin-right: 20px;
	}

.one_full { width: 100%; float: none; margin-right: 0; }
.one_half  { width: 460px; }
.one_third { width: 100%; }
.one_third2 { width: 25%; }
.two_third { width: 620px; }
.one_fourth { width: 220px; }
.two_fourth { width: 460px; }
.three_fourth { width: 700px; }

.last {	margin-right: 0px; }

#maincontent .one_half  { width: 285px; }
#maincontent .one_third { width: 180px; }
#maincontent .two_third { width: 390px; }



/*---------------------------------------------- 
15. Map
------------------------------------------------*/
#map {
	width: 1000px;
	height: 350px;
	margin: auto;
	background: #fff;
	}
	
#map img {						/* wenn google maps eingebunden wird */
	max-width: inherit;
	height: auto;
	}
	
#map {
	text-shadow: none;
	}
	
	

/*---------------------------------------------- 
16. Elements
------------------------------------------------*/


/*	Social Media Widget
------------------------------------------------*/
.socialmedia {
	text-align: center;
	height: 30px;
	}
	
.socialmedia a {
	height: 30px;
	width: 30px;
	display: inline-block;
	text-indent: -9999px;
	margin-left: 2px;
	margin-right: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	position: relative;
	overflow: hidden;
	
	/* For IE 7 */
	zoom: 1;
	*text-indent:0; 
	*font-size:0; 
	*line-height:0;
	*display: inline;
	}
	
.socialmedia a span {
	height: 60px;
	width: 30px;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	}
	
a.facebook span { background: transparent url(../images/facebook_icon.png); }
a.twitter span { background: transparent url(../images/twitter_icon.png); }
a.thumblr span { background: transparent url(../images/thumblr_icon.png); }
a.vimeo span { background: transparent url(../images/vimeo_icon.png); }
a.dribbble span { background: transparent url(../images/dribble_icon.png); }
a.behance span { background: transparent url(../images/behance_icon.png); }
a.flickr span { background: transparent url(../images/flickr_icon.png); }
a.forrst span { background: transparent url(../images/forrst_icon.png); }
a.deviantart span { background: transparent url(../images/deviantart_icon.png); }
a.linkedin span { background: transparent url(../images/linkedin_icon.png); }
a.rss span { background: transparent url(../images/rss_icon.png); }
a.googleplus span { background: transparent url(../images/googleplus_icon.png); }


/*	Team-member
------------------------------------------------*/
.team-member {
	text-align: center;
	}
	
.team-member .team-meta {
	margin-top: 20px;
	border-bottom: 1px dashed #e6e6e6;
	padding-bottom: 15px;
	}


/*	Buttons
------------------------------------------------*/
a.button {
	display: inline-block;
	text-decoration: none;
	text-align: center;
	padding: 3px 15px;
	
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin: 0 10px 10px 0;
	}
	
a.button:hover {
	-moz-box-shadow: 0px 1px 0px #cccccc; 
	-webkit-box-shadow: 0px 1p 0px #cccccc; 
	box-shadow: 0px 1px 0px #cccccc;
	}
	
		
a.white {
	color: #999999;
	text-shadow: 1px 1px 0px #ffffff;
	border: 1px solid #cccccc;
	
	background: #f0f0f0;
	background-image: linear-gradient(bottom, rgb(240,240,240) 12%, rgb(250,250,250) 100%);
	background-image: -o-linear-gradient(bottom, rgb(240,240,240) 12%, rgb(250,250,250) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(240,240,240) 12%, rgb(250,250,250) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(240,240,240) 12%, rgb(250,250,250) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(240,240,240) 12%, rgb(250,250,250) 100%);
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0.12, rgb(240,240,240)),
		color-stop(1, rgb(250,250,250))
	);

	}
a.white:hover { border: 1px solid #999999; color: #333333; }

a.blue {
	color: #318588;
	text-shadow: 1px 1px 0px #ace9ec;
	border: 1px solid #5bc0c7;
	
	background: #6ccbd6;
	background-image: linear-gradient(bottom, rgb(108,203,214) 0%, rgb(160,218,221) 100%);
	background-image: -o-linear-gradient(bottom, rgb(108,203,214) 0%, rgb(160,218,221) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(108,203,214) 0%, rgb(160,218,221) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(108,203,214) 0%, rgb(160,218,221) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(108,203,214) 0%, rgb(160,218,221) 100%);
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, rgb(108,203,214)),
		color-stop(1, rgb(160,218,221))
	);
	}
a.blue:hover { border: 1px solid #469499; color: #194b51; -moz-box-shadow: 0px 1px 0px #cccccc; -webkit-box-shadow: 0px 1p 0px #cccccc; box-shadow: 0px 1px 0px #cccccc; }

a.yellow {
	color: #ae8c2d;
	text-shadow: 1px 1px 0px #fce8af;
	border: 1px solid #fcd14b;
	
	background: #fcd96c;
	background-image: linear-gradient(bottom, rgb(252,217,108) 0%, rgb(252,228,154) 100%);
	background-image: -o-linear-gradient(bottom, rgb(252,217,108) 0%, rgb(252,228,154) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(252,217,108) 0%, rgb(252,228,154) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(252,217,108) 0%, rgb(252,228,154) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(252,217,108) 0%, rgb(252,228,154) 100%);
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, rgb(252,217,108)),
		color-stop(1, rgb(252,228,154))
	);
	}
a.yellow:hover { border: 1px solid #ba972a; color: #7e6621; -moz-box-shadow: 0px 1px 0px #cccccc; -webkit-box-shadow: 0px 1p 0px #cccccc; box-shadow: 0px 1px 0px #cccccc; }

a.green {
	color: #768c34;
	text-shadow: 1px 1px 0px #e0eebc;
	border: 1px solid #aecd5b;
	
	background: #c2e16d;
	background-image: linear-gradient(bottom, rgb(194,225,109) 0%, rgb(206,225,154) 100%);
	background-image: -o-linear-gradient(bottom, rgb(194,225,109) 0%, rgb(206,225,154) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(194,225,109) 0%, rgb(206,225,154) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(194,225,109) 0%, rgb(206,225,154) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(194,225,109) 0%, rgb(206,225,154) 100%);
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, rgb(194,225,109)),
		color-stop(1, rgb(206,225,154))
	);
	}
a.green:hover { border: 1px solid #738b32; color: #56691c; -moz-box-shadow: 0px 1px 0px #cccccc; -webkit-box-shadow: 0px 1p 0px #cccccc; box-shadow: 0px 1px 0px #cccccc; }

a.pink {
	color: #e0556e;
	text-shadow: 1px 1px 0px #e9b6bf;
	border: 1px solid #f2798d;
	
	background: #f28699;
	background-image: linear-gradient(bottom, rgb(242,134,153) 0%, rgb(242,162,176) 100%);
	background-image: -o-linear-gradient(bottom, rgb(242,134,153) 0%, rgb(242,162,176) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(242,134,153) 0%, rgb(242,162,176) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(242,134,153) 0%, rgb(242,162,176) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(242,134,153) 0%, rgb(242,162,176) 100%);
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, rgb(242,134,153)),
		color-stop(1, rgb(242,162,176))
	);
	}
a.pink:hover { border: 1px solid #d53652; color: #8e2437; -moz-box-shadow: 0px 1px 0px #cccccc; -webkit-box-shadow: 0px 1p 0px #cccccc; box-shadow: 0px 1px 0px #cccccc; }

a.purple {
	color: #d46fc9;
	text-shadow: 1px 1px 0px #efe2ee;
	border: 1px solid #e8a0e0;
	
	background: #e8b0e2;
	background-image: linear-gradient(bottom, rgb(232,176,226) 0%, rgb(232,211,230) 100%);
	background-image: -o-linear-gradient(bottom, rgb(232,176,226) 0%, rgb(232,211,230) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(232,176,226) 0%, rgb(232,211,230) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(232,176,226) 0%, rgb(232,211,230) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(232,176,226) 0%, rgb(232,211,230) 100%);
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, rgb(232,176,226)),
		color-stop(1, rgb(232,211,230))
	);
	}
a.purple:hover { border: 1px solid #c359b7; color: #843c7c; -moz-box-shadow: 0px 1px 0px #cccccc; -webkit-box-shadow: 0px 1p 0px #cccccc; box-shadow: 0px 1px 0px #cccccc; }


a.grey {
	color: #999999;
	text-shadow: 1px 1px 0px #ebebeb;
	border: 1px solid #adadad;
	
	background: #dedede;
	background-image: linear-gradient(bottom, rgb(191,191,191) 0%, rgb(217,217,217) 100%);
	background-image: -o-linear-gradient(bottom, rgb(191,191,191) 0%, rgb(217,217,217) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(191,191,191) 0%, rgb(217,217,217) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(191,191,191) 0%, rgb(217,217,217) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(191,191,191) 0%, rgb(217,217,217) 100%);
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, rgb(191,191,191)),
		color-stop(1, rgb(217,217,217))
	);
	}
a.grey:hover { border: 1px solid #737373; color: #595959; -moz-box-shadow: 0px 1px 0px #cccccc; -webkit-box-shadow: 0px 1p 0px #cccccc; box-shadow: 0px 1px 0px #cccccc; }

a.orange {
	color: #e08457;
	text-shadow: 1px 1px 0px #fde5d9;
	border: 1px solid #fda072;
	
	background: #fdb897;
	background-image: linear-gradient(bottom, rgb(253,184,151) 0%, rgb(253,203,179) 100%);
	background-image: -o-linear-gradient(bottom, rgb(253,184,151) 0%, rgb(253,203,179) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(253,184,151) 0%, rgb(253,203,179) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(253,184,151) 0%, rgb(253,203,179) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(253,184,151) 0%, rgb(253,203,179) 100%);
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, rgb(253,184,151)),
		color-stop(1, rgb(253,203,179))
	);
	}
a.orange:hover { border: 1px solid #de7744; color: #bd5223; -moz-box-shadow: 0px 1px 0px #cccccc; -webkit-box-shadow: 0px 1p 0px #cccccc; box-shadow: 0px 1px 0px #cccccc; }
		


/*	Skills
------------------------------------------------*/	
.skill {
	margin-top: 15px;
	}
	
div .skill:first-child {
	margin-top: 0px;
	}

.skill .skill_bar {
	background: #cccccc;
	height: 30px; width: 100%;
	position: relative;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}
	
.skill .skill_bar .skill_active {
	background: #38B9B3;
	height: 100%;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}
	
.skill .skill_bar span {
	color: #ffffff;
	position: absolute;
	top: 2px;
	left: 10px;
	line-height: 25px;
	}
	
	
	
/*	Alert
------------------------------------------------*/
p.alert {
	display: block;
	text-decoration: none;
	padding: 15px;
	}
		
p.blue {
	color: #2d98bd;
	border: 1px dashed #83c7df;
	background: #d6eff8;
	}
	
p.green {
	color: #509640;
	border: 1px dashed #99dd8a;
	background: #ecffe7;
	}
	
p.red {
	color: #ca3436;
	border: 1px dashed #ff9e9f;
	background: #ffe4e5;
	}




/*	Toggle
------------------------------------------------*/
.toggle {
	border: 1px dashed #e5e5e5;
	margin-top: 15px;
	}
	
div .toggle:first-child {
	margin-top: 0px;
	}
	
.toggle .toggle_title {
	padding: 15px;
	}
	
.toggle .toggle_title .toggle_icon {
	background: #38B9B3 url(../images/plus.png) center center no-repeat;
	width: 11px;
	height: 11px;
	display: inline-block;
	text-indent: -9999px;
	-webkit-border-radius: 1px;
	-moz-border-radius: 1px;
	border-radius: 1px;
	float: left;
	padding: 1px;
	margin-right: 10px;
	margin-top: 2px;
	}
	
.toggle .toggle_title a:hover .toggle_icon {
	background-color: #595959;
	}
	
.toggle .toggle_title a.active .toggle_icon {
	background-image: url(../images/minus.png);
	}
	
.toggle .toggle_inner {
	border-top: 1px dashed #e5e5e5;
	padding-top: 15px;
	padding: 15px;
	display: none;
	}


/*	Pricing Table
------------------------------------------------*/
.pricing {
	padding-bottom: 60px;
	}
	
	
.price-col {
	border-top: 5px solid #38B9B3;
	margin-right: 1px;
 	float: left;
	text-align: center;
	background: #f7f7f7;
	}
	
.best {	border-top: 5px solid #1eb56c; }	
.standard {	border-top: 5px solid #595959; }
	
.col3 .price-col { width: 299px; }
.col3 .recommended { width: 339px; }
.col4 .price-col { width: 229px; }
.col4 .recommended { width: 249px; }

.price-col {
	position: relative; z-index: 1; margin-top: 30px;
	}
	
.recommended {
	margin: 0;
	background:#fff; 
	z-index: 2;
	-moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
	}
	
.price-header, .price-footer {
	padding-top: 15px;
	padding-bottom: 15px;
	}
	
.recommended .price-header, .recommended .price-footer {
	padding-top: 30px;
	padding-bottom: 30px;
	}
	
.price-header h2 {
	margin-top: 10px;
	}
	
.recommended .price-header h2 {
	color: #38B9B3;
	}
.best .price-header h2 {	color: #1eb56c; }	
.standard .price-header h2 {	color: #595959; }
	
.price-body ul {
	margin: 0 15px;
	padding-left: 0;
	border-bottom: 1px dashed #e6e6e6;
	}

.price-body ul li {
	padding: 6px 0 5px 0;
	background: none;
	border-top: 1px dashed #e6e6e6;
	}
		
	
a.signupbutton {
	display: inline-block;
	font-family: 'PTSansBold',Helvetica, Arial, sans-serif;
	font-size: 12px;
	line-height: 30px;
	height: 30px;
	padding: 0 15px;
	color: #ffffff;
	text-transform: uppercase;
	background: #38B9B3;
	border: none;
	cursor: pointer;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}
.best a.signupbutton {	background: #1eb56c; }	
.standard a.signupbutton {	background: #595959; }

a.signupbutton:hover {
	background: #999999;
	}
	


/*---------------------------------------------- 
17. Widgets
------------------------------------------------*/
.widget {
	margin-top: 30px;
	}
	
div .widget:first-child {
	margin-top: 0px;
	}
	
#top .widget h1, #top .widget h2, #top .widget h3, #top .widget h4, #top .widget h5, #top .widget h6,
#bottom .widget h1, #bottom .widget h2, #bottom .widget h3, #bottom .widget h4, #bottom .widget h5, #bottom .widget h6{ 
	display: none; 
	}

#top .widget {
	line-height: 30px;
}



/*	Twitter Widget
------------------------------------------------*/
#twitter-widget .tweet_avatar {
	display: none;
	}	

#twitter-widget .tweet-list li {
	background: url(../images/tweet_grey.png) no-repeat top left;
	border-bottom: 1px dashed #e6e6e6;
	padding-left: 30px;
	margin-top: 10px;
	padding-bottom: 10px;
	}
	
#twitter-widget .tweet-list li .tweet_time {
	display: block;
	}

#bottom #twitter-widget, #top #twitter-widget {
	background: url(../images/tweet.png) no-repeat 0px 5px;
	padding-left: 50px;
	}
	
#bottom #twitter-widget .tweet-list li, #top #twitter-widget .tweet-list li {
	background: none;
	border-bottom: none;
	padding-left: 0;
	margin-top: 0;
	padding-bottom: 0;
	}
	
#bottom #twitter-widget .tweet-list li .tweet_time, #top #twitter-widget .tweet-list li .tweet_time {
	display: inline-block;
	}
	


/* Flickr Widget
------------------------------------------------*/
#flickr-widget {
	}
	
#flickr-widget .flickr-list  {
	width: 110%;
	overflow: hidden;
	}
	
#flickr-widget .flickr-list li {
	width: 67px;
	margin: 0 10px 10px 0;
	float: left;
	overflow: hidden;
	border: 3px solid #f7f7f7;
	padding: 0;
	}
	
#flickr-widget .flickr-list li:hover {
	border: 3px solid #38B9B3;
	}
	
footer #flickr-widget .flickr-list li {
	width: 61px;
	}
	


/*	Menu Widget
------------------------------------------------*/
#menu-widget ul {
	margin-top: 30px;
	}
	
#menu-widget ul li {
	padding: 4px 0 3px 20px;
	background: transparent url(../images/arrowtoright.png) 2px 12px no-repeat;
	line-height: 22px;
	border-bottom: 1px dashed #e6e6e6;
	}
	
#menu-widget ul li a {
	color: #999999;
	}
	
#menu-widget ul li a:hover, ul.sidebarmenu li a.active {
	color: #38B9B3;
	}
	
	


/*---------------------------------------------- 
18. Overlay Images
------------------------------------------------*/
.imgoverlay {
	position: relative;
	cursor: pointer;
	overflow: hidden;
	}

.imgoverlay a .overlay {
	width: 100%;
	height: 100%;
	background: #4aa7b8;
	position: absolute;
	top: 0;
	left: 0;
	cursor: pointer;
	}
	
.imgoverlay2 a .overlay2 {
	width: 100%;
	height: 100%;
	background: url(../images/lupa.png) no-repeat;
	position: absolute;
	top: 0;
	left: 0;
	cursor: pointer;
	}
	
	
/*---------------------------------------------- 
19. Animation Section
------------------------------------------------*/	
#animationsection {
	position: relative;
	}

#slidersection {
	width: 100%;
	height: auto;
	z-index: 2;
	}
	
#loadingsection {
	width: 100%;
	position: absolute;
	top: 0;
	left: 100%;
	z-index: 2;
	}
	
#pageloader {
	padding: 60px 30px;
	background: #f7f7f7;
	width: 1000px;
	margin: 0 auto;	
	position: relative;
	}
	
#pageloader #sidebar {
	padding-bottom: 0px;
	}
	
#loader {
	height: 100%;
	width: 100%;	
	z-index: 0;
	position: absolute;
	top: 0;
	left: 0;
	}
	
#loader .wrapper {
	background: #fff;
	padding: 0 30px;
	height: 100%;
	}
	
#loader .wrapper div {
	background: url(../images/loader.gif) center 60px no-repeat;
	width: 100%;
	height: 100%;
	display: none;
	text-align: center;
	}
	
#loader .wrapper div span {
	display: none;
	margin-top: 80px;
	display:inline-block;
	}
	
#close {
	text-align: center;
	margin-top: 10px;
	}
	
#close a {
	font-size: 11px;
	text-transform: uppercase;
	color: #999999;
	}
	
#close a:hover {
	color: #595959;
	}

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

Modules - reusable parts of our design

-------------------------------- */
.cd-container {
  /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
  width: 90%;
  max-width: 980px;
  margin: 0 auto;
}
.cd-container::after {
  /* clearfix */
  content: '';
  display: table;
  clear: both;
}

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

Main components 

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


#cd-timeline {
  position: relative;
  padding: 0.5em 0;
  margin-top: 0.5em;
  margin-bottom: 2em;
}

#cd-timeline2 {
  position: relative;
  padding: 0.5em 0;
  margin-top: 0.5em;
  margin-bottom: 2em;
}

#cd-timeline::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 35px;
  left: 18px;
  height: 99.7%;
  width: 4px;
  background: #d7e4ed;
}

#cd-timeline2::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 35px;
  left: 18px;
  height: 99.1%;
  width: 4px;
  background: #d7e4ed;
}

#cd-timeline3 {
  position: relative;
  padding: 0.5em 0;
  margin-top: 0.5em;
  margin-bottom: 2em;
}

#cd-timeline3::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 35px;
  left: 18px;
  height: 90.3%;
  width: 4px;
  background: #d7e4ed;
}

#cd-timeline4 {
  position: relative;
  padding: 0.5em 0;
  margin-top: 0.5em;
  margin-bottom: 2em;
}

#cd-timeline4::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 35px;
  left: 18px;
  height: 94.1%;
  width: 4px;
  background: #d7e4ed;
}

#cd-timeline5 {
  position: relative;
  padding: 0.5em 0;
  margin-top: 0.5em;
  margin-bottom: 2em;
}

#cd-timeline5::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 35px;
  left: 18px;
  height: 91.1%;
  width: 4px;
  background: #d7e4ed;
}

#cd-timeline6 {
  position: relative;
  padding: 0.5em 0;
  margin-top: 0.5em;
  margin-bottom: 2em;
}

#cd-timeline6::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 35px;
  left: 18px;
  height: 98.4%;
  width: 4px;
  background: #d7e4ed;
}

#cd-timeline7 {
  position: relative;
  padding: 0.5em 0;
  margin-top: 0.5em;
  margin-bottom: 2em;
}

#cd-timeline7::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 35px;
  left: 18px;
  height: 98.3%;
  width: 4px;
  background: #d7e4ed;
}

#cd-timeline8 {
  position: relative;
  padding: 0.5em 0;
  margin-top: 0.5em;
  margin-bottom: 2em;
}

#cd-timeline8::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 35px;
  left: 18px;
  height: 95%;
  width: 4px;
  background: #d7e4ed;
}

@media only screen and (min-width: 980px) {
  #cd-timeline {
    margin-top: 1em;
    margin-bottom: 3em;
  }
  #cd-timeline::before {
    left: 50%;
    margin-left: -2px;
  }
  #cd-timeline2 {
    margin-top: 1em;
    margin-bottom: 3em;
  }
  #cd-timeline2::before {
    left: 50%;
    margin-left: -2px;
  }

    #cd-timeline3 {
    margin-top: 1em;
    margin-bottom: 3em;
  }
  #cd-timeline3::before {
    left: 50%;
    margin-left: -2px;
  }

     #cd-timeline4 {
    margin-top: 1em;
    margin-bottom: 3em;
  }
  #cd-timeline4::before {
    left: 50%;
    margin-left: -2px;
  }

    #cd-timeline5 {
    margin-top: 1em;
    margin-bottom: 3em;
  }
  #cd-timeline5::before {
    left: 50%;
    margin-left: -2px;
  }

 #cd-timeline6 {
    margin-top: 1em;
    margin-bottom: 3em;
  }
  #cd-timeline6::before {
    left: 50%;
    margin-left: -2px;
  }

  #cd-timeline7 {
    margin-top: 1em;
    margin-bottom: 3em;
  }
  #cd-timeline7::before {
    left: 50%;
    margin-left: -2px;
  }

   #cd-timeline8 {
    margin-top: 1em;
    margin-bottom: 3em;
  }
  #cd-timeline8::before {
    left: 50%;
    margin-left: -2px;
  }

}

.cd-timeline-block {
  position: relative;
  margin: 2em 0;

}
.cd-timeline-block:after {
  content: "";
  display: table;
  clear: both;
}
.cd-timeline-block:first-child {
  margin-top: 0;
}
.cd-timeline-block:last-child {
  margin-bottom: 0;
}
@media only screen and (min-width: 980px) {
  .cd-timeline-block {
    margin: 4em 0;
  }
  .cd-timeline-block:first-child {
    margin-top: 0;
  }
  .cd-timeline-block:last-child {
    margin-bottom: 0;
  }
}

.cd-timeline-img {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  box-shadow: 0 0 0 4px #d7e4ed, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05);
}

.cd-timeline-img img {
  display: block;
  width: 20px;
  height: 20px;
  position: relative;
  left: 50%;
  top: 50%;
  margin-left: -10px;
  margin-top: -10px;
}

.cd-timeline-img.cd-picture {
  background: #41b8b3;
}
.cd-timeline-img.cd-movie {
  background: #c03b44;
}
.cd-timeline-img.cd-location {
  background: #f0ca45;
}
@media only screen and (min-width: 980px) {
  .cd-timeline-img {
    top:15px;
    width: 15px;
    height: 15px;
    left: 50%;
    margin-left: -8px;
    /* Force Hardware Acceleration in WebKit */
    -webkit-transform: translateZ(0);
    -webkit-backface-visibility: hidden;
  }

  .cssanimations .cd-timeline-img.is-hidden {
    visibility: hidden;
  }
  .cssanimations .cd-timeline-img.bounce-in {
    visibility: visible;
    -webkit-animation: cd-bounce-1 0.6s;
    -moz-animation: cd-bounce-1 0.6s;
    animation: cd-bounce-1 0.6s;
  }
}

@-webkit-keyframes cd-bounce-1 {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.5);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale(1.2);
  }

  100% {
    -webkit-transform: scale(1);
  }
}
@-moz-keyframes cd-bounce-1 {
  0% {
    opacity: 0;
    -moz-transform: scale(0.5);
  }

  60% {
    opacity: 1;
    -moz-transform: scale(1.2);
  }

  100% {
    -moz-transform: scale(1);
  }
}
@keyframes cd-bounce-1 {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
  }

  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
.cd-timeline-content {
  position: relative;
  margin-left: 60px;
  background: #f3f3f3;
  border-radius: 0.25em;
  padding: 1em;
  box-shadow: 0 2px 0 #d7e4ed;

}

.cd-timeline-content:after {
  content: "";
  display: table;
  clear: both;
}
.cd-timeline-content h4 {
  color: #595959;
  font-size: 16px;
}

.cd-timeline-content h5 {
  margin-top:5px;
  color: #99999e;
  font-size: 13px;
}

.cd-timeline-content {
	margin-top:0px;
}


.cd-timeline-content p, .cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date {
  font-size: 13px;
  font-size: 0.8125rem;
}
.cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date {
  display: inline-block;
}
.cd-timeline-content p {
  margin: 1em 0;
  line-height: 1.6;
}

.cd-timeline-content .cd-read-more {
  float: right;
  padding: .8em 1em;
  background: #acb7c0;
  color: white;
  border-radius: 0.25em;
}
.no-touch .cd-timeline-content .cd-read-more:hover {
  background-color: #bac4cb;
}
.cd-timeline-content .cd-date {
  float: left;
  margin-left:10px;
  padding: .8em 0;
  opacity: .7;
}

.cd-timeline-content::before {
  content: '';
  position: absolute;
  top: 16px;
  right: 100%;
  height: 0;
  width: 0;
  border: 9px solid transparent;
  border-right: 9px solid #f3f3f3;
}



.cd-timeline-content2 {
  position: relative;
  margin-left: 60px;
  background: #dedede;
  border-radius: 0.25em;
  padding: 1em;
  box-shadow: 0 2px 0 #c1c1c1;

}

.cd-timeline-content2:after {
  content: "";
  display: table;
  clear: both;
}
.cd-timeline-content2 h4 {
  color: #595959;
  font-size: 16px;
}

.cd-timeline-content2 h5 {
  margin-top:5px;
  color: #99999e;
  font-size: 13px;
}

.cd-timeline-content2 {
	margin-top:0px;
}


.cd-timeline-content2 p, .cd-timeline-content2 .cd-read-more, .cd-timeline-content2 .cd-date {
  font-size: 13px;
  font-size: 0.8125rem;
}
.cd-timeline-content2 .cd-read-more, .cd-timeline-content2 .cd-date {
  display: inline-block;
}
.cd-timeline-content2 p {
  margin: 1em 0;
  line-height: 1.6;
}

.cd-timeline-content2 .cd-read-more {
  float: right;
  padding: .8em 1em;
  background: #acb7c0;
  color: white;
  border-radius: 0.25em;
}
.no-touch .cd-timeline-content2 .cd-read-more:hover {
  background-color: #bac4cb;
}
.cd-timeline-content2 .cd-date {
  float: left;
  margin-left:10px;
  padding: .8em 0;
  opacity: .7;
}

.cd-timeline-content2::before {
  content: '';
  position: absolute;
  top: 16px;
  right: 100%;
  height: 0;
  width: 0;
  border: 9px solid transparent;
  border-right: 9px solid #dedede;
}

@media only screen and (min-width: 768px) {
  .cd-timeline-content h2 {
    font-size: 20px;
    font-size: 1.25rem;
  }

  .cd-timeline-content2 .cd-read-more, .cd-timeline-content2 .cd-date {
    font-size: 14px;
    font-size: 0.875rem;
  }

  .cd-timeline-content2 h2 {
    font-size: 20px;
    font-size: 1.25rem;
  }

  .cd-timeline-content2 .cd-read-more, .cd-timeline-content2 .cd-date {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
@media only screen and (min-width: 980px) {
  .cd-timeline-content {
    margin-left: 0;
    padding: 1.6em;
    width: 40%;
  }

  .cd-timeline-content::before {
    top: 18px;
    left: 100%;
    border-color: transparent;
    border-left-color: #f3f3f3;
  }
  .cd-timeline-content .cd-read-more {
    float: left;
  }
  .cd-timeline-content .cd-date {
    position: absolute;
    width: 100%;
    left: 122%;
    top: 0px;
    font-size: 16px;
    font-size: 1.3rem;
    color:#333333;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content {
    float: right;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content::before {
    top: 18px;
    left: auto;
    right: 100%;
    border-color: transparent;
    border-right-color: #f3f3f3;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more {
    float: right;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date {
    left: auto;
    right: 122%;
    text-align: right;
  }
  .cssanimations .cd-timeline-content.is-hidden {
    visibility: hidden;
  }
  .cssanimations .cd-timeline-content.bounce-in {
    visibility: visible;
    -webkit-animation: cd-bounce-2 0.6s;
    -moz-animation: cd-bounce-2 0.6s;
    animation: cd-bounce-2 0.6s;
  }




 .cd-timeline-content2 {
    margin-left: 0;
    padding: 1.6em;
    width: 40%;
  }

  .cd-timeline-content2::before {
    top: 18px;
    left: 100%;
    border-color: transparent;
    border-left-color: #dedede;
  }
  .cd-timeline-content2 .cd-read-more {
    float: left;
  }
  .cd-timeline-content2 .cd-date {
    position: absolute;
    width: 100%;
    left: 122%;
    top: 0px;
    font-size: 16px;
    font-size: 1.3rem;
    color:#333333;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content2 {
    float: right;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content2::before {
    top: 18px;
    left: auto;
    right: 100%;
    border-color: transparent;
    border-right-color: #dedede;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content2 .cd-read-more {
    float: right;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content2 .cd-date {
    left: auto;
    right: 122%;
    text-align: right;
  }
  .cssanimations .cd-timeline-content2.is-hidden {
    visibility: hidden;
  }
  .cssanimations .cd-timeline-content2.bounce-in {
    visibility: visible;
    -webkit-animation: cd-bounce-2 0.6s;
    -moz-animation: cd-bounce-2 0.6s;
    animation: cd-bounce-2 0.6s;
  }
}


}


@media only screen and (min-width: 980px) {
  /* inverse bounce effect on even content blocks */
  .cssanimations .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in {
    -webkit-animation: cd-bounce-2-inverse 0.6s;
    -moz-animation: cd-bounce-2-inverse 0.6s;
    animation: cd-bounce-2-inverse 0.6s;
  }
}
@-webkit-keyframes cd-bounce-2 {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(20px);
  }

  100% {
    -webkit-transform: translateX(0);
  }
}
@-moz-keyframes cd-bounce-2 {
  0% {
    opacity: 0;
    -moz-transform: translateX(-100px);
  }

  60% {
    opacity: 1;
    -moz-transform: translateX(20px);
  }

  100% {
    -moz-transform: translateX(0);
  }
}
@keyframes cd-bounce-2 {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100px);
    -moz-transform: translateX(-100px);
    -ms-transform: translateX(-100px);
    -o-transform: translateX(-100px);
    transform: translateX(-100px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(20px);
    -moz-transform: translateX(20px);
    -ms-transform: translateX(20px);
    -o-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
}
@-webkit-keyframes cd-bounce-2-inverse {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
  }

  100% {
    -webkit-transform: translateX(0);
  }
}
@-moz-keyframes cd-bounce-2-inverse {
  0% {
    opacity: 0;
    -moz-transform: translateX(100px);
  }

  60% {
    opacity: 1;
    -moz-transform: translateX(-20px);
  }

  100% {
    -moz-transform: translateX(0);
  }
}
@keyframes cd-bounce-2-inverse {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100px);
    -moz-transform: translateX(100px);
    -ms-transform: translateX(100px);
    -o-transform: translateX(100px);
    transform: translateX(100px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
    -moz-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    -o-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
}


	/*------------------------------------*\
	MAIN
\*------------------------------------*/
#timewrap {
	font-family: 'PTSansRegular', Helvetica, Arial, sans-serif; font-size:12px; color:#999999; text-align: left; line-height:18px;
	width:90%;
	margin:0 auto;
	color:#666;
	
}

#timeline ul li {
    list-style:none;
    margin:0;
    padding:0;

}

#timeline{
	background:url(http://dummyimage.com/5x5/b3b3b3/b3b3b3.gif) top center repeat-y;
	width:90%;
	padding:50px 0;
	margin:0 auto 10px auto;
	overflow:hidden;
	list-style:none;
	position:relative;
	border: 0px;
	height:2000px;
	border-style: none;
}

#timeline:before,
#timeline:after{
	content:" ";
	display:block;
	background:url(http://dummyimage.com/5x5/b3b3b3/b3b3b3.gif);
	position:absolute;
	top:0;
	left:50%;
	margin-left:-10px;
}

.bullet1{
	content:" ";
	width:10px;
	height:10px;
	display:block;
	background:#38B9B3;
	position:absolute;
	top:69px;
	left:50%;
	margin-left:-7px;
	border: 3px solid white;

	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	z-index:1;
}

.primeiro {
	position:relative;
	clear:both;
	float:left;
	width:32%;
	padding:10px;
	background:#e6e6e6;
	text-align:right;
	margin:0 0 10px 0;
	
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
	-moz-box-shadow:0 1px #fff inset;
	-webkit-box-shadow:0 1px #fff inset;
	box-shadow:0 1px #fff inset;
}

.segundo {
	position:relative;
	clear:both;
	float:left;
	width:31%;
	padding:10px;
	background:#e6e6e6;
	text-align:right;
	top:80px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
	-moz-box-shadow:0 1px #fff inset;
	-webkit-box-shadow:0 1px #fff inset;
	box-shadow:0 1px #fff inset;
}



#timeline li:before,
#timeline li:after{
	content:" ";
	width:50%;
	height:5px;
	background:#cccccc;
	position:absolute;
	left:100%;
	top:50%;
}

#timeline li:nth-of-type(odd),
#timeline li:nth-of-type(even){
	margin:-10px 0 0 0;
}
#timeline li:nth-of-type(even){
	float:right;
	text-align:left;
}
#timeline li:nth-of-type(even):after{
	background:#cccccc;
	left:auto;
	right:100%;
}

#data {
	width:100%;
	font-size: 1;
	padding-bottom:50px;
}

#data img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

#data2 {
	padding:0px;
}

#data2 img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width:60px;


}

#profile2 {
	
	width:15%;
	background:white;
	display:inline-block;

}

#text-widget2 {
	width:100%;


}

#profile {
	width:20%;
	display:inline-block;
	margin-right:3%;
	background:#f7f7f7;
	padding:20px;
}

#profile ul {
	list-style: none;
	font-size: 12px;
	border-bottom: 1px dashed #e6e6e6;
}


#profile ul li {
	border-top: 1px dashed #e6e6e6;
	padding: 5px 0 5px 0;
}



.tec_title {
	font-size:12px;
	font-weight: bold;
	color:#555b5d;
}


#text-widget {
	width:72.5%;
	display:inline-block;
	float:right;
	text-align: justify;
}

#logo {
	margin-top:10px;
}


#titulo {
	font-size:50pt;
}

.title {
	font-size:11pt;
	margin-bottom: 25px; 	
	width:100%;
	color:#595959;
	border-bottom: 1px solid #e5e5e5;
	border-top: 1px solid #e5e5e5;
	padding:8px 0 4px 0;
}

h3.titulos {
	
	text-align: center;
	margin-bottom:50px;
}

#footer p {
	color: #595959;
	font-size:10pt;
	line-height: 20px;
	text-align: justify;
}

.right_float2 { 
	margin-top:25px;
	float: right; 
	color: #595959;
}

.intro {
	color: #595959;
	font-size:10pt;
	line-height: 20px;
	text-align: justify;
}