/*
Theme Name: Midnight Shift Studio - Celestial
Theme URI: http://www.midnight-shift.net
Description: Celestial theme designed exclusively for Midnight Shift Studio
Author: Jeff Golenski
Version: 6.0

*/

/* -------------- Structure -------------- */


html {
	display: block;
	width: 100%;
	background: #001b43 url(images/starbg.jpg) 50% 0 no-repeat;
	margin: 0;
	padding: 0;
	text-align: center;
	font-family: Arial, Verdana, sans-serif; 
	color: #fff;
	font-size: 13pt;
}

body {
	width: 960px;
	margin: 0 auto;
	padding: 35px 0 0 0;
	text-align: left;
}

/* HTML5 tags */
header, section, footer,
aside, nav, article, figure {
	display: block;
}


header a {
	display: block;
	text-indent: -9999px;
	width: 100%;
}

header a.logo {
	height: 240px;
}

header h1 a {
	height: 40px;
}

header h2 a {
	height: 35px;
}

header h2 {
	margin: 0 0 75px 0;
}

.about, section.leftcontact, copyright {
	float: left;
	width: 430px;
	margin: 0 50px 0 0;
}

h3.welcome {
	background: transparent url(images/h3-welcome.png) 0 50% no-repeat;
}

h3.reno {
	background: transparent url(images/h3-reno.png) 0 50% no-repeat;
}

h3.touch {
	background: transparent url(images/h3-touch.png) 0 50% no-repeat;
}

section.bottom {
	width: 100%;
	background: transparent url(images/btmbg.png) 50% 100% no-repeat;
}

aside, section.bottom aside {
	float: left;
	width: 430px;
	margin: 0 0 0 50px;
}

nav {
	height: 80px;
	width: 100%;
	margin: 20px 0 35px 0;
	background: transparent url(images/connectbg.png) 0 0 no-repeat;
}

nav ul {
	width: 585px;
	list-style: none;
	float: right;
	margin: 0;
	padding: 0;
	
}

nav ul li {
	float: left;
}

nav ul li a {
	display: block;
	height: 80px;
	text-indent: -9999px;
}

nav ul li a#behance {
	width: 80px;
	background: url(images/navbg.png) 0 0 no-repeat;
}

	nav ul li a#behance:hover {
		width: 80px;
		background: url(images/navbg.png) 0 -79px no-repeat;
	}

nav ul li a#dribbble {
	width: 70px;
	background: url(images/navbg.png) -80px 0 no-repeat;
}

	nav ul li a#dribbble:hover {
		width: 70px;
		background: url(images/navbg.png) -80px -79px no-repeat;
	}

nav ul li a#twitter {
	width: 70px;
	background: url(images/navbg.png) -150px 0 no-repeat;
}

	nav ul li a#twitter:hover {
		width: 70px;
		background: url(images/navbg.png) -150px -79px no-repeat;
	}

nav ul li a#linkedin {
	width: 70px;
	background: url(images/navbg.png) -220px 0 no-repeat;
	}

	nav ul li a#linkedin:hover {
		width: 70px;
		background: url(images/navbg.png) -220px -79px no-repeat;
	}

nav ul li a#tumblr {
	width: 70px;
	background: url(images/navbg.png) -290px 0 no-repeat;
}

	nav ul li a#tumblr:hover {
		width: 70px;
		background: url(images/navbg.png) -290px -79px no-repeat;
	}

nav ul li a#facebook {
	width: 70px;
	background: url(images/navbg.png) -360px 0 no-repeat;
}

	nav ul li a#facebook:hover {
		width: 70px;
		background: url(images/navbg.png) -360px -79px no-repeat;
	}

