body{
	font-family:'Cantarell', sans-serif;
	font-size:12px;
	color:#000;
	text-align:center;
	background:#f7eed4;
	margin:0;
	padding:0;
}
a img{
border:0;
}
a{color:#1e6fa1}
a:hover,
a:active,
a:visited{text-decoration:none;}
h1,h2,h3,h4,h5,h6{
font-weight:normal;
letter-spacing:0.9px;
margin:0;
padding:0;
}
h2{
	line-height:1.4em;
}
blockquote,
pre{
margin:0;
background:#fffaec;
border:1px solid #ccc;
padding:7px;
font-family:'Cantarell', sans-serif;
}
#container, 
#nav, 
#inner-footer{
	width:940px;
}
#container{
	margin:auto;
	text-align:left;
}
.left{
float:left;
}
.right{
float:right;
}
/*-----------------------------
       Header Styles
-----------------------------*/
#header{
	width:100%;
	height:50px;
	background:#247aaf;
border-bottom:2px solid #ccc;
}
#nav{
	list-style:none;
	font-size:150%;
	margin:auto;
	padding:0;
	position:relative;
text-align:right;
}
#nav li{
	display:inline;
	padding:0 30px;
position:relative;
top:-5px;
}
/*
#nav li:nth-child(1){
	padding-left:0;
}
*/
#nav li:nth-child(6){
	padding-right:0;
}
#nav>li>a{
	color:#f7eed4;
	text-decoration:none;
text-shadow:0px 1px 1px #333;
}
#nav>li>a:hover{
	color:#FFC000;
}
#nav li#logo{
	font-size:180%;
	padding:0 60px 0 0;
top:0;
left:-120px;
}
#nav li#logo a{
}
#nav li#slider{
width:40px;
height:0px;
border:2px solid #ffc000;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
float:left;
position:relative;
top:-7px;
padding:0;
margin:0;
z-index:1;
display:none;
}

/* Subnav */
#nav li ul{
width:70%;
position:absolute;
top:23px;
left:17px;
font-size:70%;
background:#0a82ca;
padding:5px 5px 0 5px;
border:1px solid #0b486d;
z-index:2;
line-height:25px;
text-align:center;
-moz-border-radius-bottomleft:5px;
-webkit-border-bottom-left-radius:5px;
-moz-border-radius-bottomright:5px;
-webkit-border-bottom-right-radius:5px;
display:none;
}
#nav li ul li{
padding:0;
margin:0px 10px;
display:block;
}
#nav li ul li a{
color:#fff;
text-decoration:none;
display:block;
text-shadow:0px 1px 1px #333;
}
#nav li ul li a:hover{
color:#FFC000;
}

/*-----------------------------
       Main Styles
-----------------------------*/
#main{
	width:100%;
	background:#f7eed4;
float:left;
padding: 30px 0;
border-top:1p
}
.portfolio-box{
	width:900px;
	border:8px solid #1e6fa1;
	background:#1e6fa1;
position:relative;
overflow:hidden;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
box-shadow: rgba(0,0,0, 1) 0px 0px 8px;
-moz-box-shadow: rgba(0,0,0, 1) 0px 0px 4px;
-webkit-box-shadow: rgba(0,0,0, 1) 0px 0px 8px;
}
.portfolio-box .info{
width:30%;
height:99%;
background:#1e6fa1;
position:absolute;
bottom:0px;
left:-300px;
margin:0;
padding:10px;
color:#fff;
font-size:120%;
}
.portfolio-box .info p{
margin:0;
}
.portfolio-box h2{
margin:6px 0 6px 0;
padding:0;
font-size:130%;
line-height:110%;
}
.portfolio-box .info ul{
width:200px;
padding:0;
margin-left:13px;
margin-top:8px;
}
.portfolio-box .info li{

}


