body {
  color:#FFF;
  font-size:18px;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  margin:0px;
  padding:0px;
  overflow:hidden;
  font-family:'Lato', sans-serif;
  font-weight:400;
  cursor:default;
  background:url("images/tilingBG.jpg") repeat-x #171a20;
  -webkit-user-select:none;
  -webkit-touch-callout:none;
  -khtml-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
  overflow:hidden;
  overflow:-moz-hidden-unscrollable;
  scrollbars:none;
  scroll:no;
}
#steps {
  left:0px;
  width:0px;
  position:fixed;
  margin:0px;
  padding:0px;
  opacity:0;
  background:rgba(0,0,0,0);
  transition: all 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -o-transition: all 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -moz-transition: all 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -webkit-transition: all 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
}
#steps div {
  position:fixed;
  margin:0px;
  padding:0px;
  width:800px;
  height:760px;
  /* This controls the speed of scrolling */
  /* 250ms :: too jerky */
  /* -0.125 :: too jerky */
  /* -0.325 :: odd */
  transition: left 750ms cubic-bezier(0.250, 0.025, 0.450, 0.940), opacity 250ms cubic-bezier(0.250, -0.125, 0.450, 0.940), font-size 250ms cubic-bezier(0.250, -0.125, 0.450, 0.940);
  -o-transition: left 750ms cubic-bezier(0.250, 0.025, 0.450, 0.940), opacity 250ms cubic-bezier(0.250, -0.125, 0.450, 0.940), font-size 250ms cubic-bezier(0.250, -0.125, 0.450, 0.940);
  -moz-transition: left 750ms cubic-bezier(0.250, 0.025, 0.450, 0.940), opacity 250ms cubic-bezier(0.250, -0.125, 0.450, 0.940), font-size 250ms cubic-bezier(0.250, -0.125, 0.450, 0.940);
  -webkit-transition: left 750ms cubic-bezier(0.250, 0.025, 0.450, 0.940), opacity 250ms cubic-bezier(0.250, -0.125, 0.450, 0.940), font-size 250ms cubic-bezier(0.250, -0.125, 0.450, 0.940);
}
#steps div img {
  /*opacity:0.05;*/
  opacity:1;
  top:160px;
  position:absolute;
  /*width:400px;
  height:300px;*/
  transition: left 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -o-transition: left 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -moz-transition: left 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -webkit-transition: left 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
}
#steps div.focused {
  color:rgba(255,255,255,1);
  position:fixed;
}
#steps div.focused img {
  opacity:1;
}
#steps div.focused .number {
  text-shadow: 2px 2px 55px rgba(0,0,0,1.0);
  opacity:0;
  color:#FFF;
  font-size:40px;
  top:52px;
  position:absolute;
  text-align:center;
  /*width:800px;
  height:124px;*/
}
#steps div .number {
  opacity:0.25;
  color:#FFF;
  font-size:40px;
  top:52px;
  position:absolute;
  text-align:center;
  width:800px;
  height:124px;
  z-index:6;
}
#tilingNoise {
  position:absolute;
  width:100%;
  top:824px;
  left:0px;
  right:0px;
  bottom:0px;
  background:url("images/tilingNoise.jpg") repeat;
}
#curStep {
  display:none;
  position:absolute;
  opacity:0.5;
  color:#FFF;
  font-size:80px;
  top:12px;
  z-index:10;
}
#curStepFader {
  display:none;
  width:800px;
  height:125px;
  background:url("images/topNumberFader.png") no-repeat;
  position:absolute;
  top:0px;
  left:50%;
  margin-left:-400px;
  z-index:4;
}
#curArtistFader {
  display:none;
  width:800px;
  height:36px;
  background:url("images/fadeOutImg.png") no-repeat;
  position:absolute;
  top:124px;
  left:50%;
  margin-left:-400px;
  z-index:4;
}
#arrowPrevious {
  cursor:pointer;
  display:none;
  opacity:0.4;
  position:absolute;
  z-index:3;
  top:225px;
  left:0px;
  width:300px;
  height:300px;
  background:url("images/arrowPrevious.png") no-repeat;
  transition: opacity 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -o-transition: opacity 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -moz-transition: opacity 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -webkit-transition: opacity 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
}
#arrowPrevious:hover {
  opacity:0.65!important;
}
#arrowPrevious:active {
  opacity:0.3!important;
}
#arrowNext {
  cursor:pointer;
  display:none;
  opacity:0.4;
  position:absolute;
  z-index:3;
  top:225px;
  right:0px;
  width:300px;
  height:300px;
  background:url("images/arrowNext.png") no-repeat;
  transition: opacity 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -o-transition: opacity 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -moz-transition: opacity 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -webkit-transition: opacity 500ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
}
#arrowNext:hover {
  opacity:0.65!important;
}
#arrowNext:active {
  opacity:0.3!important;
}
/*#leftContainer
{
  position:fixed;
  overflow:hidden;
  z-index:3;
  left:0px;
  right:40%;
  top:0px;
  bottom:0px;
}
#rightContainer
{
  position:fixed;
  overflow:hidden;
  z-index:3;
  left:40%;
  right:0px;
  top:0px;
  bottom:0px;
}*/
#noiseVig
{
  display:none;
  position:absolute;
  top:160px;
  left:0px;
  right:0px;
  bottom:0px;
  width:100%;
  z-index:1;
  /*opacity:0.13;*/
  opacity:0.14;
  background-position:center top!important;
  background-repeat:repeat;
  background:url("images/noiseVig.png");
  transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -o-transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -moz-transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -webkit-transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
}
#gradLeftOuter
{
  display:block;
  position:fixed;
  top:160px!important;
  left:0px;
  bottom:0px;
  right:50%;
  z-index:1;
  pointer-events:none;
  overflow:hidden!important;
  -webkit-backface-visibility:hidden;
}
#gradLeft
{
  display:none;
  z-index:2;
  opacity:0.95;
  /*width:660px;
  width:45%;*/
  width:70%;
  height:100%;
  /*top:160px;*/
  top:0px;
  overflow:hidden!important;
  /*left:-150px;*/
  left:-0px;
  bottom:0px;
  position:absolute!important;
  /*background:rgba(255,255,255,0.5);*/
  transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -o-transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -moz-transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -webkit-transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -webkit-backface-visibility:hidden;
}
#gradRightOuter
{
  display:block;
  position:fixed;
  top:160px!important;
  left:50%;
  bottom:0px;
  right:0px;
  z-index:1;
  pointer-events:none;
  overflow:hidden!important;
  -webkit-backface-visibility:hidden;
}
#gradRight
{
  display:none;
  z-index:2;
  opacity:0.95;
  /*width:660px;
  width:45%;*/
  width:70%;
  height:100%;
  /*top:160px;*/
  top:0px;
  overflow:hidden!important;
  /*right:-150px;*/
  right:0px;
  bottom:0px;
  position:absolute!important;
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH";
  /*background:rgba(255,255,255,0.5);*/
  transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -o-transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -moz-transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -webkit-transition: opacity 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940), width 1000ms cubic-bezier(0.250, -0.275, 0.450, 0.940);
  -webkit-backface-visibility:hidden;
}
#curStep img
{
  position:relative;
  opacity:1;
  width:50px;
  height:58px;
  cursor:pointer;
}
#curStepText
{
  position:relative;
  float:right;
  opacity:1;
  margin-left:8px;
  
  /*transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  -moz-transition: all 1000ms ease-in-out;
  -webkit-transition: all 1000ms ease-in-out;*/

  /*transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -webkit-transition: all 500ms ease-in-out;*/
}