nav ul li a#flickr {
	width: 70px;
	background: url(images/navbg.png) -430px 0 no-repeat;
}

	nav ul li a#flickr:hover {
		width: 70px;
		background: url(images/navbg.png) -430px -79px no-repeat;
	}

	nav ul li a#deviantart {
		width: 80px;
		background: url(images/navbg.png) -500px 0 no-repeat;
	}

		nav ul li a#deviantart:hover {
			width: 80px;
			background: url(images/navbg.png) -500px -79px no-repeat;
		}


		footer {
			clear: both;
			font-size: 10pt;
			color: #93b8f5;
			padding: 0 0 20px 0;	
		}

		footer a, footer a:link, footer a:active, footer a:visited {
			color: #fff;
			font-weight: bold;
		}

		footer p {
			line-height: 15pt;
		}

		.copyright {
			width: 430px;
			opacity: .6;
			filter: alpha(opacity=60);
		}

		.copyright strong {
			text-transform: uppercase;
			
		}
		

.contactform {
	text-shadow: #000 1px 1px 3px; /* X-coordinate, Y-coordinate, Blur Radius */
}
		
.contactform fieldset {
	border: none;
	margin: 0;
	padding: 0;
}

.contactform legend {
	display: none;
}

.contactform ol {
	margin: 0;
	padding: 0;
	list-style: none;
	width: 100%;
}

.contactform ol li {
	height: 35px;
	margin-bottom: 10px;
	background: transparent url(images/inputbg.png) 0 0 no-repeat;
}

.contactform ol li label {
	display: none;
}

.contactform ol li input, .contactform ol li textarea {
	background: none;
	border: none;
	width: 425px;
	padding: 0 0 0 5px;
	font-weight: bold;
	color: #c2e2f7;
	font-family: Georgia, serif;
	font-style: italic;
	font-size: 10pt;
	text-shadow: #00072b 1px 1px 4px; /* X-coordinate, Y-coordinate, Blur Radius */
}

.contactform ol li input {
	height: 35px;
}

.contactform ol li#li--7 {
	height: 108px;
	background: transparent url(images/textareabg.png) 0 0 no-repeat !important;
}

.contactform ol li textarea {	
	height: 103px;
	padding-top: 5px;
}

p.cf-sb {
	margin: 0;
	padding: 0;
	line-height: 0;
}

input.sendbutton {
	background: transparent url(images/sndbg.png) 0 0 no-repeat;
	border: none;
	font-weight: bold;
	color: #c2e2f7;
	font-family: Georgia, serif;
	font-size: 10pt;
	font-style: italic;
	text-shadow: #00072b 1px 1px 4px; /* X-coordinate, Y-coordinate, Blur Radius */
	width: 87px;
	height: 35px;
	text-align: center;
}

p.linklove {
	display: none;
}


#usermessagea {
	color: #93b8f5;
	line-height: 18pt;
}


/* -- END Structure -- */

/* -------------- Common Elements -------------- */


a, a:link, a:visited, a:active {
	color: #e4aa59;
	text-decoration: none;
}

a:hover, a:focus {
	color: #e4aa59;
	text-decoration: underline;
}

h1, h2, h3 {
	margin: 0;
	padding: 0;
	font-weight: normal;
}

h3 {
	text-indent: -9999px;
	width: 430px;
	height: 30px;
}

p {
	font-weight: normal;
	line-height: 18pt;
	text-shadow: #000 1px 1px 3px; /* X-coordinate, Y-coordinate, Blur Radius */
}

p.intro {
	font-size: 15pt;
	line-height: 20pt;
	color: #93b8f5;
	font-weight: 500;
}

.clr {
	width: 100%;
	height: 1px;
	font-size: 1px;
	clear: both;
}

#panel {
	width: 920px;
	padding: 20px;
	margin: 0;
	text-align: left;
	background: #001535;
}

#panel .content h4, #panel .content p {
	color: #c2e2f7 !important;
	font-family: Georgia, serif;
	font-style: italic;
	
}

#panel .content h4 {
	font-size: 14pt !important;
	margin: 0 0 20px 0;
	font-weight: normal;
	text-shadow: #000 1px 1px 3px; /* X-coordinate, Y-coordinate, Blur Radius */
}

