/* -------- Fonts -------- */

@font-face {
    font-family: "Eina03";
    font-style: normal;
    font-weight: 700;
    src: url("fonts/eina-03-bold.ttf");
}

* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}

body.grid .column-large {
    background: url(img/grid.html) repeat-y;
}


body.grid .column-small {
    border: 1px solid red;
}

body.grid .row > .col {
    border: 1px solid black;
}

.column-large {
    max-width: 1080px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;

}

.column-medium {
    max-width: 720px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
	margin-top: 20px;

}

.column-small {
    width: calc(50% - 16px);
    margin-left: auto;
    margin-right: auto;
}

.column-logo{
    width: calc(50% - 16px);
	margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
}

/* ------ basic typography ------ */

h1 {
	font-family: 'Eina03';
	font-size: 40px;
	margin-bottom: 40px;
	line-height: 1.2;
}


h2 {
    font-family: 'Eina03';
    font-size: 40px;
    font-weight: 700;
    line-height: 1;
}


h3 {
	font-family: 'Eina03';
	font-weight: 300;
	font-size: 22px;
	margin-bottom: 5px;
	line-height: 1;
}


body {
    line-height: 1.3;
    font-family: 'Open Sans';
    font-size: 18px;
    color: #393939;
}

.center {
    text-align: center;
}

p {
    margin-bottom: 20px;
}

strong {
    font-weight: 700;
}

br.mobile {
    display: none;
}

/* ------ lists ------ */

ul {
    list-style-type: none;
    margin-bottom: 30px;
}

ul.check li,
ul.x li {
    position: relative;
}

ul.check li::before,
ul.x li::before {
    content: '';
    width: 14px;
    height: 12px;
    position: absolute;
    left: -24px;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
}

ul.check li::before {
    background: url(img/list-check.png);
}

ul.x li::before {
    background: url(img/list-x.png);
}


li {
    margin-bottom: 20px;
}

li:last-child,
ul:last-child,
p:last-child {
    margin-bottom: 0;
}

/* ------ to never stretch/shrink images ------*/

img {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;

}


/* ------  [ ] ≡≡  ------ */

/* ------  ≡≡ [ ]  ------ */

.text-image-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.text-image-flex img {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    margin-right: 30px;
}

.text-image-flex img:last-child {
    margin-right: 0;
    margin-left: 30px;
}

/* ------ my grid system ----- */

.row {
    width: 100%;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: cemter;
        -ms-flex-pack: cemter;
            justify-content: cemter;
}

.row > .col {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
    width: 0;
    margin: 0 16px;
}

.row > .col:first-child {
    margin-left: 0;
}

.row > .col:last-child {
    margin-right: 0;
}

section {
    margin-bottom: 0px;
    padding-top: 40px;
	padding-bottom: 40px;
}

section.border {
    border-bottom: 1px solid #f3f3f3;
}

.wave-b {
    position: relative;
    padding-bottom: 112px;
    border-bottom: none;
}

.wave-b::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 80px;
    background: no-repeat url(img/triangle-bottom.png);
    background-size: 100% 80px;
    z-index: 10;

}

.wave-c {
    position: relative;
    border-bottom: none;
}

.wave-c::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 80px;
    background: no-repeat url(img/divider.png);
    background-size: 100% 80px;
    z-index: 10;
	

}


/* ------ fade in animations ------ */

@-webkit-keyframes fade-in-keyframes {
    to {
        opacity: 1;
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0)
    }
}

@keyframes fade-in-keyframes {
    to {
        opacity: 1;
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0)
    }
}

.animated.animate-fade-in {
    -webkit-animation-name: fade-in-keyframes;
            animation-name: fade-in-keyframes;
}

.animate-fade-in {
    -webkit-transform: translate(0, 30px);
        -ms-transform: translate(0, 30px);
            transform: translate(0, 30px);
    opacity: 0;
    -webkit-animation-duration: 0.7s;
            animation-duration: 0.7s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
}

/* ---- Quotes ---- */

.quote {
    font-family: 'Merriweather', serif;
    background-image: url(img/quote-background.html);
    background-size: 100%;
    padding-top: 64px;
    padding-bottom: 64px;
    margin-top: -48px;
    margin-bottom: -32px;
    position: relative;
    z-index: -1;
}

.quote::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: -webkit-linear-gradient(rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.5) 64px, rgba(255, 255, 255, 0.5) 70%, rgba(255, 255, 255, 1));
    background: -o-linear-gradient(rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.5) 64px, rgba(255, 255, 255, 0.5) 70%, rgba(255, 255, 255, 1));
    background: linear-gradient(rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.5) 64px, rgba(255, 255, 255, 0.5) 70%, rgba(255, 255, 255, 1));
    z-index: -1;
}

.quote:not(.no-quotes) blockquote::before {
    content: '“';
}

.quote:not(.no-quotes) blockquote::after {
    content: '”';
}

.quote blockquote {
    z-index: 3;
    font-size: 19px;
    font-weight: 400;
    padding: 32px;
    background: white;
    -webkit-box-shadow: 0px 4px 24px 0px rgba(90, 99, 114, 0.3);
            box-shadow: 0px 4px 24px 0px rgba(90, 99, 114, 0.3);
    /*border-bottom: 4px solid #8f9db5;*/
}

.quote figcaption {
    z-index: 3;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    margin-top: 20px;
}

.quote figcaption::before {
    content: '—';
}

/*
#loading {
    width: 100vw;
    height: 100vh;
    position: relative;
    animation: loading 1s forwards;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: white;
    z-index: 99;
}

@keyframes loading {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

#loading-arrow {
    z-index: 3;
}

#loading-circle {
    z-index: 2;
    mix-blend-mode: hard-light;
}

#loading-play {
    z-index: 1;
}

#loading-arrow,
#loading-circle,
#loading-play {
    height: 256px;
    display: block;
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}*/

#top-bar {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: 20px;
}

footer .logotype,

footer .logotype {
    background-image: url(img/logotype-small-black.png);
}

#top-bar .menu > * {
    color: rgba(255, 255, 255, 0.6);
}

.menu > * {
    margin-left: 20px;
    color: #abb8cc;
    text-decoration: none;
}

.menu > a:hover {
    color: #0030ff;
}

.center {
    text-align: center;
}

/*
header {
    background-image: url(img/wave-header.png);
    background-size: 50% 50%;
    background-position: top right;
    background-repeat: no-repeat;
}*/

header {
    
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: stretch;
        -ms-flex-pack: stretch;
            justify-content: stretch;
    background-color: #1f00ff;
    background-image: url(img/header-background.png);
	background-size: cover;
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
    color: white;
}

.button.yellow {
    background: #ffce00;
    color: black;
}

