/*---------------- POTR Top Arrow --------------*/
.potr_top-1 {
    opacity: 0;
}
.potr-top-line-1-animate {
    stroke-dasharray: 635;
    stroke-dashoffset: 0;
    -webkit-animation: potrTopLine1Anim 1.5s ease-in-out forwards;
    -moz-animation: potrTopLine1Anim 1.5s ease-in-out forwards;
    -ms-animation: potrTopLine1Anim 1.5s ease-in-out forwards;
    -o-animation: potrTopLine1Anim 1.5s ease-in-out forwards;
    animation: potrTopLine1Anim 1.5s ease-in-out forwards;
    
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    
}
@-webkit-keyframes potrTopLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 635;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@keyframes potrTopLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 635;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}

.potr_top-2 {
    opacity: 0;
}
.potr-top-arrow-1-animate {
    -webkit-animation: potrTopArr1Anim 1.7s ease-in-out forwards;
    -moz-animation: potrTopArr1Anim 1.7s ease-in-out forwards;
    -ms-animation: potrTopArr1Anim 1.7ss ease-in-out forwards;
    -o-animation: potrTopArr1Anim 1.7s ease-in-out forwards;
    animation: potrTopArr1Anim 1.7s ease-in-out forwards;
    
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    
}
@-webkit-keyframes potrTopArr1Anim {
    0% {
        opacity: 0;
    }
    90% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes potrTopArr1Anim {
    0% {
        opacity: 0;
    }
    90% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
/*---------------- POTR Top Arrow --------------*/


/*---------------- POTR Top Arrow --------------*/
.potr_intro-1 {
    opacity: 0;
}
.potr-intro-line-1-animate {
    stroke-dasharray: 830;
    stroke-dashoffset: 0;
    -webkit-animation: potrIntroLine1Anim 2s ease-in-out forwards;
    -moz-animation: potrIntroLine1Anim 2s ease-in-out forwards;
    -ms-animation: potrIntroLine1Anim 2s ease-in-out forwards;
    -o-animation: potrIntroLine1Anim 2s ease-in-out forwards;
    animation: potrIntroLine1Anim 2s ease-in-out forwards;
    
}
@-webkit-keyframes potrIntroLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 830;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@keyframes potrIntroLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 830;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}

.potr_intro-2 {
    opacity: 0;
}
.potr-intro-arrow-1-animate {
    -webkit-animation: potrIntroArr1Anim 2s ease-in-out forwards;
    -moz-animation: potrIntroArr1Anim 2s ease-in-out forwards;
    -ms-animation: potrIntroArr1Anim 2s ease-in-out forwards;
    -o-animation: potrIntroArr1Anim 2s ease-in-out forwards;
    animation: potrIntroArr1Anim 2s ease-in-out forwards;
    
}
@-webkit-keyframes potrIntroArr1Anim {
    0% {
        opacity: 0;
    }
    90% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes potrIntroArr1Anim {
    0% {
        opacity: 0;
    }
    90% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
/*---------------- POTR Top Arrow --------------*/


/*---------------- POTR Desktop Slide Arrow --------------*/
.potr_ui_slide-1 {
    opacity: 0;
}
.potr-ui-slide-line-1-animate {
    stroke-dasharray: 425;
    stroke-dashoffset: 0;
    -webkit-animation: potrUiSlideLine1Anim 1.5s ease-in-out forwards;
    -moz-animation: potrUiSlideLine1Anim 1.5s ease-in-out forwards;
    -ms-animation: potrUiSlideLine1Anim 1.5s ease-in-out forwards;
    -o-animation: potrUiSlideLine1Anim 1.5s ease-in-out forwards;
    animation: potrUiSlideLine1Anim 1.2s ease-in-out forwards;
    
}
@-webkit-keyframes potrUiSlideLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 425;
    }
    20% {
        opacity: 1;
        stroke-dashoffset: 425;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 850;
    }
}
@keyframes potrUiSlideLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 425;
    }
    20% {
        opacity: 1;
        stroke-dashoffset: 425;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 850;
    }
}


