@charset "utf-8";
/* CSS Document */

@-webkit-keyframes animate-svg-fill-1a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

@keyframes animate-svg-fill-1a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

.svg-elem-1a {
  -webkit-animation: animate-svg-fill-1a 1s ease-in 0.8s both;
          animation: animate-svg-fill-1a 1s ease-in 0.8s both;
}

@-webkit-keyframes animate-svg-fill-2a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

@keyframes animate-svg-fill-2a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

.svg-elem-2a {
  -webkit-animation: animate-svg-fill-2a 1s ease-in 0.9s both;
          animation: animate-svg-fill-2a 1s ease-in 0.9s both;
}

@-webkit-keyframes animate-svg-fill-3a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

@keyframes animate-svg-fill-3a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

.svg-elem-3a {
  -webkit-animation: animate-svg-fill-3a 1s ease-in 1s both;
          animation: animate-svg-fill-3a 1s ease-in 1s both;
}

@-webkit-keyframes animate-svg-fill-4a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(245, 145, 32);
  }
}

@keyframes animate-svg-fill-4a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(245, 145, 32);
  }
}

.svg-elem-4a {
  -webkit-animation: animate-svg-fill-4a 1s ease-in 1.1s both;
          animation: animate-svg-fill-4a 1s ease-in 1.1s both;
}

@-webkit-keyframes animate-svg-fill-5a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

@keyframes animate-svg-fill-5a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

.svg-elem-5a {
  -webkit-animation: animate-svg-fill-5a 1s ease-in 1.2000000000000002s both;
          animation: animate-svg-fill-5a 1s ease-in 1.2000000000000002s both;
}

@-webkit-keyframes animate-svg-fill-6a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(245, 145, 32);
  }
}

@keyframes animate-svg-fill-6a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(245, 145, 32);
  }
}

.svg-elem-6a {
  -webkit-animation: animate-svg-fill-6a 1s ease-in 1.3s both;
          animation: animate-svg-fill-6a 1s ease-in 1.3s both;
}

@-webkit-keyframes animate-svg-fill-7a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

@keyframes animate-svg-fill-7a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

.svg-elem-7a {
  -webkit-animation: animate-svg-fill-7a 1s ease-in 1.4000000000000001s both;
          animation: animate-svg-fill-7a 1s ease-in 1.4000000000000001s both;
}

@-webkit-keyframes animate-svg-fill-8a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

@keyframes animate-svg-fill-8a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

.svg-elem-8a {
  -webkit-animation: animate-svg-fill-8a 1s ease-in 1.5s both;
          animation: animate-svg-fill-8a 1s ease-in 1.5s both;
}

@-webkit-keyframes animate-svg-fill-9a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

@keyframes animate-svg-fill-9a {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 97, 168);
  }
}

.svg-elem-9a {
  -webkit-animation: animate-svg-fill-9a 1s ease-in 1.6s both;
          animation: animate-svg-fill-9a 1s ease-in 1.6s both;
}

/* ///////////////////////////////////////////////////////////////////// */


@-webkit-keyframes animate-svg-fill-1 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(246, 146, 30);
  }
}

@keyframes animate-svg-fill-1 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(246, 146, 30);
  }
}

.svg-elem-1 {
  -webkit-animation: animate-svg-fill-1 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s both;
          animation: animate-svg-fill-1 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s both;
}

@-webkit-keyframes animate-svg-fill-2 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-2 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-2 {
  -webkit-animation: animate-svg-fill-2 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s both;
          animation: animate-svg-fill-2 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s both;
}

@-webkit-keyframes animate-svg-fill-3 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-3 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-3 {
  -webkit-animation: animate-svg-fill-3 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s both;
          animation: animate-svg-fill-3 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s both;
}

@-webkit-keyframes animate-svg-fill-4 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-4 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-4 {
  -webkit-animation: animate-svg-fill-4 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s both;
          animation: animate-svg-fill-4 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s both;
}

@-webkit-keyframes animate-svg-fill-5 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-5 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-5 {
  -webkit-animation: animate-svg-fill-5 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s both;
          animation: animate-svg-fill-5 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s both;
}

@-webkit-keyframes animate-svg-fill-6 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-6 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-6 {
  -webkit-animation: animate-svg-fill-6 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s both;
          animation: animate-svg-fill-6 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s both;
}

@-webkit-keyframes animate-svg-fill-7 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-7 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-7 {
  -webkit-animation: animate-svg-fill-7 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4000000000000001s both;
          animation: animate-svg-fill-7 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4000000000000001s both;
}

@-webkit-keyframes animate-svg-fill-8 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-8 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-8 {
  -webkit-animation: animate-svg-fill-8 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.5s both;
          animation: animate-svg-fill-8 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.5s both;
}

@-webkit-keyframes animate-svg-fill-9 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-9 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-9 {
  -webkit-animation: animate-svg-fill-9 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.6s both;
          animation: animate-svg-fill-9 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.6s both;
}

@-webkit-keyframes animate-svg-fill-10 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-10 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-10 {
  -webkit-animation: animate-svg-fill-10 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7000000000000002s both;
          animation: animate-svg-fill-10 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7000000000000002s both;
}

@-webkit-keyframes animate-svg-fill-11 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-11 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-11 {
  -webkit-animation: animate-svg-fill-11 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.8s both;
          animation: animate-svg-fill-11 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.8s both;
}

@-webkit-keyframes animate-svg-fill-12 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-12 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-12 {
  -webkit-animation: animate-svg-fill-12 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.9000000000000001s both;
          animation: animate-svg-fill-12 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.9000000000000001s both;
}

@-webkit-keyframes animate-svg-fill-13 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-13 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-13 {
  -webkit-animation: animate-svg-fill-13 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2s both;
          animation: animate-svg-fill-13 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2s both;
}

@-webkit-keyframes animate-svg-fill-14 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-14 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-14 {
  -webkit-animation: animate-svg-fill-14 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.1s both;
          animation: animate-svg-fill-14 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.1s both;
}