.button.yellow:hover {
    background: -webkit-gradient(linear, left top, left bottom, from(#ffce00), to(#ffac00));
    background: -webkit-linear-gradient(#ffce00, #ffac00);
    background: -o-linear-gradient(#ffce00, #ffac00);
    background: linear-gradient(#ffce00, #ffac00);
}

header > .column-large {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding-bottom: 74px;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
}

header h1 {
    position: relative;
    font-family: 'Eina03';
    font-weight: 700;
    font-size: 40px;
    text-align: center;
	margin-bottom: 10px;
	margin-top: 10px;
}

header h1 strong {
        background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, rgba(78, 0, 254, 0)), color-stop(50%, rgba(0, 35, 132, 1)));
        background: -webkit-linear-gradient(rgba(78, 0, 254, 0) 50%, rgba(0, 35, 132, 1) 50%);
        background: -o-linear-gradient(rgba(78, 0, 254, 0) 50%, rgba(0, 35, 132, 1) 50%);
        background: linear-gradient(rgba(78, 0, 254, 0) 50%, rgba(0, 35, 132, 1) 50%);
}

header h2 {
    font-size: 28px;
    font-weight: 400;
    line-height: 1.1;
    font-family: 'Open Sans';
    margin-bottom: 0;
    text-align: center;
}

header .points {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

header .point {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;

}

header .point:last-child {
    margin-bottom: 0;
}
header .point img {
    margin-right: 20px;
}

#video-points {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.video-to-mobile-size {
    width: 100%;
    display:block;
    margin-left: auto;
    margin-right: auto;
}


header .call-to-action {
    margin-top: 32px;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}

#main-video {
    position: relative;
    -webkit-box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.3);
            box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.3);
    padding-bottom: 56.25%;
    /* 16:9 */
    padding-top: 0;
    height: 0;
}

#main-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


.button {
    width: 100%;
    color: white;
    font-family: 'Montserrat';
    font-weight: 700;
    text-transform: uppercase;
    background: -webkit-gradient(linear, left top, left bottom, from(#0030ff), to(#3d039c));
    background: -webkit-linear-gradient(#0030ff, #3d039c);
    background: -o-linear-gradient(#0030ff, #3d039c);
    background: linear-gradient(#0030ff, #3d039c);
    padding: 16px;
    text-align: center;
    border-radius: 99px;
    cursor: pointer;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.button:hover {
    background: #005aff;
}

.payment-info {
    font-style: italic;
    text-align: center;
    margin-top: 10px;
}

/*
#top-bar::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 4px;
    width: 100%;
    background: linear-gradient(90deg, #3d039c, #0030ff);
}
*/

#first-testimonials {
    margin: 0;
}

.testimonials {
    padding: 48px 0;
    background: #f3f3f3;
}


.testimonial {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.testimonial img {
    margin-right: 20px;
    border-radius: 50%;
}

.testimonial .name {
    margin-bottom: 14px;
    font-weight: 300;
    font-size: 22px;
}

#Top-Converting-Videos {
    margin-top: 48px;
}

#Top-Converting-Videos h3 {
    line-height: 1.3;
}

#Top-Converting-Videos .stat {
    background-position: center;
    background-repeat: no-repeat;
    padding: 32px 0;
}

#Top-Converting-Videos .row {}

#massive-audiences {
    background-image: url(img/massive-audiences.html), -webkit-gradient(linear, left top, left bottom, from(#0030ff), to(#3b5998));
    background-image: url(img/massive-audiences.html), -webkit-linear-gradient(#0030ff, #3b5998);
    background-image: url(img/massive-audiences.html), -o-linear-gradient(#0030ff, #3b5998);
    background-image: url(img/massive-audiences.html), linear-gradient(#0030ff, #3b5998);
    min-height: 600px;
}

#engaged-viewers {
    background-color: #fff;
    min-height: 530px;
    background-image: url(img/engaged-viewers.html), -webkit-linear-gradient(45deg, #ffd521, #f30006, #b900b4);
    background-image: url(img/engaged-viewers.html), -o-linear-gradient(45deg, #ffd521, #f30006, #b900b4);
    background-image: url(img/engaged-viewers.html), linear-gradient(45deg, #ffd521, #f30006, #b900b4);
}

#targeted-traffic {
    background-color: #f00;
    min-height: 530px;
    background-image: url(img/targeted-traffic.html);
}

#Until-now-leveraging {}

.img-reverse .row:nth-child(2n) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
}

.img-reverse .row:nth-child(2n) .col:first-child {
    margin-right: 0;
    margin-left: 16px;
}

.img-reverse .row:nth-child(2n) .col:last-child {
    margin-right: 16px;
    margin-left: 0;
}

.row.illustration {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.row.icons .col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}


#FAQ h1 {
   margin-bottom: unset;
}

#FAQ p {
   font-size: 17px;
   margin-top: 23px;
}

#FAQ .column-narrow {
   width: 70%;
   display: block;
   margin-left: auto;
   margin-right: auto;
   margin-bottom: 20px;
}

#FAQ .column-large {
  margin-top: 25px;
}

#Until-now-leveraging .row {
    margin-top: 48px;
}

#Until-now-leveraging .col {
    text-align: center;
}

#Until-now-leveraging .col > div {
    width: 70%;
    margin-top: 20px;
}

#Until-now-leveraging h3 {
    font-size: 24px;
    font-weight: 300;
    margin-bottom: 32px;
}

#Quick-Steps .row {
    margin-top: 32px;
}

#Quick-Steps .gif {
    max-width: 100%;
}

#vidsting-section-2 .steps {
    font-size: 30px;
    margin-bottom: 10px;
    font-weight: 700;
    font-family: 'Eina03';
}

#vidsting-section-3 h1 {
   margin-bottom: unset;
}

#vidsting-section-3 p {
   font-size: 17px;
   margin-top: 23px;
}

#vidsting-section-3 .column-narrow {
   width: 70%;
   display: block;
   margin-left: auto;
   margin-right: auto;
   margin-bottom: 20px;
}

#vidsting-section-3 .column-large {
  margin-top: 25px;
}

#Heres-what-explaindio-can-do{
    background-color: #eff3f8;
}

#Heres-what-explaindio-can-do h1{
    text-align: center;
    margin-top: 25px;
}

#Heres-what-explaindio-can-do p{
    margin-top: 5px;
    font-weight: 600;
    color: #5b12ff;
    font-size: 18px;
}

#Heres-what-explaindio-can-do .icons{
    margin-top: 18px;
}

#Simple-affordable-pricing {
    background-image: url(img/header-background.png);
	background-size: cover; 
	
}

#Simple-affordable-pricing  h1{
    margin-top: 30px;
    margin-bottom: unset;
    color:#fc0;
    text-align: center;
}

#Simple-affordable-pricing .cta-box {
    padding-bottom: 20px;
    padding-top: 30px;
    position: relative;
    border-radius: 10px;
    background-color: white;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    width: 83%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

#Simple-affordable-pricing h4{
    color: #fff;
    text-align: center;
}