.potr_ui_dot-1 {
    opacity: 0;
}
.potr-ui-slide-dot-1-animate {
    -webkit-animation: potrUiSlideDot1Anim 0.8s ease-in-out forwards;
    -moz-animation: potrUiSlideDot1Anim 0.8s ease-in-out forwards;
    -ms-animation: potrUiSlideDot1Anim 0.8s ease-in-out forwards;
    -o-animation: potrUiSlideDot1Anim 0.8s ease-in-out forwards;
    animation: potrUiSlideDot1Anim 0.8s ease-in-out forwards;
    
}
@-webkit-keyframes potrUiSlideDot1Anim {
    0% {
        opacity: 0;
    }
    30% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@keyframes potrUiSlideDot1Anim {
    0% {
        opacity: 0;
    }
    30% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
/*---------------- POTR Desktop Slide Arrow --------------*/




/*---------------- POTR Desktop UI Arrow --------------*/
.potr_ui_desktop-1 {
    opacity: 0;
}
.potr-ui-desktop-line-1-animate {
    stroke-dasharray: 600;
    stroke-dashoffset: 0;
    -webkit-animation: potrUiDesktopLine1Anim 1.4s ease-in-out forwards;
    -moz-animation: potrUiDesktopLine1Anim 1.4s ease-in-out forwards;
    -ms-animation: potrUiDesktopLine1Anim 1.4s ease-in-out forwards;
    -o-animation: potrUiDesktopLine1Anim 1.4s ease-in-out forwards;
    animation: potrUiDesktopLine1Anim 1.4s ease-in-out forwards;
    
}
@-webkit-keyframes potrUiDesktopLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 600;
    }
    20% {
        opacity: 1;
        stroke-dashoffset: 600;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 1200;
    }
}
@keyframes potrUiDesktopLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 600;
    }
    20% {
        opacity: 1;
        stroke-dashoffset: 600;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 1200;
    }
}


.potr_ui_desktop-2 {
    opacity: 0;
}
.potr-ui-desktop-arrow-1-animate {
    -webkit-animation: potrUiDesktopArrow1Anim 1.7s ease-in-out forwards;
    -moz-animation: potrUiDesktopArrow1Anim 1.7s ease-in-out forwards;
    -ms-animation: potrUiDesktopArrow1Anim 1.7s ease-in-out forwards;
    -o-animation: potrUiDesktopArrow1Anim 1.7s ease-in-out forwards;
    animation: potrUiDesktopArrow1Anim 1.7s ease-in-out forwards;
    
}
@-webkit-keyframes potrUiDesktopArrow1Anim {
    0% {
        opacity: 0;
    }
    80% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes potrUiDesktopArrow1Anim {
    0% {
        opacity: 0;
    }
    80% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/*---------------- POTR Desktop UI Arrow --------------*/




/*---------------- POTR Mobile UI Arrow --------------*/
.potr_ui_mobile-1 {
    opacity: 0;
}
.potr-ui-mobile-line-1-animate {
    stroke-dasharray: 730;
    stroke-dashoffset: 0;
    -webkit-animation: potrUiMobileLine1Anim 1.5s ease-in-out forwards;
    -moz-animation: potrUiMobileLine1Anim 1.5s ease-in-out forwards;
    -ms-animation: potrUiMobileLine1Anim 1.5s ease-in-out forwards;
    -o-animation: potrUiMobileLine1Anim 1.5s ease-in-out forwards;
    animation: potrUiMobileLine1Anim 1.5s ease-in-out forwards;
    
}
@-webkit-keyframes potrUiMobileLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 730;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 1460;
    }
}
@keyframes potrUiMobileLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 730;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 1460;
    }
}


