/* 
h2 {
    font-size: 1.6875rem;
}
h3 {
    font-size: 1.375rem;
}
h4 {
    font-size: 1.125rem;
}
h5 {
    font-size: 1.125rem;
}
h6 {
    font-size: 1rem;
}
 */
/* Fluid video, widescreen aspect */
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe,
.videoWrapper object,
.videoWrapper embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.top-bar-section li:not(.has-form) a:not(.button){
	background-color:rgba(0, 0, 0, 0);
	line-height:40px;
	}
.top-bar{
	background-color:rgba(0, 0, 0, 0.7);
	line-height:40px;
	margin-bottom:1em;
	}
.elusive{
	display:inline-block;
	}
#money {
	font-size: 5em;
	width:1em;
	text-align:right;
	line-height:1;
	color:rgba(0,0,0,0.5);
	position:absolute;
	top:70px;
	right:0;
	z-index:100;
	}
.black,
.soft_edge_black
{
    color: white;
    background:black;
	background:rgba(0,0,0,.7);
}
.black a:link,
.black a:visited,
.soft_edge_black a:link,
.soft_edge_black a:visited,
 a.soft_edge_black:link,
 a.soft_edge_black:visited
{
    color: white;
}

.soft_edge_black a:hover,
.soft_edge_black a:active,
.soft_edge_black a:focus,
a.soft_edge_black:hover,
a.soft_edge_black:active,
a.soft_edge_black:focus,
.black a:hover,
.black a:active,
.black a:focus
{
    color: yellow;
}
.serif {
	font-family: "Bodoni MT", Didot, "Didot LT STD", "Hoefler Text", Garamond, "Times New Roman", serif;
	}
.black_font{
	font-family:'Arial Black','Helvetica Black','Futura Black',Impact,'Helvetica Bold','Arial Bold',Arial,Helvetica,sans-serif;
	}

.soft_edge_white{
	background:white;
	background:rgba(255,255,255,.7);
        -webkit-box-shadow: 0 0 6px #fff;
           -moz-box-shadow: 0 0 6px #fff;
                box-shadow: 0 0 6px #fff;
    }
.soft_edge_black{
	background:black;
	background:rgba(0,0,0,.7);
/*        -webkit-box-shadow: 0 0 6px #fff;
           -moz-box-shadow: 0 0 6px #fff;
                box-shadow: 0 0 6px #fff;
*/        -webkit-box-shadow: 0 0 6px #000;
           -moz-box-shadow: 0 0 6px #000;
                box-shadow: 0 0 6px #000;
    }
.error h1,
.error h2,
.error p,
.error {
	color:red;
	}
#controls_container {
	position:fixed;
	bottom:0;
	left:0;
	right:0;
	cursor:auto; 
	overflow: hidden;
	width:100%;
	}
#controls{
	margin:0 auto;
	text-align:center;
	padding:1em;
	color:white;
	}
.control{
	display:inline-block;
	margin-right:1em;
	}
form label{margin:0 .3em;}
#controls_container:hover #controls {
	display:block;
	}
.requestfullscreen {display:none;}
.fullscreen .requestfullscreen {display:inline;}
span form{ display:inline-block;}
#myCanvas, #fadeCanvas {
	position:fixed;
	top:0;
	left:0;
	overflow:hidden;
	}
#clickCanvas {
	position:fixed;
	top:0;
	left:0;
	overflow:hidden;
	}
#log {
	display:none;
	float:none;
	}
.vertical_center {
  width: 20%;
  height: 10%;
  overflow: auto;
  margin: auto;
  position: absolute;
  top: 0; left: 0; bottom: 0; right: 0;
}
#log h2 {
	display:inline;
	line-height:2em;
	padding:1em;
	vertical-align:baseline;
	color:white;
	background-color:rgba(0,0,0,0.2);
	text-transform:uppercase;
}
.fade {
	-webkit-transition: opacity 2s ease;
	transition: opacity 2s ease;
	}