#Simple-affordable-pricing li{
    color: #fff;
}

#Andrew {
     background-color:#2d2c2d;
}

#Andrew img{
    display: block;
    margin-left: auto;
    margin-right: auto;
}

#Andrew p{
     color: #fff;
     text-align: center;
}

#Get-instant-access{
    background-color: #eff3f8;
}

#Get-instant-access .column-large{
    width:70%;
}

#Get-instant-access h4{
    font-size: 17px;
    font-weight: 500;
    text-align: center;
}

#Get-instant-access h1{
    text-align: center;
    margin-top: 25px;
}

.gif {
    border-radius: 6px;
}

#Quick-Steps .number {
    font-size: 70px;
    margin-bottom: 10px;
    font-weight: 700;
    font-family: 'Eina03';
}

#publish-and-distribute {
    margin-bottom: 32px;
}

#Futher-customize h1 {
    text-align: center;
}

p {
    line-height: 1.5;
}

#Futher-customize .icons {
    margin-bottom: 48px;
    text-align: center;
}

#distributed {
    margin-bottom: 8px;

}

#Online-Video-isnt-everything .red h1 {
    font-size: 40px;
    color: white;
    margin-bottom: 0;
    line-height: 1;
}

#Online-Video-isnt-everything .the-only-thing {
    color: white;
    font-size: 120px;
    margin-bottom: 64px;
}

#Online-Video-isnt-everything .red {
	
    background-color: #ff0000;
    background-image: url(img/triangles.png);
    background-repeat: no-repeat;
    background-position: top left;
    color: white;
    padding-top: 80px;
    position: relative;
    margin-bottom: 32px;
    overflow: hidden;
    min-height: 600px;
}


#Online-Video-isnt-everything .facebook-like {
    width: 100%;
    position: relative;
}

#Online-Video-isnt-everything .facebook-like::before {
    content: "";
    position: absolute;
    bottom: 0;
    width: 75px;
    height: 75px;
    left: 20%;
    background: url(img/online-video-like.png);
    z-index: 11;
}

#hey-this-is h2 {
    font-size: 40px;
}

#hey-this-is {
    z-index: 2;
}


#sam-karthik-mobile {
    display: none;
}

#online-video-karthik,
#online-video-sam {
    width: 100%;
    max-width: 1280px;
    left: 50%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    height: 483px;
    background-repeat: no-repeat;
    background-position: right;
    position: absolute;
    bottom: -150px;
}

#online-video-karthik {
    background-image: url(img/online-video-karthik.png);
    z-index: 1;
}

#online-video-sam {
    background-image: url(img/online-video-sam.png);
    bottom: -200px;
    z-index: 2;
}

#is-where-the-buyers {
    font-size: 40px;
    font-weight: 700;
    text-align: center;
}


#Bottom-line .line {}

#Bottom-line .line {
    text-align: center;
    position: relative;
}


#Bottom-line h1,
#Bottom-line h2 {
    text-align: center;
}

#Bottom-line .row {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-line-pack: center;
        align-content: center;
}

#Bottom-line .row .col {
    width: calc(33% - 64px);
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
}

#Bottom-line .col img {
    margin-bottom: 32px;
}

#Bottom-line .back img {
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
}

#Bottom-line {
    border-bottom: none;
}

#Bottom-line .row.icons {
    margin-bottom: 32px;
}

#Bottom-line .row.second-row {
    margin-bottom: 48px;
}

#Bottom-line .col {
    font-size: 20px;
    font-weight: 300;
}

img {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
}

img.full,
img.center {
    display: block;
    margin: 0 auto 32px auto;
}

#Introducing,
#Turn-One-Time-Visitors,
#Video-traffic-conversions,
#faq,
#Online-Video-isnt-everything,
#Unlimitted-video-creation,
#Futher-customize {
    border-bottom: none;
    padding-bottom: 0;
}


#Introducing h1 {
    font-size: 24px;
    text-align: center;

}

#Introducing h3 {
    text-align: center;
    margin: 32px 0;
}

#Introducing .logotype {
    display: block;
    margin: 0 auto;
    width: 399px;
}

#boxes {
    width: 100%;
    display: block;
}

#intro-with-box {}

#watch-this-demo {
    margin-top: 0px;
    color: white;
    background: #2d2c2d;
}

#watch-this-demo h2 {
    text-align: center;
}

#watch-this-demo .video {
    margin: 32px auto;
    display: block;
}

#Optimized-out-of-the-box {}

#A-huge-passive-income {}

#Huge-ROI {}

#Turn-One-Time-Visitors {}

#a-simple-60-seconds {
    background: #f3f3f3;
    color: black;
    padding: 32px 0;
    margin: 0;
}

#Nothing-Beats-Video {
    padding-top: 48px;
    color: black;
    margin: 0;
    background-color: #fff;
    border: 0;
}

#Turn-One-Time-Visitors {
    margin: 0;
}

h1.bold {
    font-size: 53px;
}

#How-Explaindio 4.0-Turns .row {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: 32px;
}

#logo-position {
    width: 624px;
    height: 420px;
    position: relative;
}


#logo-position .laptop-text {
    background: url(img/logo-position-laptop-text.png);
    width: 624px;
    height: 420px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

#logo-position .logo {
    background: url(img/logo-position-logo.png);
    width: 280px;
    height: 114px;
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    -webkit-transform: translate(50px, 45px);
        -ms-transform: translate(50px, 45px);
            transform: translate(50px, 45px);
}

#logo-position.animated .logo {
    -webkit-animation: logoposition 10s infinite;
            animation: logoposition 10s infinite;
}

@-webkit-keyframes logoposition {
    0% {
        -webkit-transform: translate(50px, 45px);
                transform: translate(50px, 45px)
    }
    5% {
        -webkit-transform: translate(50px, 45px);
                transform: translate(50px, 45px)
    }
    15% {
        -webkit-transform: translate(290px, 45px);
                transform: translate(290px, 45px)
    }
    25% {
        -webkit-transform: translate(290px, 45px);
                transform: translate(290px, 45px)
    }
    45% {
        -webkit-transform: translate(290px, 255px);
                transform: translate(290px, 255px)
    }
    55% {
        -webkit-transform: translate(290px, 252px);
                transform: translate(290px, 252px)
    }
    75% {
        -webkit-transform: translate(70px, 252px);
                transform: translate(70px, 252px)
    }
    85% {
        -webkit-transform: translate(180px, 245px);
                transform: translate(180px, 245px)
    }
    95% {
        -webkit-transform: translate(180px, 252px);
                transform: translate(180px, 252px)
    }
    100% {
        -webkit-transform: translate(50px, 45px);
                transform: translate(50px, 45px)
    }
}