.potr_ui_mobile-2 {
    opacity: 0;
}
.potr-ui-mobile-arrow-1-animate {
    -webkit-animation: potrUiMobileArrow1Anim 1.8s ease-in-out forwards;
    -moz-animation: potrUiMobileArrow1Anim 1.8s ease-in-out forwards;
    -ms-animation: potrUiMobileArrow1Anim 1.8s ease-in-out forwards;
    -o-animation: potrUiMobileArrow1Anim 1.8s ease-in-out forwards;
    animation: potrUiMobileArrow1Anim 1.8s ease-in-out forwards;
    
}
@-webkit-keyframes potrUiMobileArrow1Anim {
    0% {
        opacity: 0;
    }
    80% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes potrUiMobileArrow1Anim {
    0% {
        opacity: 0;
    }
    80% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
/*---------------- POTR Mobile UI Arrow --------------*/





/*---------------- Services Intro Top Arrow --------------*/

.services_sme_st0{fill:none;stroke:#006BFF;stroke-width:0.75;stroke-miterlimit:10;opacity:0;stroke-dasharray: 348; stroke-dashoffset: 0;}
.services_sme_st1{fill:#006BFF;opacity: 0;}

.services_sme_top_dot_animate {
    -webkit-animation: servSMETopDotAnim 1.3s ease-in-out forwards;
    -moz-animation: servSMETopDotAnim 1.3s ease-in-out forwards;
    -ms-animation: servSMETopDotAnim 1.3s ease-in-out forwards;
    -o-animation: servSMETopDotAnim 1.3s ease-in-out forwards;
    animation: servSMETopDotAnim 1.3s ease-in-out forwards;
}
@-webkit-keyframes servSMETopDotAnim {
    0% {
        opacity: 0;
    }
    20% {
        opacity: 0;
    }
    25% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-moz-keyframes servSMETopDotAnim {
    0% {
        opacity: 0;
    }
    20% {
        opacity: 0;
    }
    25% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-ms-keyframes servSMETopDotAnim {
    0% {
        opacity: 0;
    }
    20% {
        opacity: 0;
    }
    25% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-o-keyframes servSMETopDotAnim {
    0% {
        opacity: 0;
    }
    20% {
        opacity: 0;
    }
    25% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@keyframes servSMETopDotAnim {
    0% {
        opacity: 0;
    }
    20% {
        opacity: 0;
    }
    25% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}


.services_sme_top_line_animate {
    -webkit-animation: servSMETopArrowAnim 1.3s ease-in-out forwards;
    -moz-animation: servSMETopArrowAnim 1.3s ease-in-out forwards;
    -ms-animation: servSMETopArrowAnim 1.3s ease-in-out forwards;
    -o-animation: servSMETopArrowAnim 1.3s ease-in-out forwards;
    animation: servSMETopArrowAnim 1.3s ease-in-out forwards;
}
@-webkit-keyframes servSMETopArrowAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 348;
    }
    25% {
        opacity: 0;
        stroke-dashoffset: 348;
    }
    26% {
        opacity: 1;
        stroke-dashoffset: 348;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 696;
    }
}
@-moz-keyframes servSMETopArrowAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 348;
    }
    25% {
        opacity: 0;
        stroke-dashoffset: 348;
    }
    26% {
        opacity: 1;
        stroke-dashoffset: 348;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 696;
    }
}
@-ms-keyframes servSMETopArrowAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 348;
    }
    25% {
        opacity: 0;
        stroke-dashoffset: 348;
    }
    26% {
        opacity: 1;
        stroke-dashoffset: 348;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 696;
    }
}
@-moz-keyframes servSMETopArrowAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 348;
    }
    25% {
        opacity: 0;
        stroke-dashoffset: 348;
    }
    26% {
        opacity: 1;
        stroke-dashoffset: 348;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 696;
    }
}
@keyframes servSMETopArrowAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 348;
    }
    25% {
        opacity: 0;
        stroke-dashoffset: 348;
    }
    26% {
        opacity: 1;
        stroke-dashoffset: 348;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 696;
    }
}

/*---------------- Services Intro Top Arrow --------------*/





