html, body {
  /*074f73*/
  /*0575ad*/
  /*0090d9*/
  /*f8c63d*/
  margin: 0;
  padding: 0;
  background-color: #050505;
  color: #e5e5e5;
  height:100%;
}

h1 {font-family: 'Jura', sans-serif; letter-spacing: 5px; font-weight: 300; color: #0575ad; font-size: 32px;}
h2 {font-family: 'Jura', sans-serif; letter-spacing: 5px; font-weight: 300; color: #0575ad; font-size: 32px;}
* title {font-family: 'Jura', sans-serif; letter-spacing: 5px; font-weight: 300; color: #0575ad; font-size: 32px;}
a {font-family: 'Rajdhani', sans-serif; letter-spacing: 2px; font-weight: 300; text-decoration: none;}
p ,form {font-family: 'Rajdhani',  sans-serif;  font-weight: 300;}
h3  {font-family: 'Rajdhani',  sans-serif;  font-weight: 300;}
ol, ul { list-style: none; }
br {line-height: 1.5em; }
ul.no-bullets {list-style-type: none; margin: 0px; padding: 0px;}

* img{
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */
  user-select: none;          /* Likely future */    
}
.relative_position{position: relative;}
.sliderSmallphone{display: none;}


#loaderLogo {
   
  padding-top: 76px;
}


.main .title{
  margin: 35vh  auto auto auto;
  text-shadow: 0px 0px 10px rgba(0, 0, 0, .2);
  transition: all .5s ease-out;
}

.main .jumbTitle {
  position: relative;
  top: -180px;
}
.main .jumbBG{
  height: 480px; 
  background: url(_images/jumbtitle3.png) no-repeat center center;
  background-size: 480px;
  transition: all .4s linear;
}

.main .jumbBG p{
  color: #222222; 
  font-family: 'Open Sans', sans-serif;
  font-size: 17px;
  line-height: 115%;
  font-weight: 300;
  position: relative;
  top: 260px;
  margin: 6px auto auto auto;
  letter-spacing: 0px;
  transition: all .4s linear;
  width: 360px;
}
/*.main .jumbBG span p{margin-top: 1em;}*/
.main .jumbBG p.second_p{width: 320px;}
.main .jumbBG p.phoneDisplay{display: none; margin-top: 5px;}
.main .jumbBG p.phoneVertDisplay{display: none; margin-top: 5px;}


.main .jumbBG button{
  background: url(_images/jumbtitle_dwarrow.png) no-repeat center center;
  background-size: 25px;
  outline: none;
  border: none;
  height: 40px;
  width: 25px;
  font-family: 'Open Sans', sans-serif;
  font-size: 15px;
  text-decoration: none;
  color: #0393ff;
  letter-spacing: 0px;
  top: -23px;
  left: 6px;
  position: relative;
  transition: all .3s linear;
}

.main .jumbBG button:hover{
  background: url(_images/jumbtitle_dwarrow_hov.png) no-repeat center center;
  background-size: 25px;
}

.main .title h1 {text-align: center;}


.container .scroll-down .glyphicon { 
  position: absolute;
  display: none;
  top: 55px;
  right: 36px;
  color: #FFFFFF; 
  font-size: 30px; 
  padding-right: 2px; 
  padding-top: 35px; 
}

.container .scroll-down:hover .glyphicon { padding-top: 40px; }

.container .scroll-down {
    height: 80px;
    width: 110px;
    display: block;
    position: absolute;
    bottom: 60px;
    right: 5%;
    background-color: #161616;
    text-align: center;
    z-index: 6;
    border-radius: 3px;
}

.logo {
    position: relative;
    top: 1px;
    display: block;
    margin: 18px auto 0px auto;
    height: 40px;
}

.main {
  background: rgba(0,0,0,0); no-repeat center center fixed ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 100%;
  position: absolute;
  top:0;
  width: 100%;
}

.main_grids {
/*  background: url(_images/dot.png) repeat center center ; 
  height: 100%;
  width: 100%;
  top:0;*/
}

.container {max-width: 1280px; height: 100; transition: all .4s linear;}

.btn-primary { background-color: #22A39F; border-color: #1c8784;}
.btn-primary:hover { background-color: #1c8784;  border-color: #1c8784;}

.navbar  {box-shadow: none; border: 0px; border-radius: 5px; background: rgba(0,0,0,.6); position: absolute; top: 100%; right: 5%; width: 110px; z-index: 100; }
.navbar .navbar-collapse { padding: 0px; max-height: none; border: 0px;}
.navbar .navbar-nav { float: none; }
.navbar-nav { margin: 0px; }
.navbar .nav > li { display: block; float: none; height: 80px; } 
.navbar .nav > li a { display: block;  height: 80px; text-align: center; padding-top: 30px; font-weight: 600; color: #FFFFFF;}
.navbar .nav > li a { display: block;  height: 80px; text-align: center; padding-top: 30px; font-weight: 600; color: #FFFFFF;}
.navbar .nav > li a { display: block;  height: 80px; text-align: center; padding-top: 30px; font-weight: 600; color: #FFFFFF;}
.navbar .nav > li a.topColNav {border-top-right-radius: 5px; border-top-left-radius: 5px;}
.navbar .nav > li a.bottColNav{border-bottom-right-radius: 5px; border-bottom-left-radius: 5px;}
.navbar .nav > li a:hover, 
.navbar .nav > li a:focus { color: #999999; }
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus { transition: all .2s ease-in; background: #0575ad; color: #FFFFFF;}
.navbar-default .navbar-toggle:hover .icon-bar,
.navbar-default .navbar-toggle:focus .icon-bar { background: #222222; transition: all .3s linear;}
.fixed .navbar  { position: fixed; top: 60px; }
.navbar-toggle {
    position: relative;
    float: right;
    padding: 9px 10px;
    margin-top: 8px;
    margin-right: 10%;
    margin-left: 60%;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: none;
    border: 0px;
    border-radius: 3px;
    transition: all .3s linear;
}


.blackBorderTop {border-top: 0px solid #050505;}
.blackBorderBottom {border-bottom: 0px solid #050505;}
.bg_black {background: #090909; z-index: 29; position: relative; }
.bg_gray {background: #434242; }
.bg_white {background: #eceff1; }
.bg_darkWood {background: url(_images/BG/wood.jpg) repeat center center;}
.bg_metalFloor {background: url(_images/BG/metalFloor.jpg) repeat center center;}
.bg_leather {background: url(_images/BG/leather_1.jpg) repeat center center;}
.bg_darkleather {background: url(_images/BG/dark_leather.png) repeat center center;}
.bg_concrete {background: url(_images/BG/concrete.jpg) repeat center center;}
.bg_horzGrid {
  background: url(_images/horzGrid.png) repeat center center fixed; 
  height: 100%;
}
.bg_orchid {
  background: url(_images/BG/darkdenim3.png) repeat center center;
  border-top: 12px solid #090909; 
  border-bottom: 12px solid #090909; 
  box-shadow: inset 0 18px 20px -18px rgba(0,0,0,.75), inset 0 -18px 20px -18px rgba(0,0,0,.75);
}
.bg_twistedLight{background: url(_images/BG/twst_light2.png) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.bg_darkforest{background: url(_images/BG/darkforest.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.bg_nymap{background: url(_images/BG/nymap.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.contFifteen{margin: 0px 15% 0px 0px; transition: all .4s linear;}

#profile {position: relative; top: 0;}
#profile  img.soh{ border: 0px solid #222222; height: 250px; border-radius: 100%; margin: 0px 10% 20px 10%; padding: 0px; transition: all .5s ease-out;}
#profile h2{
    margin: 0px 0px 0px 2%;
    padding: 60px 0px 0px 10px;
    margin-bottom: 10px;
    transition: all .5s ease-out;}
#profile .profText p{
    text-align: justify; 
    text-justify: inter-word; 
    margin-bottom: 10px;
    font-size: 17px;
    text-align: left;}
#profile .profText{margin: 20px 2%; padding: 15px 10px 100px 10px; transition: all .5s ease-out;}
#profile span{color: #0393ff;}
#profile .horz{display: inline-block; margin: 0px -6%;}
#profile .vert{display: none; text-align: center; margin-bottom: -15px;}

img.arrow {height: 20px; margin: -5px 0px 5px 0px ;}
img.downArrow {margin-bottom: 10px; -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg);}

#HIicon {text-align: center; display: inline-block; margin: -5px 10px 0px 10px; transition: all .5s ease-out;}
#HIicon img{padding: 10px; border: 0;}

.boxShadowLeft{box-shadow: -80px 0px 80px -50px rgba(255,245,225,.12);}

#reelSize{width: 950px; height: 534px; border: 0px; transition: all .1s ease-out; background: url("_images/lightbox-ico-loading.gif") no-repeat center center #222222; box-shadow: 0 600px 600px -600px rgba(0,256,0,.65);}
#video{margin: 10px auto 40px 1%;}

/*.wideStripe{  
  position: relative; 
  margin: -59px 0px 10px -10px; 
  padding: 0px 0px 0px 0px; 
  height:60px; 
  width: calc(100vw - 7px);
  left: calc(-49vw + 49%);
  background-color: rgba(0,0,0,.4);
}*/

.reelStrip{
  position: absolute; 
  margin: 110px 0px 0px 0px; 
  height: 534px; 
  width: 100%; 
}
.breakDownText{width: 99.9%; background-color: rgba(0,0,0,0.14); padding: 0px 20px;}
#reel h2{position: relative; margin-top: 55px; margin-bottom: 40px; font-size: 28px; text-align: center; text-shadow: 0px 0px 15px #074f73;}
#reel h2.secondaryTitle {cursor: pointer; color: rgb(200,200,200); font-size: 22px;}
#reel .noLetterSpace h2{letter-spacing: 0px;}

#reelBreakBtn{
  margin-bottom: 40px;
}

#reelBreakBtn p{
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */
  user-select: none;  cursor: pointer;     /* Likely future */
  padding: 15px 20px 14px 21px; 
  width: 260px; 
  transition: all .15s linear;
  position: relative;
  border-radius: 5px;
  font-weight: 500;
  font-size: 22px;
  letter-spacing: 1px;
  /*text-transform: uppercase;*/
}

#reelBreakBtn p:hover{color: #e5e5e5; background-color: #0575ad; box-shadow: none; transform: scale(.99,.975);}
#reelBreakBtn p:active{background-color: rgba(15,104,168,1); -ms-transform: scale(.975,.90); -webkit-transform: scale(.975,.90); transform: scale(.975,.90);}
#reelBreakBtn .reelBreakBtn-pushed{color: rgba(150,150,150,.9); background-color: #074f73; -ms-transform: scale(.99,.96); -webkit-transform: scale(.99,.96); transform: scale(.99,.96);}
#reelBreakBtn .reelBreakBtn-unpushed{color: #e5e5e5; background-color: #111111; box-shadow: inset 0 0 15px #000000;}

.breakDownText p{line-height: 95%; font-size: 15px; color: #dddddd; color: #cccccc;}
.breakDownText .col-md-2{padding: 0px 0px;}
.breakDownText br{line-height: 0;}
.breakDownText span{color: #e5e5e5; font-weight: 500;}
.breakDownText span.number{color: #0575ad;}

#fearBtn span.glyphiconFearRot {position: relative; display: inline-block; left: 10px; top: 7px; font-size: 32px;}
#fearBtn span.glyphiconFearRotPushed {
  -ms-transform: rotate(450deg); /* IE 9 */
  -webkit-transform: rotate(450deg); /* Chrome, Safari, Opera */
  transform: rotate(450deg);
  transition: all .3s ease-out;
  color: rgba(3,147,255,1);
}
#fearBtn span.glyphiconFearRotUnPushed {
  -ms-transform: rotate(0deg); /* IE 9 */
  -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
  transform: rotate(0deg);
  transition: all .2s ease-out;
}

#fearBtn span.glyphiconFearHov {position: relative; display: inline-block; left: -15px; top: 7px; font-size: 32px; transition: color .15s ease-in-out;}
#fearBtn:hover span.glyphiconFearHov{color: rgba(3,147,255,1);}
#fearBtn:active span.glyphiconFearHov{color: rgba(3,147,255,0.8);  -ms-transform: scale(.9,.80); -webkit-transform: scale(.9,.80); transform: scale(.9,.80);}
#fearBtn {cursor: pointer; margin: 20px 0;}

#effect_fear {height: 450px; padding-top: 30px;}
.fear p{font-size: 16px; margin-right: 0%; margin-top: 0px; line-height: 140%;}
.fear br{line-height: 0;}
.fear span{opacity: 0.5;}
.fear {display: inline;}
.fearText {
  float: left; 
  width: 27%;
  height: 394px;
  padding: 30px 20px 20px 40px;
  background-color: rgba(0,0,0,.4); 
  margin-bottom: 30px;
  -webkit-transition-delay: 0s; /* Safari */
  transition-delay: 0s;
}
.fearVid{
  float: left; 
  position: relative; 
  background: url("_images/lightbox-ico-loading.gif") no-repeat center center #222222;
  width: 700px; 
  height: 394px; 
  padding: 0px; 
  margin: 0px;
}


#mayaScriptsBtn span.glyphiconMayaScriptsRot {position: relative; display: inline-block; left: 10px; top: 7px; font-size: 32px;}
#mayaScriptsBtn span.glyphiconMayaScriptsRotPushed {
  -ms-transform: rotate(450deg); /* IE 9 */
  -webkit-transform: rotate(450deg); /* Chrome, Safari, Opera */
  transform: rotate(450deg);
  transition: all .3s ease-out;
  color: rgba(3,147,255,1);
}
#mayaScriptsBtn span.glyphiconMayaScriptsRotUnPushed {
  -ms-transform: rotate(0deg); /* IE 9 */
  -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
  transform: rotate(0deg);
  transition: all .2s ease-out;
}

#mayaScriptsBtn span.glyphiconMayaScriptsHov {position: relative; display: inline-block; left: -15px; top: 7px; font-size: 32px; transition: color .15s ease-in-out;}
#mayaScriptsBtn:hover span.glyphiconMayaScriptsHov{color: rgba(3,147,255,1);}
#mayaScriptsBtn:active span.glyphiconMayaScriptsHov{color: rgba(3,147,255,0.8);  -ms-transform: scale(.9,.80); -webkit-transform: scale(.9,.80); transform: scale(.9,.80);}
#mayaScriptsBtn {cursor: pointer; margin: -10px 0 20px 0;}

.twoScriptedVid-Display{display: static;}
.codeVid p{font-size: 16px; margin-top: 15px; text-align: left;}
.codeVid{padding-bottom: 30px; padding-top: 20px;}
.leftVidCont{display: inline-block; width: 300px; padding: 0px 20px;}
.rightVidCont{display: inline-block; ; width: 300px; padding: 0px 20px;}
.rightVid{background: url("_images/lightbox-ico-loading.gif") no-repeat center center #222222;}
.leftVid{background: url("_images/lightbox-ico-loading.gif") no-repeat center center #222222;}

.blankSpace {height: 70px;}

#designs {border-top: 2px solid rgba(0,0,0,.5); padding-top: 0px; box-shadow: inset 0 600px 600px -550px rgba(0,0,0,.65);}
#designs h2{position: relative; margin-top: 45px; margin-bottom: 15px; font-size: 28px; text-align: center; text-shadow: 0px 0px 15px #074f73;}
#designs .designBtnsContainer{position: relative; margin-bottom: 60px; margin-top: 40px;}

#designs img {margin-top: 20px; border-radius: 100%; box-shadow: 0 0 48px rgba(0,0,0,.8); height: 250px; border: 4px solid #333333; transition: all .4s linear, border .8s linear;}
#designs a:hover img {border: 4px solid #f8c63d; transition: border .2s ease-in-out;}
#designs a:active img {-ms-transform: scale(0.985);-webkit-transform: scale(0.985);transform: scale(0.985); box-shadow: 0 0 18px 5px rgba(0,0,0,1); -ms-transition: scale .1s linear, opacity: 0.85; -webkit-transition: scale .1s linear, opacity: 0.85; transition: scale .1s linear, opacity: 0.85;}
#designs .posters{position: relative; display: inline-block; margin: 0px 2%; transition: all .3s ease-out;}
#designs .illustrations{position: relative; display: inline-block; margin: 0px 2%; transition: all .3s ease-out;}
#designs .logos{position: relative; display: inline-block; margin: 0px 2%; transition: all .3s ease-out;}

.circlePostersBadge {
  position: relative;
  width: 0px;
  -webkit-transform: rotate(-60deg);
  -moz-transform: rotate(-60deg);
  -ms-transform: rotate(-60deg);
  -o-transform: rotate(-60deg);
  transform: rotate(-60deg);
  left: -6px;
  top: 77px;
  margin: 0px;
  padding: 0px;
  transition: all .4s linear
}
.circleIllusBadge {
  position: relative;
  width: 0px;
  -webkit-transform: rotate(-73deg);
  -moz-transform: rotate(-73deg);
  -ms-transform: rotate(-73deg);
  -o-transform: rotate(-73deg);
  transform: rotate(-73deg);
  left: -18px;
  top: 108px;
  margin: 0px;
  padding: 0px;
  transition: all .4s linear
}
.circleLogosBadge {
  position: relative;
  width: 0px;
  -webkit-transform: rotate(-53deg);
  -moz-transform: rotate(-53deg);
  -ms-transform: rotate(-53deg);
  -o-transform: rotate(-53deg);
  transform: rotate(-53deg);
  left: 0px;
  top: 63px;
  margin: 0px;
  padding: 0px;
  transition: all .4s linear
}

h1.titleCircle span {
  font-size: 17px;
  font-weight: 600;
  color: #454545;
  height: 145px;
  position: absolute;
  /*width: 20px;*/
  left: 0;
  top: 0;
  margin: 0px;
  padding: 0px;
  -webkit-transform-origin: bottom center;
  -moz-transform-origin: bottom center;
  -ms-transform-origin: bottom center;
  -o-transform-origin: bottom center;
  transform-origin: bottom center;
  transition: all .4s linear
}

.char1 {
  -webkit-transform: rotate(6deg);
  -moz-transform: rotate(6deg);
  -ms-transform: rotate(6deg);
  -o-transform: rotate(6deg);
  transform: rotate(6deg);}
.char2 {
  -webkit-transform: rotate(12deg);
  -moz-transform: rotate(12deg);
  -ms-transform: rotate(12deg);
  -o-transform: rotate(12deg);
  transform: rotate(12deg);}
.char3 {
  -webkit-transform: rotate(18deg);
  -moz-transform: rotate(18deg);
  -ms-transform: rotate(18deg);
  -o-transform: rotate(18deg);
  transform: rotate(18deg);}
.char4 {
  -webkit-transform: rotate(24deg);
  -moz-transform: rotate(24deg);
  -ms-transform: rotate(24deg);
  -o-transform: rotate(24deg);
  transform: rotate(24deg);}
.char5 {
  -webkit-transform: rotate(30deg);
  -moz-transform: rotate(30deg);
  -ms-transform: rotate(30deg);
  -o-transform: rotate(30deg);
  transform: rotate(30deg);}
.char6 {
  -webkit-transform: rotate(36deg);
  -moz-transform: rotate(36deg);
  -ms-transform: rotate(36deg);
  -o-transform: rotate(36deg);
  transform: rotate(36deg);}
.char7 {
  -webkit-transform: rotate(42deg);
  -moz-transform: rotate(42deg);
  -ms-transform: rotate(42deg);
  -o-transform: rotate(42deg);
  transform: rotate(42deg);}
.char8 {
  -webkit-transform: rotate(48deg);
  -moz-transform: rotate(48deg);
  -ms-transform: rotate(48deg);
  -o-transform: rotate(48deg);
  transform: rotate(48deg);}
.char9 {
  -webkit-transform: rotate(54deg);
  -moz-transform: rotate(54deg);
  -ms-transform: rotate(54deg);
  -o-transform: rotate(54deg);
  transform: rotate(54deg);}
.char10 {
  -webkit-transform: rotate(60deg);
  -moz-transform: rotate(60deg);
  -ms-transform: rotate(60deg);
  -o-transform: rotate(60deg);
  transform: rotate(60deg);
  width: 13px;}
.char11 {
  -webkit-transform: rotate(66deg);
  -moz-transform: rotate(66deg);
  -ms-transform: rotate(66deg);
  -o-transform: rotate(66deg);
  transform: rotate(66deg);}
.char12 {
  -webkit-transform: rotate(72deg);
  -moz-transform: rotate(72deg);
  -ms-transform: rotate(72deg);
  -o-transform: rotate(72deg);
  transform: rotate(72deg);}
.char13 {
  -webkit-transform: rotate(78deg);
  -moz-transform: rotate(78deg);
  -ms-transform: rotate(78deg);
  -o-transform: rotate(78deg);
  transform: rotate(78deg);}


.interestingStufsImg {height: 100%; transition: all .4s linear;}
.interestingStufsDisplay {position: absolute; display: block; margin: 30px 0px 0px -1%; opacity: 0.8; height: 160px; transition: all .4s linear;}

.indexThumbnails .clearfix img {border: 0; width: 78px; margin: 0px; padding: 0px; border: 3px solid #222222;}
.indexThumbnails .clearfix .hvr-buzz_bg{padding: 0px;}
.indexThumbnails .clearfix img:active{-ms-transform: scale(.94); -webkit-transform: scale(.94); transform: scale(.94);}

#lightbox-container-image-data-box {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

#thumbnails.indexThumbnails {position: relative; display: inline-block; float: right; margin: 0px 0% 0px 15%; transition: all .4s linear;}
#thumbnails.indexThumbnails ul li {float: left; margin: 0px; transition: all .4s linear;}

.clearfix:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix {display: inline-block; margin-bottom: 3px;}

.indexThumbnails .hvr-buzz_bg {
  margin: 0px;
  padding: 0px;
  background: #222222;
  -ms-transition: transition: transform 0.3s ease-out, border-radius 1.3s ease-out;
  -webkit-transition: transform 0.3s ease-out, border-radius 1.3s ease-out;
  transition: transform 0.3s ease-out, border-radius 1.3s ease-out;
}
.indexThumbnails .hvr-buzz_bg:hover, .indexThumbnails .hvr-buzz_bg:focus, .indexThumbnails .hvr-buzz_bg:active {
  -ms-transform: scale(1.05);
  -ms-transition: transform .3s ease-out, border-radius .3s ease-out;
  -webkit-transform: scale(1.05);
  -webkit-transition: transform .3s ease-out, border-radius .3s ease-out;
  transform: scale(1.05);
  transition: transform .3s ease-out, border-radius .3s ease-out;
  /*border-radius: 100%;*/
  /*z-index: -1;*/
}
.indexThumbnails .hvr-buzz_im {
  margin: 0px;
  padding: 0px;
  -webkit-filter: grayscale(.3); 
  -ms-filter: grayscale(.3);
  filter: grayscale(.3);

  -ms-transition: transform .3s ease-out;
  -ms-transition: border-radius 1.3s ease-out, border-color .3s ease-out;
  -webkit-transition: transform .3s ease-out;
  -webkit-transition: border-radius 1.3s ease-out, border-color 1.7s ease-out;
  transition: transform .3s ease-out;
  transition: border-radius 1.3s ease-out, border-color 1.7s ease-out;
}
.indexThumbnails .hvr-buzz_im:hover, .indexThumbnails .hvr-buzz_im:focus, .indexThumbnails .hvr-buzz_im:active {
  -ms-transform: scale(.93);
  -ms-transition: border-radius .3s ease-out, border-color .3s ease-out;
  -webkit-transform: scale(.93);
  -webkit-transition: border-radius .3s ease-out, border-color .3s ease-out;
  transform: scale(.93);
  transition: border-radius .3s ease-out, border-color .3s ease-out;
  border-radius: 1px;
  border-color: #222222;
  -ms-filter: grayscale(0); -webkit-filter: grayscale(0); filter: grayscale(0);
}
 


#resume{margin-top: -10px; box-shadow: inset 400px 0 400px -400px rgba(0,0,0,.95), inset -400px 0 400px -400px rgba(0,0,0,.95); /*,inset 0 600px 600px -550px rgba(0,0,0,.95);*/}

#resume .mainContainer{padding: 10px 0 30px 0;}

#resume h2{color: #000; font-weight: 600; position: relative; margin-top: 55px; margin-bottom: 25px; font-size: 28px; text-align: center; text-shadow: 0px 0px 8px rgba(0,0,0,.5) ;}
#resume .midBorder{border-right: 1px solid black;}
#resume h3 .blackColor{color: #252525;}

#resume {transition: all .5s linear;}
#resume .y_prspctive{
  -webkit-perspective: 900px;
  perspective: 900px;}

#we_icon img {margin: 30px 0  -20px 100px; width: 216px; opacity: .85; transition: all .4s linear;}
#edu_icon img {margin: 30px 0  -20px 130px; width: 216px; opacity: .85; transition: all .4s linear;}
#sftwr_icon img {margin: 30px 0  -20px 95px; width: 216px; opacity: .85; transition: all .4s linear;}
#skills_icon img {margin: 30px 0  -20px 125px; width: 216px; opacity: .85; transition: all .4s linear;}
#award_icon img {margin: 30px 0  -20px 105px; width: 216px; opacity: .85; transition: all .4s linear;}

#resume .textBGs{padding: 15px 15px 15px 15px; background-color: rgba(180,180,180,.7);border-radius: 0px;border-top: 25px solid rgba(0,0,0,.8); transition: all .15s ease-out;}

#resume .row h2{font-family: 'Rajdhani', sans-serif; letter-spacing: 0px; margin: 0px; padding: 0px 0px 5px 0px; font-size: 17px; text-align: left; color: #252525; box-shadow: none; text-shadow: none;}
#resume .row p{line-height: 110%; font-weight: 500; padding: 0px; letter-spacing: 0px; font-size: 16px; text-align: left; color: #252525;}
#resume h3{font-weight: 500;  margin: 0px; padding: 0px; letter-spacing: 0px; font-size: 16px; text-align: right; color: #0f334c;}

#resume .leftCol .textBGs{margin-top: 18px; margin-right: 2%; text-align: right;  
                          -webkit-transform: rotateX(10deg) rotateY(0deg);
                                  transform: rotateX(10deg) rotateY(0deg) translateZ(12px);
                                  box-shadow: 0 27px 77px -46px rgba(0,70,200,1);
                                  transition: all .5s ease-out;}
#resume .leftCol h1{margin-right: 4%; text-align: right;}

#resume .rightCol .textBGs{margin-top: 18px; margin-left: 2%; text-align: right;
                          -webkit-transform: rotateX(10deg) rotateY(-0deg);
                                  transform: rotateX(10deg) rotateY(-0deg) translateZ(12px);
                                  box-shadow: 0 27px 77px -46px rgba(0,70,200,1);
                                  transition: all .5s ease-out;}
#resume .rightCol h1{margin-left: 4%; text-align: left;}



#resume .rightCol .textBGs:hover, #resume .leftCol .textBGs:hover {
  box-shadow: 0 12px 25px -15px rgba(0,70,200,1);
  -webkit-filter: grayscale(0); 
  filter: grayscale(0);
  -webkit-transform: rotateX(0deg);
  transform: rotateX(0deg);
  transition: all .06s linear;
}


/*skills stars glyphicon*/
#resume .glyphicon.filled {color: #0a6999; background-color: #1e80c7; border-radius: 100%;}
#resume .glyphicon.empty {color: transparent; opacity: .7; background-color: rgba(117,117,117,.3); box-shadow: inset 0 0 1px 1px rgba(117,117,117,1); border-radius: 100%;}
#resume .glyphicon {  -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;}
#resume ul > li {
    min-height: 20px;
    padding: 2px 3px 4px 3px;
}
#resume ul > li:hover { background: rgba(60,60,60,.15);}
#resume ul > li:hover .glyphicon { margin-left: 2px; } 

#resume .glyphicon {
    color: #234e6b;
    font-size: 14px;
    position: static;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#contact ul > li {display: inline-block; vertical-align: top;}

#contact {box-shadow: inset 0 600px 600px -550px rgba(0,0,0,.95); position: relative;}
#contact h2{letter-spacing: 4px;position: relative; padding-top: 40px; margin-top: 40px; margin-bottom: 15px; font-size: 28px; text-align: center; color: #0090d9;}
#contact h2.secondaryTitle {letter-spacing: 2px; padding-top: 0px; color: rgb(235,235,235); font-size: 30px; margin-bottom: 50px;}
#contact .DashedCont{ 
  position: relative;
  border: 2px dashed  rgba(200,200,200,.6); 
  border-bottom-left-radius: 120px;  
  border-bottom-right-radius: 120px; 
  border-top: 0px;
  margin: -40px 110px 0px 110px;
  padding-bottom: 50px;
}

#contact  img.btn_hi{
  height: 150px;  
  -ms-transform: rotate(-10deg); 
  -webkit-transform: rotate(-10deg); 
  transform: rotate(-10deg); 
  transition: all .15s
  ease-out; 
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */
  user-select: none;          /* Likely future */
  cursor: pointer; 
  margin-left: -40px;    
}
#contact img.btn_hi:hover { -ms-transform: rotate(6deg); -webkit-transform: rotate(6deg); transform: rotate(6deg);}
#contact button.btn_proj_inq{
  text-align: center;
  font-size: 22px; 
  padding: 14px 45px 12px 45px; 
  margin-top: 38px;
  margin-left: -45px;
  text-transform: uppercase;
  color: #e5e5e5; 
  background-color: #1a1a1a;
  font-weight: 500;
  border-radius: 3px;
  transition: all .1s linear;
}
#contact button.btn_proj_inq:hover{color: #ffffff; background-color: #0575ad}

.social_icons {margin: 50px 5% 50px 0;}
.social_icons ul>li {margin: 0 .4%; padding: 0;}
.social_icons i{
  margin: 0;
  padding: 15px 7px 7px 8px; 
  height: 70px; width: 70px; 
  background-color: rgba(0,0,0,.6);
  transition: all .15s ease-in-out;
  text-decoration: none;
  text-align: center;
  color: rgba(250,250,250,.6); 
  border-radius: 100%;
}

.social_icons i:hover {color: rgba(255,255,255,.9);  transform: scale(1.2);}
.social_icons i:active{opacity: .9; transform: scale(.98,.98);}
.social_icons i.fa-linkedin:hover {background-color:#007bb6;}
.social_icons i.fa-facebook:hover {background-color:#3b5998;}
.social_icons i.fa-vimeo:hover {background-color:#1ab7ea;}
.social_icons i.fa-google-plus:hover {background-color:#dd4b39;}
.social_icons i.fa-twitter:hover {background-color:#4099FF;}

#copyright p {/*position: relative;*/ text-align: center; color: #999999; font-family: 'Oxygen', cursive; font-weight: 300; font-size: 12px; padding: 8px 0 20px 0; margin: 0; z-index: 30;}

/*--------- posters --------*/
.designs_separator {border-bottom: 1px solid rgba(0,0,0,.1); margin-top: 15px;}
.posters_top {  
  background-color: #fdc162;
  height:30px;
  top:0px;
  padding-top: 10px;
  margin-bottom: 0px;
  position: relative;
  text-align: center;
  margin-left: 5%;
  width: 95%;
  transition: all .2s linear;
}
.side_bar {
  text-align: center;
  position: fixed;
  float: left;
  top: 0;
  bottom: 0;
  width: 120px;
  height: 150%;
  z-index: 20;
  transition: all .2s linear;
}
.side_bar ul {padding: 60px 0 0 0; margin: 0; transition: all .2s linear;}
.side_bar a { display: block; cursor: pointer; height: 80px; text-align: center; padding: 26px 0 30px 0; font-weight: 600; color: #e5e5e5; font-size: 17px; text-decoration: none;transition: all .2s linear;}
.side_bar a:hover { background-color: #0575ad;}
.side_bar a:active { transform: scale(.98);}
.posters_top img, .l_and_p_top img, .illust_top img {width: 100%;}

.absolute_white_bckgrnd {position: fixed; width: 100%; height: 150%;}
.thumbs_backgrnd{position: relative; top:-35px; margin-left: 8%; transition: all .2s linear;}
.designs_top_blank_space{height: calc(100vw * .12);}
.poster_bottom { margin-bottom: -20px; height: 100%;}
.filler { 
  background: url(_images/_posters_type_filler.png) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width: 100%;
  height: 466px;
  position: relative;
  top: -50px;
}
.posterThumbnails .clearfix img {
  -webkit-filter: grayscale(.0); 
  filter: grayscale(.0);
  -webkit-transform: rotateX(-1deg);
  transform: rotateX(-.9deg) translateZ(2px);
  border: 0; width: 220px; 
  width: 190px; 
  margin: 0px; 
  padding: 0px; 
  border-bottom: 20px solid #222222;
  box-shadow: 0 -35px 80px -45px rgba(0,0,0,1);
  transition: all .3s ease-out; 
}

.posterThumbnails .clearfix img.small {
  -webkit-transform: rotateX(-1deg);
  transform: rotateX(-1.25deg) translateZ(2px);
  border: 0; width: 220px; 
  width: 190px; 
  margin: 0px; 
  padding: 0px; 
  border-bottom: 20px solid #222222;
  box-shadow: 0 -35px 80px -45px rgba(0,0,0,1);
  transition: all .3s ease-out; 
}

.posterThumbnails .clearfix img.xsmall {
  -webkit-transform: rotateX(-1deg);
  transform: rotateX(-1.5deg) translateZ(1px);
  border: 0; width: 220px; 
  width: 190px; 
  margin: 0px; 
  padding: 0px; 
  border-bottom: 20px solid #222222;
  box-shadow: 0 -35px 80px -45px rgba(0,0,0,1);
  transition: all .3s ease-out; 
}

.posterThumbnails .clearfix img:hover {
  box-shadow: 0 -6px 15px -8px rgba(0,0,0,1);
  -webkit-transform: rotateX(0deg);
  transform: rotateX(0deg);
  transition: all .06s linear; 
}
.posterThumbnails .clearfix .hvr-buzz_bg{padding: 0px;}
.posterThumbnails .clearfix img:active{-ms-transform: scale(.99); -webkit-transform: scale(.99); transform: scale(.99);}

#thumbnails.posterThumbnails {position: relative; display: inline-block; max-width: 1000px; transition: all .3s linear;}
#thumbnails.posterThumbnails ul li {float: left; margin: 0px;}
#thumbnails.posterThumbnails h2 {color: #222222; letter-spacing: 0px; font-size: 30px; margin-bottom: 40px; margin-top: 30px;}

.posterThumbnails .hvr-buzz_bg {
  margin: 20px; 
  padding: 0px;
  -webkit-perspective: 125px;
  perspective: 125px;
}

.l_and_p_top {  
  background-color: #fd6a62;
  height:30px;
  top:0px;
  padding-top: 10px;
  margin-bottom: 0px;
  position: relative;
  text-align: center;
  margin-left: 5%;
  width: 95%;
  transition: all .2s linear;
}

.illust_top {  
  background-color: #0ac2d2;
  height:30px;
  top:0px;
  padding-top: 10px;
  margin-bottom: 0px;
  position: relative;
  text-align: center;
  margin-left: 5%;
  width: 95%;
  transition: all .2s linear;
}

/*------Handles*-------*/
::-webkit-scrollbar {
    -webkit-box-shadow: none; 
    -webkit-border-radius: 0px;
    border-radius: 0px;
    background-color: black;
}
 
::-webkit-scrollbar {
    width: 5px;
}

::-webkit-scrollbar-thumb {
    -webkit-border-radius: 1px;
    border-radius: 1px;
    background: #167ec9; 
    -webkit-box-shadow: none; 
}
::-webkit-scrollbar-thumb:window-inactive {
  background: #215e89; 
}
::-webkit-scrollbar-corner {background-color: transparent; }



/* ----------------- jumb image slider ----------------- */
.slider_prspctive{
/*  -webkit-perspective: 80px;
  perspective: 80px;*/
  height: 100%;
  width: 100%;
  position: relative;
  top:0;}
.slider_solid{
  height: 100%;
  width: 100%;
  position: relative;
  top:0;}

.smallPhoneBG{
  background: url(_images/jumb/smallPhoneBG.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;}
/*.image01{
  background: url(_images/jumb/01.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;}
.image02 {
  background: url(_images/jumb/002.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function:linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function:linear;
  animation-iteration-count: infinite;}
.image03{
  background: url(_images/jumb/003.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function:linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function:linear;
  animation-iteration-count: infinite;}
.image04{
  background: url(_images/jumb/004.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function:linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function:linear;
  animation-iteration-count: infinite;}
.image05 {
  background: url(_images/jumb/005.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function:linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function:linear;
  animation-iteration-count: infinite;}
.image06{
  background: url(_images/jumb/006.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function:linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function:linear;
  animation-iteration-count: infinite;}
.image07{
  background: url(_images/jumb/007.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function:linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function:linear;
  animation-iteration-count: infinite;}
.image08 {
  background: url(_images/jumb/008.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function:linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function:linear;
  animation-iteration-count: infinite;}
.image09{
  background: url(_images/jumb/009.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function:linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function:linear;
  animation-iteration-count: infinite;}
.image10{
  background: url(_images/jumb/010.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function:linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function:linear;
  animation-iteration-count: infinite;}
.image11 {
  background: url(_images/jumb/011.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function:linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function:linear;
  animation-iteration-count: infinite;}
.image12{
  background: url(_images/jumb/012.jpg) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-animation-name: sliderZoom;
  -webkit-animation-duration: 9s;
  -webkit-animation-timing-function:linear;
  -webkit-animation-iteration-count: infinite;
  animation-name: sliderZoom;
  animation-duration: 9s;
  animation-timing-function:linear;
  animation-iteration-count: infinite;}*/

.imageDirt{
  background: url(_images/jumb/dirt.png) no-repeat center center;
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;

}
.imageGrid{
  background: url(_images/dot.png) repeat center center ; 
  position: absolute; top:0; left:0; right: 0; bottom: 0;
  height: 100%;
  width: 100%;
  top:0;
  opacity: .8;
    -webkit-filter: grayscale(.5); 
  filter: grayscale(.5);
}

.fullscreen-bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    /*z-index: -100;*/
}

.fullscreen-bg__video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}



@media (min-width: 1550px){
  .main .title{margin: 28% auto 40% auto;} 
  #profile .smallCenter{margin-left: 20%;} 
  #profile .profText{margin: 20px 0px 20px -60px;}
  #profile h2 {margin: 0px 0px 0px -60px;}
      #video{margin-left: 8%;}
      .contFifteen{margin: 0px 0px 0px 0px;}
  .fearText {width:37%; margin-top: 0px; -webkit-transition-delay: .5s; transition-delay: .5s;}
  .indexThumbnails .clearfix img {width: 110px;}
  #thumbnails.indexThumbnails {float: left; margin: 0px}
  .interestingStufsImg {height: 180px; margin: 20px 0px 0px -140px;}
      #we_icon img {margin: 30px 0  -20px 140px; width: 250px;}
      #edu_icon img {margin: 30px 0  -20px 165px; width: 250px;}
      #sftwr_icon img {margin: 30px 0  -20px 150px; width: 250px;}
      #skills_icon img {margin: 30px 0  -20px 175px; width: 250px;}
      #award_icon img {margin: 30px 0  -20px 150px; width: 250px;}
      #resume .leftCol .textBGs{margin-top: 27px;  
                        transform: rotateX(10deg) translateZ(12px);
                        box-shadow: 0 30px 80px -47px rgba(0,70,200,1);}
      #resume .rightCol .textBGs{margin-top: 27px;  
                        transform: rotateX(10deg) translateZ(12px);
                        box-shadow: 0 30px 80px -47px rgba(0,70,200,1);}
      #resume .rightCol .textBGs:hover, #resume .leftCol .textBGs:hover {
                        box-shadow: 0 12px 25px -15px rgba(0,70,200,1);}
  #contact .DashedCont{ 
    margin: -40px 150px 0px 150px;
    border-bottom-left-radius: 150px;  
    border-bottom-right-radius: 150px;}

#thumbnails.posterThumbnails {max-width: 1200px;}
.posters_top, .l_and_p_top, .illust_top {margin-left: 0%; width: 100%;}
.thumbs_backgrnd{position: relative; top:-25px; margin-left: 0; }
}

@media (max-width: 1200px){ 
  #profile .profText{margin: 20px 0% 20px 8%;}
  #profile h2 {margin: 0px 0px 0px 8%;}
  #profile img.soh{margin-top: 30px;}
      #reelSize{width: 785px; height: 441px;}
      .reelStrip{height: 441px;}
  .fearText {width: 700px; padding-top: 45px; height: auto;}
  .fearText p{line-height: 110%;}
      .twoScriptedVid-Display{display: none;}
#designs img {height: 230px; border: 4px solid #333333; box-shadow: 0 0 37px rgba(0,0,0,0.8);}
#designs a:hover img {border: 4px solid #f8c63d;}
#designs a:active img {box-shadow: 0 0 17px 4px rgba(0,0,0,1);}
  .circlePostersBadge {left: -4px;top: 72px;}
.circleIllusBadge {left: -16px; top: 101px;}
.circleLogosBadge {left: 0px; top: 61px;}
h1.titleCircle span {font-size: 15px; height: 133px;}
      .indexThumbnails .clearfix img {width: 63px;}
      #thumbnails.indexThumbnails {float: left; margin: 0px 0% 0px 15%;}
      .interestingStufsImg {height: 150px; margin: -8px 0px 0px -5%;}
  #resume .textBGs{border-top: 20px solid rgba(0,0,0,.8);}
  #resume .leftCol .textBGs{margin-right: 2%;}
  #resume .rightCol .textBGs{margin-left: 2%;}
  #we_icon img {margin: 30px 0  -20px 75px; width: 200px;}
  #edu_icon img {margin: 30px 0  -20px 110px; width: 200px;}
  #sftwr_icon img {margin: 30px 0  -20px 90px; width: 200px;}
  #skills_icon img {margin: 30px 0  -20px 110px; width: 200px;}
  #award_icon img {margin: 30px 0  -20px 85px; width: 200px;}
  #resume .leftCol .textBGs{margin-top: 27px;  
                    transform: rotateX(10deg) translateZ(12px);
                    box-shadow: 0 27px 73px -42px rgba(0,70,200,1);}
  #resume .rightCol .textBGs{margin-top: 27px;  
                    transform: rotateX(10deg) translateZ(12px);
                    box-shadow: 0 27px 73px -42px rgba(0,70,200,1);}
  #resume .rightCol .textBGs:hover, #resume .leftCol .textBGs:hover {
                    box-shadow: 0 12px 25px -15px rgba(0,70,200,1);}
      #contact .DashedCont{ 
        margin: -40px 40px 0px 40px;
        border-bottom-left-radius: 100px;  
        border-bottom-right-radius: 100px;
      }
      #contact  img.btn_hi{height: 140px;}
      #contact button.btn_proj_inq{
      font-size: 21px; 
      padding: 13px 35px 12px 35px; 
      margin-top: 35px;
      margin-left: -65px;
      }
  .social_icons i{
    padding: 16px 7px 7px 8px; 
    height: 60px; width: 60px;
    font-size: 28px; 
  }
  .social_icons i:hover {transform: scale(1.15);}

#thumbnails.posterThumbnails {max-width: 767px;}
.posters_top, .l_and_p_top, .illust_top {margin-left: 10%; width: 90%;}
.thumbs_backgrnd{position: relative; top:-38px; margin-left: 8.5%;}
}

@media (max-width: 992px){
  .navbar  {right: 3%;}
  #profile .row * { text-align: center; } 
  #profile h2{margin-left: -5px}
  #profile img.soh{margin-top: 30px;}
  #profile .horz{display: none;}
  #profile .vert{display: inline-block;}
  #HIicon{margin: 15px 15px 5px 15px;}
  #profile .smallCenter {margin-right: 15%;}
  #profile .profText{padding-bottom: 30px;}
  #profile h2 {margin: 0px 0px 0px 0px;}
        #reelSize{width: 585px; height: 337px;}
        .reelStrip{height: 337px;}
  .fearText{width: 585px;}
  .fearVid{width: 585px; height: 337px;}
  #designs img{height: 175px; border: 3px solid #333333; box-shadow: 0 0 22px rgba(0,0,0,0.6);}
  #designs a:hover img {border: 3px solid #f8c63d;}
  #designs a:active img {box-shadow: 0 0 15px 4px rgba(0,0,0,8);}
  .circlePostersBadge {left: -6px; top: 58px;}
  .circleIllusBadge {left: -15px; top: 81px;}
  .circleLogosBadge {left: -1px; top: 49px;}
  h1.titleCircle span {/*font-size: 15px;*/ height: 101px;}
        .indexThumbnails .clearfix img {width: 59px;}
        .interestingStufsImg {display: none;}
        #thumbnails.indexThumbnails {float: right; margin: 0px 3% 0px -8%;}
  #resume .textBGs{border-top: 17px solid rgba(0,0,0,.8);}
  #resume { box-shadow: inset 300px 0 300px -300px rgba(0,0,0,.50), inset -300px 0 300px -300px rgba(0,0,0,.50), inset 0 400px 400px -400px rgba(0,0,0,.85);}
  #we_icon img {margin: 25px 0  -15px 16%; width: 180px;}
  #edu_icon img {margin: 25px 0  -15px 23%; width: 180px;}
  #sftwr_icon img {margin: 25px 0  -15px 16%;width: 180px;}
  #skills_icon img {margin: 25px 0  -15px 23%; width: 180px;}
  #award_icon img {margin: 25px 0  -15px 18%; width: 180px;}
  #resume .leftCol .textBGs{margin-top: 27px;
            -webkit-transform: rotateX(7deg);  
                    transform: rotateX(7deg) translateZ(10px);
                    box-shadow: 0 20px 70px -30px rgba(0,70,200,1);}
  #resume .rightCol .textBGs{margin-top: 27px;
            -webkit-transform: rotateX(7deg);  
                    transform: rotateX(7deg) translateZ(10px);
                    box-shadow: 0 20px 70px -30px rgba(0,70,200,1);}
  #resume .rightCol .textBGs:hover, #resume .leftCol .textBGs:hover {
                    box-shadow: 0 12px 20px -15px rgba(0,70,200,1);}  
  #resume #letterSqeez{font-size: 14px; letter-spacing: -1px;}
          #contact .DashedCont{ 
            margin: -40px 30px 0px 30px;
            border: none;
            padding-bottom: 20px;
          }
          #contact  img.btn_hi{height: 130px; margin-left: -50px;}
          #contact button.btn_proj_inq{
          padding: 12px 25px 11px 25px; 
          margin-top: 32px;
          margin-left: -25px;
          }
  .social_icons i{
    padding: 15px 7px 7px 8px; 
    height: 55px; width: 55px;
    font-size: 26px; 
  }
  .social_icons i:hover {transform: scale(1.14);}

#thumbnails.posterThumbnails {max-width: 532px;}
.posters_top, .l_and_p_top, .illust_top {margin-left: 10%; width: 90%;}
.thumbs_backgrnd{position: relative; top:-35px; margin-left: 11%;}
}

@media (max-width: 767px) { 
        .contFifteen{margin: 0px 0px 0px 0px;}
  .hidden-phone{display: none;}
  .navbar {background: rgba(0,0,0,1);}
.main .jumbBG{height: 420px; background-size: 420px;}
.main .jumbBG p{font-size: 16px; line-height: 115%; top: 230px; width: 340px;}
.main .jumbBG p.second_p{width: 310px;}
.main .jumbBG span p{margin-top: .5em;}
.main .jumbBG button{top: -29px;}
        #reel h2.showreeltitle{margin-top:28px; margin-bottom: 29px;}
        .reelStrip{height: 427px; margin: 40px 0px 0px 0px;}
    #resume h2 {margin-top:30px; margin-bottom: -5px; text-shadow: none;}
    #resume #letterSqeez{font-size: 16px; letter-spacing: 0px;}
    #resume .textBGs{box-shadow: none;}
    #resume .row h2 {text-shadow: none;}
  #profile h2{ margin: 30px 0px 0px -2%; padding-bottom: 0px;}
  #profile .smallCenter {margin-right: 0%;}
  #profile .profText{margin: 0px}
  #designs img{height: 145px; border: 2px solid #333333;}
  #designs a:hover img {border: 2px solid #f8c63d;}
  .circlePostersBadge {left: -6px; top: 51px;}
  .circleIllusBadge {left: -14px; top: 69px;}
  .circleLogosBadge {left: -3px; top: 43px;}
  h1.titleCircle span {font-size: 14px; height: 84px;}
       .indexThumbnails .clearfix img {width: 105px;}
        #thumbnails.indexThumbnails {float: left; margin: 0 -50px 0 0; padding: 0; left: -35px;}
  #resume .leftCol .textBGs{margin-right: 30px; margin-left: 30px;}
  #resume .rightCol .textBGs{margin-right: 30px; margin-left: 30px;}
  #resume { box-shadow: inset 120px 0 120px -120px rgba(0,0,0,.50), inset -120px 0 120px -120px rgba(0,0,0,.50), inset 0 300px 300px -300px rgba(0,0,0,.75);}
  #we_icon img {margin-left: 30%; }
  #edu_icon img {margin-left: 35%; }
  #sftwr_icon img {margin-left: 30%;}
  #skills_icon img {margin-left: 35%; }
  #award_icon img {margin-left: 30%; }
  #resume .midBorder{border-right: 0}
  #resume .leftCol .textBGs{margin-top: 27px;
            -webkit-transform: rotateX(0) rotateY(0deg);  
                    transform: rotateX(0) translateZ(0px);
                    box-shadow: none;}
  #resume .rightCol .textBGs{margin-top: 27px;
            -webkit-transform: rotateX(0) rotateY(0deg);  
                    transform: rotateX(0) translateZ(0px);
                    box-shadow: none;}
  #resume .rightCol .textBGs:hover, #resume .leftCol .textBGs:hover {
                    box-shadow: none;}
  #resume .y_prspctive{
    -webkit-perspective: none;
    perspective: none;}
        .container .scroll-down { width: 100%; right: 0px;  height: 80px; bottom: 0px; border-radius: 0px;}
        .container .scroll-down .glyphicon { position: absolute; display: inline-block; top: -10px; right: 45%;}
  .logo {display: none;}
  .navbar  { left: 0px; width: 100%; }
  .navbar .nav > li { height: 60px; }
  .navbar .nav > li a { height: 60px; text-align: center; padding-top: 20px; font-weight: 600; color: #FFFFFF; }
  .navbar .nav > li a.topColNav { border-radius: 0px;}
  .navbar .nav > li a.bottColNav{ border-radius: 0px;}
  .fixed .navbar { top: 0px; }
        #contact h2.secondaryTitle {font-size: 26px;} 
        #contact  img.btn_hi{height: 120px; margin-left: -55px;}
        #contact button.btn_proj_inq{
        font-size: 20px; 
        padding: 11px 20px 10px 20px; 
        margin-top: 28px;
        margin-left: -25px;
        }
        .social_icons i{
          padding: 13px 7px 7px 8px; 
          height: 50px; width: 50px;
          font-size: 24px; 
        }
        .social_icons i:hover {transform: scale(1.14);}