@-webkit-keyframes animate-svg-fill-15 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-15 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-15 {
  -webkit-animation: animate-svg-fill-15 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.2s both;
          animation: animate-svg-fill-15 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.2s both;
}

@-webkit-keyframes animate-svg-fill-16 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-16 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-16 {
  -webkit-animation: animate-svg-fill-16 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.3s both;
          animation: animate-svg-fill-16 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.3s both;
}

@-webkit-keyframes animate-svg-fill-17 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-17 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-17 {
  -webkit-animation: animate-svg-fill-17 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4000000000000004s both;
          animation: animate-svg-fill-17 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4000000000000004s both;
}

@-webkit-keyframes animate-svg-fill-18 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-18 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-18 {
  -webkit-animation: animate-svg-fill-18 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.5s both;
          animation: animate-svg-fill-18 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.5s both;
}

@-webkit-keyframes animate-svg-fill-19 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

@keyframes animate-svg-fill-19 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(0, 96, 168);
  }
}

.svg-elem-19 {
  -webkit-animation: animate-svg-fill-19 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.6s both;
          animation: animate-svg-fill-19 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.6s both;
}


/* ///////////////////////////////////////////////////////////////////// */



@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes slide-out-bottom {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
    opacity: 0; display:none;
  }
}
@keyframes slide-out-bottom {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
    opacity: 0; display:none;
  }
}

@-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;
  }
}
@-webkit-keyframes rotate_ora{
	0%{
		-webkit-transform:rotate(0deg);	
		transform:rotate(0deg)
	}
	100%{
		-webkit-transform:rotate(-360deg);	
		transform:rotate(-360deg)
	}
}
@keyframes rotate_ora{
	0%{
		-webkit-transform:rotate(0deg);	
		transform:rotate(0deg)
	}
	100%{
		-webkit-transform:rotate(-360deg);	
		transform:rotate(-360deg)
	}
}
@-webkit-keyframes blink-2 {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.25;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blink-2 {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.25;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes cliprotate {
  0% {-webkit-transform: rotate(0deg); transform: rotate(0deg)}
  100% {-webkit-transform: rotate(360deg); transform: rotate(360deg)}
}
@keyframes cliprotate {
  0% {-webkit-transform: rotate(0deg); transform: rotate(0deg)}
  100% {-webkit-transform: rotate(360deg); transform: rotate(360deg)}
}
@-webkit-keyframes rotate {
  0% {-webkit-transform: rotate(-45deg); transform: rotate(-45deg)}
  100% {-webkit-transform: rotate(135deg); transform: rotate(135deg)}
}
@keyframes rotate {
  0% {-webkit-transform: rotate(-45deg); transform: rotate(-45deg)}
  100% {-webkit-transform: rotate(135deg); transform: rotate(135deg)}
}
@-webkit-keyframes showfixed {
  0% {opacity: 0;}
  49.99% {opacity: 0;}
  50% {opacity: 1;}
 100% {opacity: 1;}
}
@keyframes showfixed {
  0% {opacity: 0;}
  49.99% {opacity: 0;}
  50% {opacity: 1;}
 100% {opacity: 1;}
}
@-webkit-keyframes appear{
	0%{opacity:0}
	100%{opacity:1}
}
@keyframes appear{
	0%{opacity:0}
	100%{opacity:1}
}
@-webkit-keyframes removef{
	0%{opacity:1}
	100%{opacity:0}
}
@keyframes removef{
	0%{opacity:1}
	100%{opacity:0}
}
@-webkit-keyframes circle_wrap_move {
	0% {-webkit-transform:translateX(0%); transform:translateX(0%)}
	100% {-webkit-transform:translateX(-100%); transform:translateX(-100%)}
}
@keyframes circle_wrap_move {
	0% {-webkit-transform:translateX(0%); transform:translateX(0%)}
	100% {-webkit-transform:translateX(-100%); transform:translateX(-100%)}
}
@-webkit-keyframes mobile_wrap_move {
	0% {-webkit-transform:translateX(100%); transform:translateX(100%)}
	100% {-webkit-transform:translateX(0%); transform:translateX(0%)}
}
@keyframes mobile_wrap_move {
	0% {-webkit-transform:translateX(100%); transform:translateX(100%)}
	100% {-webkit-transform:translateX(0%); transform:translateX(0%)}
}
@-webkit-keyframes bounce-in-fwd {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: scale(0.7);
            transform: scale(0.7);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: scale(0.84);
            transform: scale(0.84);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  89% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
	  opacity:1
  }
}
@keyframes bounce-in-fwd {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: scale(0.7);
            transform: scale(0.7);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: scale(0.84);
            transform: scale(0.84);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  89% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
	  opacity:1
  }
}
@-webkit-keyframes horizontal {
  0% { -webkit-transform:translate(0,0); transform:translate(0,0)}
  4.41177% { -webkit-transform:translate(5px,0); transform:translate(5px,0)}
  8.82353% { -webkit-transform:translate(0,0); transform:translate(0,0)}
  13.23529% { -webkit-transform:translate(5px,0); transform:translate(5px,0)}
  17.64706% { -webkit-transform:translate(0,0); transform:translate(0,0)}
  22.05882% { -webkit-transform:translate(5px,0); transform:translate(5px,0)}
  26.47059% { -webkit-transform:translate(0,0); transform:translate(0,0)}
  100% { -webkit-transform:translate(0,0); transform:translate(0,0)}
}
@keyframes horizontal {
  0% { -webkit-transform:translate(0,0); transform:translate(0,0)}
  4.41177% { -webkit-transform:translate(5px,0); transform:translate(5px,0)}
  8.82353% { -webkit-transform:translate(0,0); transform:translate(0,0)}
  13.23529% { -webkit-transform:translate(5px,0); transform:translate(5px,0)}
  17.64706% { -webkit-transform:translate(0,0); transform:translate(0,0)}
  22.05882% { -webkit-transform:translate(5px,0); transform:translate(5px,0)}
  26.47059% { -webkit-transform:translate(0,0); transform:translate(0,0)}
  100% { -webkit-transform:translate(0,0); transform:translate(0,0)}
}
@-webkit-keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}