#left{
width:60%;
font-size:110%;
letter-spacing:0.3px;
line-height:145%;
float:left;
}
#left h1{
line-height:1em;
}
#left p{
	margin-top:4px;
}
#left .content-box{
margin-bottom:40px;
}
#left img{
border:1px solid #ccc;
margin-right:10px;
}
#share-links{
	list-style:none;
	padding:0;
}
#share-links li:nth-child(1){
	float:left;
}
#share-links li:nth-child(2){
	float:right;
}
#right{
width:32%;
float:right;
}
#right img{
float:right;
border:6px solid #1e6fa1;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
}
#right .caption{
float:right;
width:100%;
margin-top:3px;
}

/*-----------------------------
       Footer Styles
-----------------------------*/
#footer{
	width:100%;
	clear:both;
	background:#247aaf;
text-align:left;
float:left;
padding:0 0 10px 0;
border-top:2px solid #ccc;
color:#f7eed4;
}
#footer h3{
font-size:150%;
margin:10px 0 5px 0;
}
#footer #inner-footer{
margin:auto;
}
#footer #social-media{
width:300px;
float:left;
}
#footer #social-media ul{
list-style:none;
margin:0;
padding:0;
line-height:50px;
}
#footer #social-media li{
display:inline;
}
#footer #social-media li:hover{
background: transparent url(http://127.0.0.1/portfolioCMS/views/images/glow.png) no-repeat 3px 15px;
padding:35px 0;
}


#footer #social-media a{
padding:23px 10px;
background:transparent url(http://www.levijackson.net/views/images/social-media-sprite.png) no-repeat top left;
display:block;
width:50px;
height:30px;
float:left;
text-indent:-9999em;
}
#footer #social-media a span{

}
#footer #social-media #facebook-lnk{
background-position:0 0;
}
#footer #social-media #twitter-lnk{
background-position:-68px 0px;
}
#footer #social-media #reddit-lnk{
background-position:-137px 0px;
}
#footer #social-media #rss-lnk{
background-position:-205px 0px;
}
#footer #social-media #google-lnk{
background-position:0px -80px;
}
#footer #social-media #linkedin-lnk{
background-position:-68px -80px;
}

#contact-form,
#contact-form-page{
width:350px;
float:right;
}

#contact-form-page{
float:left;
}
#contact-form form,
#contact-form-page form{
margin-top:-15px;
}
#contact-form label,
#contact-form-page label{
position:relative;
top:23px;
left:5px;
color:#333;
font-size:120%;
}
#contact-form input,
select,
#contact-form-page input{
display:block;
}
input,
textarea,
select{
width:225px;
padding:4px;
background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
border:2px solid #ccc;
}
#contact-form textarea,
#contact-form-page textarea{
width:350px;
margin-bottom:0;
}
#contact-form #comments{
	display:none;
}
#footer .copyright{
clear:both;
font-size:120%;
}