.side_bar ul {padding-top: 40px;}
.side_bar {width: 80px;}
.side_bar a {height: 70px; padding: 24px 0 30px 0; font-weight: 600; font-size: 14px;}
      .posterThumbnails .clearfix img, 
      .posterThumbnails .clearfix img.small, 
      .posterThumbnails .clearfix img.xsmall {
        -webkit-transform: rotateX(0deg);
        transform: rotateX(0deg) translateZ(0px);
        box-shadow: none;}
      .posterThumbnails .clearfix img:hover {box-shadow: none;}
      .posterThumbnails .hvr-buzz_bg {-webkit-perspective: none; perspective: none;}
} 


@media (max-width: 630px) {
  .noMobileDisplay {display: none;}
  #reelSize{width: 520px; height: 292px;}
  .reelStrip{height: 427px; margin: 20px 0px 0px 0px;}
  #designs img{height: 110px;}
  .indexThumbnails .clearfix img {width: 75px;}
  .char10 {width: 11px;}
  h1.titleCircle span {font-size: 10px; height: 78px;}
  #we_icon img {margin-left: 28%; }
  #edu_icon img {margin-left: 33%; }
  #sftwr_icon img {margin-left: 28%;}
  #skills_icon img {margin-left: 33%; }
  #award_icon img {margin-left: 28%; }

.side_bar ul {padding-top: 26px;}
#thumbnails.posterThumbnails {max-width: 303px;}
.posters_top, .l_and_p_top, .illust_top {margin-left: 12%; width: 88%;}
.thumbs_backgrnd{position: relative; top:-35px; margin-left: 13%;}
}