.fade_quick {
	-webkit-transition: opacity 0.5s ease;
	transition: opacity 0.5s ease;
	}
/* Utility */
.transparent {
	opacity:0;
	background-color:rgba(0,0,0,0) !important;
}

.image-right {
	float:right;
	margin: .2em 0 .2em 1em;
	}
.image-left {
	float:left;
	margin: .2em 1em .2em 0;
	}
.margin-left {
	margin-left:1em;
	}
.margin-right {
	margin-right:1em;
	}
.margin-top {
	margin-top:1em;
	}
.margin-bottom {
	margin-bottom:1em;
	}
.padding-bottom {
	padding-bottom:1em;
	}
.padding-left {
	padding-left:1em;
	}
.padding-right {
	padding-right:1em;
	}
.padding-top {
	padding-top:1em;
	}

.margin-zero {
	margin:0;
 	}
.panel{
/* 
	background-color:rgba(0,0,0,0);
	border:none;
 */
	}
select {
width:auto;
}
    body {
      -moz-user-select: auto !important;
      cursor: auto !important;
    }

/* global foundicon styles */
[class*="foundicon-"] {
	color:inherit;
	}

[class*="foundicon-"]:before {
	font-size:150%;
	color:inherit;
}
nav [class*="foundicon-"] {
	color:inherit;
	}

nav [class*="foundicon-"]:before {
	font-size:150%;
	color:inherit;
}
#small-eye {
	margin-right:.5rem;
	height:40px;
	width:auto;
	float:left;
	}
.top-bar-section ul li > a {
	font-size:1rem;
	background-color:rgba(0,0,0,0);
	}
.top-bar .name h1{
	font-size:1.8rem;
	}
#settings-link {
	margin-right:1rem;
	}
#headline {
	display:none;
	}

#home #headline {
	display:block;
	}
#headline h1,
#headline p {
	text-shadow:white 0 0 6px;
	}
	
/* hide pages if js */
.js #home #web-design-content,
.js #home #videography-content,
.js #home #graphic-design-content {
	display:none;
	}
#web-design-section a, a:visited, a:active {
    color: #005C7A;
    line-height: inherit;
    text-decoration: none;
}
#web-design-section a:hover,
#web-design-section a:focus {
    color: #005C7A;
}
#web-design-content a, a:visited, a:active {
    border-bottom: 1px #005C7A dotted;
}
#web-design-content a:hover, a:focus {
    border-bottom: 1px #005C7A solid;
}
#videography-section a, a:visited, a:active {
    color: #845454;
    line-height: inherit;
    text-decoration: none;
}
#videography-section a:hover,
#videography-section a:focus {
    color: #845454;
}
#videography-content a, a:visited, a:active {
    border-bottom: 1px #845454 dotted;
}
#videography-content a:hover, a:focus {
    border-bottom: 1px #845454 solid;
}
#graphic-design-section a, a:visited, a:active {
    color: #375531;
    line-height: inherit;
    text-decoration: none;
}
#graphic-design-section a:hover,
#graphic-design-section a:focus {
    color: #375531;
}
#graphic-design-content a, a:visited, a:active  {
	border-bottom: 1px #375531 dotted;
}
#graphic-design-content a:hover, a:focus  {
	border-bottom: 1px #375531 solid;
}
#artMachine-section a {
    color: #555;
    line-height: inherit;
    text-decoration: none;
      border-bottom: 1px #845454 dotted;
	}
#artMachine-section a:hover,
#artMachine-section a:focus {
    color: #555;
}

/******************** buckart override @media styles *********************/
@media only screen and (max-width: 40em) {
	.extra-view-space {padding-bottom:100%;}
}
@media only screen and (max-width: 64.063em) {
	.contact {display:none;}
}


/*
    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;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    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:url(images/overlay.png) repeat 0 0;}
#colorbox{outline:0;}
    #cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(images/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(images/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(images/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(images/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(images/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(images/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(images/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}