/*-------------------Main Banner-------------------*/

.WorkMainBanner{
	display: block;
  font-size: 0;
  width:100%;
  height:96vh;
  background: url("../../links/Handy/handy-MainBanner.jpg") no-repeat 50% 50%;
  background-size: cover;
  text-align: center;
  overflow: hidden;
  position: relative;
}

.Handy-logo{
  display: block;
  position: relative;
  width: 14%;
  margin: auto;
  top: 43%;
  min-width: 150px;
  /*transform: translateX(-50%) translateY(-50%);*/
}

  /*-------------------Awards-------------------*/

.award-logo{
  display: block;
  width: 100%;
  margin-top: 32px;
  font-size: 0;
}

.award-logo img{
  display: inline-block;
  width: 56px;
  padding-right: 16px;
  vertical-align: middle;
}

.award-logo span{
  display: inline-block;
  vertical-align: middle;
}


  /*-------------------Video-------------------*/

  .videoWrapper {
    display: block;
    position: relative;
  }
  .videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }



@keyframes FadeInOut {
  0% {
    opacity: .4;
  }
  50%{
  	opacity: 1;
  }
  100% {
    opacity: .4;
  }
}

@keyframes MoveUPDown {
  0% {
    transform: translateY(0px);
  }
  50%{
      transform: translateY(5px);
  }
  100% {
        transform: translateY(0px);
  }
}


.Proj_Maintitle{
display: block;
}

#WorkDetails_Container{
  -webkit-transition: all 300ms ease-out;
  -moz-transition: all 300ms ease-out;
  -o-transition: all 300ms ease-out;
  -ms-transition: all 300ms ease-out;
  transition: all 300ms ease-out; 
}


.slick-slider  div{
  -webkit-user-select: text !important; 
  -khtml-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
}
.slick-list div.draggable {
  -webkit-user-select: none !important;
  -khtml-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
}






/*-------------------  Big Img  -------------------*/

.Buskers-hero-img{
  display: block;
  height: 650px;
  overflow: hidden;
  background: url("../../links/Buskers/Buskers-4.jpg") no-repeat 50%;
  background-size: cover;
}




/* ----------- Call Out ----------- */

.TO_CallOut{
  display:block;
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: 300;
  font-size: 25pt;
  line-height: 150%;
  text-align: center;
  width: 65%;
  margin: 15% auto;
  position: relative;
  z-index: 9999;
}

.TO_CallOut span:nth-child(1){
  font-weight: 600;
}

.TO_CallOut span:nth-child(4){
  font-size: 15pt;
}











/* ----------- Work_Details_Holder ----------- */
.Work_Details_Holder_P1{
  width: 100%;
  background-color: white;
}





/* Feature */

.Slider_WorkDetails{
  overflow: hidden;
}

.slick-slide:focus { outline: none; }


/* F 1 */

.F1_Holder{
  margin: 0 auto 120px;
  position: relative;
  display: block;
}

.F1_Holder img{
  width: 102%;
  display: block;
  position: relative;
  margin: 40px auto;
  /* max-width: 750px; */
  margin-left: 50%;
  transform: translateX(-50%);
}

.F1_Holder img:nth-child(4){
  float: right;
  margin: 0 0 0 0;
}

.F1_Holder > span {
  display: block;
  padding-bottom: 80px;
  text-align: center;
}

.handy-Features-VR.F1_Holder{
  max-width: 1200px;
  margin: 0 auto 80px;
  padding: 0 40px;
}

.handy-Features-VR.F1_Holder > span {
  text-align: left;
}

.F1_Holder > div > span, .F1_Holder > div{
  display: block;
  padding-bottom: 40px;
}

.handy-Features-IRS.F1_Holder > div{
  display: block;
  font-size: 0;
}

/* F 2 */

.F2_Holder{
  width: 100%;
  margin: 0 auto 160px;
  position: relative;
  display: block;
  text-align: left;
  font-size: 0;
}

.F2-img{
  display: inline-block;
  position: relative;
  width: 50%;
  left: -40px;
  padding: 0 5% 0 0;
  overflow: hidden;
  text-align: right;
  vertical-align: middle;
}

.F2-img img{
  width: 47.5%;
  padding: 0 0 5% 0;
}

.F2-img img:first-child{
  float: left;
}


/*  F3  */
.handy-Features-VR.F3_Holder{
  margin: 80px auto 0;
  display: block;  
  max-width: 2000px;
  padding: 40px;
}

.handy-Features-VR.F3_Holder img{
  width: 100%;
}

.handy-Features-IRS.F3_Holder{
  margin: 10% auto;
  position: relative;
  display: block;
  text-align: center;
  background-color: #283c55;
}

.handy-Features-VR-P4 img{
  width: 100%;
}

.big-numbers{
  display: block;
  position: relative;
}

.big-numbers>div{
  display: block;
  margin-bottom: 32px;
  font-size: 0;
}

.big-numbers > div > div > span{
  display: block;
}

/*  F4  */
.F4_Holder{
  width: 85%;
  display: block;
  position: relative;
  margin: 10% auto;
}

.F4_Holder img:first-child{
  width: 100%;
}