@media (max-width: 550px) {
  .sliderSmallphone {display: block;}
  .slider_prspctive{
  -webkit-perspective: none;
  perspective: none;}
  .sliderNormal {display: none;}
  .imageGrid {opacity: .0;}
  #reelSize{width: 420px; height: 236px;}
  .reelStrip{height: 427px; margin: -10px 0px 0px 0px;}
}


@media (max-width: 450px) {
.main .jumbBG{height: 380px; background-size: 300px;}
.main .jumbBG p{font-size: 13px; line-height: 125%; top: 195px; width: 280px;}
.main .jumbBG p.second_p{display: none;}
.main .jumbBG p.phoneDisplay{display: inline-block;}
.main .jumbBG span p{margin-top: -2em; }
#HIicon{margin: 15px 10px 5px 10px;}
        #reel h2.showreeltitle {margin-top:28px; margin-bottom: 29px; font-size: 26px;}
        #reelBreakBtn h2{padding: 15px 2px 15px 6px; font-size: 17px; width: 240px;}
        #reelSize{width: 335px; height: 188px;}
        .reelStrip{height: 350px; margin: 0px 0px 0px 0px;}
  #resume #letterSqeez{font-size: 16px; letter-spacing: -1px;}
  #resume .leftCol .textBGs{margin-right: 5px; margin-left: 5px;}
  #resume .rightCol .textBGs{margin-right: 5px; margin-left: 5px;}
  #resume h2 {margin-top:30px; margin-bottom: -5px; font-size: 26px;}
  #resume .row h2, #resume h3, #resume .row p, #resume .textBGs{text-align: center;}
        #we_icon img {margin-left: 24%; width: 155px;}
        #edu_icon img {margin-left: 30%; width: 155px;}
        #sftwr_icon img {margin-left: 25%; width: 155px;}
        #skills_icon img {margin-left: 31%; width: 155px;}
        #award_icon img {margin-left: 23%; width: 155px;}
  #designs h2 {margin-top:30px; font-size: 26px;}
  #designs img{height: 90px;}
  #designs .designBtnsContainer{margin-bottom: 30px;}
  .circlePostersBadge {left: -7px; top: 42px;}
  .circleIllusBadge {left: -12px; top: 54px;}
  .circleLogosBadge {left: -4px; top: 36px;}
  .char10 {width: 11px;}
  h1.titleCircle span {font-size: 10px; height: 58px;}
        .indexThumbnails .clearfix img {width: 61px;}
        #thumbnails.indexThumbnails {float: left; margin: 0 -65px 0 0px; padding: 0; left: -50px;}
  #contact  img.btn_hi{height: 100px; margin-left: -70px;}
  #contact button.btn_proj_inq{
  font-size: 17px; 
  padding: 10px 15px 9px 15px; 
  margin-top: 23px;
  margin-left: -40px;}
        .social_icons {margin: 50px 0% 50px -10%;}
        .social_icons i:hover {transform: scale(1.1);}

