/*
Theme Name: Cell Designs v4
Theme URI: http://www.cell-designs.com
Description: Portfolio Theme Exclusively for cell designs
Version: 3.0
Author: Marcell Purham
Author URI: http://www.cell-designs.com
Tags: clean, portfolio, art
*/

@import "style/css/reset.css";
@import "style/css/typography.css";
@import "style/css/layout.css";

@import url("css/reset.css");	


/*------------------code starts----------------------*/

@font-face {
    font-family: 'BebasNeueRegular';
    src: url('fonts/BebasNeue-webfont.eot');
    src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/BebasNeue-webfont.woff') format('woff'),
         url('fonts/BebasNeue-webfont.ttf') format('truetype'),
         url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

.clear {
	clear:both;
} 

body {
	font-family: 'arial';
	font-size: 1em;
	background:#000 url("images/body-bg.jpg");
	color: #525252;
	line-height:20px;
}

a{
	color: #5f0000;
	text-decoration:none;
}

a:visited {
	color: #5f0000;
	text-decoration:none;
}

a:hover {
	color: #8d0202;
	text-decoration: none;
	text-decoration:none;
}

#container {
	width: 960px;
	margin: 0 auto;
}


/*  =HEADER
-------------------------------------------------------------- */

#header .inner {
	width:960px;
	margin:0 auto;
	height:350px;
    position: relative;
}

.colors {
	background: url(images/bg-colors.png) -22px -2px no-repeat;
	width:960px;
	margin:0 auto;
	height:350px;
	padding-top: 20px;
}

#logo a {
	background: #000;
	border: 1px solid #292929;
	color: #fff;
	display:block;
	font-size: 48px;
    font-family: 'BebasNeueRegular';
	float: left;
	padding: 20px 5px;
	border-radius: 10px;
	margin-top: 11px;
}

#speech {
	color: #ececec;
	float: left;
	font-size: 72px;
	line-height: 70px;
	font-family: 'BebasNeueRegular';
}

#speech span.purple {
	color: #2c358b;
}

#speech span.pink {
	color: #ad1c59;
}

#speech span.yellow {
	color: #fff200;
}

#speech span.green {
	color: #178324;
}

#arrow {
	background: url(images/arrow-bg.png) no-repeat;
	height: 285px;
	width:451px;
	position: absolute;
	left: 280px;
	top: 63px;
}

#clone-me a {
	background:url("images/me.png");
	float:right;
	display:block;
	height:329px;
	width:176px;
	text-indent:-9999px;
}


/*  =NAVIGATION
-------------------------------------------------------------- */

.home #nav {
	margin-bottom: 0;
}

#nav {
	background: #3f3f3f; /* Old browsers */
	background: -moz-linear-gradient(top,  #3f3f3f 0%, #242424 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3f3f3f), color-stop(100%,#242424));/*Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #3f3f3f 0%,#242424 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #3f3f3f 0%,#242424 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #3f3f3f 0%,#242424 100%); /* IE10+ */
	background: linear-gradient(top,  #3f3f3f 0%,#242424 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3f3f3f', endColorstr='#242424',GradientType=0 );/*IE6-9*/
	height: 90px;
	position: relative;
	margin-bottom: 30px;
}

#nav-inside {
	background: url(images/header-bg.png);
}

#nav .inner {
	width: 960px;
	height: 90px;
	margin: 0 auto;
    position: relative;
}

#nav li {
	float: left;
}

#nav li a {
	color: #fff;
	float: right;
	font-weight: bold;
	font-size: 14px;
	display:block;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	padding: 25px 10px;
}

#nav li a:hover { 
	background: rgba(30,30,30, 0.3);
}

#nav li a .menu-description {
	color: #777;
	font-size: 10px;
	display: block;
}

#nav li a:hover .menu-description {
	color: #FFF200;
}

.menu-primary-container {
	float: right;
}

/*  =CONTENT
-------------------------------------------------------------- */

#content {
	float:right;
	width:645px;
}

#content.full {
	float:right;
	width:960px;
}

#content h1, #content h2, #content h3, #content h4 {
	margin:10px 0 10px 0;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	color: #282828;
	clear: left;
	font-weight: bold;
}
#content h2 {
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	font-weight: bold;
	line-height: 24px;
	text-transform: capitalize;
}
#content h2 span a {
	text-align:center;
}
#content h1 {
	font-size: 26px;
        line-height: 26px;
}
#content h2 {
	font-size: 24px;
}
#content h3 {
	font-size: 22px;
}
#content h4 {
	font-size: 20px;
}