/*-----------------------------
       General Styles
-----------------------------*/
.button {
	display: inline-block;
	zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
	*display: inline;
	vertical-align: baseline;
	margin: 0 2px;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font: 14px/100% Arial, Helvetica, sans-serif;
	padding: .5em 2em .55em;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: .5em; 
	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.button:hover {
	text-decoration: none;
}
.button:active {
	position: relative;
	top: 1px;
}
.bigrounded {
	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;
}
.medium {
	font-size: 12px;
	padding: .4em 1.5em .42em;
}
.small {
	font-size: 11px;
	padding: .2em 1em .275em;
}

/* orange */
.orange {
	color: #fff;
	border: solid 1px #da7c0c;
	background: #ffc000;
	background: -webkit-gradient(linear, left top, left bottom, from(#ffc000), to(#eab000));
	background: -moz-linear-gradient(top,  #ffc000,  #eab000);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffc000', endColorstr='#eab000');
}
.orange:hover {
	background: #f47c20;
	background: -webkit-gradient(linear, left top, left bottom, from(#ffc000), to(#ffa200));
	background: -moz-linear-gradient(top,  #ffc000,  #ffa200);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffc000', endColorstr='#ffa200');
}

/* blue */
.blue{
	color: #fef4e9;
	border: solid 1px #ccc;
	background: #ffc000;
	background: -webkit-gradient(linear, left top, left bottom, from(#3a7984), to(#1e6fa1));
	background: -moz-linear-gradient(top,  #3a7984,  #1e6fa1);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#3a7984', endColorstr='#1e6fa1');
}
.blue:hover {
	background: #f47c20;
	background: -webkit-gradient(linear, left top, left bottom, from(#3096a9), to(#1e6fa1));
	background: -moz-linear-gradient(top,  #3096a9,  #1e6fa1);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#3096a9', endColorstr='#1e6fa1');
}

/* black */
.black {
	color: #d7d7d7;
	border: solid 1px #333;
	background: #333;
	background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#000));
	background: -moz-linear-gradient(top,  #666,  #000);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#000000');
}
.black:hover {
	background: #000;
	background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#000));
	background: -moz-linear-gradient(top,  #444,  #000);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#000000');
}

/* gray */
.gray {
	color: #444;
	border: solid 1px #555;
	background: #6e6e6e;
	background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#b6b6b6));
	background: -moz-linear-gradient(top,  #eee,  #b6b6b6);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#EEEEEE', endColorstr='#b6b6b6');
}
.gray:hover {
	background: #616161;
	background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#979797));
	background: -moz-linear-gradient(top,  #eee,  #979797);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#EEEEEE', endColorstr='#979797');
}

/* white */
.white {
	color: #606060;
	border: solid 1px #b7b7b7;
	background: #fff;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
	background: -moz-linear-gradient(top,  #fff,  #ededed);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}

.white:hover {
	background: #ededed;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
	background: -moz-linear-gradient(top,  #fff,  #dcdcdc);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
}

/* green */
.green {
	color: #e8f0de;
	border: solid 1px #538312;
	background: #64991e;
	background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
	background: -moz-linear-gradient(top,  #7db72f,  #4e7d0e);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}
.green:hover {
	background: #538018;
	background: -webkit-gradient(linear, left top, left bottom, from(#6b9d28), to(#436b0c));
	background: -moz-linear-gradient(top,  #6b9d28,  #436b0c);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');
}

/* red */
.red {
	color: #faddde;
	border: solid 1px #980c10;
	background: #d81b21;
	background: -webkit-gradient(linear, left top, left bottom, from(#ed1c24), to(#aa1317));
	background: -moz-linear-gradient(top,  #ed1c24,  #aa1317);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ed1c24', endColorstr='#aa1317');
}
.red:hover {
	background: #b61318;
	background: -webkit-gradient(linear, left top, left bottom, from(#c9151b), to(#a11115));
	background: -moz-linear-gradient(top,  #c9151b,  #a11115);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9151b', endColorstr='#a11115');
}


/* Registration Page */
#registerUser{
width:300px;
}
#registerUser input{
display:block;
margin-bottom:5px;
width:300px;
}
#registerUser input.button{
width:110px;
}
#registerUser  label{
position:relative;
top:26px;
left:5px;
color:#aaa;
font-size:120%;
}

/* Login Page */
#loginUser{
width:300px;
}
#loginUser input{
display:block;
margin-bottom:5px;
width:300px;
}
#loginUser input.button{
width:110px;
}
#loginUser label{
position:relative;
top:26px;
left:5px;
color:#aaa;
font-size:120%;
}

/* Add Page */
#pageNew{
width:600px;
}
#pageNew input,
#pageNew textarea,
#pageEdit input,
#pageEdit textarea{
display:block;
margin-bottom:5px;
width:550px;
}
#pageNew input[type=checkbox],
#pageEdit input[type=checkbox]{
width:150px;
margin-top:7px;
}
#pageNew input.button,
#pageEdit input.button{
width:110px;
}
#pageNew label,
#pageEdit label{
position:relative;
top:26px;
left:5px;
color:#aaa;
font-size:120%;
}

/* All Pages */
#pageSelect{
width:600px;
}
#pageSelect select{
display:block;
margin-bottom:5px;
width:550px;
}

#pageSelect input.button{
width:90px;
}
#pageSelect label{
color:#aaa;
font-size:120%;
}

.errors, .success{
position:absolute;
top:0;
left:0;
width:100%;
background:#eee;
color:#333;
text-align:center;
font-weight:bold;
color:#458B00;
display:none;
}
.errors{
color:#C11B17;
}

/* Web Work Pages */
.web,
.flash,
.gfx,
.project{
clear:both;
margin-bottom:20px;
position:relative;
}
.web:nth-child(odd){
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
}
.web img,
.flash img,
.gfx img,
.project img{
float:right;
margin-left:8px;
border:1px solid #ccc;
}
.web .portfolio-link,
.flash .portfolio-link,
.gfx .portfolio-link,
.project .portfolio-link{
clear:both;
float:right;
margin:10px 0 20px 0;
}
.web ul,
.flash ul,
.gfx ul,
.project ul{
margin-top:0;
padding:0;
width:350px;
}
.web ul li,
.flash ul li,
.gfx ul li,
.project ul li{
display:inline;
margin-right:20px;
}
.web ul li .bullet,
.flash ul li.bullet,
.gfx ul li.bullet,
.project ul li.bullet{
font-size:30px;
position:relative;
top:6px;
}
.web h3,
.flash h3,
.gfx h3,
.project h3{
margin:5px 0;
color:#104a6d;
font-size:140%;
}
.web h4,
.flash h4,
.gfx h4,
.project h4{
margin:10px 0 5px 0;
font-size:110%;
color:#000;
}

#left .portfolio .web,
#left .portfolio .flash,
#left .portfolio .gfx,
#left .portfolio .project{
border:0;
}

#portfolio-filter{
width:400px;
margin:0 0 -20px 0;
padding:0;
position:relative;
top:-25px;
}
#portfolio-filter li{
list-style:none;
display:inline;
margin:0;
padding:0 20px;
font-size:140%;
}
#portfolio-filter li:nth-child(1){
	padding-left:0;
}
#portfolio-filter li a{
color:#000;
}
.intro-content{
	clear:both;
	padding-top:20px;
}

/* Categories*/
#widget{
width:286px;
background:#1e6fa1;
padding:2px 6px 10px 6px;
border:2px solid #ccc;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
margin-bottom:20px;
}
#widget a{
padding:0;
text-decoration:none;
color:#f7eed4;
font-size:1.1em;
}
#widget a:hover{
color:#ffc000;
}
#widget h2{
color:#f7eed4;
}
#widget ul,
#widget li{
padding:0;
margin:0;
list-style:none;
}
#widget li{
	padding:1px 5px 0 5px;
}

#submit-email{
width:100px;
margin-top:15px;
}


/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:visible;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* 
    ColorBox example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{background:#fff;}

#colorbox{}
    #cboxContent{margin-top:32px;}
        #cboxLoadedContent{background:#000; padding:1px;}
        #cboxLoadingGraphic{background:url(../images/loading.gif) center center no-repeat;}
        #cboxLoadingOverlay{background:#000;}
        #cboxTitle{position:absolute; top:-22px; left:0; color:#000;}
        #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}
        #cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose{text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(../images/close.png) 0 0 no-repeat;}
        #cboxPrevious{background-position:0px 0px; right:44px;}
        #cboxPrevious.hover{background-position:0px -25px;}
        #cboxNext{background-position:-25px 0px; right:22px;}
        #cboxNext.hover{background-position:-25px -25px;}
        #cboxClose{width:40px;height:40px;right:0;}
        /*#cboxClose.hover{background-position:-50px -25px;}*/
#cboxOverlay{background:#222;}
        .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}
        .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
        .cboxSlideshow_on #cboxSlideshow.hover{background-position:-100px -25px;}
        .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
        .cboxSlideshow_off #cboxSlideshow.hover{background-position:-75px -25px;}	
        
        
        
#login-link{
position:absolute;
bottom:0;
left:0;
color:#247AAF;
font-size:30px;
}