#infoBar
{
  z-index:10;
  width:600px;
  display:none;
  /*visibility:hidden;*/
  position:absolute;
  top:124px;
  /*top:125px;*/
  left:50%;
  margin-left:-300px;
  height:36px;
  background:rgba(0,0,0,0);
  /*color:rgba(255,255,255,0.4);*/
  color:rgba(255,255,255,0.25);
  /*font-size:15px;*/
  font-size:16px;
  font-weight:700;
  -webkit-user-select:text;
  -webkit-touch-callout:text;
  -khtml-user-select:text;
  -moz-user-select:text;
  -ms-user-select:text;
  user-select:text;
}

#infoBar div#name
{
  float:left;
  line-height:34px;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.15);
  transition: all 175ms ease-in-out;
  -o-transition: all 175ms ease-in-out;
  -moz-transition: all 175ms ease-in-out;
  -webkit-transition: all 175ms ease-in-out;
}

#infoBar a
{
  float:right;
  line-height:34px;
}

#subHeaders
{
  font-size:12px;
  position:absolute;
  width:600px;
  left:50%;
  margin-left:-300px;
  height:20px;
  /*top:-25px;*/
  top:-22px;
  text-transform:uppercase;
  color:rgba(255,255,255,0.15);
  /*color:rgba(255,255,255,0.12);*/
  /*background:rgba(255,255,255,0.01);*/

}
#leftHeader
{
  float:left;
  text-align:right;
  /*color:rgba(255,255,255,0.1);*/
  /*text-transform:uppercase;*/
}
#rightHeader
{
  float:right;
  text-align:right;
  /*color:rgba(255,255,255,0.1);*/
  /*text-transform:uppercase;*/
}