/* ///////////////////////////////////////////////////////////////////// */


@-webkit-keyframes connect_wrap_bottom_vbpts{
	0% {bottom:67px}
	100% {bottom:7.5px}
}

@keyframes connect_wrap_bottom_vbpts{
	0% {bottom:67px}
	100% {bottom:7.5px}
}

@-webkit-keyframes connect_scale_margin_vbpts{
	0% {width:206.3px; margin-bottom:7.3px}
	100% {width:201.1px; margin-bottom:2px}
}

@keyframes  connect_scale_margin_vbpts{
	0% {width:206.3px; margin-bottom:7.3px}
	100% {width:201.1px; margin-bottom:2px}
}



@-webkit-keyframes connect_wrap_bottom_bpts{
	0% {bottom:67px}
	100% {bottom:17.5px}
}

@keyframes connect_wrap_bottom_bpts{
	0% {bottom:67px}
	100% {bottom:17.5px}
}

@-webkit-keyframes connect_scale_margin_bpts{
	0% {width:199.5px; margin-bottom:7.3px}
	100% {width:194.5px; margin-bottom:12.25px}
}

@keyframes  connect_scale_margin_bpts{
	0% {width:199.5px; margin-bottom:7.3px}
	100% {width:194.5px; margin-bottom:12.25px}
}



@-webkit-keyframes connect_wrap_bottom_bpns{
	0% {bottom:63.5px}
	100% {bottom:7.5px}
}

@keyframes connect_wrap_bottom_bpns{
	0% {bottom:63.5px}
	100% {bottom:7.5px}
}

@-webkit-keyframes connect_scale_margin_bpns{
	0% {width:189.3px; margin-bottom:6.9px}
	100% {width:184.5px; margin-bottom:2px}
}

@keyframes  connect_scale_margin_bpns{
	0% {width:189.3px; margin-bottom:6.9px}
	100% {width:184.5px; margin-bottom:2px}
}




@-webkit-keyframes connect_wrap_bottom_bpss{
	0% {bottom:40px}
	100% {bottom:7px}
}

@keyframes connect_wrap_bottom_bpss{
	0% {bottom:40px}
	100% {bottom:7px}
}

@-webkit-keyframes connect_scale_margin_bpss{
	0% {width:173.3px; margin-bottom:6.3px}
	100% {width:169px; margin-bottom:6px}
}

@keyframes  connect_scale_margin_bpss{
	0% {width:173.3px; margin-bottom:6.3px}
	100% {width:169px; margin-bottom:6px}
}



@-webkit-keyframes connect_wrap_bottom_mppts{
	0% {bottom:10%}
	100% {bottom:2.25%}
}

@keyframes connect_wrap_bottom_mppts{
	0% {bottom:10%}
	100% {bottom:2.25%}
}

@-webkit-keyframes connect_scale_margin_mppts{
	0% {width:189.3px; margin-bottom:6.9px}
	100% {width:184.5px; margin-bottom:5px}
}

@keyframes  connect_scale_margin_mppts{
	0% {width:189.3px; margin-bottom:6.9px}
	100% {width:184.5px; margin-bottom:5px}
}



@-webkit-keyframes connect_wrap_bottom_mppns{
	0% {bottom:9%}
	100% {bottom:1.75%}
}

@keyframes connect_wrap_bottom_mppns{
	0% {bottom:9%}
	100% {bottom:1.75%}
}

@-webkit-keyframes connect_scale_margin_mppns{
	0% {width:180.6px; margin-bottom:6.6px}
	100% {width:176px; margin-bottom:4.7px}
}

@keyframes  connect_scale_margin_mppns{
	0% {width:180.6px; margin-bottom:6.6px}
	100% {width:176px; margin-bottom:4.7px}
}



@-webkit-keyframes connect_wrap_bottom_mppss{
	0% {bottom:9%}
	100% {bottom:1.75%}
}

@keyframes connect_wrap_bottom_mppss{
	0% {bottom:9%}
	100% {bottom:1.75%}
}

@-webkit-keyframes connect_scale_margin_mppss{
	0% {width:173.3px; margin-bottom:6.3px}
	100% {width:169px; margin-bottom:4.5px}
}

@keyframes  connect_scale_margin_mppss{
	0% {width:173.3px; margin-bottom:6.3px}
	100% {width:169px; margin-bottom:4.5px}
}



@-webkit-keyframes connect_wrap_bottom_mpts{
	0% {bottom:8.5%}
	100% {bottom:1.25%}
}

@keyframes connect_wrap_bottom_mpts{
	0% {bottom:8.5%}
	100% {bottom:1.25%}
}

@-webkit-keyframes connect_scale_margin_mpts{
	0% {width:180.6px; margin-bottom:6.6px}
	100% {width:176px; margin-bottom:4.7px}
}

@keyframes  connect_scale_margin_mpts{
	0% {width:180.6px; margin-bottom:6.6px}
	100% {width:176px; margin-bottom:4.7px}
}


@-webkit-keyframes connect_wrap_bottom_mpss{
	0% {bottom:6.5%}
	100% {bottom:1.25%}
}

@keyframes connect_wrap_bottom_mpss{
	0% {bottom:6.5%}
	100% {bottom:1.25%}
}

@-webkit-keyframes connect_scale_margin_mpss{
	0% {width:153.9px; margin-bottom:5.6px}
	100% {width:150px; margin-bottom:2.8px}
}

@keyframes  connect_scale_margin_mpss{
	0% {width:153.9px; margin-bottom:5.6px}
	100% {width:150px; margin-bottom:2.8px}
}


@-webkit-keyframes connect_wrap_bottom_spts{
	0% {bottom:10.25%}
	100% {bottom:2%}
}

@keyframes connect_wrap_bottom_spts{
	0% {bottom:10.25%}
	100% {bottom:2%}
}

@-webkit-keyframes connect_scale_margin_spts{
	0% {width:173.4px; margin-bottom:6.3px}
	100% {width:169px; margin-bottom:4.5px}
}