@keyframes logoposition {
    0% {
        -webkit-transform: translate(50px, 45px);
                transform: translate(50px, 45px)
    }
    5% {
        -webkit-transform: translate(50px, 45px);
                transform: translate(50px, 45px)
    }
    15% {
        -webkit-transform: translate(290px, 45px);
                transform: translate(290px, 45px)
    }
    25% {
        -webkit-transform: translate(290px, 45px);
                transform: translate(290px, 45px)
    }
    45% {
        -webkit-transform: translate(290px, 255px);
                transform: translate(290px, 255px)
    }
    55% {
        -webkit-transform: translate(290px, 252px);
                transform: translate(290px, 252px)
    }
    75% {
        -webkit-transform: translate(70px, 252px);
                transform: translate(70px, 252px)
    }
    85% {
        -webkit-transform: translate(180px, 245px);
                transform: translate(180px, 245px)
    }
    95% {
        -webkit-transform: translate(180px, 252px);
                transform: translate(180px, 252px)
    }
    100% {
        -webkit-transform: translate(50px, 45px);
                transform: translate(50px, 45px)
    }
}

#logo-position video {
    position: absolute;
    top: 38px;
    left: 45px;
    z-index: 1;
}

#branded-scenes {
    position: relative;
    height: 423px;
    width: 100%;
}

#branded-scenes .scene {
    width: 467px;
    height: 298px;
    position: absolute;

}

#branded-scenes-one {
    background: url(img/branded-scenes-one.png);
    z-index: 1;
}

#branded-scenes-two {
    background: url(img/branded-scenes-two.png);
    z-index: 2;
    /* transform: translate(80px, 62px);*/
}

#branded-scenes-three {
    background: url(img/branded-scenes-three.png);
    z-index: 3;
    /*transform: translate(160px, 125px);*/
}

#logo-position-mobile,
#branded-scenes-mobile {
    display: none;
}

#vidsting-section-6 {
    background-color: #2d2c2d;
    margin: 0;
    padding-top: 32px;
    border: 0;
    color: white;
}

img {
    max-width: 100%;
}

/*#Explaindio-software {
    background-image: url(img/software-box-bg.png);
    background-repeat: no-repeat;
    background-size: cover;   
}*/



#Explaindio-software h1{
   /* color: #fff;*/
    margin-top: 10px;
}

#Explaindio-software p{
    /*color: #fff;*/
    text-align: right;
}

#Explaindio-software .column-large{
    width: 85%;
    margin-bottom: 30px;
}

#Testimonials {
    background-color: #ffffff;
    margin-bottom: 45px;
}

#Testimonials p{
    font-size: 16px;
}

.testimonial-wrapper {
    background-color: #fafbfb;
    padding: 37px;
    border-radius: 25px;
    font-style: italic;
    box-shadow: 5px 10px 18px #bfbfbf;
}

#buy-buttons {
     background-image: url(img/header-background.png);
}


#Testimonials img{
    float: left;
    margin-right: 30px;
}

#Testimonials .qoute{
    float: left;
}

#Testimonials h1{
    text-align: center;
    margin-top: 30px;
}

#legal-text {
    background-color: #eff3f8;
    text-align: center;
    font-size: 13px;
}

#legal-text .column-large{
    width: 70%;
}

#FAQ h1{
    text-align: center;
}

#FAQ {
    background-color: #eff3f8;
}

#FAQ .row {
    margin-top: 33px;
}

#FAQ p{
    text-align: left;
}

#FAQ .column-large{
    width: 90%;
}

#FAQ li {
    font-weight: 700;
    font-size:19px;
    margin-bottom: 7px;
    text-align: left;
    background-image: url(img/question.svg);
    background-size: 28px;
    background-repeat: no-repeat;
    padding-left: 40px;
}

.answer {
    padding-left: 38px;
    margin-top: -15px;
}



#What-you-get {
    background-color: #2d2c2d;
    padding-bottom: unset;
	padding-bottom: 150px;
}

#What-you-get .icons {
    margin-top: 70px;
}

#What-you-get h1{
    color:#fff;
    margin-top: 30px;
}

#What-you-get p{
    color:#fff;
    text-align: center;
}

#What-you-get h4{
    color:#ffce00;
    text-align: center;
    font-size: 25px;
}





#vidsting-section-6 h1 {
    margin-bottom: 16px;
}

#vidsting-section-6 .row {
    margin-top: 32px;
}

#The-Fastest-Way {
    background-color: #2d2c2d;
    color: white;
    padding-top: 32px;

}

#The-Fastest-Way h1 {}

#Your-Videos-your-way {}

#The-Explaindio 4.0-difference {}

#Unlimitted-video-creation {}

#Explaindio-features {
    background: #3d039c url(img/triangles.png) top left no-repeat;
    padding-top: 64px;
    color: white;
}


#Explaindio-features h1 {
    text-align: center;
    margin-bottom: 48px;
}

#Explaindio-features h1 strong {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, rgba(78, 0, 254, 0)), color-stop(50%, rgba(0, 35, 132, 1)));
    background: -webkit-linear-gradient(rgba(78, 0, 254, 0) 50%, rgba(0, 35, 132, 1) 50%);
    background: -o-linear-gradient(rgba(78, 0, 254, 0) 50%, rgba(0, 35, 132, 1) 50%);
    background: linear-gradient(rgba(78, 0, 254, 0) 50%, rgba(0, 35, 132, 1) 50%);
}

#Explaindio-features h3 {
    font-weight: 700;
    font-size: 17px;
    margin-bottom: 12px;
}

#Explaindio-features h4 {
    text-align: center;
}

#Explaindio-features .column-large {
    margin-top: 45px;
}

#Explaindio-features li {
    padding: 10px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 80px;
}

#Explaindio-features li img {
    margin-right: 18px;
}

#Explaindio 4.0-and-you {
    background-color: #2d2c2d;
    /*background-image: url(img/triangles-Explaindio 4.0-and-you.png);
    background-repeat: no-repeat;*/
    color: white;
    padding-top: 64px;
}

#Explaindio 4.0-and-you .videos {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}


#Explaindio 4.0-and-you .videos > div {
    width: 25%;
    margin-top: 28px;
    padding: 20px;
    text-align: center;
}


#Explaindio 4.0-and-you h1 {
    text-align: center;
    margin-bottom: 24px;
}

#universal-appeal {
    font-size: 34px;
    font-weight: 400;
    font-family: 'Open Sans';
    text-align: center;
}

#Explaindio 4.0-and-you h3 {
    text-align: center;
    font-weight: 700;
    font-size: 24px;
    font-family: 'Eina03';
    color: #ffce00;
}

#Explaindio 4.0-and-you video {
    width: 100%;
    cursor: pointer;
}

#Explaindio 4.0-and-you .example {
    margin-bottom: 16px;
    position: relative;
    cursor: pointer;
}

#Explaindio 4.0-and-you h2 {
    text-align: center;
}


#Video-traffic-conversions h1,
#Video-traffic-conversions h2,
#Video-traffic-conversions h3 {
    text-align: center;
}