@-webkit-keyframes shortcutAllFadeIn {
  0%   { top:76px; margin-left:-128px; }
  100% { top:96px; margin-left:-113px; }
}
@-moz-keyframes shortcutAllFadeIn {
  0%   { top:76px; margin-left:-128px; }
  100% { top:96px; margin-left:-113px; }
}
@-o-keyframes shortcutAllFadeIn {
  0%   { top:76px; margin-left:-128px; }
  100% { top:96px; margin-left:-113px; }
}
@keyframes shortcutAllFadeIn {
  0%   { top:76px; margin-left:-128px; }
  100% { top:96px; margin-left:-113px; }
}


@-webkit-keyframes arrowLeftFadeIn {
  0%   { margin-right:30px; }
  100% { margin-right:15px; }
}
@-moz-keyframes arrowLeftFadeIn {
  0%   { margin-right:30px; }
  100% { margin-right:15px; }
}
@-o-keyframes arrowLeftFadeIn {
  0%   { margin-right:30px; }
  100% { margin-right:15px; }
}
@keyframes arrowLeftFadeIn {
  0%   { margin-right:30px; }
  100% { margin-right:15px; }
}


@-webkit-keyframes arrowRighttFadeIn {
  0%   { margin-left:30px; }
  100% { margin-left:15px; }
}
@-moz-keyframes arrowRighttFadeIn {
  0%   { margin-left:30px; }
  100% { margin-left:15px; }
}
@-o-keyframes arrowRighttFadeIn {
  0%   { margin-left:30px; }
  100% { margin-left:15px; }
}
@keyframes arrowRighttFadeIn {
  0%   { margin-left:30px; }
  100% { margin-left:15px; }
}