#thumbnails.posterThumbnails {max-width: 303px;}
.posters_top, .l_and_p_top, .illust_top {margin-left: 17%; width: 83%;}
.thumbs_backgrnd{position: relative; top:-37px; margin-left: 20%;}
}

@media (max-width: 320px) {
  #profile img.soh{height: 200px;}
  #profile .profText p{font-size: 16px; margin: 0 -10px;}
  #HIicon{margin: 15px 5px 5px 5px;}
        #reelSize{width: 280px; height: 157px;}
        .reelStrip{height: 350px; margin: -15px 0px 0px 0px;}
 .noSmallPhoneDisplay{display: none;}
  #designs .designBtnsContainer{margin-top: 10px;}
  #designs h2 {margin-bottom: 0px;}
  #designs img{height: 75px;}
  h1.titleCircle span {font-size: 9px; height: 56px;}
        #resume .leftCol .textBGs{margin-right: -15px; margin-left: -15px;}
        #resume .rightCol .textBGs{margin-right: -15px; margin-left: -15px;}
        #we_icon img {margin-left: 19%; width: 155px;}
        #edu_icon img {margin-left: 25%; width: 155px;}
        #sftwr_icon img {margin-left: 20%; width: 155px;}
        #skills_icon img {margin-left: 26%; width: 155px;}
        #award_icon img {margin-left: 18%; width: 155px;}
  #contact h2{letter-spacing: 2px;}
  #contact  img.btn_hi{height: 90px; margin-left: -80px;}
  #contact button.btn_proj_inq{
  padding: 10px 15px 9px 15px; 
  margin-top: 20px;
  margin-left: -40px;
  }
  .social_icons {margin: 50px 0% 50px -13%;}
}

