.custom_icon{
    width: 25px;
    height: 46px;
    border: 2px solid #fff;
    border-radius: 18px;
    position: absolute;
    left: 50%;
    bottom: 60px;
    z-index: 2;
    margin-left: -12px;
    -webkit-animation: caption-start 1.5s ease .2s infinite;
    -moz-animation: caption-start 1.5s ease .2s infinite;
    -ms-animation: caption-start 1.5s ease .2s infinite;
    -o-animation: caption-start 1.5s ease .2s infinite;
    animation: caption-start 1.5s ease .2s infinite;
}

.custom_dot{
    background: none repeat scroll 0 0 white;
    border-radius: 50%;
    height: 5px;
    left: 8px;
    opacity: 1;
    position: absolute;
    top: 9px;
    width: 5px;
}
.custom_dot:after{
    content: " ";
    background: none;
    border: 2px solid #FFF;
    border-radius: 50%;
    height: 100%;
    left: 0px;
    position: absolute;
    top: 0px;
    width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -webkit-animation: 2000ms ease-in 0ms normal none infinite circle-border-scale;
    -moz-animation: 2000ms ease-in 0ms normal none infinite circle-border-scale;
    -o-animation: 2000ms ease-in 0ms normal none infinite circle-border-scale;
    animation: 2000ms ease-in 0ms normal none infinite circle-border-scale;
    }

    
@-webkit-keyframes caption-start {
  0%{ 
        -webkit-transform: translate3d(0,0,0);
    }
  50% { 
        -webkit-transform: translate3d(0,10px,0);
    }
  100% { 
        -webkit-transform: translate3d(0,0,0);
    }
}
@-moz-keyframes caption-start{
  0%{ 
        -moz-transform: translate3d(0,0,0);
    }
  50% { 
        -moz-transform: translate3d(0,10px,0);
    }
  100% { 
        -moz-transform: translate3d(0,0,0);
    }
}
@-o-keyframes caption-start {
  0%{ 
        -o-transform: translate3d(0,0,0);
    }
  50% { 
        -o-transform: translate3d(0,10px,0);
    }
  100% { 
        -o-transform: translate3d(0,0,0);
    }
}
@keyframes caption-start {
  0%{ 
        transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
    }
  50% { 
        transform: translate3d(0,10px,0);
        -ms-transform: translate3d(0,10px,0);
    }
  100% { 
        transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
    }
}
    
@keyframes circle-border-scale{
    0% {
        width:100%;
        height:100%;
        left:0;
        top:0;
        opacity:1
    }
    30% {
        width:21px;
        height:21px;
        left:-8px;
        top:-8px;
        opacity:0;
    }
    100% {
        width:21px;
        height:21px;
        left:-8px;
        top:-8px;
        opacity:0;
    }
    
}
@-webkit-keyframes circle-border-scale{
    0% {
        width:100%;
        height:100%;
        left:0;
        top:0;
        opacity:1
    }
    30% {
        width:21px;
        height:21px;
        left:-8px;
        top:-8px;
        opacity:0;
    }
    100% {
        width:21px;
        height:21px;
        left:-8px;
        top:-8px;
        opacity:0;
    }
}

@-moz-keyframes circle-border-scale{
    0% {
        width:100%;
        height:100%;
        left:0;
        top:0;
        opacity:1
    }
    30% {
        width:21px;
        height:21px;
        left:-8px;
        top:-8px;
        opacity:0;
    }
    100% {
        width:21px;
        height:21px;
        left:-8px;
        top:-8px;
        opacity:0;
    }
}

@-o-keyframes circle-border-scale{
    0% {
        width:100%;
        height:100%;
        left:0;
        top:0;
        opacity:1
    }
    30% {
        width:21px;
        height:21px;
        left:-8px;
        top:-8px;
        opacity:0;
    }
    100% {
        width:21px;
        height:21px;
        left:-8px;
        top:-8px;
        opacity:0;
    }
}