.F4_Holder img:last-child{
  width: 13%;
  position: absolute;
  bottom: 10%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 100;
}

/*  F5  */
.F5-Holder{
  display: block;
  position: relative;
}

.F5-child{
  display: block;
  position: relative;
  width: 100%;
  font-size: 0;
}

.F5-child.Mobile{
  display: none;
}

.F5-child .F2_Details{
  display: inline-block;
  text-align: left;
  width: 50%;
  padding: 160px;
  vertical-align: middle;
  box-sizing: border-box;
}


.F5-child div{
  display: inline-block;
  position: relative;
  width: 50%;
  vertical-align: middle;
  /*background: url("../../links/Handy/handy1.png") no-repeat 50%;
  background-size: auto;*/
}

.F5-child div img{
  display: inline-block;
  position: relative;
  z-index: 100;
  /*top: 70%;*/
  /*left: -37.5px;*/
  /*right: 0;
  transform: translateY(-50%);*/
  width: 100%;
}

.F6_Holder{
  display: block;
  position: relative;
  width: 100%;
  margin: 120px auto;
  text-align: center;
}

.F5-child .handy-bg-1{
  display: block;
  position: absolute;
  z-index: -999999;
  width: 100%;
  height: 100%;
  left: 0;
  top: 120px;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#002854+0,002751+100&0.05+0,0+100 */
  background: -moz-linear-gradient(top,  rgba(0,40,84,0.05) 0%, rgba(0,39,81,0) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(0,40,84,0.05) 0%,rgba(0,39,81,0) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(0,40,84,0.05) 0%,rgba(0,39,81,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0d002854', endColorstr='#00002751',GradientType=0 ); /* IE6-9 */
}

.handy-last-banner{
  display: block;
  width: 100%;
  height: 400px;
  background: url("../../links/Handy/handy-last.png") no-repeat 50%;
  background-size: cover;
  margin-bottom: 3%; 
}

.handy-sponsors{
  margin: 80px auto 120px;
  position: relative;
  display: block;
  max-width: 1200px;
}

.handy-sponsors img{
  width: 100%;
}

/*=========================================Behind Scenes=================================================*/

.Sub-Features-OuterHolder{
  display: block;
  position: relative;
  margin: 0 auto 120px;
  padding: 0 40px;
  max-width: 1200px;
  text-align: center;
}

.Sub-Features-Holder{
  display: block;
  position: relative;
  margin: auto;
  padding: 40px;
  max-width: 1200px;
  font-size: 0%;
  background-color: rgba(34,31,32,0.01);
  border-radius: 8px;
  box-sizing: border-box;
}

.Sub-Features{
  display: inline-block;
  position: relative;
  width: 25%;
  text-align: center;
  opacity: .5;
  cursor: pointer;
  vertical-align: top;
}

.Sub-Features:hover{
  opacity: 1;

  -webkit-transition: all 300ms ease-out;
  -moz-transition: all 300ms ease-out;
  -o-transition: all 300ms ease-out;
  -ms-transition: all 300ms ease-out;
  transition: all 300ms ease-out; 
}

.Sub-Features img{
  padding-right: 8px;
  vertical-align: middle;
}

.Sub-Features span{
  vertical-align: middle;
}

.handy-Features-VR.F2_Holder{
  text-align: center;
}


.handy-Features-VR.F2_Holder video{
  padding: 40px;
  max-width: 1200px;
  margin: auto;
  box-sizing: border-box;
}

.handy-VR-Flow-1{
  padding: 40px 40px 120px;
  max-width: 1200px;
  margin: auto;
  box-sizing: border-box;
}

.handy-VR-Flow-1 img{
  width: 100%;
}

.handy-Features-VR-P4{
  display: block;
  position: relative;
  font-size: 0;
  margin-bottom: 160px;
}

.handy-Features-VR-P4 .VR-Video{
  text-align: center;
  padding-right: 40px;
  box-sizing: border-box;
}

.handy-Features-VR-P4 div video{
  width: 100%;
  max-width: 560px;
}

.handy-Features-VR-P4 div span, .handy-Features-VR-P4 div p{
  max-width: 560px;
}

.handy-Features-VR-P4 div img{
  display: block;
  margin-top: 80px;
  width: 100%;
}


.IRS-icon-holder {
  display: block;
  position: relative;
  font-size: 0;
  max-width: 540px;
}

.IRS-icon-holder div{
  display: inline-block;
  vertical-align: top;
  text-align: center;
  width: 33%;
}

.handy-Features-IRS.F1_Holder > div > div > span {
  display: block;
  padding-bottom: 40px;
}

.IRS-icon-holder div img, .IRS-icon-holder div span{
  display: block;
  margin: auto;
  height: 80px;
  transform: none;
}

.IRS-icon-holder div img{
  margin-bottom: 16px;
}

.IRS-video-holder{
  width: 50%;
  max-width: 480px;
  padding: 6% 0 0 0;
}

.IRS-video-holder>div{
  width: 50%;
  margin: auto;
}

.handy-Features-IRS.F2_Holder > div {
  padding-right: 80px;
  box-sizing: border-box;
}

.handy-Features-IRS.F2_Holder img{
  width: 100%;
}

.handy-Features-IRS.F2_Holder > div:nth-child(2){
  max-width: 800px;
}

.handy-Features-IRS.F2_Holder > div > span, .handy-Features-IRS.F2_Holder > div > p{
  display: block;
  padding-bottom: 40px;
  box-sizing: border-box;
}

.handy-Features-IRS.F2_Holder > div > p{
  padding-bottom: 80px;
}

.Video-Width{
  width: 60%;
  max-width: 400px;
  margin: auto;
}

.handy-Features-VR-P4.handy-Phone{
  padding: 0 40px;
  max-width: 1200px;
  text-align: left;
  margin: 0 auto 180px;
}

.handy-Features-VR-P4.handy-Phone > div > img{
  margin: auto;
  padding-right: 80px;
  box-sizing: border-box;
}

.handy-Features-VR-P4.handy-MK{
  /* max-width: 1200px; */
  text-align: left;
  margin: 0 auto 180px;
}

.handy-Features-VR-P4.handy-MK .margin-b-80{
  padding-right: 40px;
  margin-bottom: 80px;
  box-sizing: border-box;
}

.handy-Features-VR-P4.handy-MK > div > img{
  margin: auto;
  padding-right: 80px;
  box-sizing: border-box;
}

/*=========================================Computer Screens=================================================*/

@media only screen and (min-width:2400px){

  .F5-child .F2_Details {
    padding: 320px;    
  }

}

@media only screen and (max-width: 1024px){

  .F5-child{
    padding-bottom: 80px;
  }

  .F5-child .F2_Details{
    display: block;
    padding: 80px 40px;
    width: 100%;
  }

  .F5-child div{
    display: block;
    width: 100%;
  }
  
  .F5-child .handy-bg-1{
    display: none;
  }

  .F5-child.Desktop{
    display: none;
  }

  .F5-child.Mobile{
    display: block;
  }

  .Sub-Features-Holder{
    text-align: center;
  }
  
  .Sub-Features img, .Sub-Features span{
    display: block;
    margin: auto;
    padding: 0;
  }

  .Sub-Features img {
    padding: 0 0 8px;
  }

  .big-numbers > div > div > .Title-0{
    font-weight: 500;
    font-size: 32pt;
    line-height: 64px;
  }
  

}

@media only screen and (max-width: 800px) {


  .Sub-Features span{
    display: none;
  }

  .Sub-Features img{
    padding: 0;
  }

  .Sub-Features-OuterHolder{
    margin: 0 auto 80px;
  }

  .Sub-Features-Holder{
    padding: 40px 24px;
  }

  .handy-Features-VR.F1_Holder > div{
    width: 100%;
  }

  .handy-Features-VR-P4 > div{
    display: block;
    width: 100%;
    padding: 40px;
    box-sizing: border-box;
  }

  .handy-Features-VR-P4 > div > video{
    margin-bottom: 80px;
    width: 100%;
    max-width: none;
  }

  .handy-Features-VR-P4.handy-MK{
    padding: 0 40px;
  }

  .handy-Features-VR-P4.handy-MK > div{
    margin-bottom: 80px;
    padding: 0;
  }

  .handy-Features-VR-P4.handy-MK > div > img {
    margin: auto;
    padding-right: 0;
    box-sizing: border-box;
}

  .Proj_Title_Block > :nth-child(3){
    padding-bottom: 32px;
  }

  .F6_Holder {
    margin: 120px auto 0;
  }

  .handy-Features-IRS.F1_Holder > div > div{
    display: block;
    width: 100%;
    margin: auto;
  }

  .handy-Features-IRS.F1_Holder > div .margin-b-80{
    margin: 0 auto 80px;
  }

  .handy-Features-IRS.F2_Holder > div {
    display: block;
    width: 100%;
    margin: auto;
    padding: 40px;
  }

  .IRS-icon-holder {
    max-width: none;
  }

  .F1_Holder > div > span, .F1_Holder > div{
    width: 100%;
  }
}





/*=========================================mobile=================================================*/

@media only screen and (max-width: 480px) {

  .WorkMainBanner img:nth-child(3){
    right: inherit;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    top: 60%;
  }

  .award-logo img, .award-logo span{
    display: block;
    padding-bottom: 16px;
  }

  .Sub-Features-Holder{
    padding: 24px;
  }

  .Sub-Features-OuterHolder, .handy-Features-VR.F1_Holder, .handy-Features-VR-P4, .handy-sponsors, .handy-Features-VR-P4.handy-MK, .handy-Features-IRS.F2_Holder > div, .handy-Features-VR-P4.handy-Phone {
    padding: 0 24px;
  }

  .handy-Features-VR.F2_Holder video{
    padding: 0;
  }

  .handy-VR-Flow-1, .handy-Features-VR.F3_Holder{
    padding: 40px 24px;
  }

  .handy-Features-VR-P4 .VR-Video, .handy-Features-VR-P4 > div{
    padding: 0;
  }

}

@media only screen and (max-width: 375px) {
  .F3_Slider{
    width: 100%;
  }
}