#shortcuts
{
  opacity:1;
  z-index:9;
  width:260px;
  /*display:none;*/
  position:absolute;
  /*top:773px;*/
  /*top:853px;*/
  /*top:750px;*/
  /*top:96px;*/
  top:76px;
  left:50%;
  margin-left:-130px;
  height:36px;
  font-size:16px;
  font-weight:700;
  text-align:center;
  -webkit-user-select:text;
  -webkit-touch-callout:text;
  -khtml-user-select:text;
  -moz-user-select:text;
  -ms-user-select:text;
  user-select:text;
  color:rgba(255,255,255,0.25);
  /*transition: opacity 100ms ease-in-out;
  -o-transition: opacity 100ms ease-in-out;
  -moz-transition: opacity 100ms ease-in-out;
  -webkit-transition: opacity 100ms ease-in-out;*/
  -webkit-animation: shortcutAllFadeIn 0.75s ease-in-out forwards; /* Safari 4+ */
  -moz-animation:    shortcutAllFadeIn 0.75s ease-in-out forwards; /* Fx 5+ */
  -o-animation:      shortcutAllFadeIn 0.75s ease-in-out forwards; /* Opera 12+ */
  animation:         shortcutAllFadeIn 0.75s ease-in-out forwards; /* IE 10+ */
  /*-webkit-animation-delay: 0.25s;
  -moz-animation-delay: 0.25s;
  -o-animation-delay: 0.25s;
  animation-delay: 0.25s;*/
}
#shortcutText
{
  display:inline-block;
  position:relative;
  float:left;
  top:-5px;
}
#shortcutL
{
  display:inline-block;
  position:relative;
  float:left;
  width:10px;
  height:11px;
  margin-right:15px;
  background:url("images/shortcutL.png");
  /*transition: all 100ms ease-in-out;
  -o-transition: all 100ms ease-in-out;
  -moz-transition: all 100ms ease-in-out;
  -webkit-transition: all 100ms ease-in-out;*/
  -webkit-animation: arrowLeftFadeIn 0.75s ease-in-out forwards; /* Safari 4+ */
  -moz-animation:    arrowLeftFadeIn 0.75s ease-in-out forwards; /* Fx 5+ */
  -o-animation:      arrowLeftFadeIn 0.75s ease-in-out forwards; /* Opera 12+ */
  animation:         arrowLeftFadeIn 0.75s ease-in-out forwards; /* IE 10+ */
}
#shortcutR
{
  display:inline-block;
  position:relative;
  float:left;
  width:10px;
  height:11px;
  margin-left:15px;
  background:url("images/shortcutR.png");
  /*transition: all 100ms ease-in-out;
  -o-transition: all 100ms ease-in-out;
  -moz-transition: all 100ms ease-in-out;
  -webkit-transition: all 100ms ease-in-out;*/
  -webkit-animation: arrowRighttFadeIn 0.75s ease-in-out forwards; /* Safari 4+ */
  -moz-animation:    arrowRighttFadeIn 0.75s ease-in-out forwards; /* Fx 5+ */
  -o-animation:      arrowRighttFadeIn 0.75s ease-in-out forwards; /* Opera 12+ */
  animation:         arrowRighttFadeIn 0.75s ease-in-out forwards; /* IE 10+ */
  
}

#topDarken
{
  background:rgba(0,0,0,0.35);
  position:absolute;
  top:0px;
  left:0px;
  right:0px;
  height:124px;
  z-index:5;
}

/*#blackBar
{
  display:none;
  visibility:hidden;
  opacity:0;
}*/



/* Social networks */

#socialBtns
{
  height:36px;
  float:right;
  text-align:right;
  /*background:rgba(0,0,0,0.5);*/
}

#socialBtns a
{
  display:inline-block;
  float:left;
  top:8px;
  z-index:7;
  width:20px;
  height:20px;
  margin-left:6px;
  position:relative;
  background:url("images/social_icons/socialSet.png");
}
#socialBtns a div
{
  opacity:0;
  background:url("images/social_icons/socialSet.png");
  width:20px;
  height:20px;
  transition: all 100ms ease-in-out;
  -o-transition: all 100ms ease-in-out;
  -moz-transition: all 100ms ease-in-out;
  -webkit-transition: all 100ms ease-in-out;
}
/*#socialBtns a div:first-child
{
  margin-left:0px!important;
}*/
#socialBtns a div:hover
{
  opacity:1;
}


#domainurl
{
  display:none;
  background-position:0px 0px!important;
}
#domainurlInner
{
  background-position:0px 45px!important;
}


#email
{
  display:none;
  background-position:80px 0px!important;
}
#emailInner
{
  background-position:80px 45px!important;
}


#dribbble
{
  display:none;
  background-position:180px 0px!important;
}
#dribbbleInner
{
  background-position:180px 45px!important;
}


#twitter
{
  display:none;
  background-position:160px 0px!important;
}
#twitterInner
{
  background-position:160px 45px!important;
}


#instagram
{
  display:none;
  background-position:220px 0px!important;
}
#instagramInner
{
  background-position:220px 45px!important;
}


#other
{
  display:none;
  background-position:240px 0px!important;
}
#otherInner
{
  background-position:240px 45px!important;
}


#facebook
{
  display:none;
  background-position:140px 0px!important;
}
#facebookInner
{
  background-position:140px 45px!important;
}


#linkedin
{
  display:none;
  background-position:120px 0px!important;
}
#linkedinInner
{
  background-position:120px 45px!important;
}


#deviantart
{
  display:none;
  background-position:100px 0px!important;
}
#deviantartInner
{
  background-position:100px 45px!important;
}


#gplus
{
  display:none;
  background-position:60px 0px!important;
}
#gplusInner
{
  background-position:60px 45px!important;
}