#it-gets-better h1,
#it-gets-better h2 {
    text-align: center;
}

#thanks-for-checking .photos {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

#thanks-for-checking .photos > * {
    margin-right: 32px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

#thanks-for-checking .photos img {
    margin-bottom: 16px;
    padding: 16px;
    width: 128px;
    height: 128px;
}

/* ------ footer ------ */

footer {
    padding: 20px 0;
    border-top: 1px solid #f3f3f3;
}

footer .column-large {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

footer a {
    color: #bbb;
}

.question-container .question {
    background-image: url(img/arrow-closed.svg);
    background-position: left center;
    background-repeat: no-repeat;

    cursor: pointer;
    padding: 8px 0;
    font-weight: 700;
}

.question-container .question.open {
    background-image: url(img/arrow-open.svg);
}

.question-container .answer {
    padding: 16px 0;

}

img.smaller {
    width: 180px;
}

.text-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: 16px;
}

.text-img > img {
    margin-left: 16px;
}

.text-img > *:not(img) {
    margin: 0 16px 0 0;
}



#packages {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    border-bottom: none;
    margin-bottom: 0;
}

.package {
    border-radius: 4px;
    width: calc(33.3% - 14px);
    padding: 24px;
    -webkit-transition: .2s all;
    -o-transition: .2s all;
    transition: .2s all;
    max-width: 650px;
}
.package.empty_column {
    width: calc(16.6% - 14px);
}


.package h2 {
    text-align: center;
    font-size: 30px;
	padding: 12px;


}

.package h3 {
    text-align: center;
    font-size: 20px;
    padding: 12px;

}
.package .number {
    font-weight: 700;
}

.package li {
    margin-bottom: 20px;
}

#package-starter {
    border: 1px solid #8f9cb5;
}

#package-premium {
    color: white;
    -webkit-box-shadow: 0px 7px 28px 0px rgba(37, 0, 119, 0.4);
            box-shadow: 0px 7px 28px 0px rgba(37, 0, 119, 0.4);
    background-color: #3d039c;
    /*background-image: url(img/package-premium.png);*/
    background-size: cover;
}

#package-agency {
    background-color: #3d039c;
   /* background-image: url(img/package-premium.png);*/
    background-size: cover;
    -webkit-box-shadow: 0px 7px 28px 0px rgba(104, 104, 104, 0.4);
            box-shadow: 0px 7px 28px 0px rgba(104, 104, 104, 0.4);
}

#package-agency li,
#package-premium li {
    position: relative;
    padding-left: 26px;
}

#package-agency li::before,
#package-premium li::before {
    content: '';
    width: 12px;
    height: 10px;
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
}

#package-agency li::before {
    background: url(img/list-check-agency.png);
}

#package-premium li::before {
    background: url(img/list-check-agency.png);
}


#package-agency,
#package-premium {
    background-position: top center;
    background-repeat: no-repeat;
    padding-top: 50px;
    color: white;

}

#package-agency:hover,
#package-premium:hover {
    -webkit-transform: scale(1.025);
        -ms-transform: scale(1.025);
            transform: scale(1.025);

}


#package-premium h2 {
    /*background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, rgba(0, 35, 123, 0)), color-stop(50%, rgba(0, 35, 132, 1)));
    background: -webkit-linear-gradient(rgba(0, 35, 123, 0) 50%, rgba(0, 35, 132, 1) 50%);
    background: -o-linear-gradient(rgba(0, 35, 123, 0) 50%, rgba(0, 35, 132, 1) 50%);
    background: linear-gradient(rgba(0, 35, 123, 0) 50%, rgba(0, 35, 132, 1) 50%);*/
}

#package-starter .button {
    background: #8f9db5;
    color: white;
}

#package-agency .button {
    background: #ffce00;
    color: black;
}

#package-premium .button {
    background: #002384;
    color: white;
}


#package-starter .button:hover {
    background: -webkit-gradient(linear, left top, left bottom, from(#8f9db5), to(#778296));
    background: -webkit-linear-gradient(#8f9db5, #778296);
    background: -o-linear-gradient(#8f9db5, #778296);
    background: linear-gradient(#8f9db5, #778296);
}

#package-agency .button:hover {
    background: -webkit-gradient(linear, left top, left bottom, from(#ffce00), to(#ffac00));
    background: -webkit-linear-gradient(#ffce00, #ffac00);
    background: -o-linear-gradient(#ffce00, #ffac00);
    background: linear-gradient(#ffce00, #ffac00);
}

#package-premium .button:hover {
    background: -webkit-gradient(linear, left top, left bottom, from(#002384), to(#00176c));
    background: -webkit-linear-gradient(#002384, #00176c);
    background: -o-linear-gradient(#002384, #00176c);
    background: linear-gradient(#002384, #00176c);
}

#payment-info {
    border-bottom: none;
    margin-bottom: 0;
}

#something-no-other-can .icons {
    margin-top: 32px;
}


#something-no-other-can .icons img {
    width: 180px;
    margin-bottom: 16px;
}

#something-no-other-can .icons h2 {
    margin-bottom: 8px;
    font-size: 17px;
    text-align: center;
    height: 50px;
}

#turn-scrollers {
    background-color: #e9ebee;
    padding-top: 48px;
    overflow-x: hidden;
}

#scroll-section-parent {
    -webkit-perspective: 1000px;
            perspective: 1000px;
    height: 590px;
    width: 100%;
    position: relative;
    top: 0;
}

#scroll-section {
    background-image: url(img/facebook-background.png);
    background-position: center top;
    position: relative;
    width: 200%;
    left: 100%;
    top: 0;
    padding: 26px;
    -webkit-transform-origin: bottom center;
        -ms-transform-origin: bottom center;
            transform-origin: bottom center;
    -webkit-transform: rotateX(30deg) translateX(-75%) translateY(-285px);
            transform: rotateX(30deg) translateX(-75%) translateY(-285px);
}

#scrollers-text {
    width: 624px;
    position: relative;
    top: 0;
    left: 0;

}

#scrollers-videos {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 1030px;
}


#facebook-dogs,
#facebook-nuggets {
    width: 502px;
    height: 805px;
    background-repeat: no-repeat;
    position: relative;
    border: 1px solid #dddfe2;
    border-radius: 4px;

}

#facebook-dogs video,
#facebook-nuggets video {
    width: 476px;
    height: 476px;
    position: absolute;
    left: 13px;
    top: 117px;
}

#facebook-nuggets {
    background-image: url(img/facebook-nuggets.png);
}

#facebook-dogs {
    background-image: url(img/facebook-dogs.png);
}

#demo {
    text-align: center;
    color: white;
    padding-top: 32px;
    background: #2d2c2d;
}

#demo .video {
    margin: 0 auto;
    width: 900px;
    max-width: 100%;
}

#demo h1 {
    margin-bottom: 24px;
}