/*---------------- Services Intro Bottom Arrow --------------*/

.services_sme_st2{fill:none;stroke:#006BFF;stroke-width:0.75;stroke-miterlimit:10;stroke-dasharray: 295; stroke-dashoffset: 0;}
.services_sme_st3{fill:none;stroke:#006BFF;stroke-width:2;stroke-miterlimit:10;}

.services_sme_btm_line_animate {
    -webkit-animation: servSMEBtmLineAnim 2.8s ease-in-out forwards;
    -moz-animation: servSMEBtmLineAnim 2.8s ease-in-out forwards;
    -ms-animation: servSMEBtmLineAnim 2.8s ease-in-out forwards;
    -o-animation: servSMEBtmLineAnim 2.8s ease-in-out forwards;
    animation: servSMEBtmLineAnim 2.8s ease-in-out forwards;
}
@-webkit-keyframes servSMEBtmLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 295;
    }
    45% {
        opacity: 0;
        stroke-dashoffset: 295;
    }
    46% {
        opacity: 1;
        stroke-dashoffset: 295;
    }
    90% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@-moz-keyframes servSMEBtmLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 295;
    }
    45% {
        opacity: 0;
        stroke-dashoffset: 295;
    }
    46% {
        opacity: 1;
        stroke-dashoffset: 295;
    }
    90% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@-ms-keyframes servSMEBtmLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 295;
    }
    45% {
        opacity: 0;
        stroke-dashoffset: 295;
    }
    46% {
        opacity: 1;
        stroke-dashoffset: 295;
    }
    90% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@-moz-keyframes servSMEBtmLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 295;
    }
    45% {
        opacity: 0;
        stroke-dashoffset: 295;
    }
    46% {
        opacity: 1;
        stroke-dashoffset: 295;
    }
    90% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@keyframes servSMEBtmLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 295;
    }
    45% {
        opacity: 0;
        stroke-dashoffset: 295;
    }
    46% {
        opacity: 1;
        stroke-dashoffset: 295;
    }
    90% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}