.white{color: #fff;}
.slick-dots {
    position: absolute;
    bottom: inherit;
    display: block;
    font-size: 20px;
    width: auto;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    top: 50%;
    right: 1%;
    transform: translateY(-50%);
}


.slick-dots li {
    position: relative;
    width: 20px;
    display: block;
    height: 23px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer;
}

.slick-dots li button:before {font-size: 20px;}.contain{position: relative;}
.singleItem{
    width: 100%;
    height: 90vh;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.back-gx{background:#ee5f23;}
.back-g1{background:#bd9a79;}
.back-fan{background: #6b6b6b;}
.back-gbus{background:#e3dcd6;}

.back-one{background:#ebafb2;}
.back-two{background:#f7c3b5;}
.back-three{background: #f05e58;}
.back-four{background:#11ecf7;}
.back-five{background:#fea474;}
.back-six{background:#cf3f3f;}
.back-seven{background:#eb8350;}
.black-back{background:#000000;}
.back-nine{background: #eca12a;}
.back-ten{background:#eb5e55;}
.textSide{position: absolute;top: 50%;left: 15%;z-index: 2;transform: translateY(-50%);}
.textSide1{position: absolute;top: 33%;left: 15%;z-index: 2;}
.slick-active div .singleItem .textSide, .slick-active div .singleItem .textSide1 {    
    animation-name: fadeIn;
    animation-duration: 2s;
}

.baneerimage{position: absolute;}
.slick-active div .singleItem .baneerimage img.dito{
    animation-name: fadeInRight;
    animation-duration: 3s;
}
.slick-active div .singleItem .baneerimage img.fadeindown{
    animation-name: fadeInDown;
    animation-duration: 3s;
}
.slick-active div .singleItem .baneerimage img.zoom-In{
    animation-name: zoomIn;
    animation-duration: 3s;
}


/*.imageOne {
    top: 50%;
    transform: translate(-50%, -50%);
    left: 65%;    
}
*/
/*.imageTwo{
    left: 65%;    
    top: 50%;
    transform: translate(-50%, -50%);
}
.imageThree {
    left: 70%;
    top: 100%;
    transform: translate(-50%, -50%);
    width: 45%;
}
.imageFour {
    left: 42%;
    top: 50%;
    transform: translateY(-50%);
}
.imageFive {
    left: 40%;
    top: 55%;
    transform: translateY(-50%);
}
.imageSix {
    left: 41%;
    top: 50%;
    transform: translateY(-50%);
    width: 50%;
}
.imageSeven {
    left: 70%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 55%;
}*/
.imageSeven-desk, .bannerimage-one-desk, .imageten-desk{
    display: block !important;
}
.imageSeven-mob, .bannerimage-one-mob, .imageten-mob{
    display: none !important;
}
.bannerimage-one{
    left: 75%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 40%;
}
.imagenine{
    left: 68%;
    top: 50%;
    width: 55%;
    transform: translate(-50%, -50%);
}
.imageten{
    left: 0%;
    top: 0%;
    width: 100%;
}


@media (max-width: 1600px){
    
    .imageThree{left: 65%;top: 125%;width: 55%;}
    .imageFive {left: 33%;}
    .imageSix {top: 50%;width: 60%;left: 37%;}
    .textSide {left: 13%;}
    .custom_icon{bottom: 70px;}
    .imageSeven {left: 65%;width: 60%;}
    .bannerimage-one{top: 50%;}
    .imagenine{top: 50%;width: 60%;}
}
@media (max-width: 1350px){
    .imageThree{left: 65%;top: 90%;width: 55%;}
}
@media (max-width: 1200px){
    .imageSeven {left: 65%;width: 60%;}
}

@media only screen and (max-width:768px){
    .banner-head{font-size:42px !important;line-height:52px !important;}
    .banner-subhead{font-size:18px !important;width:100% !important;}
    }
    @media only screen and (max-width:1024px){
    .banner-subhead{font-size:18px !important;width:100% !important;}
    }
@media (max-width: 1024px){
    
    .textSide{width: 100%;top: 15%;text-align: center;left: 0;}
    .textSide1{width: 100%;top: 10%;text-align: center;left: 0;}
    /*.imageOne{width: 40%;left: 50%;top: 55%;transform: translate(-50%, -50%);}
    .imageTwo{width: 40%;left: 50%;top: 60%;transform: translate(-50%,-50%);}
    .imageThree {left: 50%;top: 100%;width: 90%;}
    .imageFour {top: 55%;left: 57%;width: 80%;transform: translate(-50%,-50%);}
    .imageFive {top: 60%;left: 50%;width: 80%;transform: translate(-50%,-50%);}
    .imageSix {left: 6%;top: 53%;width: 90%;}
    .imageSeven {left: 50%;top: 55%;width: 50%;}
*/    .imageSeven-desk, .bannerimage-one-desk, .imageten-desk{display: none !important;}
    .imageSeven-mob, .bannerimage-one-mob, .imageten-mob{display: block !important;}
    .bannerimage-one{top: 56%;left: 50%;width: 40%;}
    .banner-text{width: 80% !important;float: left;margin: 0px 10%;text-align: center;}
    .imagenine{left: 50%;width: 100%;}
}

@media (max-width: 767px){
    h1{font-size: 33px;line-height: 35px;}
    .textSide{padding: 0px 10px;}.imageOne {top: 60%;}
    .custom_icon{bottom:  115px;}.custom_icon_other{bottom:  40px !important;}
    .imageThree {left: 50%;top: 75%;width: 100%;}
    .imageFive {top: 50%;}.imageSix {top: 47%;}
    .textSide1{padding: 0 30px;}.bannerimage-one{top: 55%;}
    .imagenine{top: 50%;}.imageten{left: 0%;top: 0%;width: 100%;}
}

@media (max-width: 576px){
    /*.imageOne {top: 50%;}
    .imageTwo {top: 50%;width: 50%;}
    .imageThree {top: 87%;}
    .imageSeven {left: 50%;width: 85%;}*/
    .bannerimage-one{width: 90%;top:51%;}
    .banner-text{display: none !important;}
    /*.imageFour{top: 45%;}
    .imageSix {left: 9%;width: 85%;top: 44%;}*/
}
@media (max-width: 400px){
    .imageThree {
        top: 80%;
    }  
}
@media (max-width: 370px){
    /*.imageOne {top: 50%;}
    .imageTwo {top: 50%;width: 50%;}
    .imageThree {top: 95%;}
    .imageSeven {left: 50%;width: 65%;}*/
    .bannerimage-one{top: 57%;width: 125%;}
    /*.imageFour{top: 50%;}
    .imageSix {top: 48%;}*/
}

/*.slick-dots li:nth-child(1):hover::before {
    content: 'Fans';
    position: absolute;
    left: -40px;
    font-size: 13px;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
    color: #F2F2F5;
}
.slick-dots li:nth-child(2):hover::before {
    content: 'ET Awards';
    position: absolute;
    left: -74px;
    font-size: 13px;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
    color: #F2F2F5;
}
.slick-dots li:nth-child(3):hover::before {
    content: 'Home Automation';
    position: absolute;
    left: -118px;
    font-size: 13px;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
    color: #F2F2F5;
}
.slick-dots li:nth-child(4):hover::before {
    content: 'Nixon';
    position: absolute;
    left: -42px;
    font-size: 13px;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
    color: #F2F2F5;
}
.slick-dots li:nth-child(5):hover::before {
    content: 'Wires and Cables';
    position: absolute;
    left: -113px;
    font-size: 13px;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
    color: #F2F2F5;
}

.slick-dots li:nth-child(6):hover::before {
    content: 'Entertainment';
    position: absolute;
    left: -92px;
    font-size: 13px;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
    color: #F2F2F5;
}
.slick-dots li:nth-child(7):hover::before {
    content: 'Doorbells';
    position: absolute;
    left: -65px;
    font-size: 13px;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
    color: #F2F2F5;
}
.slick-dots li:nth-child(8):hover::before {
    content: 'MCBs and DBs';
    position: absolute;
    left: -94px;
    font-size: 13px;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
    color: #F2F2F5;
}*/

@media only screen and (min-width:768px){
.bannerimage-one-desks{display:block !important;}  
.bannerimage-one-mobs{display:none !important;}
}
@media only screen and (max-width:767px){
    .bannerimage-one-desks{display:none !important;}  
.bannerimage-one-mobs{display:block !important;margin:0px auto;}
    }