#behance
{
  display:none;
  background-position:40px 0px!important;
}
#behanceInner
{
  background-position:40px 45px!important;
}


#vimeo
{
  display:none;
  background-position:200px 0px!important;
}
#vimeoInner
{
  background-position:200px 45px!important;
}


#youtube
{
  display:none;
  background-position:20px 0px!important;
}
#youtubeInner
{
  background-position:20px 45px!important;
}


#tooSmallBox
{
  /*display:none;*/
  display:table;
  width:100%;
  height:100%;
  opacity:0;
  z-index:0;
  position:fixed;
  top:0px;
  left:0px;
  right:0px;
  bottom:0px;
  text-align:center;
  vertical-align:middle;
  color:rgba(255,255,255,0);
  background:rgba(0,0,0,0);
  transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -webkit-transition: all 250ms ease-in-out;
}
#tooSmallBox div
{
  /*display:inline-block;
  vertical-align:middle;*/
  display:table-cell;
  text-align:center;
  vertical-align:middle;
}












/* Responsive Styles */











/* or 475px and shorter! */
@media screen
and (max-height:475px)
{

body {
  background:url("images/tilingBG_sml.jpg") repeat-x #171a20;
}
#tooSmallBox
{
  /*display:table-cell;*/
  display:table;
  width:100%;
  height:100%;
  position:fixed;
  visibility:visible;
  opacity:1;
  z-index:99;
  color:rgba(255,255,255,0.5);
  background:rgba(0,0,0,0.9);
}

#steps div
{
  width:400px;
  height:332px;
}
#steps div img
{
  width:400px;
  height:332px;
}
#steps div .number
{
  opacity:0;
}

#curStepFader {
  display:none;
  width:100%!important;
  height:125px;
  background:url("images/topNumberFader.png") no-repeat 50% 0%!important;
  position:fixed;
  top:0px;
  left:50%;
  margin-left:-50%!important;
  z-index:4;
}
#curArtistFader {
  display:none;
  width:100%!important;
  height:36px;
  background:url("images/fadeOutImg.png") no-repeat 50% 0%!important;
  position:fixed;
  top:124px;
  left:50%;
  margin-left:-50%!important;
  z-index:4;
}

#blackBar
{
  position:absolute;
  top:36px;
  width:100%;
  height:36px;
  z-index:1;
  background:rgba(0,0,0,1);
}

#arrowPrevious
{
  left:5%!important;
}
#arrowNext
{
  right:5%!important;
}
#noiseVig
{
  opacity:0!important;
  top:196px!important;
}

}






/* 299px and thinner! */
@media only screen
and (max-width:299px)
{

body {
  background:url("images/tilingBG_sml.jpg") repeat-x #171a20;
}
#tooSmallBox
{
  /*display:table-cell;*/
  display:table;
  width:100%;
  height:100%;
  visibility:visible;
  opacity:1;
  z-index:99;
  color:rgba(255,255,255,0.5);
  background:rgba(0,0,0,0.9);
}

#steps div
{
  width:400px;
  height:332px;
}
#steps div img
{
  width:400px;
  height:332px;
  top:196px;
}
#steps div .number
{
  opacity:0;
}

#curStepFader {
  display:none;
  width:100%!important;
  height:125px;
  background:url("images/topNumberFader.png") no-repeat 50% 0%!important;
  position:fixed;
  top:0px;
  left:50%;
  margin-left:-50%!important;
  z-index:4;
}
#curArtistFader {
  display:none;
  width:100%!important;
  height:36px;
  background:url("images/fadeOutImg.png") no-repeat 50% 0%!important;
  position:fixed;
  top:124px;
  left:50%;
  margin-left:-50%!important;
  z-index:4;
}

#shortcuts
{
  opacity:0;
}

#infoBar
{
  width:100%!important;
  position:fixed;
  top:124px;
  left:0%!important;
  margin-left:0px!important;
  height:36px;
  background:rgba(0,0,0,0);
  /*color:rgba(255,255,255,0.4);*/
  color:rgba(255,255,255,0.35);
  font-size:15px;
  font-weight:700;
  text-align:center!important;
}
#infoBar div#name
{
  text-align:center!important;
  float:none!important;
  line-height:34px;
  transition: all 175ms ease-in-out;
  -o-transition: all 175ms ease-in-out;
  -moz-transition: all 175ms ease-in-out;
  -webkit-transition: all 175ms ease-in-out;
}
#infoBar a
{
  float:right;
  line-height:34px;
}
#subHeaders
{
  display:none;
  visibility:hidden;
}

