/*
Theme Name: OMFGCO
Theme URI: http://www.omfgco.com
Description: More like the first one.
Version: 3.0
Author: Mathew Foster
Author URI: http://www.omfgco.com/
*/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0; padding:0;} 
table { border-collapse:collapse; border-spacing:0; } 
fieldset,img {  border:0; } 
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; } 
ol,ul { list-style:none; } 
caption,th { text-align:left; } 
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; } 
q:before,q:after { content:''; } 
abbr,acronym {border:0; }
a,img {text-decoration: none;outline:#FFF;}
strong, b {font-weight:bold;}
em, i {font-style:italic;}
div.break, div.clear, div.clearer {	display:block; clear:both; height:1px;}

/* GLOBAL */

body {
	background:#FFF;
	color:#444;
	font-family:Helvetica, Arial, sans-serif;
	font-size:11px;
	line-height:180%;
	text-align: center;
}

a:link, a:visited {
	color:#000;
}

a:hover {
	color:#888;
}

#container, #header, #content, #footer {
	position:relative;
	text-align: center;
}


/* HEADER */

#header h40 {
	background:url('images/jc_logo.jpgg') no-repeat;
	height:115px;
	margin:30px auto 0px auto;
	width:174px;
}




#header ul {
	font-family:"proxima-nova-1","proxima-nova-2",Helvetica, Arial,sans-serif;
	font-size:11px;
	letter-spacing:1px;
	margin:-2px auto 5px auto;
	position: relative;
	text-transform: uppercase;
	width:251px;
}

#header ul li {
	display:inline;
	font-weight:bold;
	margin:0 -2px;
}

#header ul li a {
	background:#FFF;
	color:#999;
	padding:3px 6px;
}

#header ul li a:hover {
	color:#111;
}


	

/* SIDEBAR */

#sidebar {
	left:0;
	position:absolute;
	top:55px;
	width:180px;
	height:200px;
	z-index:4;
}

#sidebar #accordion {
	height:225px;
	padding-left:30px;
	padding-top: 14px;
	text-align: left;
}

#sidebar #noaccordion {
	height:200px;
	padding-left:30px;
	padding-top: 14px;
	text-align: left;
}
#sidebar #accordion a.heading {
	border-bottom:1px dotted #ffa700; 
	color:#61b497;
	display:block;
	font-family:Helvetica, Arial,sans-serif;
	font-size:13px;
	font-weight:bold;
	letter-spacing:1px;
	margin-bottom:8px;
	padding-bottom:3px;
	text-transform: uppercase;
}

#sidebar #accordion ul li {
	font-size:11px;
	font-family:Helvetica, Arial,sans-serif;
	font-weight:bold;
	letter-spacing:1px;
	line-height:120%;
	margin:0 0 8px 0;
	text-transform: uppercase;
}

#sidebar #accordion ul li a {
	color:#555;
	font-size:10px;
	font-weight:normal;
	padding:2px 4px 2px 0;
	text-transform: capitalize;
}

#sidebar #accordion ul a:hover {
	color:#000;
}

#sidebar #accordion a.current {
	background:url('img/active.gif')no-repeat 0 5px;
	color:#ff9300;
	margin-left:-10px;
	padding-left:10px;
}

#sidebar #openaccord {
	height:225px;
	padding-left:30px;
	padding-top: 14px;
	text-align: left;
}

#sidebar #openaccord {
	height:200px;
	padding-left:30px;
	padding-top: 14px;
	text-align: left;
}
#sidebar #openaccord a.heading {
	border-bottom:1px dotted #ffa700; 
	color:#61b497;
	display:block;
	font-family:Helvetica, Arial,sans-serif;
	font-size:13px;
	font-weight:bold;
	letter-spacing:1px;
	margin-bottom:4px;
	padding-bottom:3px;
	text-transform: uppercase;
}

#sidebar #openaccord ul li {
	font-size:11px;
	font-family:Helvetica, Arial,sans-serif;
	font-weight:bold;
	letter-spacing:1px;
	line-height:120%;
	margin:0 0 8px 0;
	text-transform: uppercase;
}