@keyframes  connect_scale_margin_spts{
	0% {width:173.4px; margin-bottom:6.3px}
	100% {width:169px; margin-bottom:4.5px}
}


@-webkit-keyframes connect_wrap_bottom_spss{
	0% {bottom:9%}
	100% {bottom:1.5%}
}

@keyframes connect_wrap_bottom_spss{
	0% {bottom:9%}
	100% {bottom:1.5%}
}

@-webkit-keyframes connect_scale_margin_spss{
	0% {width:173.4px; margin-bottom:6.3px}
	100% {width:169px; margin-bottom:4.5px}
}

@keyframes  connect_scale_margin_spss{
	0% {width:173.4px; margin-bottom:6.3px}
	100% {width:169px; margin-bottom:4.5px}
}







@-webkit-keyframes connect_wrap_bottom_vsp{
	0% {bottom:4.75%}
	100% {bottom:1.25%}
}

@keyframes connect_wrap_bottom_vsp{
	0% {bottom:4.75%}
	100% {bottom:1.25%}
}

@-webkit-keyframes connect_scale_margin_vsp{
	0% {width:154px; margin-bottom:5.6px}
	100% {width:150.15px; margin-bottom:4px}
}

@keyframes  connect_scale_margin_vsp{
	0% {width:154px; margin-bottom:5.6px}
	100% {width:150.15px; margin-bottom:4px}
}











.fade-in {
	-webkit-animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

.fade-out {
	-webkit-animation: fade-out .5s ease-out both;
	        animation: fade-out .5s ease-out both;
}

.scale-in-center {
	-webkit-animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) .5s both ;
	        animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) .5s both ;
}

.rotate_ora {
	-webkit-animation: rotate_ora 1.5s linear both ;
	        animation: rotate_ora 1.5s linear both;
}

.appear{-webkit-animation: appear .5s linear forwards ;
	        animation: appear .5s linear  forwards ;}

.blink-2 {
	-webkit-animation: blink-2 2s infinite both;
	        animation: blink-2 2s infinite both;
}

.removef{-webkit-animation: removef .25s linear forwards ;
	        animation: removef .25s linear  forwards ;}

.circle_wrap_move{-webkit-animation: circle_wrap_move .5s ease-out both;
	        animation: circle_wrap_move .5s ease-out both}

.mobile_wrap_move{-webkit-animation: mobile_wrap_move .5s ease-out both;
	        animation: mobile_wrap_move .5s ease-out both}

.connect_scale{-webkit-animation: connect_scale .5s both;
	        animation:connect_scale .5s  both}

.slide-out-bottom {
	-webkit-animation: slide-out-bottom .5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: slide-out-bottom .5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

.bounce-in-fwd {
	-webkit-animation: bounce-in-fwd 1.1s both;
	        animation: bounce-in-fwd 1.1s both;
}

.horizontal {
  animation: horizontal 2.72s ease infinite;
  transform-origin: 50% 50%; opacity:1!important; animation-delay: 1s;
}

.slide-in-bottom {
	-webkit-animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}


/* Div layer for the entire container. */
#dc_container {
	position: fixed;
	width: 100%;
	height: 100%;
	margin: auto;
    font-size:0;
	top:0;
	left:0;
	z-index: 999999999999; 
}
#dc_content {
	position: absolute;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	z-index: 100;
}
#info {
	position:absolute;
	display:none;
	bottom:0.75%;
	z-index: 999;
	right:1.25%;
	width:20px;
	height:20px;
}
#info img {
	position:inherit;
	width:100%
}
/* Invisible button for background clickthrough. */
#dc_background_exit{
	position: absolute;
	width: 25px;
	height: 25px;
	top: 10px;
	right: 10px;
	z-index: 998;
	cursor: pointer;
	opacity: 0;
}

#dc_bgImage{
	position: absolute;
	bottom: 0px;
	left: 0px;
}

#dc_expand_logo{
	position: absolute;
	left: 5px;
	top: 5px;
}

#dc_btnClose{
	display:none;
	position: absolute;
	width: 25px;
	height: auto;
	top: 1.5%;
	right: 3%;
	z-index: 999;	
	cursor: pointer;
}



#dc_content img, #dc_content svg{width:100%; height:auto}







/*SCENE 1 */


.circle_wrap{display:flex; flex-direction:column; align-items:center; justify-content:center;
 position:absolute; width:100%; height:100%; background-image: url("assets/circle_bg_428.jpg"); background-repeat:no-repeat; background-position:center; background-size:100% auto; z-index:20}
	
.circle{display:flex; align-items:center; justify-content:center; position:relative; width:373.4px; height:373.4px; border-radius:50%; margin-top:5.2px}
	
.blue_glow{position:absolute; width:88%; height:88%; border-radius:50%; border:solid 6.2px #0061a8; filter:blur(3.1px); z-index:10}	
	
.tap{position:absolute; width:265.9px; filter: drop-shadow(.5px .5px .5px rgba(35,31,32,1))}

.orange{position:absolute; width:100%; height:100%; z-index:20}
	
.blue_final{position:absolute; width:100%; height:100%; box-sizing:border-box; border: solid 20.6px #0061a8; border-radius:50%; z-index:15}
	
.blue_circle{position:absolute; z-index:15; width:100%; height:100%; transform: scaleX(-1)}
	
	
	
#halfclip {
    width: 50%;
    height: 100%;
    right: 0px;
    position: absolute;
    overflow: hidden;
    transform-origin: left center;
    animation: cliprotate 1.5s steps(2) infinite;
    -webkit-animation: cliprotate 1.5s steps(2) infinite; 
}

#clipped {
    width: 200%;
    animation: rotate .75s linear infinite;
    -webkit-animation: rotate .75s linear infinite; 
	

}
#fixed {
    width: 100%;
    transform: rotate(135deg);
    animation: showfixed 1.5s steps(2) infinite;
    -webkit-animation: showfixed 1.5s linear infinite;
}

.halfcircle {
    box-sizing: border-box;
    height: 100%;
    right: 0px;
    position: absolute;
    border: solid 20.6px transparent;
    border-top-color: #0061a8;
    border-left-color: #0061a8;
    border-radius: 50%;
}	