#content ul, #content ol {
	font-size: 14px;
	font-family:'arial';
	color: #525252;
	margin: 0 0 10px 10px;
	padding: 10px;
}
#content ul {
	list-style-type: square;
}
#content ol {
	list-style-type: decimal;
}

#content ul li, #content ol li {
    color: #525252;
	font-size: 14px;
	line-height: 24px;
}

.menu-side-side ul {
	float: left;
	width: 275px;
}

.menu-side-side li {
	background: url(images/thumbs-up.png) no-repeat;
	padding: 0 0 10px 30px;
	list-style: none;
}

#content pre {
    color: #FFF200;
	width: 512px;
	overflow: auto;
	background: #feffde url(images/pre-bg.jpg);
	padding: 10px;
	font-size: 15px;
	line-height: 20px;
	font: 15px/150% "Myriad Pro","Calibri","Helvetica Neue",Arial,Helvetica,sans-serif;
	border-left: 1px solid grey;
}
#content blockquote {
	background: #dfdfdf url(images/blockquote.png) 10px 20px no-repeat;
    font-style: italic;
    line-height: 20px;
    padding: 20px 20px 20px 70px;
}

#content blockquote p {
	color:#000;
    font-size: 16px;
    line-height: 24px;
}

#content p {
	line-height:24px;
	color:#525252;
	margin-bottom:10px;
	font-family:'arial';
}


.post {
	margin: 0 0 15px 0;
	background:#ececec;
	padding:15px;
	overflow: hidden;
}

.page-id-5 .post {
	background: #000;
}

.page-id-5 #portfolio h2 {
	color: #fff;
}

.post img {
    background-color: #E1E1E1;
    border: 1px solid #D0D0D0;
	display: block;
	padding: 3px;
	float:left;
	margin-bottom:5px;
}

.post-info {
	margin:10px 0 10px 0;
}

.post-more a {
	background: #3f3f3f; /* Old browsers */
	background: -moz-linear-gradient(top,  #3f3f3f 0%, #242424 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3f3f3f), color-stop(100%,#242424));/*Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #3f3f3f 0%,#242424 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #3f3f3f 0%,#242424 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #3f3f3f 0%,#242424 100%); /* IE10+ */
	background: linear-gradient(top,  #3f3f3f 0%,#242424 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3f3f3f', endColorstr='#242424',GradientType=0 );/*IE6-9*/
	color: #979797;
    display: block;
    padding: 5px 10px;
    text-align: center;
	text-transform: uppercase;
}

.post-more a:hover{
	background: #3f3f3f; /* Old browsers */
	background: -moz-linear-gradient(top,  #242424 0%, #3f3f3f 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3f3f3f), color-stop(100%,#242424));/*Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #242424 0%,#3f3f3f 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #242424 0%,#3f3f3f 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #242424 0%,#3f3f3f 100%); /* IE10+ */
	background: linear-gradient(top,  #242424 0%,#3f3f3f 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#242424', endColorstr='#3f3f3f',GradientType=0 );/*IE6-9*/
	color: #fff;
}

.post p {
	text-align:left;
	font-size:14px;
}

.post h2 a{
	font-size:24px;
	color:#282828;
	text-align:center;
	letter-spacing: -1px;
}


/*  =SIDEBAR
-------------------------------------------------------------- */

#sidebar {
	float:left;
	width:270px;
	background:#000;
	padding:15px;
}

.widget {
	margin-bottom:10px;
	clear:both;
}

.widget-title {
	background: url(images/arrow-sidebar-bg.png) no-repeat left center;
	color: #fff;
    font-family: 'BebasNeueRegular';
	display:block;
	padding: 2px 0 0 25px;
}

.widget li {
	padding-bottom:10px;
}

.widget-title-bottom {
	background: #fff200 url("images/stripe-bg.png");
	height:20px;
	display:block;
	width: 270px;
	margin: 10px 0;
}

#latest img {
	border:5px solid grey;
}

#fav {
	background:url("images/cell-main.png");
	background-position:400px -175px;
	height:80px;
	text-indent:-9999px;
	display:block;
}

#flickr {
	background:url("images/cell-main.png");
	background-position:410px -350px;
	height:80px;
	text-indent:-9999px;
	display:block;
}

/*  =FOOTER
-------------------------------------------------------------- */

#footer {
	width:930px;
	margin:0 auto;
	padding:15px;
	font-size:14px;
}

#footer a {
	color:#747474;
}

#footer a:hover {
	color:#5f0000;
}