#panel .content p {
	font-size: 12pt;
	margin: 20px 0 0 0;
}

.content p small {
	color: #355383;
}

ul#twocol {
	text-align: left;
  	width: 900px;
  	margin: 0 auto;
	padding: 0;
  	font-size: 9pt; 
  	
}

ul#twocol li {
  	/*line-height:14pt;*/
  	float: left;
  	/*display:inline;*/
	display: block;
	list-style: none;
  	width: 50%;
/*	border-bottom: 1px #000d20 solid; */
	padding: 3px 0;
	font-style: italic;
	color: #355383;
}


ul#twocol li a {
	color: #fff;
	display: block;
	/* width: 200px; */
	float: left; 
	margin-right: 15px;
	font-style: normal;
}


/*
Name: Sliding Login Panel with jQuery 1.3.2
Author: Jeremie Tisseau
Author URI: http://web-kreation.com/
Date: March 26, 2009
Version: 1.0

	Copyright 2009 Jeremie Tisseau
	"Sliding Login Panel with jQuery 1.3.2" is distributed under the GNU General Public License version 3:
	http://www.gnu.org/licenses/gpl-3.0.html
*/

/***** clearfix 
.clear {clear: both;height: 0;line-height: 0;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}
Hides from IE-mac 
* html .clearfix {height: 1%;}
.clearfix {display: block;}
 End hide from IE-mac *
.clearfix {height: 1%;}
.clearfix {display: block;}
*****/

/* Panel Tab/button */
.tab {
  	background: url(images/slidebtmbg.png) repeat-x 50% 0;
	height: 32px;
	position: relative;
    top: 0;
    z-index: 999;
	border-top: 1px #e3f3ff solid;
	text-align: center;
}

.tab a.open, .tab a.close {
	cursor: pointer;
	display: block;
	width: 100%;
	height: 22px;
	margin: 8px auto 0 auto;
	position: relative;
	left: -1px;
}

.tab a.open, .tab a:hover.open {
	background: url(images/animatedarrow.gif) no-repeat 50% 0;
	}

.tab a.close, .tab a:hover.close {
	background: url(images/animatedarrow.gif) no-repeat 50% 0;
	}

/* sliding panel */

#toppanel {
   /* position: absolute; */  /*Panel will overlap  content */
    position: relative;   /*Panel will "push" the content down */
    top: -40px;
    width: 100%;
    z-index: 999;
    text-align: center;
    margin: 0 auto 25px auto;
	border-top: 1px #4a7397 solid;
}

#panel {
	height: auto;
	overflow: hidden;
	position: relative;
	z-index: 3;
	display: none;
	
}

#panel .content {
	margin: 0 auto;
	text-align: left;
}

/* .seewho {
	width: 250px;
	height: 50px;
	background: url(images/seewho.png) no-repeat 0 0;
	position: relative;
	left: 490px;
	top: -5px;
	z-index: 999;
} */

.seewho {
	width: 100%;
	height: 50px;
	background: url(images/seewho.png) no-repeat 70% 0;
	z-index: 999;
}


/* -- END Common Elements -- */



/*
Description: NextGEN Default Gallery Stylesheet
Author: Alex Rabe

*/

/* ----------- Album Styles Extend -------------*/

.ngg-albumoverview {
	margin-top: 10px;
	width: 100%;
	clear:both; 
	display:block !important;
}

.ngg-album {
    height: 100%;
    padding: 5px;
    margin-bottom: 5px;
    border: 1px solid #fff;
}

/* IE6 will ignore this , again I hate IE6 */
/* See also http://www.sitepoint.com/article/browser-specific-css-hacks */
html>body .ngg-album {
    overflow:hidden;
    padding: 5px;
    margin-bottom: 5px;
    border: 1px solid #cccccc;
} 

.ngg-album {
	overflow: hidden;
	padding: 5px;
	margin-bottom: 5px;
	border: 1px solid #cccccc;
}