/* SCENE 2 */	
	
	
.mobile_wrap{display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("assets/final_scene_428.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% auto;
	z-index:10
	}	
	
.mobile_wrap_top{display:flex; flex-direction:column; align-items:center; margin-top:24.9px}	
.hellenic_bank{width:276.1px; margin-bottom:23.7px}	
.new_mobile_app{width:269px; filter: drop-shadow(.5px .5px .5px rgba(35,31,32,1)); margin-bottom:14.5px; opacity:0}	
.discover{width:167.7px; opacity:0}
	
.app_wrap{display:flex; justify-content:center; position:absolute; left:0; right:0; bottom:128px}
.google_play{width:80.35px; margin-right:3.77px; opacity:0}
.apple_store{width:80.35px; margin-left:3.77px; opacity:0}	


/* CONNECT */	
	
	
.connect_wrap{display:flex; width:100%; flex-direction:column; align-items:center; justify-content:center; position:absolute; z-index:100; bottom:67px}	

.connect{width:206.3px; margin-bottom:7.3px}
.connect_with{display:flex; align-items:center; justify-content:space-between; width:285.9px}	
	
.divide{width:.28px; height: 6.4px; background-color:#434243}
	
.divide:nth-of-type(2){-webkit-animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2.25s both; animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2.25s both}	
.divide:nth-of-type(4){-webkit-animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2.75s both; animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2.75s both;}
.divide:nth-of-type(6){-webkit-animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 3.25s both; animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 3.25s both;}
.divide:nth-of-type(8){-webkit-animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 3.75s both; animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 3.75s both;}
	
	
	
.web{width:27.3px; filter:drop-shadow(.33px .33px #434243); -webkit-animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2s both;
	        animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2s both}
	
.mobile_app{width:58px; filter:drop-shadow(.33px .33px #434243); -webkit-animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2.5s both;
	        animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2.5s both}
	
.contact{width:63.9px; filter:drop-shadow(.33px .33px #434243); -webkit-animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 3s both;
	        animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 3s both}
	
.mobile_wallet{width:82.9px; filter:drop-shadow(.33px .33px #434243); -webkit-animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 3.5s both;
	        animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 3.5s both}
	
.atm{width:28.1px; filter:drop-shadow(.33px .33px #434243); -webkit-animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 4s both;
	        animation:fade-in .25s cubic-bezier(0.390, 0.575, 0.565, 1.000) 4s both}
	
	
.terms{width:201.6px; filter: drop-shadow(.5px .5px .5px rgba(35,31,32,1)); opacity:0}	

	
.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_vbpts .5s ease-out both; animation: connect_wrap_bottom_vbpts .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_vbpts .5s ease-out both; animation: connect_scale_margin_vbpts .5s ease-out both}



/* Big Phone (tall screen) */
@media  screen and (max-device-width:414px) and (-webkit-min-device-pixel-ratio:2) {
		

/*SCENE 1 */


.circle_wrap{background-image: url("assets/circle_bg_414_tall.jpg")}
	
.circle{width:361.1px; height:361.1px; margin-top:5px}
	
.blue_glow{width:88%; height:88%; border:solid 6px #0061a8; filter:blur(3px)}	
	
.tap{width:257.2px}

.blue_final{border: solid 20px #0061a8}
	
.halfcircle {border: solid 20px transparent; border-top-color: #0061a8; border-left-color:#0061a8}	
	
	
/* SCENE 2 */	
	
.mobile_wrap{background-image: url("assets/final_scene_414_tall.jpg")}	
	
.mobile_wrap_top{margin-top:24.9px}	
.hellenic_bank{width:276.1px; margin-bottom:23.7px}	
.new_mobile_app{width:269px; margin-bottom:14.5px}	
.discover{width:167.7px}
	
.app_wrap{bottom:156px}
.google_play{width:77.7px; margin-right:3.65px}
.apple_store{width:77.7px;  margin-left:3.65px}	
	

/* CONNECT */	
	
	
.connect_wrap{bottom:67px}	

.connect{width:199.5px; margin-bottom:7.3px}
.connect_with{width:276.5px}	
	
.divide{width:.27px; height:6.2px}
	

	
.web{width:26.4px}
	
.mobile_app{width:56.1px}
	
.contact{width:61.8px}
	
.mobile_wallet{width:80.2px}
	
.atm{width:27.2px}
	
	
.terms{width:195px}	

	
.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_bpts .5s ease-out both; animation: connect_wrap_bottom_bpts .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_bpts .5s ease-out both; animation: connect_scale_margin_bpts .5s ease-out both}
		
}


/* Big Phone (normal screen) */
@media  screen and (max-device-width:414px) and (max-height:725px) and (-webkit-min-device-pixel-ratio:2) {
	
	
/*SCENE 1 */


.circle_wrap{background-image:url("assets/circle_bg_414_normal.jpg")}
	
.circle{width:361.1px; height:361.1px; margin-top:5px}
	
.blue_glow{width:88%; height:88%; border:solid 6px #0061a8; filter:blur(3px)}	
	
.tap{width:257.2px}

.blue_final{border: solid 20px #0061a8}
	
.halfcircle {border: solid 20px transparent; border-top-color: #0061a8; border-left-color:#0061a8}	
	
	
/* SCENE 2 */	
	
.mobile_wrap{background-image:url("assets/final_scene_414_normal.jpg")}	
	
.mobile_wrap_top{margin-top:23.6px}	
.hellenic_bank{width:262px; margin-bottom:22.5px}	
.new_mobile_app{width:255.2px; margin-bottom:13.7px}	
.discover{width:159.1px}
	
.app_wrap{bottom:120px}
.google_play{width:73.7px; margin-right:3.4px}
.apple_store{width:73.7px; margin-left:3.4px}	
	

/* CONNECT */	
	
	
.connect_wrap{bottom:63.5px}	

.connect{width:189.3px; margin-bottom:6.9px}
.connect_with{width:262.4px}	
	
.divide{width:.25px; height:5.8px}
	

	
.web{width:25px}
	
.mobile_app{width:53.2px}
	
.contact{width:58.6px}
	
.mobile_wallet{width:76.1px}
	
.atm{width:25.8px}
	
	
.terms{width:185px}	

	
.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_bpns .5s ease-out both; animation: connect_wrap_bottom_bpns .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_bpns .5s ease-out both; animation: connect_scale_margin_bpns .5s ease-out both}	
		
}



/* Big Phone (short screen) */
@media  screen and (max-device-width:414px) and (max-height:622px) and (-webkit-min-device-pixel-ratio:2) {
	
	
/*SCENE 1 */


.circle_wrap{background-image: url("assets/circle_bg_414_short.jpg")}
	
.circle{width:361.1px; height:361.1px; margin-top:5px}
	
.blue_glow{width:88%; height:88%; border:solid 6px #0061a8; filter:blur(3px)}	
	
.tap{width:257.2px}

.blue_final{border: solid 20px #0061a8}
	
.halfcircle {border: solid 20px transparent; border-top-color: #0061a8; border-left-color:#0061a8}	
	
	
/* SCENE 2 */	
	
.mobile_wrap{background-image: url("assets/final_scene_414_short.jpg")}	
	
.mobile_wrap_top{margin-top:12px}	
.hellenic_bank{width:239.9px; margin-bottom:15px}	
.new_mobile_app{width:233.7px; margin-bottom:10px}	
.discover{width:145.7px}
	
.app_wrap{bottom:110px}
.google_play{width:67.5px; margin-right:3.17px}
.apple_store{width:67.5px;  margin-left:3.17px}	
	

/* CONNECT */	
	
	
.connect_wrap{bottom:40px}	

.connect{width:173.3px; margin-bottom:6.3px}
.connect_with{width:240.2px}	
	
.divide{width:.23px; height:5.4px}
	

	
.web{width:22.9px}
	
.mobile_app{width:48.7px}
	
.contact{width:53.7px}
	
.mobile_wallet{width:69.7px}
	
.atm{width:23.6px}
	
	
.terms{width:169.4px}	

	
.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_bpss .5s ease-out both; animation: connect_wrap_bottom_bpss .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_bpss .5s ease-out both; animation: connect_scale_margin_bpss .5s ease-out both; filter: drop-shadow(5px 5px 10px #fff); transition:filter .5s }
		
}
	

/* Medium+ Phone (tall screen) */
@media  screen and (max-device-width:393px) and (-webkit-min-device-pixel-ratio:2) {
	
/*SCENE 1 */


.circle_wrap{background-image: url("assets/circle_bg_393_tall.jpg")}
	
.circle{width:342.7px; height:342.7px; margin-top:4.7px}
	
.blue_glow{width:88%; height:88%; border:solid 5.7px #0061a8; filter:blur(2.85px)}	
	
.tap{width:244px}

.blue_final{border: solid 19px #0061a8}
	
.halfcircle {border: solid 19px transparent; border-top-color:#0061a8; border-left-color:#0061a8}	
	
	
/* SCENE 2 */	
	
.mobile_wrap{background-image: url("assets/final_scene_393_tall.jpg")}	
	
.mobile_wrap_top{margin-top:6%}	
.hellenic_bank{width:262px; margin-bottom:5.75%}	
.new_mobile_app{width:255.2px; margin-bottom:3.5%}	
.discover{width:159.1px}
	
.app_wrap{bottom:19.05%}
.google_play{width:73.7px; margin-right:3.4px}
.apple_store{width:73.7px;  margin-left:3.4px}	
	

/* CONNECT */	
	
	
.connect_wrap{bottom:10%}	

.connect{width:189.3px; margin-bottom:6.9px}
.connect_with{width:262.4px}	
	
.divide{width:.25px; height:5.9px}
	

	
.web{width:25px}
	
.mobile_app{width:53.2px}
	
.contact{width:58.6px}
	
.mobile_wallet{width:76.1px}
	
.atm{width:25.8px}
	
	
.terms{width:185px}	

	
.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_mppts .5s ease-out both; animation: connect_wrap_bottom_mppts .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_mppts .5s ease-out both; animation: connect_scale_margin_mppts .5s ease-out both; filter:unset; transition:unset}
		

	
	
	
}

/* Medium+ Phone (normal screen) */
@media  screen and (max-device-width:393px) and (max-height:680px) and (-webkit-min-device-pixel-ratio:2) {
	
	
	
/*SCENE 1 */


.circle_wrap{background-image:url("assets/circle_bg_393_normal.jpg")}
	
.circle{width:342.7px; height:342.7px; margin-top:4.7px}
	
.blue_glow{width:88%; height:88%; border:solid 5.7px #0061a8; filter:blur(2.85px)}	
	
.tap{width:244px}

.blue_final{border: solid 19px #0061a8}
	
.halfcircle {border: solid 19px transparent; border-top-color:#0061a8; border-left-color:#0061a8}	
	
	
/* SCENE 2 */	
	
.mobile_wrap{background-image:url("assets/final_scene_393_normal.jpg")}	
	
.mobile_wrap_top{margin-top:5%}	
.hellenic_bank{width:250px; margin-bottom:5%}	
.new_mobile_app{width:243.5px; margin-bottom:2.5%}	
.discover{width:151.8px}
	
.app_wrap{bottom:17%}
.google_play{width:70.3px; margin-right:3.2px}
.apple_store{width:70.3px;  margin-left:3.2px}	
	

/* CONNECT */	
	
	
.connect_wrap{bottom:9%}	

.connect{width:180.6px; margin-bottom:6.6px}
.connect_with{width:250.3px}	
	
.divide{width:.24px; height:5.6px}
	

	
.web{width:23.8px}
	
.mobile_app{width:50.7px}
	
.contact{width:55.9px}
	
.mobile_wallet{width:72.6px}
	
.atm{width:24.6px}
	
	
.terms{width:176.5px}	


	

.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_mppns .5s ease-out both; animation: connect_wrap_bottom_mppns .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_mppns .5s ease-out both; animation: connect_scale_margin_mppns .5s ease-out both; filter: drop-shadow(4.7px 4.7px 9.4px #fff); transition:filter .5s}		
	
	
	
}

/* Medium+ Phone (short screen) */
@media  screen and (max-device-width:393px) and (max-height:660px) and (-webkit-min-device-pixel-ratio:2) {
	
	
/*SCENE 1 */


.circle_wrap{background-image:url("assets/circle_bg_393_short.jpg")}	
	

.circle{width:342.7px; height:342.7px; margin-top:4.7px}
	
.blue_glow{width:88%; height:88%; border:solid 5.7px #0061a8; filter:blur(2.85px)}	
	
.tap{width:244px}

.blue_final{border: solid 19px #0061a8}
	
.halfcircle {border: solid 19px transparent; border-top-color:#0061a8; border-left-color:#0061a8}		
	
	
	
	
/* SCENE 2 */	
	
.mobile_wrap{background-image:url("assets/final_scene_393_short.jpg")}		
	
	
	
.mobile_wrap_top{margin-top:5%}	
.hellenic_bank{width:239.9px; margin-bottom:5%}	
.new_mobile_app{width:233.7px; margin-bottom:2.5%}	
.discover{width:145.7px}
	
.app_wrap{bottom:16%}
.google_play{width:67.5px; margin-right:3.1px}
.apple_store{width:67.5px;  margin-left:3.1px}		
	
	
/* CONNECT */	
	
	
.connect_wrap{bottom:9%}	

.connect{width:173.3px; margin-bottom:6.3px}
.connect_with{width:240.2px}	
	
.divide{width:.23px; height:5.4px}
	

	
.web{width:22.9px}
	
.mobile_app{width:48.7px}
	
.contact{width:53.7px}
	
.mobile_wallet{width:69.7px}
	
.atm{width:23.6px}
	
	
.terms{width:169.4px}		
	
	
.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_mppss .5s ease-out both; animation: connect_wrap_bottom_mppss .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_mppss .5s ease-out both; animation: connect_scale_margin_mppss .5s ease-out both; filter: drop-shadow(4.5px 4.5px 9px #fff); transition:filter .5s}			
	
	
}



/* Medium Phone (tall screen) */
@media  screen and (max-device-width:375px) and (-webkit-min-device-pixel-ratio:2) {
	
	
/*SCENE 1 */


.circle_wrap{background-image: url("assets/circle_bg_375_tall.jpg")}
	
.circle{width:326.9px; height:326.9px; margin-top:4.5px}
	
.blue_glow{width:88%; height:88%; border:solid 5.4px #0061a8; filter:blur(2.7px)}	
	
.tap{width:232.7px}

.blue_final{border: solid 18.1px #0061a8}
	
.halfcircle {border: solid 18.1px transparent; border-top-color:#0061a8; border-left-color:#0061a8}		
	
	
/* SCENE 2 */	
	
.mobile_wrap{background-image: url("assets/final_scene_375_tall.jpg")}	
	
.mobile_wrap_top{margin-top:3.5%}	
.hellenic_bank{width:250px; margin-bottom:5%}	
.new_mobile_app{width:243.5px; margin-bottom:3%}	
.discover{width:151.8px}
	
.app_wrap{bottom:16.25%}
.google_play{width:70.3px; margin-right:3.2px}
.apple_store{width:70.3px;  margin-left:3.2px}	

	
/* CONNECT */	
	
	
.connect_wrap{bottom:8.5%}	

.connect{width:180.6px; margin-bottom:6.6px}
.connect_with{width:250.3px}	
	
.divide{width:.23px; height:5.6px}
	

	
.web{width:23.8px}
	
.mobile_app{width:50.7px}
	
.contact{width:55.9px}
	
.mobile_wallet{width:72.6px}
	
.atm{width:24.6px}
	
	
.terms{width:176.5px}	

	
.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_mpts .5s ease-out both; animation: connect_wrap_bottom_mpts .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_mpts .5s ease-out both; animation: connect_scale_margin_mpts .5s ease-out both; filter:drop-shadow(4.7px 4.7px 9.4px #fff); transition:filter .5s}	
		
	
}







/* Medium Phone (short screen) */
@media  screen and (max-device-width:375px) and (max-height:628px) and (-webkit-min-device-pixel-ratio:2) {

	
/*SCENE 1 */

.circle_wrap{background-image: url("assets/circle_bg_375_short.jpg")}
	
.circle{width:326.9px; height:326.9px; margin-top:4.5px}
	
.blue_glow{width:88%; height:88%; border:solid 5.4px #0061a8; filter:blur(2.7px)}	
	
.tap{width:232.7px}

.blue_final{border: solid 18.1px #0061a8}
	
.halfcircle {border: solid 18.1px transparent; border-top-color:#0061a8; border-left-color:#0061a8}			
	
	

	
	
/* SCENE 2 */	
	
.mobile_wrap{background-image:url("assets/final_scene_375_short.jpg")}		
	
	
	
.mobile_wrap_top{margin-top:3.5%}	
.hellenic_bank{width:213px; margin-bottom:3.5%}	
.new_mobile_app{width:207.5px; margin-bottom:2%}	
.discover{width:129.4px}
	
.app_wrap{bottom:16.5%}
.google_play{width:60px; margin-right:2.75px}
.apple_store{width:60px;  margin-left:2.75px}			
	
	
/* CONNECT */	
	
	
.connect_wrap{bottom:6.5%}	

.connect{width:153.9px; margin-bottom:5.6px}
.connect_with{width:213.3px}	
	
.divide{width:.2px; height:4.8px}
	

	
.web{width:20.3px}
	
.mobile_app{width:43.2px}
	
.contact{width:47.7px}
	
.mobile_wallet{width:61.9px}
	
.atm{width:20.9px}
	
	
.terms{width:150.4px}		
	
	
.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_mpss .5s ease-out both; animation: connect_wrap_bottom_mpss .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_mpss .5s ease-out both; animation: connect_scale_margin_mpss .5s ease-out both; filter: drop-shadow(4px 4px 8px #fff); transition:filter .5s}			
	
	
}	
	
	
	






/* Small Phone */
@media screen and (max-device-width:360px) and (-webkit-min-device-pixel-ratio:2) {
	
/*SCENE 1 */

.circle_wrap{background-image: url("assets/circle_bg_360_tall.jpg")}	
	
.circle{width:313.8px; height:313.8px; margin-top:4.3px}
	
.blue_glow{width:88%; height:88%; border:solid 5.2px #0061a8; filter:blur(2.6px)}	
	
.tap{width:223.4px}

.blue_final{border: solid 17.4px #0061a8}
	
.halfcircle {border: solid 17.4px transparent; border-top-color:#0061a8; border-left-color:#0061a8}		
	
	
	
	
/* SCENE 2 */	
	
.mobile_wrap{background-image:url("assets/final_scene_360_tall.jpg")}		
	
.mobile_wrap_top{margin-top:6%}	
.hellenic_bank{width:240px; margin-bottom:5.75%}	
.new_mobile_app{width:233.7px; margin-bottom:3.5%}	
.discover{width:145.7px}
	
.app_wrap{bottom:19%}
.google_play{width:67.5px; margin-right:3px}
.apple_store{width:67.5px;  margin-left:3px}		
	
	
/* CONNECT */	
	
	
.connect_wrap{bottom:10.25%}	

.connect{width:173.4px; margin-bottom:6.3px}
.connect_with{width:240.3px}	
	
.divide{width:.22px; height:5.4px}
	

	
.web{width:22.8px}
	
.mobile_app{width:48.6px}
	
.contact{width:53.6px}
	
.mobile_wallet{width:69.7px}
	
.atm{width:23.6px}
	
	
.terms{width:169.5px}	

	
.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_spts .5s ease-out both; animation: connect_wrap_bottom_spts .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_spts .5s ease-out both; animation: connect_scale_margin_spts .5s ease-out both; filter:unset; transition:unset}	
	
	
	
	
	
}

/* Small Phone (short screen) */
@media screen and (max-device-width:360px) and (max-height:620px) and (-webkit-min-device-pixel-ratio:2) {
	
	
/*SCENE 1 */

.circle_wrap{background-image: url("assets/circle_bg_360_short.jpg")}	
	
.circle{width:313.8px; height:313.8px; margin-top:4.3px}
	
.blue_glow{width:88%; height:88%; border:solid 5.2px #0061a8; filter:blur(2.6px)}	
	
.tap{width:223.4px}

.blue_final{border: solid 17.4px #0061a8}
	
.halfcircle {border: solid 17.4px transparent; border-top-color:#0061a8; border-left-color:#0061a8}		
	
		
/* SCENE 2 */		
	
.mobile_wrap{background-image:url("assets/final_scene_360_short.jpg")}		
	

.mobile_wrap_top{margin-top:3.5%}	
.hellenic_bank{width:230.4px; margin-bottom:5%}	
.new_mobile_app{width:224.3px; margin-bottom:3%}	
.discover{width:139.8px}
	
.app_wrap{bottom:16.5%}
.google_play{width:67.5px; margin-right:3px}
.apple_store{width:67.5px;  margin-left:3px}			
	

/* CONNECT */	
	
	
.connect_wrap{bottom:9%}	

.connect{width:173.4px; margin-bottom:6.3px}
.connect_with{width:240.3px}	
	
.divide{width:.22px; height:5.4px}
	

	
.web{width:22.8px}
	
.mobile_app{width:48.6px}
	
.contact{width:53.6px}
	
.mobile_wallet{width:69.7px}
	
.atm{width:23.6px}
	
	
.terms{width:169.5px}	

	
.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_spss .5s ease-out both; animation: connect_wrap_bottom_spss .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_spss .5s ease-out both; animation: connect_scale_margin_spss .5s ease-out both; filter:drop-shadow(4.5px 4.5px 9px #fff); transition:filter .5s}	
		
	
	
}



/* Very Small Phone */
@media screen and (max-device-width:320px) and (-webkit-min-device-pixel-ratio:1.5) {
	
	
/*SCENE 1 */

.circle_wrap{background-image: url("assets/circle_bg_320.jpg")}		
	
.circle{width:278.6px; height:278.6px; margin-top:3.8px}
	
.blue_glow{width:88%; height:88%; border:solid 4.6px #0061a8; filter:blur(2.3px)}	
	
.tap{width:198.4px}

.blue_final{border: solid 15.4px #0061a8}
	
.halfcircle {border: solid 15.4px transparent; border-top-color:#0061a8; border-left-color:#0061a8}			
	
	
/* SCENE 2 */	
	
.mobile_wrap{background-image:url("assets/final_scene_320.jpg")}		
	
.mobile_wrap_top{margin-top:3.5%}	
.hellenic_bank{width:170.5px; margin-bottom:3%}	
.new_mobile_app{width:166px; margin-bottom:1.75%}	
.discover{width:103.5px}
	
.app_wrap{bottom:18%}
.google_play{width:60px; margin-right:2.6px}
.apple_store{width:60px;  margin-left:2.6px}			
	
	
	
	
	
	
/* CONNECT */	
	
	
.connect_wrap{bottom:4.75%}	

.connect{width:154px; margin-bottom:5.6px}
.connect_with{width:213.4px}	
	
.divide{width:.2px; height:4.8px}
	

	
.web{width:20.2px}
	
.mobile_app{width:43.1px}
	
.contact{width:47.6px}
	
.mobile_wallet{width:61.9px}
	
.atm{width:21px}
	
	
.terms{width:150.5px}	

	
.connect_wrap_bottom{-webkit-animation: connect_wrap_bottom_vsp .5s ease-out both; animation: connect_wrap_bottom_vsp .5s ease-out both}
.connect_scale_margin{-webkit-animation: connect_scale_margin_vsp .5s ease-out both; animation: connect_scale_margin_vsp .5s ease-out both; filter:drop-shadow(4px 4px 8px #fff); transition:filter .5s}	
		
}