.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    overflow: hidden;
    outline: 0;
    background: rgba(0, 0, 0, 0.5);
}

.modal-content {
    width: 900px;
    max-width: 90%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    -webkit-box-shadow: 0 10px 60px rgba(0, 0, 0, 0.8);
            box-shadow: 0 10px 60px rgba(0, 0, 0, 0.8);
    border: 4px solid #3d039c;
    background: #3d039c;
}

.modal-close {
    background: url(img/x-close.png);
    width: 32px;
    height: 32px;
    cursor: pointer;
    position: absolute;
    right: -16px;
    top: -16px;
    z-index: 2;
}

.modal-close:hover {
    background: url(img/x-close-hover.png);
}

.videos .example {
    position: relative;
}

.videos .example::before {
    content: '';
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
    height: calc(100% - 4px);
    width: 100%;
    /*background: url(img/thumbnail-bg.png);*/
    border-bottom: 4px solid #3d039c;
    opacity: 0;
    -webkit-transition: all .25s;
    -o-transition: all .25s;
    transition: all .25s;
}

.videos .example::after {
    content: '';
    z-index: 3;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 92px;
    height: 92px;
    -webkit-transform: translate(-50%, -50%) scale(0.5);
        -ms-transform: translate(-50%, -50%) scale(0.5);
            transform: translate(-50%, -50%) scale(0.5);
    background: url(img/thumbnail-play.png) center no-repeat;
    -webkit-transition: all .25s;
    -o-transition: all .25s;
    transition: all .25s;
}

.videos .example:hover::after {
    -webkit-transform: translate(-50%, -50%) scale(1);
        -ms-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
}

.videos .example:hover::before {
    opacity: 1;
}

#effortlessly-drive-traffic .row {
    margin-bottom: 32px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 920px;
    margin: 0 auto;
    margin-top: 48px;
}

@media (max-width: 940px) {
    #effortlessly-drive-traffic .row {
        width: 100%;
    }
}

#effortlessly-drive-traffic .row .col {
    width: auto;
}

.row.reverse {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
}

.row.reverse .col:first-child {
    margin: 0 0 0 16px;
}

.row.reverse .col:last-child {
    margin: 0 16px 0 0;
}

#simple-sells-animation {
    position: relative;
    width: 972px;
    max-width: 100%;
    margin: 10px auto 32px auto;
    height: 610px;
    background: white;
}

@media (max-width: 1000px) {
    #simple-sells-animation {
        height: 62vw;
    }
}

#simple-sells-animation img {
    width: 100%;
    z-index: 101;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transform: translateZ(0);
}

#simple-sells-animation video {
    width: 100%;
    z-index: 1;
    position: absolute;
    -webkit-transform: translateZ(0);
}

#vidsting-section-4 {

	
    background-color: #1f00ff;

    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
    color: white;
	font-size: 16px;
}


#vidsting-section-4 h1 {
    text-align: center;
    margin-bottom: 48px;
    font-size: 60px;
}

#vidsting-section-4 li {
    padding: 10px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 80px;
}

#vidsting-section-4 li img {
    margin-right: 18px;
}

/*-- countdown / timer --*/

#timer {
    padding-bottom: 16px;
    margin-bottom: 0;
    margin-top: 8px;
    background: #3d039c;
    color: white;
    position: relative;
    padding-top: 0px;
    z-index: 102;
}

#timer::after {
    content: "";
    position: absolute;
    top: -32px;
    left: 0;
    width: 100%;
    height: 32px;
    background: no-repeat url(img/wave-top-blue.svg);
    background-size: 100% 32px;
    z-index: 10;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);

}

#timer .column-large {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

#timer h1 {
    margin-bottom: 0;
    font-size: 30px;
}



#timer-countdown {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 32px;
}

#timer-countdown > div {
    margin: 32px;
    text-align: center;
}

#timer-countdown .number {
    font-size: 25px;
    font-weight: 700;
}


/* ----------- responsive design ------------- */

@media (max-width: 1320px) {

    .column-large {
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }
    header {
        background-size: 100%;
    }
    .illustration img {
        width: 100%;
    }
    img {
        max-width: 100%;
    }
}



@media (max-height: 900px) {
    header > .column-large {
        padding-bottom: 20px;
    }
}

@media (max-width: 1025px) {
    .column-small {
        width: 70%;
    }
    img.full {
        width: 100%;
    }
    .testimonial img {
        width: 100px;
    }
    #Online-Video-isnt-everything .facebook-like {
        display: none;
    }
}

@media (max-width: 900px) {
    #video-points {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    #video-points .col {
        width: 100%;
    }

    header h1 {
        font-size: 40px;
    }
    header h2 {
        font-size: 25px;
    }
    header .points {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
    }
    header .point {
        width: 50%;
    }
    header .call-to-action {
        width: 80%;
    }

    h1 br:not(.display),
    h2 br:not(.display),
    h3 br:not(.display) {
        display: none;
    }

    br.mobile {
        display: block !important;
    }
    #main-video {
        margin-bottom: 20px;
    }

    .wave-b {
        padding-bottom: 64px;
    }
    .wave-b::after {
        height: 32px;
        background-size: 100% 32px;
    }
    #Bottom-line .row {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;

    }
    #Bottom-line .col {
        font-size: inherit;
        font-weight: 400;
    }
    #Bottom-line .row .col {
        width: calc(50% - 32px);
    }
    #Bottom-line .col img {
        margin: 0 16px 0 0;
        width: 150px;
    }
    #Bottom-line .row.icons {
        margin-bottom: 0;
    }
    #Bottom-line .row .col {
        margin: 0 0 32px 0;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
    }

    h1.bold {
        margin-bottom: 30px;
    }
    #packages .package {
        width: calc(55% - 4px);
        padding-left: 16px;
        padding-right: 16px;
        padding-bottom: 16px;
    }
    .package.empty_column {
        display: none;
    }
    #packages .package h2 {
        padding: 12px;
        font-size: 30px;
    }
    #packages .package li {
        margin-bottom: 10px;
    }
    #packages .package:hover {
        -webkit-transform: none;
            -ms-transform: none;
                transform: none;
    }
    ul.check li,
    ul.x li {
        padding-left: 28px;
    }
    ul.check li::before,
    ul.x li::before {
        content: '';
        width: 14px;
        height: 12px;
        position: absolute;
        left: -0;
        top: 50%;
        -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
                transform: translateY(-50%);
    }
    #timer {
        padding-top: 16px;
    }
    #timer::after {
        display: none;
    }
#timer .column-large {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    #timer-countdown > div {
        margin: 16px;   
    }
}