#sidebar #openaccord ul li a {
	color:#555;
	font-size:10px;
	font-weight:normal;
	padding:2px 4px 2px 0;
	text-transform: capitalize;
}

#sidebar #openaccord ul a:hover {
	color:#000;
}

#sidebar #openaccord a.current {
	background:url('img/active.gif')no-repeat 0 5px;
	color:#000;
	margin-left:-10px;
	padding-left:10px;

}


/* CONTACT */

#contact {
	left:0;
	position:absolute;
	top:565px;
	width:220px;
	height:0px;
	z-index:2;
}

#contact #tact {
	height:0px;
	padding-left:30px;
	padding-top: 14px;
	text-align: left;
	
	
}
#contact #tact a.heading {
	border-bottom:1px dotted #ffa700;
	color:#61b497;
	display:block;
	font-family:Helvetica, Arial,sans-serif;
	font-size:13px;
	font-weight:bold;
	letter-spacing:1px;
	margin-bottom:4px;
	padding-bottom:3px;
	text-transform: uppercase;
}

#contact #tact ul a:hover {
	color:#ffa700;
}

#contact #tact a.current {
	background:url('img/active.gif')no-repeat 0 5px;
	color:#000;
	margin-left:-10px;
	padding-left:10px;
}











/* SIDENAVNO */

#sidenavno {
	left:0;
	position:absolute;
	top:158px;
	width:220px;
	height:0px;
	z-index:2;
}

#sidenavno #noaccordion {
	height:0px;
	padding-left:30px;
	padding-top: 14px;
	text-align: left;
	
}

#sidenavno #noaccordion {
	height:200px;
	padding-left:30px;
	padding-top: 14px;
	text-align: left;
}
#sidenavno #noaccordion a.heading {
	border-bottom:1px dotted #ffa700;
	color:#61b497;
	display:block;
	font-family:Helvetica, Arial,sans-serif;
	font-size:13px;
	font-weight:bold;
	letter-spacing:1px;
	margin-bottom:4px;
	padding-bottom:3px;
	text-transform: uppercase;
}

#sidenavno #noaccordion ul li {
	font-size:11px;
	font-family:Helvetica, Arial,sans-serif;
	font-weight:bold;
	letter-spacing:1px;
	line-height:120%;
	margin:0 0 8px 0;
	text-transform: uppercase;
}

#sidenavno #noaccordion ul li a {
	color:#555;
	font-size:10px;
	font-weight:normal;
	padding:2px 4px 2px 0;
	text-transform: capitalize;
}

#sidenavno #noaccordion ul a:hover {
	color:#000;
}

#sidenavno #noaccordion a.current {
	background:url('img/active.gif')no-repeat 0 5px;
	color:#000;
	margin-left:-10px;
	padding-left:10px;
}


/* SIDENAVNO2 */

#sidenavno2 {
	left:0;
	position:absolute;
	top:185px;
	width:200px;
	height:0px;
	z-index:3;
}

#sidenavno2 #noaccordion {
	height:0px;
	padding-left:30px;
	padding-top: 14px;
	text-align: left;
	
}

#sidenavno2 #noaccordion {
	height:200px;
	padding-left:30px;
	padding-top: 14px;
	text-align: left;
}
#sidenavno2 #noaccordion a.heading {
	border-bottom:1px dotted #ffa700;
	color:#61b497;
	display:block;
	font-family:Helvetica, Arial,sans-serif;
	font-size:13px;
	font-weight:bold;
	letter-spacing:1px;
	margin-bottom:4px;
	padding-bottom:3px;
	text-transform: uppercase;
}

#sidenavno2 #noaccordion ul li {
	font-size:11px;
	font-family:Helvetica, Arial,sans-serif;
	font-weight:bold;
	letter-spacing:1px;
	line-height:120%;
	margin:0 0 8px 0;
	text-transform: uppercase;
}

#sidenavno2 #noaccordion ul li a {
	color:#555;
	font-size:10px;
	font-weight:normal;
	padding:2px 4px 2px 0;
	text-transform: capitalize;
}

#sidenavno2 #noaccordion ul a:hover {
	color:#000;
}