#blackBar
{
  position:absolute;
  top:36px;
  width:100%;
  height:36px;
  z-index:1;
  background:rgba(0,0,0,1);
}

#socialBtns
{
  display:block!important;
  float:none!important;
  text-align:center;
  width:100%!important;
}
#socialBtns a
{
  /*display:inline-block!important;*/
  display:inline-block;
  float:none!important;
  top:10px!important;
  z-index:7;
  width:20px;
  height:20px;
  margin-left:3px;
  margin-right:3px;
  /*margin-left:6px;*/
  position:relative;
  background:url("images/social_icons/socialSet.png");
}
/*#socialBtns a:first-child
{
  margin-left:0px!important;
}*/
#socialBtns a div
{
  opacity:0;
  background:url("images/social_icons/socialSet.png");
  width:20px;
  height:20px;
  transition: all 100ms ease-in-out;
  -o-transition: all 100ms ease-in-out;
  -moz-transition: all 100ms ease-in-out;
  -webkit-transition: all 100ms ease-in-out;
}
#socialBtns a div:hover
{
  opacity:1;
}



#arrows
{
  /*width:inherit!important;*/
  width:auto;
  min-width:0;
  display:table;
}
#arrowPrevious
{
  display:none;
  opacity:0.4;
  position:fixed;
  z-index:8;
  top:26px;
  /*left:25px!important;*/
  left:7%!important;
  width:36px;
  height:66px;
  /*background-size:50%!important;*/
  background:url("images/arrowPreviousSmallest.png") no-repeat;
}
#arrowPrevious:hover
{
  opacity:0.65!important;
}
#arrowPrevious:active
{
  opacity:0.3!important;
}
#arrowNext
{
  display:none;
  opacity:0.4;
  position:fixed;
  z-index:8;
  top:26px;
  /*right:25px!important;*/
  right:7%!important;
  width:36px;
  height:66px;
  /*background-size:50%!important;*/
  background:url("images/arrowNextSmallest.png") no-repeat;
}
#arrowNext:hover
{
  opacity:0.65!important;
}
#arrowNext:active
{
  opacity:0.3!important;
}
#gradLeft
{
  opacity:0.0!important;
}
#gradRight
{
  opacity:0.0!important;
}
#noiseVig
{
  opacity:0!important;
  top:196px!important;
}

}






/* 300-460 */
@media only screen 
and (min-width:300px)
and (max-width:460px)
{

body {
  background:url("images/tilingBG_sml.jpg") repeat-x #171a20;
}
#steps div {
  width:400px;
  height:332px;
}
#steps div img {
  width:400px;
  height:332px;
  top:196px;
}
#steps div .number {
  opacity:0;
}

#curStepFader {
  display:none;
  width:100%!important;
  height:125px;
  background:url("images/topNumberFader.png") no-repeat 50% 0%!important;
  position:fixed;
  top:0px;
  left:50%;
  margin-left:-50%!important;
  z-index:4;
}
#curArtistFader {
  display:none;
  width:100%!important;
  height:36px;
  background:url("images/fadeOutImg.png") no-repeat 50% 0%!important;
  position:fixed;
  top:124px;
  left:50%;
  margin-left:-50%!important;
  z-index:4;
}

#shortcuts
{
  opacity:0;
}

#infoBar
{
  width:100%!important;
  position:fixed;
  top:124px;
  left:0%!important;
  margin-left:0px!important;
  height:36px;
  background:rgba(0,0,0,0);
  /*color:rgba(255,255,255,0.4);*/
  color:rgba(255,255,255,0.35);
  font-size:15px;
  font-weight:700;
  text-align:center!important;
}
#infoBar div#name
{
  text-align:center!important;
  float:none!important;
  line-height:34px;
  transition: all 175ms ease-in-out;
  -o-transition: all 175ms ease-in-out;
  -moz-transition: all 175ms ease-in-out;
  -webkit-transition: all 175ms ease-in-out;
}
#infoBar a
{
  float:right;
  line-height:34px;
}
#subHeaders
{
  display:none;
  visibility:hidden;
}