.top {
	height:23px;
    background: #FFF200 url("images/stripe-bg.png");
	text-indent:10px;
	margin: 30px 0;
}

.top p {
	color:#000;
	text-transform: capitalize;
	padding-top:3px;
	font-size: 10px;
}

.box-item {
	float:left;
}

.box-item li {
	text-indent:15px;
}

#box1 {
	width:270px;
}

#box2 {
	width:310px;
}

#box2 li {
	display:block;
	padding:15px 15px 15px 20px;
	text-indent:0;
	font-size:14px;
}

#box3 {
	width:340px;
}

#fav-site,
#twit_date,
#where,
#per-pro  {
	background: url(images/arrow-sidebar-bg.png) no-repeat left center;
	color: #fff;
    font-family: 'BebasNeueRegular';
    font-size: 36px;
	display:block;
	padding: 2px 0 0 25px;
	margin-bottom: 15px;
}

#per-pro {
	margin-top: 15px;
}

.sidebreak {
	background: url("images/bg.png");
}

#footer span.top {
	background: #000;
	margin-left: 48em;
	padding-right:10px;
}

span.top a:hover {
	color:#fff;
}

.xoxo {
	width:300px;
}

.xoxo img {
	border: 3px solid;
	background:#353535;
	padding:5px;
}

.flickrwidget_text img {
	border:none;
	background:none;
}

img.alignleft, 
div.alignleft {
	float:left;
	margin:0 0.5em 0.5em 0;
}

img.alignright, 
div.alignright {
	float:right;
	margin:0 0 0.5em 0.5em;
}

img.aligncenter, 
div.aligncenter{
	text-align:center;
	margin:0 auto;
}

#content img.alignleft, 
#content img.alignright, 
#content img.aligncenter {
    background-color: #E1E1E1;
    border: 1px solid #D0D0D0;
	display: block;
	padding: 3px;
	margin-bottom:10px;
}

.wp-caption {
	border: 1px solid #ddd;
	text-align: center;
	background-color: #f3f3f3;
	padding-top: 4px;
	margin: 10px;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}

.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
}

.wp-caption p.wp-caption-text {
	font-size: 11px;
	line-height: 17px;
	padding: 0 4px 5px;
	margin: 0;
}

.wp-caption {
	background:none repeat scroll 0 0 #F1F1F1;
	line-height:18px;
	margin-bottom:20px;
	max-width:632px !important;
	padding:4px;
	text-align:center;
}


/* =Comments
-------------------------------------------------------------- */
#comments {
	clear: both;
}

#comments .navigation {
	padding: 0 0 18px 0;
}
h3#comments-title,
h3#reply-title {
	color: #000;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 0;
}
h3#comments-title {
	padding: 24px 0;
}
.commentlist {
	list-style: none;
	margin: 0;
}
.comments li {
	list-style:none;
}

.commentlist li.comment {
	border-bottom: 1px solid #e7e7e7;
	line-height: 24px;
	margin: 0 0 24px 0;
	padding: 0 0 0 56px;
	position: relative;
}
.commentlist li:last-child {
	border-bottom: none;
	margin-bottom: 0;
}
#comments .comment-body ul,
#comments .comment-body ol {
	margin-bottom: 18px;
}
#comments .comment-body p:last-child {
	margin-bottom: 6px;
}
#comments .comment-body blockquote p:last-child {
	margin-bottom: 24px;
}
.commentlist ol {
	list-style: decimal;
}
.commentlist .avatar {
	position: absolute;
	top: 4px;
	left: 0;
}
.comment-author {
}
.comment-author cite {
	color: #000;
	font-style: normal;
	font-weight: bold;
}
.comment-author .says {
	font-style: italic;
}
.comment-meta {
	font-size: 12px;
	margin: 0 0 18px 0;
	text-indent:10px;
}
.comment-meta a:link,
.comment-meta a:visited {
	color: #888;
	text-decoration: none;
}
.comment-meta a:active,
.comment-meta a:hover {
	color: #ff4b33;
}
.commentlist .even {
}
.commentlist .bypostauthor {
}
.reply {
	font-size: 12px;
	padding: 0 0 24px 0;
}
.reply a,
a.comment-edit-link {
	color: #888;
}
.reply a:hover,
a.comment-edit-link:hover {
	color: #ff4b33;
}
.commentlist .children {
	list-style: none;
	margin: 0;
}
.commentlist .children li {
	border: none;
	margin: 0;
}
.nopassword,
.nocomments {
	display: none;
}
#comments .pingback {
	border-bottom: 1px solid #e7e7e7;
	margin-bottom: 18px;
	padding-bottom: 18px;
}
.commentlist li.comment+li.pingback {
	margin-top: -6px;
}
#comments .pingback p {
	color: #888;
	display: block;
	font-size: 12px;
	line-height: 18px;
	margin: 0;
}
#comments .pingback .url {
	font-size: 13px;
	font-style: italic;
}