#sidenavno2 #noaccordion a.current {
	background:url('img/active.gif')no-repeat 0 5px;
	color:#000;
	margin-left:-10px;
	padding-left:10px;
}



/* PROJECT VIEW */

body.work #content {
	border:1px solid #FFF;
}

#work-info {
	left:20%;
	position:absolute;
	text-align: left;
	top:15px;
	z-index:5;
}

#work-info h1 {
	font-family:"proxima-nova-1","proxima-nova-2",Arial,Helvetica,sans-serif;
	font-size:14px;
	font-weight:normal;
	letter-spacing:1px;
	margin:0 0 0 -1px;
	padding-bottom:0;
	text-transform: uppercase;
	z-index:5;
}

#work-info h1 span.client {
	color:#222;
	font-size:13px;
	font-weight:bold;
	margin-right:3px;
}

#work-info h1 span a {
	color:#222;
}

/* MORE INFO */
		
#text {
	height:500px;
	width:390px;
}

#text p {
	color:#333;
	font-family:"Andale Mono", Courier, monospace;
	font-size:11px;
	margin:10px 0;
	text-align: justify;
}

#text ul {
	font-size:12px;
	list-style-type: square;
	margin:-15px 0 25px 15px;
}

#text ul li {
	margin-bottom:2px;
}

#text p a, #text ul a {
	border-bottom:1px solid #555;
	color:#222;
	margin:0 1px;
}	
#text p a:hover, #text ul a:hover {
	border-bottom:none;
	color:#000;
}	

	
/* GALLERY */

#gallery {
	height:650px;
	margin:15px 0 0 20%;
	overflow:hidden;
	position:relative;
	width:79%;
}

#gallery .whitespace {
	height:25px;
}

#gallery ul {
	height:625px;
	overflow-x:hidden;
	width:19000px;
}

#gallery ul li {
	display:inline;
	float:left;
	height:625px;
	overflow:hidden;
	width:auto;
}


#gallery ul li.image {
	height:582px !important;
	margin:0 15px 0 0;
	position:relative;
}


#gallery ul li.image img {
	height:525px !important;
	width:auto;
	border: 1px #929494 solid;
}


#gallery ul li.imgabout {
	height:525px !important;
	width:auto;
	border: 0px;
}

#gallery ul li.image .donkey {
	height:523px !important;
	width:auto;
	border: 0px;

}
#gallery ul li.image .caption {
	background:transparent;
	bottom: 26px;
	font-family: Helvetica, Arial, sans-serif
	font-size: 10px;
	font-weight: normal;
	left: 0;
	padding-right: 7px;
	position: absolute;
	right: 0;
	text-align: left;
	text-transform: none;
	width: 100%;
}

#gallery ul li.image .caption {
	color:# 333;
	padding-right:8px;
	opacity: 0.5;
	-moz-opacity: 0.5;
	filter:alpha(opacity=50);
    z-index: 5;
}

#gallery ul li.image .caption a {
	color:#FFF;
	z-index:50;
}

#gallery ul li.image .caption a:hover {
	color:yellow;
}
	
	/* YOURKEYS */	
.yourkeys {
	height:40px;
	left:94%;
	position:absolute;
	text-align: left;
	top:600px;
	width:80px;
	z-index:5;
}
	
.yourkeys #use {
	left:-48px;
	font-family:Helvetica,Arial,sans-serif;
	letter-spacing:1px;
	margin:8px 0 0 10px;
	position:absolute;
	padding:3px 0 3px 22px;
	top: 25px;
}

	
	
/* ARROWS */	
.arrows {
	height:40px;
	left:20%;
	position:absolute;
	text-align: left;
	top:600px;
	width:79%;
	z-index:5;
}

.arrows a {
	float:left;
	padding:8px 8px 8px 0;
}

.arrows a.prev {margin:0 8px 0 0}
.arrows a:hover {
	border:none !important;
	opacity: 0.5;
	-moz-opacity: 0.5;
	filter:alpha(opacity=50);
}

