/*
===============================================

Theme Name: Spacing (Shared on www.MafiaShare.net)
Theme URI: http://www.mafiashare.net
Description: Spacing is a Clean and Minimal WordPress theme with a ‘BOLD’ feel that can be easily used as a personal portfolio or a business website.
Version: 1.0
Author: Tauris
Author URI: http://www.mafiashare.net


1. CSS Reset
2. General
	2.1. Default and Global values
3. Typography
	3.1. Heading Font
	3.2. Typography Elements
4. Header
5. Pages
	5.1. Homepage
	5.2. Portfolio
	5.3. Blog	
6. Sidebar
7. Footer
8. Contact Form
9. Widgets
	9.1. Recent Psots
	9.2. Flickr
	9.3. Search
	9.4. Twitter
10. Shortcodes
	10.1. Columns
	10.2. Tabs
	10.3. Toggles
	10.4. Lists
	10.5. Icon Boxes
	10.6. Pricing Boxes
	10.7. Buttons	
	
===============================================
*/

/* 
===============================================
	1. CSS 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, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
:focus {/* remember to define focus styles! */
	outline: 0;
}
body {
	line-height: 1;
	background-attachment:fixed !important; 
}
ol, ul {
	list-style: none;
}
table {/* tables still need 'cellspacing="0"' in the markup */
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	font-weight: normal;
	text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
a img {
	border: 0;
}
article, aside, details, figcaption, figure,
footer, #header, hgroup, menu, nav, section {
	display: block;
}
p:empty {
	margin-bottom:0;
}
	

/* 
===============================================
	1. General
===============================================
*/


body { background:#777575; color:#777; font-family:Helvetica, Arial, sans-serif; font-size:12px; line-height:20px;}

a { text-decoration:none; }

#wrapper { margin:0 auto;position:relative; z-index:1;}
	
.main-container {padding:20px 10px 0 10px;position:relative;margin-bottom:0px; margin-top:0px;}

	.main-container img {max-width:100%;height:auto;}
	
#main {margin-bottom:0;}

.clear {clear:both;}

.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}

a,.rp-title span { transition: color 0.2s linear; -moz-transition: color 0.2s linear; -webkit-transition: color 0.2s linear; -o-transition: color 0.2s linear; }

.social a img,
.bread-home,
.search-border,
.search-box,
.clients-logo-holder img,
.search-submit{ transition: opacity 0.2s linear; -moz-transition: opacity 0.2s linear; -webkit-transition: opacity 0.2s linear; -o-transition: opacity 0.2s linear; }

.bg-image { position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1; }


/* 
===============================================
		2.1. Default & Global Values
===============================================
*/