@media only screen and (orientation: landscape) and (max-height: 768px) {
.main .jumbBG{height: 480px; background-size: 420px;}
.main .jumbBG p{font-size: 16px; line-height: 115%; top: 250px; width: 340px;}
.main .jumbBG p.second_p{width: 300px;}
}
@media only screen and (orientation: landscape) and (max-height: 420px) and (max-width: 767px) {
  .main .jumbBG{height: 380px; background-size: 200px;}
  .main .jumbBG p{font-size: 11px; line-height: 110%; top: 195px; width: 150px;}
  .main .jumbBG p.second_p{display: none;}
  .main .jumbBG p.phoneDisplay{display: none;}
  .main .jumbBG p.phoneVertDisplay{display: inline-block;}
  .main .jumbBG button{left: 2px;}

}

@media only screen and (orientation: landscape) and (max-height: 550px) and (max-width: 1100px) {
  .sliderSmallphone {display: inline-block;}
  .slider_prspctive{
  -webkit-perspective: none;
  perspective: none;}
  .sliderNormal {display: none;}
  .imageGrid {opacity: .0;}
}

@media (min-aspect-ratio: 16/9) {
  .fullscreen-bg__video {
    height: 300%;
    top: -100%;
  }
}

@media (max-aspect-ratio: 16/9) {
  .fullscreen-bg__video {
    width: 300%;
    left: -100%;
  }
}


