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

	COLORS:

	default-grey		#999999
	dark-grey			#595959
	light-grey			#b3b3b3
	
	color dark			#2a3233
	colors blue			#2db6cf
	
	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.png);
	}
::selection { background:#2db6cf; color:#fff; }
::-moz-selection { background:#2db6cf; color:#fff; }
::-webkit-selection { background:#2db6cf; 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: #999999;
	text-transform: uppercase;
	margin-bottom: 25px;
	text-align: center;
	}

#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: #2db6cf;  
	}
	
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: #2db6cf;
	}
	
.wrapperoverlay a {	color: #edf4f5;	}
.wrapperoverlay a:hover {	color: #2db6cf;	}

a.color {
	text-decoration: none;
	color: #2db6cf;
	}
	
a.color:hover {
	color: #595959;
	}
	
.wrapperoverlay a.color { color: #2db6cf; }		
.wrapperoverlay a.color:hover { color: #edf4f5; }		
	
a.readmore .readmoreicon {
	background: #2db6cf 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: #2db6cf;
	}
	
.wrapperoverlay a.themebutton { background: #555b5d; color: #2a3233; }		
.wrapperoverlay a.themebutton:hover { background: #2db6cf; 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;
	}
	
.wrapperoverlay {
	margin: 0 auto;
	width: 940px;
	max-width: 100%;
	padding: 20px 60px;
	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; 
	}
	
.right_float { 
	float: right; 
	}
	
.seperator { 
	background: transparent url(../images/seperator.png) no-repeat top center; 
	padding-top: 18px;  /* 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:70px;			/* 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: 50px;			/* 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: 40px;
	background: #595959;
	display: none;
	min-width: 150px;
	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: 1060px;
	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;
	}
	
#blog #slider {
	position: relative;
	z-index: 2;
	overflow: hidden;
	}
	
#pageloader #slider {
	margin-bottom: 0px;
	}
	
#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;
	}

	
	

/*---------------------------------------------- 
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: #2db6cf;
	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: #edf4f5;
	}


	
/*---------------------------------------------- 
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: 40px;
	}
	
.portfolio-entry {
	float: left;
	width: 220px;
	background: #fff;
	margin-right: 20px;
	margin-bottom: 20px;
	position: relative;
	background: #f7f7f7;
	padding-bottom: 15px;
	}

.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: #2db6cf; }



/*---------------------------------------------- 
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: #2db6cf;
	
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}
	
.meta_type a.type_quote { background: #2db6cf url(../images/type_quote.png) no-repeat center center; }
.meta_type a.type_post { background: #2db6cf url(../images/type_post.png) no-repeat center center; }
.meta_type a.type_image { background: #2db6cf url(../images/type_image.png) no-repeat center center; }
.meta_type a.type_gallery { background: #2db6cf url(../images/type_gallery.png) no-repeat center center; }
.meta_type a.type_video { background: #2db6cf url(../images/type_video.png) no-repeat center center; }
.meta_type a.type_audio { background: #2db6cf url(../images/type_audio.png) no-repeat center center; }
.meta_type a.type_link { background: #2db6cf 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: #2db6cf;
	}
	
#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: #2db6cf 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: #2db6cf 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: 300px; }
.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: 1060px;
	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: #bfbfbf;
	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: #2db6cf;
	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: #2db6cf 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 #2db6cf;
	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: #2db6cf;
	}
.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: #2db6cf;
	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 #2db6cf;
	}
	
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: #2db6cf;
	}
	
	


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

.imgoverlay a .overlay {
	width: 100%;
	height: 100%;
	background: #ffffff;
	position: absolute;
	top: 0;
	left: 0;
	cursor: pointer;
	}
	
	
	
/*---------------------------------------------- 
19. Animation Section
------------------------------------------------*/	
#animationsection {
	position: relative;
	z-index: 2;
	}

#slidersection {
	width: 100%;
	height: auto;
	z-index: 2;
	}
	
#loadingsection {
	width: 100%;
	position: absolute;
	top: 0;
	left: 100%;
	z-index: 2;
	}
	
#pageloader {
	padding: 60px 60px;
	background: #f7f7f7;
	width: 940px;
	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 {
	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;
	}
	
#portfolio 	#loader {
	min-height: 60px;
	height: 100%;
	}
	
#portfolio #loader .wrapper div {
	background: url(../images/loader.gif) center 25px no-repeat;
	}
	
#portfolio #loader .wrapper div span {
	display: none;
	}