.ngg-albumtitle {
	text-align: left;
 	font-weight: bold;
	margin:0px;
	padding:0px;
	font-size: 1.4em;
	margin-bottom: 10px;
}

.ngg-thumbnail {
	float: left;
	margin-right: 12px;
}

.ngg-description {
	text-align: left;

}

/* ----------- Album Styles Compact -------------*/

.ngg-album-compact {
	float:left;
	height:180px;
	padding-right:6px !important;
	margin:0px !important; 
	text-align:left;
	width:120px;	
}

.ngg-album-compactbox {
	background:transparent url(albumset.gif) no-repeat scroll 0%;
	height:86px;
	margin:0pt 0pt 6px !important;
	padding:12px 0pt 0pt 7px !important;
	width:120px;
}


.ngg-album-compactbox .Thumb {
	border:1px solid #000000;
	margin:0px !important;
	padding:0px !important;
	width:91px; 
	height:68px;
}

.ngg-album-compact h4 {
	font-size:15px;
	font-weight:bold;
	margin-bottom:0px;
	margin-top:0px;
	width:110px;
}

.ngg-album-compact p {
	font-size:11px;
	margin-top:2px;
}

/* ----------- Gallery style -------------*/

.ngg-galleryoverview {
	overflow: hidden;
	margin: 10px 0;
	width: 100%;
	clear:both; 
	display:block !important;
}

.ngg-galleryoverview .desc {
/* required for description */
   margin:0px 10px 10px 0px;
   padding:5px;
}

.ngg-gallery-thumbnail-box {
	/*float: left;*/ 
	font-size: 12pt;
	line-height: 18pt;
	padding: 00;
	text-transform: uppercase;
}

.ngg-gallery-thumbnail-box-sample1 {
	float: left; 
	font-size: 12pt;
	line-height: 18pt;
	padding: 10px 0 0 0;
   /* border: 2px #fff solid;  */  
} 

.ngg-gallery-thumbnail {
	float: left;
	margin-right: 5px;
	text-align: center;
}


.ngg-thumbnail img, .ngg-gallery-thumbnail img {
	background: url(images/thumbsbg.png) 50% 50% no-repeat !important;
	border: none !important;
	margin:4px 0px 4px 5px;
	padding: 6px !important;
	position:relative;
}

.ngg-thumbnail img:hover, .ngg-gallery-thumbnail img:hover {
	background: url(images/thumbsbghover.png) 50% 50% no-repeat !important;
	border: none !important;
}

.ngg-gallery-thumbnail span {
	/* Images description */
	font-size: 90%;
	padding-left:5px;
	display:block;
	
}

.ngg-clear {
	clear: both;
}

/* ----------- Gallery navigation -------------*/

.ngg-navigation {
	font-size: 10pt !important;
	clear: both !important;
	display: block !important;
	padding:15px 0;
	
}
/*
.ngg-navigation span {    
	font-weight:bold;
	padding: 6px !important;
	display: block;
	float: left;
	font-size: 10pt !important;
	background: url(images/thumbsbg.png) 50% 50% no-repeat !important;
	margin-right:3px; 
	border: none !important;
	
}
*/
.ngg-navigation span,
.ngg-navigation a.page-numbers, 
.ngg-navigation a.next,
.ngg-navigation a.prev, 
.ngg-navigation span.page-numbers,
.ngg-navigation span.next,
.ngg-navigation span.prev,
.ngg-navigation a.page-numbers:hover,
.ngg-navigation a.next:hover,
.ngg-navigation a.prev:hover, 
.ngg-navigation span.page-numbers:hover,
.ngg-navigation span.next:hover,
.ngg-navigation span.prev:hover {
	font-size: 10pt !important;
	margin-right: 3px !important;
	padding: 12px !important;
	background: url(images/thumbsbg.png) 50% 50% no-repeat !important;
	display: block !important;
	float: left !important;
	border: none !important;	
}