@-webkit-keyframes sliderZoom {
  0% {
  -webkit-transform: rotateX(-1deg) rotateY(0deg);
  transform: rotateX(-1deg) rotateY(0deg) translateZ(6px);
  }


  100% {
  -webkit-transform: rotateX(4deg) rotateY(0deg);
  transform: rotateX(4deg) rotateY(0deg) translateZ(40px);
  }
}

@keyframes sliderZoom {
  0% {
  -webkit-transform: rotateX(-1deg) rotateY(0deg);
  transform: rotateX(-1deg) rotateY(0deg) translateZ(5px);
  }


  100% {
  -webkit-transform: rotateX(4deg) rotateY(0deg);
  transform: rotateX(4deg) rotateY(0deg) translateZ(40px);
  }
}


.mscene{background-color: red;}

.m-scene .scene_element {
  -webkit-animation-duration: .3s;
  animation-duration: .3s;
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

.m-scene .scene_element--fadein {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;   
  -webkit-animation-duration: .8s;
  animation-duration: .8s;}

.m-scene .scene_element--fadeinup {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp; 
  -webkit-animation-duration: .3s;
  animation-duration: .3s;
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
}

.m-scene .scene_element--fadeindown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown; 
  -webkit-animation-duration: .5s;
  animation-duration: .5s;
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
}

.m-scene .scene_element--fadeinright {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight; 
}
.m-scene .scene_element--fadeinleft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft; 
  -webkit-animation-duration: .4s;
  animation-duration: .4s;}

.m-scene .scene_element--delayed {
  -webkit-animation-delay: 0.25s;
  animation-delay: 0.25s; }

.m-scene.is-exiting .scene_element {
  -webkit-animation-direction: alternate-reverse;
  animation-direction: alternate-reverse; }

.m-scene.is-exiting .scene_element--delayed {
  -webkit-animation-delay: .3s;
  animation-delay: .3s; }

.m-scene.is-exiting .scene_element--noexiting {
  -webkit-animation-direction: alternate-reverse;
  animation-direction: alternate-reverse; }



@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn; }

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -5000px, 0);
    transform: translate3d(0, -5000px, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -5000px, 0);
    -ms-transform: translate3d(0, -5000px, 0);
    transform: translate3d(0, -5000px, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none; } }

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown; }

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    -ms-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none; } }

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp; }

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-200%, 0, 0);
    transform: translate3d(-200%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-200%, 0, 0);
    -ms-transform: translate3d(-200%, 0, 0);
    transform: translate3d(-200%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none; } }

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft; }

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    -ms-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none; } }

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight; }