/* Comments form */
input[type=submit] {
	color: #333;
}
#respond {
	border-top: 1px solid #e7e7e7;
	margin: 24px 0;
	overflow: hidden;
	position: relative;
}
#respond p {
	margin: 0;
}
#respond .comment-notes {
	margin-bottom: 1em;
}
.form-allowed-tags {
	line-height: 1em;
}
.children #respond {
	margin: 0 48px 0 0;
}
h3#reply-title {
	margin: 18px 0;
}
#comments-list #respond {
	margin: 0 0 18px 0;
}
#comments-list ul #respond {
	margin: 0;
}
#cancel-comment-reply-link {
	font-size: 12px;
	font-weight: normal;
	line-height: 18px;
}
#respond .required {
	color: #ff4b33;
	font-weight: bold;
}
#respond label {
	color: #888;
	font-size: 12px;
}
#respond input {
	margin: 0 0 9px;
	width: 98%;
}
#respond textarea {
	width: 98%;
}
#respond .form-allowed-tags {
	color: #888;
	font-size: 12px;
	line-height: 18px;
}
#respond .form-allowed-tags code {
	font-size: 11px;
}
#respond .form-submit {
	margin: 12px 0;
}
#respond .form-submit input {
	font-size: 14px;
	width: auto;
}

cite.fn {
	margin-left:10px;
}
#latest{
	list-style-type:none;
}

#cm_get_your_own {
	display:none;
}

.item{
	float: left;
	margin: 5px;
	width: 300px;
}
.item h2 {
	color: #fff;
	font-size: 20px;
}
.item p { 
	text-align: left; 
	font-size: 12px; 
}
.item p a{ 
	text-align: left; 
	font-weight: bold; 
}

.item img{
	border: 1px solid #000000; 
	background: #1a1a1a; 
	padding:10px;
}

.item img:hover {
	border: 1px solid #000000; 
	background: #333333; 
	padding:10px;
    opacity: 0.5;
    -moz-transition: opacity 1s linear;
    -webkit-transition: opacity 1s linear;
    -o-transition: color 1s ease-in;
}

.item .info {
	background: #199209;
	clear: left;
	padding: 10px;
}

/* self-clear floats */

.group:after {
	content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.block_dload {
    border-bottom: 1px solid #B4B4B4;
    border-top: 1px solid #8c8c8c;
    margin-bottom: 10px;
    width: 100%;
}
.dload, .demo {
    background: -moz-linear-gradient(center top , #EA4B4B, #B83030) repeat scroll 0 0 #92C7DA;
    background: -webkit-linear-gradient(top, #EA4B4B, #B83030); 
    border: 1px solid #b83030;
    color: #FFFFFF;
    display: block;
    float: left;
    font-size: 25px;
    font-weight: bold;
    padding: 40px;
    text-align: center;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
    width: 225px;
}
.dload:hover, .demo:hover {
    background: -moz-linear-gradient(center top , #B83030, #EA4B4B) repeat scroll 0 0 #92C7DA;
    background: -webkit-linear-gradient(top, #B83030, #EA4B4B); 
    color: #FFFFFF;
    text-decoration: none;
}
.demo {
    border-left: 1px solid #7c2121;
}

/* Contact Form */

.cform label {
	width:150px; 
	margin:4px 10px 0 0; 
	display:-moz-inline-box; /*for mozilla*/
	display:inline-block; /*for Opera & IE*/
	vertical-align:top;
}

.cform label span {
	color: #000;
	width:170px; /* must be the same as above!*/
	display:block; 
} 

.cform textarea {
	font-family: arial;
	font-size: 0.9em;
	overflow:auto;
}

.cform input,
.cform textarea,
.cform select { 
	color: #fff;
	padding:8px;
	background: #2d2d2d url(images/pre-bg.jpg); 
	border: 1px solid #11161b; 
	vertical-align:top;
}

.cform input:hover,
.cform textarea:hover,
.cform select:hover	{
	background:#5d5d5d; 
}


.cform input:focus,
.cform textarea:focus,
.cform select:focus	{ 
	background:#989898; 
	color: #000;
}

.cform textarea,
.cform input {
	width:580px; 
}