/*
.ngg-navigation a.page-numbers:hover,
.ngg-navigation a.next:hover,
.ngg-navigation a.prev:hover, 
.ngg-navigation span.page-numbers:hover,
.ngg-navigation span.next:hover,
.ngg-navigation span.prev:hover {
	background: url(images/thumbsbghover.png) 50% 50% no-repeat !important;
	color: #FFFFFF !important;
	text-decoration: none !important;
	border: none !important;
	padding:6px !important;
	display: block;
}
*/

/* ----------- Image browser style -------------*/

.ngg-imagebrowser {
	
}

.ngg-imagebrowser h3 {
	text-align:center;
}

.ngg-imagebrowser img {
	border:1px solid #A9A9A9;
	margin-top: 10px; 
	margin-bottom: 10px; 
	width: 100%;
	display:block !important;
	padding:5px;
}

.ngg-imagebrowser-nav {
	padding:5px;
	margin-left:10px;	
}

.ngg-imagebrowser-nav .back {
	float:left;
	border:1px solid #DDDDDD;
	margin-right:3px;
	padding:3px 7px;
}

.ngg-imagebrowser-nav .next {
	float:right;
	border:1px solid #DDDDDD;
	margin-right:3px;
	padding:3px 7px;
}

.ngg-imagebrowser-nav .counter {
	text-align:center;
	font-size:0.9em !important;
}

.exif-data {
  	margin-left: auto !important;
    margin-right: auto !important;	
}

/* ----------- Slideshow -------------*/
.slideshow {
	margin-left: auto; 
	margin-right: auto;
	text-align:center;
	outline: none;	
}

.slideshowlink {
	
}

/* ----------- Single picture -------------*/
.ngg-singlepic {
	background-color:#FFFFFF;
	display:block;  
	padding:4px;
}

.ngg-left {
	float: left;
	margin-right:10px;
}

.ngg-right {
	float: right;
	margin-left:10px;
}

.ngg-center {
  	margin-left: auto !important;
    margin-right: auto !important;
}

/* ----------- Sidebar widget -------------*/
.ngg-widget,
.ngg-widget-slideshow {
	overflow: hidden;
	margin:0pt;
	padding:5px 0px 0px 0pt;
}

.ngg-widget img {
	border:2px solid #A9A9A9;
	margin:0pt 2px 2px 0px; 
	padding:1px; 
}

/* ----------- Related images -------------*/
.ngg-related-gallery {
	background:#F9F9F9;
	border:1px solid #E0E0E0;
	overflow:hidden;
	margin-bottom:1em;
	margin-top:1em;
	padding:5px;
}
.ngg-related-gallery img {
	border: 1px solid #DDDDDD;
	float: left;
	margin: 0pt 3px;
	padding: 2px;
	height: 50px;
	width:  50px;
}

.ngg-related-gallery img:hover {
	border: 1px solid #000000;
}







/*

.ngg-thumbnail img, .ngg-gallery-thumbnail img {
	background: url(images/thumbsbg.png) 50% 50% no-repeat !important;
	border: none !important;
	margin:4px 0px 4px 5px;
	padding: 6px !important;
	position:relative;
}

.ngg-thumbnail img:hover, .ngg-gallery-thumbnail img:hover {
	background: url(images/thumbsbghover.png) 50% 50% no-repeat !important;
	border: none !important;
}

.ngg-navigation {
	font-size: 10pt !important;
	clear: both !important;
	display: block !important;
	padding:15px 0;
	
}

.ngg-navigation span {      current page number 
	font-weight:bold;
	padding: 6px !important;
	float: left;
	font-size: 10pt !important;
	background: url(images/thumbsbg.png) 50% 50% no-repeat !important;
	margin-right:3px; 
	border: none !important;
	
}

.ngg-navigation a.page-numbers,
.ngg-navigation a.next,
.ngg-navigation a.prev, 
.ngg-navigation span.page-numbers,
.ngg-navigation span.next,
.ngg-navigation span.prev {
	font-size: 10pt !important;
	margin-right: 3px;
	padding:6px !important;
	background: url(images/thumbsbg.png) 50% 50% no-repeat !important;
	display: block;
	float: left;
	border: none !important;
	
}

.ngg-navigation a.page-numbers:hover,
.ngg-navigation a.next:hover,
.ngg-navigation a.prev:hover, 
.ngg-navigation span.page-numbers:hover,
.ngg-navigation span.next:hover,
.ngg-navigation span.prev:hover {
	background: url(images/thumbsbghover.png) 50% 50% no-repeat !important;
	color: #FFFFFF !important;
	text-decoration: none !important;
	border: none !important;
	padding:6px !important;
	
}

*/