.arrows #arrow-help {
	color:#CCC;
	float:left;
	font-family:"Andale Mono","Courier New",monospace;
	font-size:10px;
	font-weight:normal;
	margin-top:10px;
}


/* ARROWS */
		
.arrows #posts-nav {
	border-left:1px solid #CCC;
	left:70px;
	font-family:"proxima-nova-1","proxima-nova-2",Arial,Helvetica,sans-serif;
	letter-spacing:1px;
	margin:8px 0 0 10px;
	position:absolute;
	padding:3px 0 3px 22px;
	top: 0px;
}

.arrows #posts-nav a {
	border:none;
	color:#61B497;
	float:none;
	padding:3px;
}

.arrows #posts-nav a:hover {
	color:#666;
}


/* MORE INFO */		

.arrows #posts-nav a.more-info {
	border-right:1px solid #CCC;
	color:#111;
	font-size:14px;
	height:22px;
	margin:0 10px 0 0;
	padding-right:14px;
}

.arrows #posts-nav a.more-info span {
	font-size:11px;
}

.arrows #posts-nav a.more-info:hover {
	background:#FFF;
	border-right:1px solid #CCC !important;
	color:#333;
}
	
.arrows h3 {
	color:#666;
	float:right;
	font-family:"Andale Mono","Courier New",monospace;
	font-weight:normal;
	font-size:10px;
	margin:8px 0 0 0;
	padding:0;
	text-align: right;
}

.arrows h3 a {
	color:#635d5f;
	float:none;
	padding:4px;
	text-transform: lowercase;
}

.arrows h3 a:hover {
	border:none !important;
	color:#61B497;
}

.arrows h3.copyright {
	color:#CCC;
}

	
	


/* FOOTER */


h3.copyright {
	color:#CCC;
}

#MERGE0 {
	margin: 10px 0 0 0;
	border: 1px solid #ccc;
	color: #999;
	font-size: 10px;
	font-family:"Andale Mono","American Typewriter",sans-serif;
	text-align: center;
	padding: 5px;
}
/* FONT CONTROLS */

span.amp {
	font-family:"Andale Mono","American Typewriter",sans-serif;
}
.wf-active #work-info p {
	font-size:12px;
}
.wf-active #work-info h1 {
	font-size:13px;
}
.wf-active #work-info h1 span.client {
	font-size:14px;
}
.wf-loading {visibility: hidden;}


/* ColorBox Core Style:
The following CSS is consistent between example themes and should not be altered.*/
#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;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/* User Style: 
Change the following styles to modify the appearance of ColorBox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */

#cboxOverlay{
	background:#fff;
}

#cboxLoadedContent {
	background:#FFF;
	height:525px; 
	padding:0 15px 0 0;
	opacity: 0.95;
	-moz-opacity: 0.95;
	filter:alpha(opacity=95);
}

#cboxLoadingGraphic{
	background:url('img/loading.gif') no-repeat center center;
}

#cboxLoadingOverlay{
	background:transparent;
}
   

/* iPAD ISH */

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {

	#container, #header, #content, #footer {
		margin:0 auto;
		position:relative;
		text-align: center;
		width:1024px !important;
	}
	
	#home-footer {
		background:none;
		font-size:18px;
	}
	
	#home-footer a {
		background:none;
	}
	
	#key-nav {
		display:none;
	}	
	
	#gallery,
	#gallery ul, 
	#gallery ul li,
	#gallery ul li.image,
	#gallery ul li.image img {
		height:480px !important;
	}
	
	.arrows {
		top:500px;
	}
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {

	#container, #header, #content, #footer {
		margin:0 auto;
		position:relative;
		text-align: center;
		width:1024px !important;
	}
	
	#instagrams {
		width:1024px;
	}
	
	#insta_f, #insta_j {
		 width: 331px;
	}
	
	#home-footer {
		background:none;
		font-size:18px;
	}
	
	#home-footer a {
		background:none;
	}
	
	#key-nav {
		display:none;
	}	
	
	#gallery,
	#gallery ul, 
	#gallery ul li,
	#gallery ul li.image,
	#gallery ul li.image img {
		height:480px !important;
	}
	
	.arrows {
		top:500px;
	}
}