#blackBar
{
  position:absolute;
  top:36px;
  width:100%;
  height:36px;
  z-index:1;
  background:rgba(0,0,0,1);
}

#socialBtns
{
  display:block!important;
  float:none!important;
  text-align:center;
  width:100%!important;
}
#socialBtns a
{
  /*display:inline-block!important;*/
  display:inline-block;
  float:none!important;
  top:10px!important;
  z-index:7;
  width:20px;
  height:20px;
  margin-left:3px;
  margin-right:3px;
  /*margin-left:6px;*/
  position:relative;
  background:url("images/social_icons/socialSet.png");
}
/*#socialBtns a:first-child
{
  margin-left:0px!important;
}*/
#socialBtns a div
{
  opacity:0;
  background:url("images/social_icons/socialSet.png");
  width:20px;
  height:20px;
  transition: all 100ms ease-in-out;
  -o-transition: all 100ms ease-in-out;
  -moz-transition: all 100ms ease-in-out;
  -webkit-transition: all 100ms ease-in-out;
}
#socialBtns a div:hover
{
  opacity:1;
}



#arrows
{
  /*width:inherit!important;*/
  width:auto;
  min-width:0;
  display:table;
}
#arrowPrevious
{
  display:none;
  opacity:0.4;
  position:fixed;
  z-index:8;
  top:26px;
  /*left:25px!important;*/
  left:11%!important;
  width:36px;
  height:66px;
  /*background-size:50%!important;*/
  background:url("images/arrowPreviousSmallest.png") no-repeat;
}
#arrowPrevious:hover
{
  opacity:0.65!important;
}
#arrowPrevious:active
{
  opacity:0.3!important;
}
#arrowNext {
  display:none;
  opacity:0.4;
  position:fixed;
  z-index:8;
  top:26px;
  /*right:25px!important;*/
  right:11%!important;
  width:36px;
  height:66px;
  /*background-size:50%!important;*/
  background:url("images/arrowNextSmallest.png") no-repeat;
}
#arrowNext:hover
{
  opacity:0.65!important;
}
#arrowNext:active
{
  opacity:0.3!important;
}
#gradLeft
{
  opacity:0.0!important;
}
#gradRight
{
  opacity:0.0!important;
}
#noiseVig
{
  opacity:0!important;
  top:196px!important;
}

}






/* 461-800 */
@media only screen 
and (min-width:461px)
and (max-width:800px)
{

body {
  background:url("images/tilingBG_sml.jpg") repeat-x #171a20;
}
#steps div {
  width:400px;
  height:332px;
}
#steps div img {
  width:400px;
  height:332px;
  top:196px;
}
#steps div .number {
  opacity:0;
}

#curStepFader {
  display:none;
  width:100%!important;
  height:125px;
  background:url("images/topNumberFader.png") no-repeat 50% 0%!important;
  position:fixed;
  top:0px;
  left:50%;
  margin-left:-50%!important;
  z-index:4;
}
#curArtistFader {
  display:none;
  width:100%!important;
  height:36px;
  background:url("images/fadeOutImg.png") no-repeat 50% 0%!important;
  position:fixed;
  top:124px;
  left:50%;
  margin-left:-50%!important;
  z-index:4;
}

#shortcuts
{
  opacity:0;
}

#infoBar
{
  width:100%!important;
  position:fixed;
  top:124px;
  left:0%!important;
  margin-left:0px!important;
  height:36px;
  background:rgba(0,0,0,0);
  /*color:rgba(255,255,255,0.4);*/
  color:rgba(255,255,255,0.35);
  font-size:15px;
  font-weight:700;
  text-align:center!important;
}
#infoBar div#name
{
  text-align:center!important;
  float:none!important;
  line-height:34px;
  transition: all 175ms ease-in-out;
  -o-transition: all 175ms ease-in-out;
  -moz-transition: all 175ms ease-in-out;
  -webkit-transition: all 175ms ease-in-out;
}
#infoBar a
{
  float:right;
  line-height:34px;
}
#subHeaders
{
  display:none;
  visibility:hidden;
}