a,#navigation li.current-menu-item > a,
#navigation li.current_page_item > a,
#navigation li.current-menu-parent > a,
#navigation li.current_page_parent > a,
#navigation ul li:hover > a,
ul.sorting-menu a.selected,
a.rp-holder:hover .rp-title span,
.sidebar-widget ul li a:hover,
.post-meta-box a:hover,
.classic-meta-section span a:hover,
.testimonial-quote,
.divider.title a:hover,
.tweet .twitter-content a				{ color:#ff3333;  }
.homepage-post-title a:hover,
.portfolio-summary a:hover,	
.post-title a:hover,
.portfolio-nav a:hover					{ color:#ff3333;  }
a:hover,
.tweet .twitter-content a:hover			{ color:#222; }
.copyright								{ color:#666; }
.pagination span,
.pagination a:hover,
#navigation ul li#magic-line,
.span.overlay-link span,
.post-cn-box:hover						{ background-color:#ff3333;  }
footer a:hover,
footer .tweet .twitter-content a:hover,	
footer .sidebar-widget ul li a:hover,
#subfooter a:hover						{ color:#fff; }

h1,h2,h3,h4,h5,h6,
h1.post-title a,
.portfolio-summary h4 a,
.post-meta-box span,
.pagination a,
.classic-meta-section span,
.classic-meta-section span a,
.homepage-post-title a,
.post-meta-box a,
.portfolio-nav a						{ color:#444; }

#page-title h1 							{ color:#fff; }

.post-entry-holder,
#comments .comments-holder,
#navigation ul li ul li,
.post-content-holder,
.classic-content-holder,
.classic-post-holder,
.avatar-holder img,
.tabdiv,
.toggle-container h6,
blockquote,
.pullquote,
.line,.top,
.post-date-box, .post-cn-box,
.testimonial-content,
.pricing-price h1						{ border-color:#f4f4f4; }

.twitter-content						{ background-color:#f4f4f4; }

#header,#navigation ul li ul,
.main-container,						
#tagline								{ background-color:#fff; }

#footer									{ background-color:#222; }
#subfooter 								{ background-color:#1a1a1a; }

/* 
===============================================
	3. Typography
===============================================
*/

h5,h6,#navigation { text-transform:uppercase; }

/* 
===============================================
		3.2. Typography Elements
===============================================
*/

h1,h2,h3,h4,h5,h6 { margin-bottom:20px; font-weight:bold;  }
	h2,h3,h4,h5,h6 { letter-spacing:.9px; }		
	h1{ font-size:22px; line-height:1em; }
	h2{ font-size:18px; line-height:1em; }
	h3{ font-size:16px; line-height:1em; }
	h4{ font-size:14px; line-height:1em; }
	h5{ font-size:11px; }
	h6{ font-size:10px; }

p { margin-bottom:20px; }


blockquote { color:#999; font-size:15px; font-style:italic; margin:20px 0px 20px 20px; padding:20px; border-left:3px solid #f4f4f4; }
	blockquote p { margin:0px; }
	blockquote span { display:block; font-size:12px; line-height:20px; color:#555; float:right; }
	
	
.pullquote { float: right; font-size:15px; font-style:italic; color:#999; width: 32%; margin: 20px 20px 14px 20px; padding: 20px; border-left: 2px solid #e1e1e1;}
	.quoteleft { float: left; margin-left: 1px; margin-right: 20px; margin-left:20px; }	
	
	
.highlight { padding: 2px 5px; margin-right:5px; }


.dropcap { display: block; float: left; font-size: 40px; line-height: 40px; margin: 0 10px 0 0; }
	.drop-circle { width:40px; height:40px; -moz-border-radius: 20px;-webkit-border-radius: 20px; border-radius: 20px; font-size:30px; text-align:center; }
	
	
.aligncenter { display:block; margin-left:auto; margin-right:auto; padding-bottom:20px; }

	.imageleft, .imageright { padding-top:20px; }
		.imageright { float:right; padding-left:20px; }
		.imageleft { float: left; padding-right:20px; }
	.center { display:block; margin-left:auto; margin-right:auto; margin-bottom:30px; }
	
.blockleft, .blockright { padding-top:20px; }
	.blockleft { float: left; padding-right:20px; }	
	.blockright { float: right; padding-left:20px; }
	.caption { color: #aaa; font-size: 12px; font-style: italic; text-align: center; margin:0; }
		
.wp-caption { display: block; width:auto; padding:2px; }
	.wp-caption img { margin:5px 0 0 5px; }
	.alignleft { float: left; padding:20px 20px 15px 0; }	
	.alignright { float: right; padding:20px 0 15px 20px ; }
	.wp-caption-text { color: #aaa; font-size: 11px; font-style: italic; text-align: center; margin-bottom:2px; }
	
.box { padding:15px 20px; border:1px solid #f6f6f6; text-align:center; margin-bottom:20px; }


/* 
===============================================
   4. Header
===============================================
*/


#header { padding:0 20px;margin-bottom:0px;}

#logo { float:left; }

	#logo { text-transform:capitalize; padding:35px 0; }	
	#logo img { max-width:100%; }
	
#navigation { float:right; margin-right:20px; }

	#navigation ul { list-style:none; position:relative; }
	#navigation ul li { float:left; padding-left:30px; font-size:12px; display:block; position:relative; font-weight:bold; }	
	#navigation ul li a { color:#888; padding-bottom:10px; padding-top:35px; display:block; }	
	#navigation ul li ul { position:absolute; border:1px solid #e9e9e9; display:none; left:15px; padding-bottom:15px; z-index:9999; }	
	#navigation ul li ul li {  min-width:150px; margin-left:15px; margin-right:15px; padding:15px 0 10px 0; border-bottom:1px solid #f6f6f6; font-weight:normal; font-size:10px; }	
	#navigation ul li ul li:last-child {  border:0;	 padding-bottom:0; }	
	#navigation ul li ul li a { border:0; display:block; padding:0; }	
	#navigation li:hover ul { display:block; }

#navigation select { display:none; -webkit-appearance: none; border-radius: 0; }

#navigation ul li#magic-line { position: absolute; left: 0; width: 100px; height: 4px; padding-left:0; display:none; }
	
/* 
===============================================
   5. Pages
===============================================
*/

#page-title { padding:20px 0; margin-bottom:0px; position:relative; background-color:#ff3333; }

	#page-title h1 { margin:0; line-height:36px; float:left; font-weight:normal; font-size:20px; }
	
	.title-arrow { width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid #333; position:absolute; bottom:-8px; left:20px; z-index:10;}
	
#breadcrumbs { background-color:#fff; border-bottom:1px solid #f4f4f4; margin-bottom:-8px; }

.breadcrumb { list-style: none; overflow: hidden; }
.breadcrumb li { float: left; background:url(img/bread-arrow.png) no-repeat right center; }
.breadcrumb li a { color: #999; text-decoration: none; padding: 10px 20px 10px 10px; position: relative; display: block; float: left; font-size:10px; text-transform:uppercase; }
.breadcrumb li a:hover { color:red; }
.breadcrumb li:last-child { background:none; }
.breadcrumb li a.bread-home {background:url(img/home.gif) no-repeat center left;height:40px;padding:0 40px 0 0;opacity:0.3;}
	.breadcrumb li .bread-home:hover { opacity:0.8; }	
.container .four.columns.title-searchform { float:right; }

/* 
===============================================
		5.1. Homepage
===============================================
*/

#homepage-slider,.homepage-custom { margin-bottom:0px; width:100%; }

	.homepage-custom img { width:100%; height:auto; display:block; }

.slide-title, .slide-caption { display:block; }

.slide-caption { font-size:18px; font-weight:bold; }

	.slide-caption a { color:#fff; text-decoration:underline; }

#tagline {margin-bottom:10px;
}

	#tagline h1 {font-weight:normal;padding:0;line-height:1.5em;display:block;text-align:center;margin-bottom:0;color:#999;font-size:22px;}
	
	#tagline span {	font-size:20px;font-weight:bold;margin-bottom:10px;line-height:1.3em;color:#444;display:block;}


/* Recent Work */
	
#related-work {padding-bottom:20px;	}	
	
.recent-posts h5 {margin-bottom:10px;}
	.homepage-post-thumbnail {margin-bottom:14px;}
	
	.homepage-post-meta.classic-meta-section {margin-bottom:8px;}
	
.recent-full {position:relative;width:100%;}
.recent-more {position:absolute;right:10px;top:0;}

.homepage-post-title {margin-bottom:10px;}

.homepage-more {margin-bottom:20px;display:inline-block;}

#recent-work .portfolio-item {margin-bottom:20px;}

#recent-work { margin-bottom:-20px; }

.clients-logo-holder img { opacity:0.35; }
.clients-logo-holder img:hover { opacity:0.7; }

#clients { padding-bottom:20px; }

#homepage-content { margin-bottom:-30px; }

#main #homepage-content.container:last-child, #main #recent-work.container:last-child { margin-bottom:0; }
#main #tagline.container:last-child { margin-bottom:0; padding-bottom:20px; }

/* 
===============================================
		5.2. Portfolio
===============================================
*/

#portfolio-container .portfolio-item {margin-bottom:20px;}

.padding-bottom {padding-bottom:20px;}		

ul.sorting-menu {display:block;margin:4px 10px 24px 10px;}

	ul.sorting-menu li {float:left;	margin-right:10px;padding-right:10px;border-right:1px dotted #ddd;line-height:12px;display:inline-block;}	
	ul.sorting-menu li a {color:#666;}	
	ul.sorting-menu li:last-child {margin-right:0;padding-right:0;}	
	ul.sorting-menu li:first-child, ul.sorting-menu li:last-child {border:0;}	
	ul.sorting {float:right;}	
	ul.sorting-menu a.selected {font-weight:bold;color:#222;}

	
#portfolio-container h5 {display:none;}

.portfolio-summary h4 {margin-top:20px;margin-bottom:10px;}
.portfolio-summary p {margin-bottom:0;}
	
.portfolio-thumbnail-holder {position: relative;overflow:hidden;background-color:#111;}
	
	.portfolio-thumbnail img,.homepage-post-thumbnail img {width:100%;display:block;}
	
		#portfolio-container .four.columns .portfolio-thumbnail img {height:145px;}		
		#portfolio-container .six.columns .portfolio-thumbnail img {height:225px;}		
		#portfolio-container .twelve.columns .portfolio-thumbnail img {height:264px;}		
		#portfolio-container .eight.columns .portfolio-thumbnail img {height:304px;}		
		#portfolio-container .onethird .portfolio-thumbnail img {height:198px;}		
		#portfolio-container .sixteen.columns .portfolio-thumbnail img {height:345px;}		
		
	
	span.overlay-link,span.overlay-title,span.overlay-link-alt {position: absolute;text-align:center;opacity:0;width:100%;text-transform:uppercase;}	
	span.overlay-content {opacity:0;height:100%;width:100%;}

	span.overlay-link {top:50%;left: 0;}	
	span.overlay-link-alt {top: 42%;left: 0;}		
	span.overlay-link span,span.overlay-link-alt span {width:40px;height:40px;display:block;background:#f33 url(img/icons-white/link1.png) no-repeat center center;border-radius:30px;-webkit-border-radius:30px;-moz-border-radius: 30px;margin:0 auto;}	
	
	span.overlay-content span.play-video { background-image:url(img/icons-white/video.png); }	
	span.overlay-content span.external-url { background-image:url(img/icons-white/link.png); }	
	span.overlay-content span.open-gallery { background-image:url(img/icons-white/enlarge.png); }	
	
	span.overlay-title {top: 46%;left: 0%;color:#fff;font-size:14px;font-weight:bold;line-height:22px;margin-top:-30px;text-transform:none;}
	
	.portfolio-thumbnail-title {margin-top:20px;margin-bottom:0;}	
	.portfolio-thumbnail-desc {margin-top:10px;margin-bottom:0;font-size:11px;}
	

/* Portfolio Single*/	

.portfolio-image-list img {width:100%;margin:20px 0;display:block;}

.portfolio-post-media {width:700px;}

	.portfolio-post-media > img { display:block; }

.portfolio-post-content {width:220px;float:left;}

.layout-fullwidth {float:none;width:100%;}

.gallerypage {margin-bottom:20px;}

.lightbox-hidden {display:none;}

.container.sidebar-left .twelve.columns {float:right;}
	
.portfolio-nav {float:right;margin-top:5px;}

	.portfolio-nav div {display:inline-block;}
	
	.portfolio-next {margin-left:20px;}



/* 
===============================================
		5.3. Blog
===============================================
*/


.post p:last-child {margin:0;}

.featured-image-holder {margin-bottom:20px;background-color:#111;}
	.featured-image-holder img {width:100%;height:auto;display:block;}

	.post-thumbnail-medium {width:100%;	margin-bottom:20px;}
	
	.post-thumbnail-small {width:100%;margin-bottom:10px;}	
	
	.post.clerafix:last-child .post-entry-right {margin-bottom:10px;}
	
	.comments-reply .post-entry-right, #homepage-blog .post:last-child .post-entry-right, .posts-holder .post:last-child .post-entry-right  {border-bottom:0;margin-bottom:0;}	
	
	a.opacity-hover { background-color:#111; position: relative; display:block; }
	a.opacity-hover img { display:block; }


.blog-default-holder {margin-left:-10px;margin-right:-10px;}

.blog-default-meta {padding-bottom:20px;}

.default-comments h6 {margin-bottom:5px;}

.post-entry-holder, #comments .comments-holder {margin-bottom:30px;border-bottom:1px solid #f6f6f6;	padding-bottom:20px;}
	.post-content-holder {margin-bottom:20px;border-bottom:1px solid #f6f6f6;}
	.comments-holder {margin-bottom:20px;}

.blog-pagination {border-bottom:0;margin-bottom:20px;padding:0;}

.posts-holder .post:last-child .post-entry-holder {margin-bottom:20px;}

.post-date-box, .post-cn-box {width:98px;text-align:center;padding:8px 0 6px 0;text-transform:uppercase;font-size:10px;display:block;border:1px solid #f4f4f4;}

	.post-date-box span, .post-cn-box span{font-size:14px;display:block;line-height:30px;font-weight:bold;}	
	.boxes-holder p {margin-bottom:0;}	
	.post-date-box {color:#444;}	
	.post-cn-box:hover  {color:#fff;}	
	.post-cn-box {color:#333;transition: color, background-color 0.1s linear; -moz-transition: color, background-color 0.1s linear; -webkit-transition: color, background-color 0.2s linear; -o-transition: color, background-color 0.1s linear;margin-bottom:16px;border-top:0;}

.post-meta-box {text-align:left;font-size:11px;}

	.post-meta-box p {margin-bottom:10px;}	
	.post-meta-box span {padding-right:5px;display:block;font-weight:bold;text-transform:uppercase;font-size:10px;}	
	.post-meta-box h4 {margin-bottom:5px;}

.pagination {text-align:right;display:block;margin-bottom:20px;}
	.pagination a, .pagination span {padding:6px 11px;font-size:11px;font-weight:bold;}
	.pagination a {background:#fff;transition: color, background-color 0.1s linear; -moz-transition: color, background-color 0.1s linear; -webkit-transition: color, background-color 0.2s linear; -o-transition: color, background-color 0.1s linear;}
	.pagination a:hover {color:#fff;}
	.pagination span {color:#fff;}
	
/* Classic Layout */

.classic-meta-section {color:#aaa;text-transform:uppercase;font-size:10px;margin-top:-3px;margin-bottom:17px;}

	.classic-meta-section span {font-weight:bold;}

.classic-content-holder {padding-bottom:10px;border-bottom:1px solid #f6f6f6;margin-bottom:30px;}

	.classic-content-holder ul {margin-bottom:20px;}

.classic-post-holder {margin-bottom:30px;border-bottom:1px solid #f6f6f6;padding-bottom:30px;}


/* Single Post */


.single-post-title {margin-bottom:20px;}

.post-meta-small {font-size:10px;text-transform:uppercase;color:#999;display:block;margin-bottom:20px;}

	.post-meta-small a {font-weight:bold;line-height:20px;}	
	.post-meta-small a:hover {font-weight:bold;}

.post-section-title h6 {margin-bottom:0;}

	.post-section-title p {font-size:11px;}
	
	
/* Comments */

.comment-holder {margin-bottom:20px;min-height:56px;}

.avatar-holder {width:48px;float:left;}

	.avatar-holder img {padding:3px;border:1px solid #f6f6f6;}

.comment-entry {margin-left:76px;}

	.comment-meta {margin-bottom:5px;display:inline-block;font-size:10px;text-transform:uppercase;color:#aaa;}	
	.comment-meta span {font-weight:bold;color:#666;}
	
.comment-holder ul.children {clear:both;margin-left:76px;padding-top:10px;}
	
	.comments-container li:last-child > .comment-holder {margin:0;}
	
.reply-note {font-size:11px;color:#aaa;}


/* 
===============================================
	6. Sidebar
===============================================
*/

.sidebar .sidebar-widget h5 {margin-bottom:20px;}

.sidebar-both #sidebar, .sidebar-right #sidebar { float:right; }

.both-container #content, .sidebar-left #content{float:right;}

.both-container.twelve.columns .four.columns {margin-left:0;}

.both-container.twelve.columns .eight.columns {margin-right:0;}

.sidebar {padding-bottom:20px;}


/* 
===============================================
	7. Footer
===============================================
*/


	
#footer {padding:20px 10px 0 10px;margin-top:8px;}

	.footer-dark {color:#999;}	
		.footer-dark h1,.footer-dark h2,.footer-dark h3,.footer-dark h4,.footer-dark h5 {color:#fff;}				
		.footer-dark .twitter-content {	background-color:#2a2a2a;}		
		.footer-dark .twitter-date {background:url(img/twitter-arrow-dark.png) left top no-repeat;}		
		.footer-dark .rp-title span {color:#ddd;}	
	#footer h5 {margin-bottom:10px;}

#subfooter, #header-social {position:relative;padding:15px 0;}

	.copyright {font-size:11px;}	
	.social,#subfooter .social-footer {float:right;}			
	  .social a img {margin-left:10px; opacity:0.7;}
	  .social a:first-child img {margin-left:0;}	  
	  .social a img:hover {opacity:1;}
	  

/* 
===============================================
   8. Contact/Comments Form
===============================================
*/

.contact-form label {
	display:block;
	font-size:11px;
	text-transform:uppercase;
	font-weight:bold;	
	margin-bottom:20px;
}

.contact-form input[type=text], .contact-form textarea {	
	-webkit-appearance: none;
    border-radius: 0;
	border:1px solid #f0f0f0;
	padding:10px 10px;
	color:#999;
}

	.contact-form input[type=text]:focus, .contact-form textarea:focus, .search-box:focus {
		border-color:#ccc;
	}
	
	.contact-form input[type=text] {
		width:191px;
		margin:0 0 20px 0;
	}
	
	.contact-form textarea {
		margin-bottom:15px;
		width:658px;
		font-family:Helvetica, Arial, sans-serif;
	}
	
	.six.columns textarea, .six.columns input[type=text] {
		width:318px;
	}
	
	.forms .textfield { float:left; width:213px; margin-right:20px;}
	.forms .textarea { clear:both; }	

.contact-form button { margin-left:0; }

.form-success {
	display:none;
}

.loading { display:none; background:url(img/slider/loader.gif) no-repeat 1px; height:28px; width:28px; position:absolute; margin-top:-50px; margin-left:217px; }

.contact-textarea { min-height:170px; }

#contact_gmap { width:100%; height:350px; }
#contact_gmap img,
#widget_gmap img { max-width:inherit; }

/* 
===============================================
   9. Widgets
===============================================
*/

.sidebar-widget {
	margin-bottom:30px;
	font-size:11px;
}
	
	.sidebar-widget:last-child { border:0; padding:0; }

	.sidebar-widget .textwidget {
		font-size:11px;
	}

	.sidebar-widget ul li a {
		color:#888;
	}

	.tagcloud a {
		padding:4px 6px;
		background-color:#f6f6f6;
		color:#666;
	}


/* 
===============================================
		9.1. Recent Posts
===============================================
*/

.widget-recent-posts li {
	margin-bottom:10px;
}

.rp-thumbnail img {
	float:left;
	width:47px;
	height:auto; 
}

.rp-title {
	display:inline-block;
	padding-left:10px;
}

	.rp-title span {
		text-transform:uppercase;
		font-weight:bold;
		font-size:10px;
		color:#666;
	}

	.rp-title p {
		font-size:10px;
		text-transform:capitalize;
		margin-bottom:0;
	}
		
/* 
===============================================
		9.2. Flickr
===============================================
*/


.flickr-badge {
	margin:0 0 -10px -10px;
}
.flickr_badge_image {
	float:left;
}

	.flickr_badge_image img {
		width:47px;
		height:auto;
		margin-left:10px;
		margin-bottom:4px;
	}

.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 10px;
	height: 0;
	overflow: hidden;	
}

.portfolio-post-media .video-container { margin-bottom:20px; }

.video-container iframe,  
.video-container object, 
.video-container > div, 
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index:25500;
}

/* 
===============================================
		9.3. Search
===============================================
*/

.searchform {
	position:relative;
}

.search-border {
	position:relative;
	width:100%;
	height:34px;
	border:1px solid #fff;	
	opacity:.2;
	z-index:1;
}

.searchform:hover .search-border { opacity:.5; }

#searchform {
	position:absolute;
	top:1px;
	left:1px;
	z-index:10;
}

.search-submit {
	position:absolute;
	width:35px;
	height:35px;
	right:0;
	top:2px;
	background:url(img/search-white.png) center 8px no-repeat;
	border:0;
	opacity:0.8;
	cursor:pointer;
	z-index:5;
}

	.search-submit:hover {
		opacity:1;
	}

.search-box {
	-webkit-appearance: none;
    border-radius: 0;
	width:173px;
	padding:10px 35px 10px 10px;
	font-size:11px;
	color:#aaa;
	margin-top:0;
	border:0;
	z-index:555;
}

.title-searchform input[type=text] {
	color:#fff;
	background-color:transparent;
	opacity:.8;
}

	.title-searchform input[type=text]:hover {
		opacity:1;
	}
	
	.title-searchform:focus .search-border {
		opacity:1;
	}
	
.sidebar-widget .search-submit {
	background:url(img/search.png) center 8px no-repeat;
}


/* 
===============================================
		9.4. Twitter
===============================================
*/

.twitter-content {padding:4px 10px;}
.twitter-date {padding:10px 0;margin-left:10px;background:url(img/twitter-arrow.png) left top no-repeat;}

/* 
===============================================
		9.5. Testimonials
===============================================
*/

.testimonial-content {padding:15px 10px 15px 50px;border:1px solid #f4f4f4;font-size:11px;position:relative;}

	.testimonial-quote { position:absolute; left:13px; top:0; font-weight:bold; letter-spacing:-3px; font-size:50px; }
	.testimonial-arrow { position:absolute; background:url(img/testimonial-arrow.png) no-repeat center center; display:block; height:8px; width:15px; z-index:10; left:50px; bottom:-8px; }

.testimonial-author { padding-left:50px; padding-top:15px; margin-bottom:15px; }

	.testimonial-author span {font-size:11px;text-transform:uppercase;font-weight:bold;}	
	.testimonial-author a { font-size:11px; font-style:italic; }
	
.sidebar-widget .testimonial-content,
.sidebar-widget .testimonial-author { padding-left:40px; }

.sidebar-widget .testimonial-arrow { left:40px; }
.sidebar-widget .testimonial-quote { font-size:42px; left:10px; top:2px;}

		
/* 
===============================================
	10. Shortcodes
===============================================
*/

/* 
===============================================
		10.1. Columns
===============================================
*/


.one-half, .one-third, .one-fourth, .three-fourth, .two-third, .one-fifth, .two-fifth, .three-fifth, .four-fifth { margin-bottom: 20px; float:left; margin-right: 4%; position:relative; }

.one-half		{ width:48%; }
.one-third		{ width:30.65%; }
.two-third		{ width:65.2%; }
.one-fourth		{ width:22%; }
.three-fourth	{ width:74%; }
.one-fifth		{ width:16.8%; }
.two-fifth		{ width:37.6%; }
.three-fifth	{ width:58.4%; }
.four-fifth		{ width:79.2%; }

.last			{ margin-right: 0 !important; }
	
.divider { clear: both; margin:30px 0; }
	.line,.top,.title { height: 1px; background-color:#f4f4f4; }
	.divider.top { text-align:right; }
	.divider.title { text-align:center; }
	
	.divider.top a,divider.title span,.divider.title a,.divider.title span { background-color:#fff; position: relative; top: -10px; text-transform:uppercase; }
	.divider.title a,.divider.title span { font-size:10px; color:#aaa; padding:0 8px; }
	.divider.top a { font-size:8px; padding-left:8px; }
	
	.divider-homepage { margin:30px 10px; }
	.divider-homepage .line { margin-top:10px; }	
	
	
/* 
===============================================
		10.2. Tabs
===============================================
*/	
	
.tabs {  }
	.tabnav li { display: inline; list-style: none; padding-right: 5px;	}	
	.tabnav li a { font-size:11px; color:#888; font-weight: bold; text-transform:uppercase; padding: 8px 10px; outline: none; border:1px solid #fff; border-bottom:1px solid #f0f0f0; }		
	.tabnav li a:active, .tabnav li.ui-tabs-selected a { color:#666; text-decoration: none; border:1px solid #f0f0f0; border-bottom:1px solid #fff; }
		
.tabdiv { margin-top: 5px; padding:16px 10px 0 10px; border:1px solid #f0f0f0;}

.ui-tabs-hide { display: none; }

/* 
===============================================
		10.3. Toggles
===============================================
*/

.toggle-container { width:100%; }

.toggle-container { margin-bottom:10px; position:relative; cursor:pointer; overflow:hidden; }
	.toggle-container h6 { font-size:11px; color:#888; font-weight: bold; text-decoration: none; padding:6px 8px 6px 30px; line-height:20px; margin:0; border: 1px solid #e1e1e1; }
	.toggle { background:url(img/toggle.png) no-repeat 10px 10px; }
	.active { background:url(img/toggle.png) no-repeat 10px -20px;}


.toggle-container div { padding:10px 10px 2px 32px; margin:0px; } 
.toggle-content { display:none; }

/* 
===============================================
		10.4. Lists
===============================================
*/

ol, .list { list-style:inside none; margin-bottom:20px; }
ol li, .list li { color:#888; line-height:20px; margin-bottom:4px; }
	ol { list-style-type:decimal; }
	.square { list-style-type:square; }
	.circle { list-style-type:circle; }
	.check li { background:transparent url(img/check.png) no-repeat 0px 2px; padding-left:25px; }
	.checkgrey li { background:transparent url(img/checkgrey.png) no-repeat 0px 2px; padding-left:25px; }
	
/* 
===============================================
		10.5. Icon Boxes
===============================================
*/

/*.icon-image { float:left; width:34px; height:34px; margin-right:10px; background-color:#f33; -webkit-border-radius:20px; position:relative; }
	.icon-image img { position: absolute;
   top: 50%;
   left: 50%; }*/
	
.icon-image { float:left; width:32px; margin-right:10px; }
.icon-text h5,.icon-text h6 { margin-bottom:5px; }
.icon-text p { font-size:11px; margin-left:42px; }

/* 
===============================================
		10.6. Pricing Boxes
===============================================
*/

.pricing-box { border:5px solid #f1f1f1; }
	.pricing-box p { margin-bottom:0; }
	.pricing-title { text-align:center; padding:20px 30px 0 30px;}
	.pricing-title h3 { margin-bottom:0; }
	.pricing-price { text-align:center;}
	.pricing-price h1 { font-size:42px; line-height:42px; padding:20px 0; border-top:1px solid #f6f6f6; border-bottom:1px solid #f6f6f6; }
	.pricing-content { padding:20px 30px; }
	.pricing-content ol, .pricing-content .list { margin-bottom:20px; }
	.pricing-content .button { margin-bottom:0; margin-right:0; text-align:center; display:block; }	

/* 
===============================================
		10.7. Buttons - Button Pro by Raspo
===============================================		
*/

.button{
	display: inline-block;
	text-decoration: none;
	outline: none;
	cursor: pointer;
	font: bold 12px/1em HelveticaNeue, Arial, sans-serif;
	padding: 8px 11px;
	color: #555;
	text-shadow: 0 1px 0 #fff;
	margin-right:15px;
	margin-bottom:20px;
	
	background: #f5f5f5;
	background: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#f0f0f0));
	background: -moz-linear-gradient(top, #f9f9f9, #f0f0f0);
	
	border: 1px solid #dedede;
	border-color: #dedede #d8d8d8 #d3d3d3;
	
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	
/*	-webkit-box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #fcfcfc;*/
	-moz-box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #fbfbfb;
	box-shadow: 0 1px 0 #f9f9f9, inset 0 1px 0 #fbfbfb;
}

.button:hover {
	color: #555;
}

.button:focus{
	color: #555;
	background: #efefef;
	background: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#e9e9e9));
	background: -moz-linear-gradient(top, #f9f9f9, #e9e9e9);
	border-color: #ccc;
	-webkit-box-shadow: 0 2px 1px #e0e0e0, inset 0 1px 0 #fbfbfb;
	-moz-box-shadow: 0 2px 1px #e0e0e0, inset 0 1px 0 #fbfbfb;
	box-shadow: 0 1px 2px #e0e0e0, inset 0 1px 0 #fbfbfb;
}

.button:active{
	position: relative;
	top: 1px;
	
	color: #555;
	background: #efefef;
	background: -webkit-gradient(linear, left top, left bottom, from(#eaeaea), to(#f4f4f4));
	background: -moz-linear-gradient(top, #eaeaea, #f4f4f4);
	border-color: #c6c6c6;
	-webkit-box-shadow: 0 1px 0 #fff, inset 0 0 5px #ddd;
	-moz-box-shadow: 0 1px 0 #fff, inset 0 0 5px #ddd;
	box-shadow: 0 1px 0 #fff, inset 0 0 5px #ddd;
}

.button.rounded{
	padding: 8px 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
}


input.button, button.button{
	*width: auto; /* IE7 Fix */
	*overflow: visible; /* IE7 Fix */
}

.button img{
	border: none;
	vertical-align: bottom;
}


/* ----- ---- --- -- -  Small buttons - -- --- ---- ----- */

.button.small{
	padding: 5px 11px;
	font-size: 11px;
	font-weight: normal;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.button.small.rounded{
	-webkit-border-radius: 11px;
	-moz-border-radius: 11px;
	border-radius: 11px;
}



/* ----- ---- --- -- -  Large buttons - -- --- ---- ----- */

.button.large{
	padding: 12px 15px;
	font-size: 20px;
	font-weight: normal;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.button.large.rounded{
	padding: 12px 22px;
	-webkit-border-radius: 23px;
	-moz-border-radius: 23px;
	border-radius: 23px;
}

/* ----- ---- --- -- -  Light Blue - -- --- ---- ----- */

.button.light_blue{
	background: #92dbf6;
	background: -webkit-gradient(linear, left top, left bottom, from(#abe4f8), to(#6fcef3));
	background: -moz-linear-gradient(top, #abe4f8, #6fcef3);
	border-color: #7cbdd5;
	color: #444;
	text-shadow: 0 1px 0 #b6e6f9;
	-webkit-box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 0 #c0ebfa;
	-moz-box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 0 #c0ebfa;
	box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 0 #c0ebfa;    
}
.button.light_blue:focus{
	background: #85d6f5;
	background: -webkit-gradient(linear, left top, left bottom, from(#b1e9fd), to(#66c6ea));
	background: -moz-linear-gradient(top, #b1e9fd, #66c6ea);
	border-color: #66a8bf;
	-webkit-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #c0ebfa;
	-moz-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #c0ebfa;
	box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #c0ebfa;
}
.button.light_blue:active{
	background: #92dbf6;
	border-color: #66a8bf;
	-webkit-box-shadow: 0 1px 0 #fff, inset 0 0 5px #66a8bf;
	-moz-box-shadow: 0 1px 0 #fff, inset 0 0 5px #66a8bf;
	box-shadow: 0 1px 0 #fff, inset 0 0 5px #66a8bf;
}



/* ----- ---- --- -- -  Blue - -- --- ---- ----- */

.button.blue{
	background: #377ad0;
	background: -webkit-gradient(linear, left top, left bottom, from(#52a8e8), to(#377ad0));
	background: -moz-linear-gradient(top, #52a8e8, #377ad0);
	border-color: #4081af #2e69a3 #20559a;
	color: #fff;
	text-shadow: 0 1px 1px #4081af;
	-webkit-box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 1px #72b9eb;
	-moz-box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 1px #72b9eb;
	box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 1px #72b9eb;
}
.button.blue:focus{
	background: #206bcb;
	background: -webkit-gradient(linear, left top, left bottom, from(#3e9ee5), to(#206bcb));
	background: -moz-linear-gradient(top, #3e9ee5, #206bcb);
	border-color: #2a73a6 #165899 #07428f;
	-webkit-box-shadow: 0 1px 0 0 #fff, inset 0 1px 0 0 #62b1e9;
	-moz-box-shadow: 0 1px 0 0 #fff, inset 0 1px 0 0 #62b1e9;
	box-shadow: 0 1px 0 0 #fff, inset 0 1px 0 0 #62b1e9;
}
.button.blue:active{
	background: #3282d3;
	border-color: #154c8c #154c8c #0e408e;
	text-shadow: 0 -1px 1px #1d62ab;
	-webkit-box-shadow: 0 1px 0 0 #fff, inset 0 0 6px 3px #1657b5;
	-moz-box-shadow: 0 1px 0 0 #fff, inset 0 0 6px 3px #1657b5;
	box-shadow: 0 1px 0 0 #fff, inset 0 0 6px 3px #1657b5;
}



/* ----- ---- --- -- -  Green - -- --- ---- ----- */

.button.green{
	background: #7fbf4d;
	background: -webkit-gradient(linear, left top, left bottom, from(#7fbf4d), to(#63a62f));
	background: -moz-linear-gradient(top, #7fbf4d, #63a62f);
	border-color: #63a62f;
	color: #fff;
	text-shadow: 0 1px 0 #53961e;
	-webkit-box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 0 #96d865;
	-moz-box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 0 #96d865;
	box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 0 #96d865;    
}
.button.green:focus{
	background: #76b347;
	background: -webkit-gradient(linear, left top, left bottom, from(#86c755), to(#5ea12a));
	background: -moz-linear-gradient(top, #86c755, #5ea12a);
	border-color: #53961e;
	-webkit-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #96d865;
	-moz-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #96d865;
	box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #96d865;    
}
.button.green:active{
	background: #7fbf4d;
	border-color: #53961e;
	-webkit-box-shadow: 0 1px 0 #fff, inset 0 0 5px #53961e;
	-moz-box-shadow: 0 1px 0 #fff, inset 0 0 5px #53961e;
	box-shadow: 0 1px 0 #fff, inset 0 0 5px #53961e;
}



/* ----- ---- --- -- -  Red - -- --- ---- ----- */

.button.red{
	background: #e6433d;
	background: -webkit-gradient(linear, left top, left bottom, from(#f8674b), to(#d54746));
	background: -moz-linear-gradient(top, #f8674b, #d54746);
	border-color: #d1371c #d1371c #9f220d;
	color: #fff;
	text-shadow: 0 1px 1px #961a07;
	-webkit-box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 0 #ff9573;
	-moz-box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 0 #ff9573;
	box-shadow: 0 1px 2px #d6d6d6, inset 0 1px 0 #ff9573;    
}
.button.red:focus{
	background: #dd3a37;
	background: -webkit-gradient(linear, left top, left bottom, from(#ff7858), to(#cc3a3b));
	background: -moz-linear-gradient(top, #ff7858, #cc3a3b);
	border-color: #961a07;
	-webkit-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #ff9573;
	-moz-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #ff9573;
	box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #ff9573;    
}
.button.red:active{
	background: #e6433d;
	border-color: #961a07;
	-webkit-box-shadow: 0 1px 0 #fff, inset 0 0 5px #961a07;
	-moz-box-shadow: 0 1px 0 #fff, inset 0 0 5px #961a07;
	box-shadow: 0 1px 0 #fff, inset 0 0 5px #961a07;
}



/* ----- ---- --- -- -  Orange - -- --- ---- ----- */

.button.orange{
	background: #ee8f1f;
	background: -webkit-gradient(linear, left top, left bottom, from(#f5b026), to(#f48423));
	background: -moz-linear-gradient(top, #f5b026, #f48423);
	border-color: #e6791c #e6791c #d86f15;
	color: #fff;
	text-shadow: 0 1px 1px #b85300;
	-webkit-box-shadow: 0 1px 2px #d7e9a4, inset 0 1px 0 #f8d898;
	-moz-box-shadow: 0 1px 2px #d7e9a4, inset 0 1px 0 #f8d898;
	box-shadow: 0 1px 2px #d7e9a4, inset 0 1px 0 #f8d898;    
}
.button.orange:focus{
	background: #e38512;
	background: -webkit-gradient(linear, left top, left bottom, from(#ffbb33), to(#eb7b1a));
	background: -moz-linear-gradient(top, #ffbb33, #eb7b1a);
	border-color: #d0680c;
	-webkit-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #ffdf9e;
	-moz-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #ffdf9e;
	box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #ffdf9e;    
}
.button.orange:active{
	background: #ee8f1f;
	border-color: #d0680c;
	-webkit-box-shadow: 0 1px 0 #fff, inset 0 0 5px #d0680c;
	-moz-box-shadow: 0 1px 0 #fff, inset 0 0 5px #d0680c;
	box-shadow: 0 1px 0 #fff, inset 0 0 5px #d0680c;
}



/* ----- ---- --- -- -  Yellow - -- --- ---- ----- */

.button.yellow{
	background: #f9e327;
	background: -webkit-gradient(linear, left top, left bottom, from(#fceb4c), to(#ebd611));
	background: -moz-linear-gradient(top, #fceb4c, #ebd611);
	border-color: #dcc700 #dcc700 #c2b00b;
	color: #444;
	text-shadow: 0 1px 1px #ffff98;
	-webkit-box-shadow: 0 1px 2px #d7e9a4, inset 0 1px 0 #fee395;
	-moz-box-shadow: 0 1px 2px #d7e9a4, inset 0 1px 0 #fee395;
	box-shadow: 0 1px 2px #d7e9a4, inset 0 1px 0 #fee395;    
}
.button.yellow:focus{
	background: #ebd611;
	background: -webkit-gradient(linear, left top, left bottom, from(#fffa58), to(#e1cd00));
	background: -moz-linear-gradient(top, #fffa58, #e1cd00);
	border-color: #cebb10;
	-webkit-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #fee395;
	-moz-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #fee395;
	box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #fee395;    
}
.button.yellow:active{
	background: #f9e327;
	border-color: #cebb10;
	-webkit-box-shadow: 0 1px 0 #fff, inset 0 0 5px #cebb10;
	-moz-box-shadow: 0 1px 0 #fff, inset 0 0 5px #cebb10;
	box-shadow: 0 1px 0 #fff, inset 0 0 5px #cebb10;
}



/* ----- ---- --- -- -  Pink - -- --- ---- ----- */

.button.pink{
	background: #f87bca;
	background: -webkit-gradient(linear, left top, left bottom, from(#f87bca), to(#ec56b5));
	background: -moz-linear-gradient(top, #f87bca, #ec56b5);
	border-color: #e54aac #e54aac #cc3695;
	color: #fff;
	text-shadow: 0 1px 1px #c02589;
	-webkit-box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #f1b9dd;
	-moz-box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #f1b9dd;
	box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #f1b9dd;    
}
.button.pink:focus{
	background: #f075c3;
	background: -webkit-gradient(linear, left top, left bottom, from(#ff85d3), to(#e34dac));
	background: -moz-linear-gradient(top, #ff85d3, #e34dac);
	border-color: #c02589;
	-webkit-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #f1b9dd;
	-moz-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #f1b9dd;
	box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #f1b9dd;    
}
.button.pink:active{
	background: #f87bca;
	border-color: #c02589;
	-webkit-box-shadow: 0 1px 0 #fff, inset 0 0 5px #c02589;
	-moz-box-shadow: 0 1px 0 #fff, inset 0 0 5px #c02589;
	box-shadow: 0 1px 0 #fff, inset 0 0 5px #c02589;
}



/* ----- ---- --- -- -  Purple - -- --- ---- ----- */

.button.purple{
	background: #995dc8;
	background: -webkit-gradient(linear, left top, left bottom, from(#c785e5), to(#995dc8));
	background: -moz-linear-gradient(top, #c785e5, #995dc8);
	border-color: #7c45aa #7c45aa #5d288a;
	color: #fff;
	text-shadow: 0 1px 1px #370662;
	-webkit-box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #ce8ded;
	-moz-box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #ce8ded;
	box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #ce8ded;    
}
.button.purple:focus{
	background: #8b50ba;
	background: -webkit-gradient(linear, left top, left bottom, from(#cc8aea), to(#884eb8));
	background: -moz-linear-gradient(top, #cc8aea, #884eb8);
	border-color: #5d288a;
	-webkit-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #ce8ded;
	-moz-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #ce8ded;
	box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #ce8ded;    
}
.button.purple:active{
	background: #995dc8;
	border-color: #5d288a;
	-webkit-box-shadow: 0 1px 0 #fff, inset 0 0 5px #5d288a;
	-moz-box-shadow: 0 1px 0 #fff, inset 0 0 5px #5d288a;
	box-shadow: 0 1px 0 #fff, inset 0 0 5px #5d288a;
}



/* ----- ---- --- -- -  Grey - -- --- ---- ----- */

.button.grey{
	background: #969696;
	background: -webkit-gradient(linear, left top, left bottom, from(#ababab), to(#818181));
	background: -moz-linear-gradient(top, #ababab, #818181);
	border-color: #a0a0a0 #7c7c7c #717171;
	color: #fff;
	text-shadow: 0 1px 1px #444;
	-webkit-box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #bebebe;
	-moz-box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #bebebe;
	box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #bebebe;    
}
.button.grey:focus{
	background: #868686;
	background: -webkit-gradient(linear, left top, left bottom, from(#b0b0b0), to(#6f6f6f));
	background: -moz-linear-gradient(top, #b0b0b0, #6f6f6f);
	border-color: #666 #666 #606060;
	-webkit-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #bebebe;
	-moz-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #bebebe;
	box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #bebebe;    
}
.button.grey:active{
	background: #909090;
	border-color: #606060;
	-webkit-box-shadow: 0 1px 0 #fff, inset 0 0 5px #606060;
	-moz-box-shadow: 0 1px 0 #fff, inset 0 0 5px #606060;
	box-shadow: 0 1px 0 #fff, inset 0 0 5px #606060;
}



/* ----- ---- --- -- -  Black - -- --- ---- ----- */

.button.black{
	background: #525252;
	background: -webkit-gradient(linear, left top, left bottom, from(#5e5e5e), to(#434343));
	background: -moz-linear-gradient(top, #5e5e5e, #434343);
	border-color: #4c4c4c #313131 #1f1f1f;
	color: #fff;
	text-shadow: 0 1px 1px #2e2e2e;
	-webkit-box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #868686;
	-moz-box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #868686;
	box-shadow: 0 1px 2px #eaeaea, inset 0 1px 0 #868686;    
}
.button.black:focus{
	background: #4b4b4b;
	background: -webkit-gradient(linear, left top, left bottom, from(#686868), to(#363636));
	background: -moz-linear-gradient(top, #686868, #363636);
	border-color: #313131;
	-webkit-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #868686;
	-moz-box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #868686;
	box-shadow: 0 0 1px #d6d6d6, inset 0 1px 0 #868686;    
}
.button.black:active{
	background: #525252;
	border-color: #313131;
	-webkit-box-shadow: 0 1px 0 #fff, inset 0 0 5px #313131;
	-moz-box-shadow: 0 1px 0 #fff, inset 0 0 5px #313131;
	box-shadow: 0 1px 0 #fff, inset 0 0 5px #313131;
}
/* ----- ---- --- -- -  Pete- -- --- ---- ----- */
nav {float:right;}
article.pagina {float:left; width:800px;}
article.pagina em {font-style:normal;}
article.pagina h1, article#paginaweb h1, article#paginacursos h1 {text-align:center; margin:20px 0; color:#ff3333; font-size:18px;}
article.pagina h4 {margin:20px 0 10px;}
div.foto {float:left; width:400px;}
div.info {float:left; width:400px; padding-top:45px;}
article.pagina div.info p, article.pagina div.infocursos p, article#paginaweb p, article#paginacursos p {font-size:14px; margin-bottom:10px;}
div.info em {font-style:normal;}
div.limpia {clear:both;}
div.campos {float:left; width:300px;}
div.mensaje {float:left; width:350px;}
div.formulario {float:left; margin-left:25px;}
div.formulario p {font-size:14px;}
article#paginacursos {width:650px; margin:0 auto;}
div.infocursos {float:left; width:430px; height:200px; padding-left:20px;}
article div.infocursos:nth-child(2) {margin-bottom:20px;}
div.infocursos h2 {margin-top:0; color:#ff3333;}
div.fotocursos {float:left; width:200px;}
div.titular {margin-bottom:50px;}
article#paginaweb {width:650px; margin:0 auto;}
article#paginaweb h2 {text-align:center; margin-top:30px; margin-bottom:25px; color:#ff3333;}
div#centra {width:800px; margin:0 auto;}
article#acercade {width:650px; margin:0 auto;} 
div.compartir {margin:0 auto; width:300px;}

@media only screen and (min-width: 768px) and (max-width: 959px)  {
article#paginacursos {width:300px;}
article.pagina {width:300px; float:left;}
div.info {width:300px; float:left;}
}
@media only screen and (max-width: 767px) {	
article#paginacursos {width:500px;}
article#paginaweb {width:400px; padding:10px;} 
article.pagina {width:300px; float:left;}
div.info {width:300px; float:left;}
}