.services_sme_btm_arrow_animate {
    -webkit-animation: servSMEBtmArrowAnim 2.8s ease-in-out forwards;
    -moz-animation: servSMEBtmArrowAnim 2.8s ease-in-out forwards;
    -ms-animation: servSMEBtmArrowAnim 2.8s ease-in-out forwards;
    -o-animation: servSMEBtmArrowAnim 2.8s ease-in-out forwards;
    animation: servSMEBtmArrowAnim 2.8s ease-in-out forwards;
}
@-webkit-keyframes servSMEBtmArrowAnim {
    0% {
        opacity: 0;
    }
    75% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-moz-keyframes servSMEBtmArrowAnim {
    0% {
        opacity: 0;
    }
    75% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-ms-keyframes servSMEBtmArrowAnim {
    0% {
        opacity: 0;
    }
    75% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-o-keyframes servSMEBtmArrowAnim {
    0% {
        opacity: 0;
    }
    75% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@keyframes servSMEBtmArrowAnim {
    0% {
        opacity: 0;
    }
    75% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}

/*---------------- Services Intro Bottom Arrow --------------*/




/*---------------- Services Why Slide 1 --------------*/
/*.save_time_anim_play .circle1 {
    -webkit-animation: saveTimeCircle1Anim 5s linear infinite forwards;
    -moz-animation: saveTimeCircle1Anim 5s linear infinite forwards;
    -ms-animation: saveTimeCircle1Anim 5s linear infinite forwards;
    -o-animation: saveTimeCircle1Anim 5s linear infinite forwards;
    animation: saveTimeCircle1Anim 5s linear infinite forwards;
}
@-webkit-keyframes saveTimeCircle1Anim {
    0% { transform: rotate(0deg) translateX(5px) rotate(0deg); }
    100%   { transform: rotate(360deg) translateX(5px) rotate(-360deg); }
}
.save_time_anim_play .circle2 {
    -webkit-animation: saveTimeCircle2Anim 5s linear infinite forwards;
    -moz-animation: saveTimeCircle2Anim 5s linear infinite forwards;
    -ms-animation: saveTimeCircle2Anim 5s linear infinite forwards;
    -o-animation: saveTimeCircle2Anim 5s linear infinite forwards;
    animation: saveTimeCircle2Anim 5s linear infinite forwards;
}
@-webkit-keyframes saveTimeCircle2Anim {
    0%   { transform: rotate(360deg) translateX(4px) rotate(-360deg); }
    100% { transform: rotate(0deg) translateX(4px) rotate(0deg); }
}
.save_time_anim_play .circle3 {
    -webkit-animation: saveTimeCircle3Anim 5s linear infinite forwards;
    -moz-animation: saveTimeCircle3Anim 5s linear infinite forwards;
    -ms-animation: saveTimeCircle3Anim 5s linear infinite forwards;
    -o-animation: saveTimeCircle3Anim 5s linear infinite forwards;
    animation: saveTimeCircle3Anim 5s linear infinite forwards;
}
@-webkit-keyframes saveTimeCircle3Anim {
    0%   { transform: rotate(360deg) translateX(2px) rotate(-360deg); }
    100% { transform: rotate(0deg) translateX(2px) rotate(0deg); }
}
.save_time_anim_play .circle4 {
    -webkit-animation: saveTimeCircle4Anim 5s linear infinite forwards;
    -moz-animation: saveTimeCircle4Anim 5s linear infinite forwards;
    -ms-animation: saveTimeCircle4Anim 5s linear infinite forwards;
    -o-animation: saveTimeCircle4Anim 5s linear infinite forwards;
    animation: saveTimeCircle4Anim 5s linear infinite forwards;
}
@-webkit-keyframes saveTimeCircle4Anim {
    0%   { transform: rotate(360deg) translateX(8px) rotate(-360deg); }
    100% { transform: rotate(0deg) translateX(8px) rotate(0deg); }
}*/

/*.save_time_anim_play {
    -webkit-animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    opacity: 0;
}
.save-time-svg-container {
    -webkit-transform: scale(0);
            transform: scale(0);
}
@-webkit-keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}*/

/*---------------- Services Why Slide 1 --------------*/





/*---------------- Contact Top Bottom Arrow --------------*/
.c_top_st0{fill:none;stroke:#006BFF;stroke-width:0.75;stroke-miterlimit:10;stroke-dasharray: 645; stroke-dashoffset: 0;opacity: 0;}
.c_btm_st0{fill:none;stroke:#006BFF;stroke-width:0.75;stroke-miterlimit:10;stroke-dasharray: 650; stroke-dashoffset: 0;}
.c_st1{fill:none;stroke:#006BFF;stroke-width:2;stroke-miterlimit:10;opacity: 0;}
.c_st2{fill:#006BFF;}



.contact-top-line-animate {
    stroke-dasharray: 645;
    stroke-dashoffset: 0;
    -webkit-animation: conTopLineAnim 1.5s ease-in-out forwards;
    -moz-animation: conTopLineAnim 1.5s ease-in-out forwards;
    -ms-animation: conTopLineAnim 1.5s ease-in-out forwards;
    -o-animation: conTopLineAnim 1.5s ease-in-out forwards;
    animation: conTopLineAnim 1.5s ease-in-out forwards;
}
@-webkit-keyframes conTopLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 645;
    }
    14% {
        opacity: 0;
        stroke-dashoffset: 645;
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 645;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@-moz-keyframes conTopLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 645;
    }
    14% {
        opacity: 0;
        stroke-dashoffset: 645;
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 645;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@-ms-keyframes conTopLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 645;
    }
    14% {
        opacity: 0;
        stroke-dashoffset: 645;
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 645;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@-o-keyframes conTopLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 645;
    }
    14% {
        opacity: 0;
        stroke-dashoffset: 645;
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 645;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@keyframes conTopLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 645;
    }
    14% {
        opacity: 0;
        stroke-dashoffset: 645;
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 645;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}


.contact-top-arrow-animate {
    stroke-dasharray: 645;
    stroke-dashoffset: 0;
    -webkit-animation: conTopArrowAnim 2s ease-in-out forwards;
    -moz-animation: conTopArrowAnim 2s ease-in-out forwards;
    -ms-animation: conTopArrowAnim 2s ease-in-out forwards;
    -o-animation: conTopArrowAnim 2s ease-in-out forwards;
    animation: conTopArrowAnim 2s  ease-in-out forwards;
}
@-webkit-keyframes conTopArrowAnim {
    0% {
        opacity: 0;
    }
    75% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-moz-keyframes conTopArrowAnim {
    0% {
        opacity: 0;
    }
    75% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-ms-keyframes conTopArrowAnim {
    0% {
        opacity: 0;
    }
    75% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-o-keyframes conTopArrowAnim {
    0% {
        opacity: 0;
    }
    75% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@keyframes conTopArrowAnim {
    0% {
        opacity: 0;
    }
    75% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}



.contact-btm-line-animate {
    stroke-dasharray: 650;
    stroke-dashoffset: 0;
    -webkit-animation: conBtmLineAnim 3s ease-in-out forwards;
    -moz-animation: conBtmLineAnim 3s ease-in-out forwards;
    -ms-animation: conBtmLineAnim 3s ease-in-out forwards;
    -o-animation: conBtmLineAnim 3s ease-in-out forwards;
    animation: conBtmLineAnim 3s  ease-in-out forwards;
}
@-webkit-keyframes conBtmLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 650;
    }
    59% {
        opacity: 0;
        stroke-dashoffset: 650;
    }
    60% {
        opacity: 1;
        stroke-dashoffset: 650;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@-moz-keyframes conBtmLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 650;
    }
    59% {
        opacity: 0;
        stroke-dashoffset: 650;
    }
    60% {
        opacity: 1;
        stroke-dashoffset: 650;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@-ms-keyframes conBtmLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 650;
    }
    59% {
        opacity: 0;
        stroke-dashoffset: 650;
    }
    60% {
        opacity: 1;
        stroke-dashoffset: 650;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@-o-keyframes conBtmLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 650;
    }
    59% {
        opacity: 0;
        stroke-dashoffset: 650;
    }
    60% {
        opacity: 1;
        stroke-dashoffset: 650;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}
@keyframes conBtmLineAnim {
    0% {
        opacity: 0;
        stroke-dashoffset: 650;
    }
    59% {
        opacity: 0;
        stroke-dashoffset: 650;
    }
    60% {
        opacity: 1;
        stroke-dashoffset: 650;
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0;
    }
}


.contact-btm-dot-animate {
    -webkit-animation: conBtmDotAnim 2s ease-in-out forwards;
    -moz-animation: conBtmDotAnim 2s ease-in-out forwards;
    -ms-animation: conBtmDotAnim 2s ease-in-out forwards;
    -o-animation: conBtmDotAnim 2s ease-in-out forwards;
    animation: conBtmDotAnim 2s ease-in-out forwards;
}
@-webkit-keyframes conBtmDotAnim {
    0% {
        opacity: 0;
    }
    85% {
        opacity: 0;
    }
    95% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-moz-keyframes conBtmDotAnim {
    0% {
        opacity: 0;
    }
    85% {
        opacity: 0;
    }
    95% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-ms-keyframes conBtmDotAnim {
    0% {
        opacity: 0;
    }
    85% {
        opacity: 0;
    }
    95% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@-o-keyframes conBtmDotAnim {
    0% {
        opacity: 0;
    }
    85% {
        opacity: 0;
    }
    95% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@keyframes conBtmDotAnim {
    0% {
        opacity: 0;
    }
    85% {
        opacity: 0;
    }
    95% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
/*---------------- Contact Top Bottom Arrow --------------*/