@media (max-width: 800px) {
    .column-small {
        width: 100%;
    }

    img {
        max-width: 100%;
    }

    .row {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

    .row > .col {
        -webkit-box-flex: 1;
            -ms-flex: 1 1 auto;
                flex: 1 1 auto;
        width: 100% !important;
        margin: 16px 0;
    }

    .row > .col:first-child {
        margin-top: 0;
    }

    .row > .col:last-child {
        margin-bottom: 0;
    }

    .row.reverse {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    .row.reverse .col:first-child {
        margin: 8px 0 0 0;
    }
    .row.reverse .col:last-child {
        margin: 0 0 8px 0;
    }

    .img-reverse .row:nth-child(2n) {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    .img-reverse .row:nth-child(2n) .col:first-child {
        /* image */
        margin: 0 0 16px 0;
    }
    .img-reverse .row:nth-child(2n) .col:last-child {
        margin: 0 0 16px 0;
    }


    #Top-Converting-Videos .row {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
        border-bottom: 1px solid #f3f3f3;
        padding-top: 16px;
        padding-bottom: 16px;
    }

    #Top-Converting-Videos .row > .col {
        margin: 0;
    }
    #Top-Converting-Videos .row:last-child {
        border-bottom: none;
    }
    #Top-Converting-Videos .row img {
        margin: 0 16px 0 0;
    }
    #Top-Converting-Videos h3 {
        font-size: 15px !important;
        font-weight: 400;
        margin-bottom: 0;
    }
    /*-----------------*/
    #Explaindio-features h1 {
        font-size: 30px;
    }

    #Explaindio-features li {
        padding: 0;
        height: auto;
    }
    #Explaindio-features .row {
        min-height: 0;
    }
    #Quick-Steps .number {
        font-size: 60px;
    }

    footer .column-large {
        display: block;
    }
    footer .copyright {
        text-align: center;
        margin: 0;
    }
    footer .menu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

    footer .menu > * {
        margin: 8px;
        padding: 8px;
    }
    #scroll-section {
        -webkit-transform: none;
            -ms-transform: none;
                transform: none;
        left: 0;
        top: 0;
        width: 100%;
        background: none;
        padding: 16px;
    }
    #facebook-dogs,
    #facebook-nuggets {
        width: calc(100vw - 32px);
        background-size: calc(100vw - 32px);
        height: 150vw;
    }
    #facebook-dogs video,
    #facebook-nuggets video {
        top: 20vw;
        width: calc(100vw - 48px);
        left: 50%;
        height: auto;
        -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
                transform: translateX(-50%);
    }
    #scrollers-videos {

        position: relative;
        left: 0;
        -webkit-transform: none;
            -ms-transform: none;
                transform: none;
        width: auto;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    #scroll-section-parent {
        height: auto;
    }
    footer .logotype {
        margin: 0 auto;   
    }
}

@media (max-width: 620px) {
    .column-large {
        padding-left: 16px;
        padding-right: 16px;
    }
    #main-video {
        margin: 0;
        padding: 0;
    }

    header #main-video iframe,
    .video iframe {
        position: static;
        top: 0;
        left: 0;
    }

    #main-video,
    .video {
        width: 100%;
        height: 56.25vw;
    }

    .animate-fade-in {
        -webkit-transform: translate(0, 0);
            -ms-transform: translate(0, 0);
                transform: translate(0, 0);
        opacity: 1;
    }
    body {
        font-size: 15px;
    }
    h1.bold {
        font-size: 30px;
        margin-bottom: 12px;
    }

    #Explaindio-features li img,
    header .point img {
        width: 32px;
        margin-right: 16px;
    }

    header h1 {
        font-size: 30px;
    }
    h1 {
        font-size: 25px;
    }

    h2 {
        font-size: 20px !important;

    }

    h3,
    h4 {
        font-size: 18px !important;
        font-weight: 700;
    }

    header .point {
        margin-bottom: 16px;
        width: 100%;
    }
    header .point:last-child {
        margin-bottom: 0;
    }


    header .call-to-action {
        margin-top: 16px;
    }
    header > .column-large {
        padding-bottom: 16px;
    }

    #video-points {
        margin-top: 16px;
    }
    section {
        margin-top: 16px;
        margin-bottom: 16px;
        padding-top: 16px;
        padding-bottom: 30px;
    }

    header h1 {
        padding-bottom: 0;
    }
    header h2 {
        font-size: 32px;
    }
    header .headline {
		margin-top: 20px;
        margin-bottom: 20px;
    }
    .button {
        width: 100%;
        font-size: 3.4vw;
    }
    section:not(.wave-b) {
        margin-top: 16px !important;
        margin-bottom: 16px !important;
        padding-top: 16px !important;
        padding-bottom: 16px !important;

    }
    .testimonial img {
        width: 64px;
        margin-right: 16px;
    }
    .testimonial .name {
        font-weight: 700;
        font-size: 15px;
        margin-bottom: 9px;
    }

    #guarantee {
        width: 50%;
        margin-bottom: 16px;
    }

    #thanks-for-checking img {
        width: 50%;
    }
    #thanks-for-checking .photos img {
        margin: 0 16px 16px 0;
        padding: 0;
        width: 64px;
        height: 64px;
    }
    .wave-b {
        padding-bottom: 48px;
    }
    .wave-b::after {
        height: 16px;
        background-size: 100% 16px;
    }

    #logo-position-mobile,
    #branded-scenes-mobile {
        display: block;
    }

    #logo-position,
    #branded-scenes {
        display: none;
    }

    header .call-to-action {
        width: 100%;
    }

    /*---- */
    #sam-karthik-mobile {
        display: block;
        margin-bottom: 16px;
    }

    #online-video-karthik,
    #online-video-sam {
        display: none;
    }
    #Online-Video-isnt-everything .red {
        padding-top: 16px;
        background-image: none;
        text-align: center;
        min-height: 0;
    }

    #Online-Video-isnt-everything h1 {
        font-size: 6vw !important;
    }
    #Online-Video-isnt-everything .the-only-thing {
        margin-bottom: 16px;
        font-size: 9vw !important;
    }
    #hey-this-is h2 {
        margin-bottom: 0;
    }
    /*----*/
    #Explaindio 4.0-and-you {
        margin-top: 0 !important;
        padding-top: 20px;
    }
    #Explaindio 4.0-and-you .videos > div {
        width: 100%;
        padding: 0;
    }
    #Explaindio 4.0-and-you .example {
        width: 100%;
        height: auto;
    }

    #intro-text {
        padding-left: 16px;
        padding-right: 16px;
    }

    /* FOOTER */
    footer {
        margin-top: 16px;
    }

    footer .column-large {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        text-align: center;
    }

    footer .column-large > * {
        width: 100%;
        -webkit-box-flex: 0;
            -ms-flex: 0 0 1;
                flex: 0 0 1;

    }
    footer .menu {
        margin-top: 16px;
        display: block;
    }
    footer .menu > * {
        padding: 8px 0;
        margin: 0;
        display: block;
    }
    #How-Explaindio 4.0-Turns {
        margin-bottom: 0!important;
    }
    #vidsting-section-6,
    #The-Fastest-Way {
        margin-top: 0!important;
        margin-bottom: 0!important;
    }
    #How-Explaindio 4.0-Turns .row {
        margin-bottom: 16px;
    }
    #How-Explaindio 4.0-Turns .row:first-child {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
            -ms-flex-direction: column-reverse;
                flex-direction: column-reverse;
    }
    #logo-position-mobile {
        margin-top: 16px;
    }

    /*---*/
    #Until-now-leveraging .icons img {
        width: 100px;
        margin-right: 8px;
    }
    #Bottom-line .icons img {
        margin-right: 8px;
        width: 140px;
    }
    #Until-now-leveraging .col > div {
        margin-top: 0;
        width: 100%;
        text-align: left;
    }
    #Until-now-leveraging .row {
        margin-top: 0;
    }

    #Until-now-leveraging .col {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
    }

    .img-reverse .row:nth-child(2n) .col:first-child {
        /* image */
        margin: 0;
    }
    .img-reverse .row:nth-child(2n) .col:last-child {
        margin: 0;
    }

    #a-simple-60-seconds {
        margin: 16px 0 0 0;
        padding: 16px 0;
    }

    /*---*/
    #step1,
    #step2,
    #step3 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
            -ms-flex-direction: column-reverse;
                flex-direction: column-reverse;
    }
    #Quick-Steps img {
        margin-top: 16px;
    }
    #Quick-Steps .number {
        font-size: 30px;
    }

    #Quick-Steps .row {
        margin-top: 0;
    }

    /* -- */
    #Futher-customize .row.icons .col {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
    }
    #Futher-customize .icons {
        text-align: left;
    }
    #Futher-customize img {
        margin-right: 16px;
        width: 32px;
    }

    .quote {
        padding-top: 32px;
        padding-bottom: 32px;
        margin-top: -32px;
        margin-bottom: -32px;
    }
    .quote blockquote {
        font-size: 15px;
    }

    .quote figcaption {
        font-size: 13px;
    }

    #Introducing .logotype {
        width: 62%;
    }

    /*---*/
    #packages {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        margin-bottom: 0!important;
    }
    #packages .package {
        width: 100%;
        padding-left: 16px;
        padding-right: 16px;
        margin-bottom: 16px;
    }

    /*---*/
    .text-img {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

    .text-img > img {
        margin-left: 0;
        margin-top: 8px;
    }

    .text-img > *:not(img) {
        margin: 0 0 8px 0;
    }


}
@media (min-width: 901px) {
    #timer{
        position: fixed;
        bottom: 0px;
        width: 100%;
        padding-top: 5px;
        padding-bottom: 5px;
        margin-top: 0px;
    }
    #timer .column-large > * {
        -webkit-box-flex: 1;
        -ms-flex: 1 0 0px;
            flex: 1 0 0;
    }
    #timer-countdown > div{
        margin: 5px 32px 5px;
    }
    footer{
        margin-bottom: 173px;
    }
    #timer::after{
        display: none;
    }
}
span.most-popular{
    position: absolute;
    top: 10px;
    display: inline-block;
    left: 0px;
    text-align: center;
}
span.most-popular{
    display: inline-block;
    padding: 6px 16px 6px 12px;
    background:  #ffce00;
    color: #000;
    font-weight: bold;
    border-top-right-radius: 99px;
    border-bottom-right-radius: 99px;

}
#package-agency{
    position: relative;
}