/* TipTip CSS - Version 1.2 */

#tiptip_holder {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 99999;
}

#tiptip_holder.tip_top {
	padding-bottom: 5px;
}

#tiptip_holder.tip_bottom {
	padding-top: 5px;
}

#tiptip_holder.tip_right {
	padding-left: 5px;
}

#tiptip_holder.tip_left {
	padding-right: 5px;
}

#tiptip_content {
	font-size: 11pt;
	line-height: 18pt;
	color: #fff;
	text-shadow: 0 0 2px #000;
	padding: 10px;
	border: 1px solid rgba(128,166,200,0.25);
	background-color: rgb(0,14,36);
	background-color: rgba(0,14,36,0.92);
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#000e24), to(#000e24));
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	box-shadow: 0 0 3px #000;
	-webkit-box-shadow: 0 0 3px #000;
	-moz-box-shadow: 0 0 3px #000;
}

#tiptip_arrow, #tiptip_arrow_inner {
	position: absolute;
	border-color: transparent;
	border-style: solid;
	border-width: 6px;
	height: 0;
	width: 0;
}

#tiptip_holder.tip_top #tiptip_arrow {
	border-top-color: #fff;
	border-top-color: rgba(32,53,78,0.35);
}

#tiptip_holder.tip_bottom #tiptip_arrow {
	border-bottom-color: #fff;
	border-bottom-color: rgba(32,53,78,0.35);
}

#tiptip_holder.tip_right #tiptip_arrow {
	border-right-color: #fff;
	border-right-color: rgba(32,53,78,0.35);
}

#tiptip_holder.tip_left #tiptip_arrow {
	border-left-color: #fff;
	border-left-color: rgba(32,53,78,0.35);
}

#tiptip_holder.tip_top #tiptip_arrow_inner {
	margin-top: -7px;
	margin-left: -6px;
	border-top-color: rgb(0,14,36);
	border-top-color: rgba(0,14,36,0.92);
}

#tiptip_holder.tip_bottom #tiptip_arrow_inner {
	margin-top: -5px;
	margin-left: -6px;
	border-bottom-color: rgb(0,14,36);
	border-bottom-color: rgba(0,14,36,0.92);
}

#tiptip_holder.tip_right #tiptip_arrow_inner {
	margin-top: -6px;
	margin-left: -5px;
	border-right-color: rgb(0,14,36);
	border-right-color: rgba(0,14,36,0.92);
}

#tiptip_holder.tip_left #tiptip_arrow_inner {
	margin-top: -6px;
	margin-left: -7px;
	border-left-color: rgb(0,14,36);
	border-left-color: rgba(0,14,36,0.92);
}

/* Webkit Hacks  */
@media screen and (-webkit-min-device-pixel-ratio:0) {	
	#tiptip_content {
		padding: 10px;
		background-color: rgba(128,166,200,0.25);
	}
	#tiptip_holder.tip_bottom #tiptip_arrow_inner { 
		border-bottom-color: rgba(0,14,36,0.88);
	}
	#tiptip_holder.tip_top #tiptip_arrow_inner { 
		border-top-color: rgba(0,14,36,0.92);
	}
}