#blackBar
{
  position:absolute;
  top:36px;
  width:100%;
  height:36px;
  z-index:1;
  background:rgba(0,0,0,1);
}

#socialBtns
{
  display:block!important;
  float:none!important;
  text-align:center;
  width:100%!important;
}
#socialBtns a
{
  /*display:inline-block!important;*/
  display:inline-block;
  float:none!important;
  top:10px!important;
  z-index:7;
  width:20px;
  height:20px;
  margin-left:3px;
  margin-right:3px;
  /*margin-left:6px;*/
  position:relative;
  background:url("images/social_icons/socialSet.png");
}
/*#socialBtns a:first-child
{
  margin-left:0px!important;
}*/
/*#socialBtns a:first-child
{
  margin-left:0px!important;
}*/
#socialBtns a div
{
  opacity:0;
  background:url("images/social_icons/socialSet.png");
  width:20px;
  height:20px;
  transition: all 100ms ease-in-out;
  -o-transition: all 100ms ease-in-out;
  -moz-transition: all 100ms ease-in-out;
  -webkit-transition: all 100ms ease-in-out;
}
#socialBtns a div:hover
{
  opacity:1;
}



#arrows
{
  /*width:inherit!important;*/
  width:auto;
  min-width:0;
  display:table;
}
#arrowPrevious
{
  display:none;
  opacity:0.4;
  position:fixed;
  z-index:8;
  top:26px;
  /*left:25px!important;*/
  left:20%!important;
  width:36px;
  height:66px;
  /*background-size:50%!important;*/
  background:url("images/arrowPreviousSmallest.png") no-repeat;
}
#arrowPrevious:hover
{
  opacity:0.65!important;
}
#arrowPrevious:active
{
  opacity:0.3!important;
}
#arrowNext
{
  display:none;
  opacity:0.4;
  position:fixed;
  z-index:8;
  top:26px;
  /*right:25px!important;*/
  right:20%!important;
  width:36px;
  height:66px;
  /*background-size:50%!important;*/
  background:url("images/arrowNextSmallest.png") no-repeat;
}
#arrowNext:hover
{
  opacity:0.65!important;
}
#arrowNext:active
{
  opacity:0.3!important;
}
#gradLeft
{
  opacity:0.65!important;
}
#gradRight
{
  opacity:0.65!important;
}
#noiseVig
{
  top:196px!important;
}

}






/* 801-1000 */
@media only screen 
and (min-width:801px) 
and (max-width:1000px)
{

#steps div .number {
  opacity:0;
}

#blackBar
{
  display:none;
  visibility:hidden;
  opacity:0;
}

#arrows
{
  position:absolute;
  left:50%;
  top:0px;
  margin-left:-300px;
  width:600px;
}
#arrowPrevious
{
  display:none;
  opacity:0.4;
  position:absolute;
  z-index:8;
  top:26px;
  left:0px;
  width:36px;
  height:66px;
  /*background-size:50%!important;*/
  background:url("images/arrowPrevious850.png") no-repeat;
}
#arrowPrevious:hover
{
  opacity:0.65!important;
}
#arrowPrevious:active
{
  opacity:0.3!important;
}
#arrowNext
{
  display:none;
  opacity:0.4;
  position:absolute;
  z-index:8;
  top:26px;
  right:0px;
  width:36px;
  height:66px;
  /*background-size:50%!important;*/
  background:url("images/arrowNext850.png") no-repeat;
}
#arrowNext:hover
{
  opacity:0.65!important;
}
#arrowNext:active
{
  opacity:0.3!important;
}
#gradLeft
{
  opacity:0.0;
}
#gradRight
{
  opacity:0.0;
}
#noiseVig
{
  opacity:0!important;
}

}






/* 1600px and wider! */
@media only screen 
and (min-width:1600px)
{

#gradLeft
{
  width:55%;
}
#gradRight
{
  width:55%;
}

#blackBar
{
  display:none;
  visibility:hidden;
  opacity:0;
}

}






/* 1920px and wider! */
@media only screen 
and (min-width:1920px)
{

#gradLeft
{
  width:65%;
}
#gradRight
{
  width:65%;
}

#blackBar
{
  display:none;
  visibility:hidden;
  opacity:0;
}

}