#vidsting-section-5 {
    font-size: 20px;
    margin-bottom: 10px;
    font-family: 'Eina03';
}


/*========= EXIT POPUP =========*/

.center-block{display:block;margin:0 auto;}
.p-20{padding:20px;}
.title{font-family: 'Eina03';font-weight:900;}
.text-80{font-size:80px;line-height:90px;}
.text-case-none{text-transform:none;}
.mb-0{margin-bottom:0;}
.text-light{font-weight:300;}
.mt-0{margin-top:0px;}
.ptl-50{padding-left:50px;}
.p-30{padding:30px;}
.mtn-20{margin-top:-20px;}


#exitpopup_wrap, #exitpopup_wrap2 { position: fixed; width: 100%;  height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 99999; top: 0; left: 0;}
#exitpopup { width: 735px; height: 425px;  margin: 100px auto; position: relative; z-index: 9999999; color: #494949; font-size:14px; padding:20px 10px; padding-bottom:0; background: #fff; box-sizing: border-box; border-radius: 5px; box-shadow: 0 0 20px #000;  }
#exitpopup:after { content:""; display:block; weight: 1px; clear:both;}
#exitpopup h2 { color:#2f5e94; font-size:39px;line-height:48px; text-transform:uppercase; text-align:center;font-family: 'Eina03'; font-weight: normal;letter-spacing: -2px;}
#exitpopup p{text-align:center;}
#exitpopup a.close, #exitpopup a.close2, #bio_ep_close{opacity:0.5;position: absolute; top: 0; right: -10px; color: #fff; font-weight: bold; width: 38px; height: 38px; background: #2e2d2b; border-radius: 50%; line-height: 25px; font-size: 34px; text-align: center; border: 3px solid #fff; cursor: pointer; display: block;}

#exitpopup form input[name="name"], #exitpopup form input[name="email"] { box-sizing: border-box; padding: 15px 30px;  border: 1px solid #c4c6ca; border-radius: 0px; font-size: 18px; vertical-align:bottom; margin:0 auto; margin-bottom:10px; width:324px;}
#exitpopup form input[type="email"] {background-repeat:no-repeat; background-position: center left; padding-left: 60px; min-width:400px; text-align: left; float:left;}
#exitpopup form input[type="submit"]{background:#089a50;width:324px;border:0 none;font-size:20px;color:#fff;font-weight:bold;ffont-family: 'Eina03', sans-serif;border-radius:8px;padding-top:15px;padding-bottom:15px;}
#exitpopup form input[type="submit"]:hover{cursor:pointer;}
#exitpopup .pull-left{position: absolute;bottom: 0;left: 0;width:44%;}
#exitpopup .privacy{ clear:both; padding:10px 0;}
#exitpopup #after{  text-align: center; font-size: 20px; line-height: normal; color: #900; width:50%; float:right;}
#bio_ep #exitpopup{margin-top:0;}



@media (max-width: 820px){
    #exitpopup {
        width: 67%;
        height: 80%;
    }

    #exitpopup .popup-center {
        display: block;
        margin-left: auto;
        margin-right: auto;
        padding-top: unset;
    }

     #exitpopup .popup-image {
        width: 94%;
        margin-top: 17px;
     }

 @media (max-width: 800px){    
     #exitpopup .popup-image {
        width: 94%;
        
     }
 }

 @media (max-width: 600px){    
     #exitpopup .padding-top {
        padding-top: unset;
        
     }
 }

@media (max-width: 420px){    
     #clockdiv div.margin-bottom-mobile {
        margin-top: 15px;
        margin-right: 16px;
        
     }
 }