@import "http://fonts.googleapis.com/css?family=Open%2BSans%3A300%2C400%2C600%2C700%2C800|Ubuntu|Source%2BSans%2BPro%3A900";
body {
    background-color: #000;
    font-family: droid arabic kufi, open sans, sans-serif
}

#videoBG {
    position: fixed;
    z-index: -1
}

@media(min-aspect-ratio:16/9) {
    #videoBG {
        width: 100%;
        height: auto
    }
}

@media(max-aspect-ratio:16/9) {
    #videoBG {
        width: auto;
        height: 100%
    }
}

@media(max-width:767px) {
    #videoBG {
        display: none
    }
    body {
        background: url(../img/poster.png);
        background-size: cover
    }
}

.opacity-5 {
    opacity: .5
}

.hero-section header {
    background-color: #1a1a1a
}

.hero-section header .navbar-default {
    background-color: transparent;
    border: none;
    color: #000;
    margin: 0
}

.hero-section header .navbar-default .navbar-header .navbar-toggle {
    margin-top: 18px;
    border-color: #fff
}

.hero-section header .navbar-default .navbar-header .navbar-toggle .icon-bar {
    display: block;
    background-color: #fff
}

.hero-section header .navbar-default .navbar-header .navbar-toggle:hover {
    background-color: #fff
}

.hero-section header .navbar-default .navbar-header .navbar-toggle:hover .icon-bar {
    background-color: #000
}

.hero-section header .navbar-default .navbar-header .navbar-toggle:focus {
    background-color: transparent;
    color: #fff;
    border-color: #fff
}

.hero-section header .navbar-default .navbar-header .navbar-toggle:focus .icon-bar {
    background-color: #fff
}

.hero-section header .navbar-default .navbar-header .navbar-brand {
    height: 25px
}

.hero-section header .navbar-default .navbar-header .navbar-brand .top-logo {
    max-width: 34px
}

.hero-section header .navbar-default .navbar-collapse {
    border-color: #fff
}

.hero-section header .navbar-default .navbar-collapse .navbar-nav {
    margin-top: 12px
}

.hero-section header .navbar-default .navbar-collapse .navbar-nav li {
    text-transform: uppercase;
    font-weight: 500
}

.hero-section header .navbar-default .navbar-collapse .navbar-nav li.active a {
    background-color: transparent;
    color: #fff
}

.hero-section header .navbar-default .navbar-collapse .navbar-nav li.active a:hover {
    background-color: transparent;
    color: #fff
}

.hero-section header .navbar-default .navbar-collapse .navbar-nav li a {
    color: #afafaf
}

.hero-section header .navbar-default .navbar-collapse .navbar-nav li a:hover {
    color: #fff
}

.head-section {
    padding: 100px 0 0;
    text-align: center
}

.head-section .order-box {
    margin: 80px 0;
    padding: 20px;
    border: 3px solid #000;
    position: relative;
    background-color: #fff;
    z-index: 999999
}

.head-section .order-box .image-left {
    background-image: url(../img/left-image.html);
    background-size: cover;
    width: 422px;
    height: 301px;
    position: absolute;
    left: -450px;
    top: 30px;
    z-index: -9999;
    opacity: .4
}

.head-section .order-box .image-right {
    background-image: url(../img/right-image.html);
    background-size: cover;
    width: 214px;
    height: 383px;
    position: absolute;
    right: -250px;
    top: -30px;
    z-index: -9999
}

@media(max-width:991px) {
    .head-section .order-box {
        margin: -200px 0 70px
    }
}

@media(max-width:375px) {
    .head-section .order-box {
        margin: -90px 0 70px
    }
}

@media(max-width:320px) {
    .head-section .order-box {
        margin: -80px 0 70px
    }
}

.head-section blockquote {
    display: block;
    background: #fff;
    padding: 15px 20px 15px 45px;
    margin: 0 0 20px;
    position: relative;
    font-size: 16px;
    line-height: 1.2;
    color: #666;
    text-align: justify;
    border-left: 15px solid #d21d54;
    border-right: 2px solid #d21d54;
    -moz-box-shadow: 2px 2px 15px #ccc;
    -webkit-box-shadow: 2px 2px 15px #ccc;
    box-shadow: 2px 2px 15px #ccc
}

.head-section blockquote::before {
    content: "\201C";
    font-family: Georgia, serif;
    font-size: 60px;
    font-weight: 700;
    color: #999;
    position: absolute;
    left: 10px;
    top: 5px
}

.head-section blockquote::after {
    content: ""
}

.head-section blockquote a {
    text-decoration: none;
    background: #eee;
    cursor: pointer;
    padding: 0 3px;
    color: #c76c0c
}

.head-section blockquote a:hover {
    color: #666
}

.head-section blockquote em {
    font-style: italic
}

.head-section #contactForm label {
    color: #eee
}

.head-section #contactForm .inputField {
    display: block;
    width: 100%;
    padding: 10px;
    outline: 0;
    border: 1px solid #969696;
    color: #969696;
    font-weight: 400;
    background-color: transparent;
    -moz-transition: all 150ms ease;
    -o-transition: all 150ms ease;
    -webkit-transition: all 150ms ease;
    transition: all 150ms ease
}

.head-section #contactForm .inputField::-webkit-input-placeholder {
    font-weight: 400;
    color: #969696
}

.head-section #contactForm .inputField:-moz-placeholder {
    font-weight: 400;
    color: #969696
}

.head-section #contactForm .inputField::-moz-placeholder {
    font-weight: 400;
    color: #969696
}

.head-section #contactForm .inputField:-ms-input-placeholder {
    font-weight: 400;
    color: #969696
}

.head-section #contactForm .inputField:hover {
    border-color: #c4c4c4;
    color: #c4c4c4
}

.head-section #contactForm .inputField:hover::-webkit-input-placeholder {
    font-weight: 400;
    color: #c4c4c4
}

.head-section #contactForm .inputField:hover:-moz-placeholder {
    font-weight: 400;
    color: #c4c4c4
}

.head-section #contactForm .inputField:hover::-moz-placeholder {
    font-weight: 400;
    color: #c4c4c4
}

.head-section #contactForm .inputField:hover:-ms-input-placeholder {
    font-weight: 400;
    color: #c4c4c4
}

.head-section #contactForm .inputField:focus {
    font-weight: 700;
    border-color: #fff;
    color: #fff
}

.head-section #contactForm .inputField:focus::-webkit-input-placeholder {
    font-weight: 400;
    color: #c4c4c4
}

.head-section #contactForm .inputField:focus:-moz-placeholder {
    font-weight: 400;
    color: #c4c4c4
}

.head-section #contactForm .inputField:focus::-moz-placeholder {
    font-weight: 400;
    color: #c4c4c4
}

.head-section #contactForm .inputField:focus:-ms-input-placeholder {
    font-weight: 400;
    color: #c4c4c4
}

.head-section #contactForm .inputField.success {
    border-color: #0c7b37;
    color: #0c7b37
}

.header-section {
    margin: 20px auto;
    text-align: center
}

.header-section .inside {
    background-color: #000;
    padding: 15px;
    border: .125em solid #000;
    -moz-box-shadow: 0 0 2.606em .463em rgba(0, 0, 0, .5), inset 0 .125em 0 rgba(255, 255, 255, .17);
    -webkit-box-shadow: 0 0 2.606em .463em rgba(0, 0, 0, .5), inset 0 .125em 0 rgba(255, 255, 255, .17);
    box-shadow: 0 0 2.606em .463em rgba(0, 0, 0, .5), inset 0 .125em 0 rgba(255, 255, 255, .17);
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e38920), color-stop(100%, #704109));
    background-image: -moz-linear-gradient(top, #e38920 0%, #704109 100%);
    background-image: -webkit-linear-gradient(top, #e38920 0%, #704109 100%);
    background-image: linear-gradient(to bottom, #e38920 0%, #704109 100%)
}

.header-section .header-logo {
    max-width: 100%;
    text-align: center;
    margin: 0 auto;
    width: 100px
}

.header-section h1 {
    color: #fff;
    font-weight: 400;
    text-transform: uppercase;
    font-family: source sans pro, sans-serif;
    margin: 15px 0 0;
    font-weight: 900;
    text-shadow: 0 2px 0 #000;
    font-size: 3em
}

@media(max-width:320px) {
    .header-section h1 {
        font-size: 1.7em
    }
}

.header-section .sub-heading {
    color: #f5c183;
    margin: 10px 0
}

.header-section .timer-heading {
    font-size: 1.2em;
    color: #fff
}

.header-section .timer-heading .timer {
    color: #fe2121;
    font-weight: 900;
    font-size: 2em
}

.generator-section {
    padding: 60px 0;
    position: relative
}

.generator-section .overlay {
    background-color: #none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.generator-section header {
    text-align: center;
    color: #fff;
    padding-bottom: 30px
}

.generator-section header .header-logo {
    max-width: 100%;
    text-align: center;
    margin: 0 auto;
    width: 200px
}

.generator-section header h1 {
    color: #fff;
    font-weight: 400;
    text-transform: uppercase;
    margin: 15px 0 0;
    font-weight: 800;
    text-shadow: 0 2px 0 #000;
    font-size: 3em
}

@media(max-width:320px) {
    .generator-section header h1 {
        font-size: 1.7em
    }
}

.generator-section header .sub-heading {
    color: #ccc;
    margin: 10px 0
}

.generator-section .generator-form {
    display: none;
    overflow: hidden;
    border: .125em solid #000;
    -moz-box-shadow: 0 0 2.606em .463em rgba(0, 0, 0, .5), inset 0 .125em 0 rgba(255, 255, 255, .17);
    -webkit-box-shadow: 0 0 2.606em .463em rgba(0, 0, 0, .5), inset 0 .125em 0 rgba(255, 255, 255, .17);
    box-shadow: 0 0 2.606em .463em rgba(0, 0, 0, .5), inset 0 .125em 0 rgba(255, 255, 255, .17);
    text-align: left;
    padding: 30px;
    -moz-transition: all 150ms ease;
    -o-transition: all 150ms ease;
    -webkit-transition: all 150ms ease;
    transition: all 150ms ease
}

.generator-section .generator-form .inside .step-one {
    display: block;
    visibility: hidden
}

.generator-section .generator-form .inside .step-one .select-icon {
    text-indent: 20px;
    background-repeat: no-repeat;
    background-position: 2% 35%;
    background-size: 17px auto;
    font-size: .8em
}

.generator-section .generator-form .inside .step-one .select-icon.user-icon {
    background-image: url(../img/user-icon.html)
}

.generator-section .generator-form .inside .step-one .select-icon.device-icon {
    background-image: url(../img/device-icon.html);
    background-size: 13px auto
}

.generator-section .generator-form .inside .step-one .generate-btn {
    display: block;
    width: 100%;
    padding: 20px;
    border: 1px solid #000;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    -moz-box-shadow: 0 2px 0 #000, inset 0 36px 0 rgba(255, 255, 255, .1), inset 0 0 79px rgba(255, 255, 255, .25);
    -webkit-box-shadow: 0 2px 0 #000, inset 0 36px 0 rgba(255, 255, 255, .1), inset 0 0 79px rgba(255, 255, 255, .25);
    box-shadow: 0 2px 0 #000, inset 0 36px 0 rgba(255, 255, 255, .1), inset 0 0 79px rgba(255, 255, 255, .25);
    font-weight: 900;
    text-shadow: 0 2px 0 rgba(0, 0, 0, .49);
    font-size: 1.4em;
    text-transform: uppercase;
    outline: 0;
    margin-top: 15px;
    color: #fff
}

.generator-section .generator-form .inside .step-one .generate-btn.white-color {
    background-color: #fff;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2I1YjViNSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #b5b5b5), color-stop(100%, #ffffff));
    background-image: -moz-linear-gradient(bottom, #b5b5b5 0%, #ffffff 100%);
    background-image: -webkit-linear-gradient(bottom, #b5b5b5 0%, #ffffff 100%);
    background-image: linear-gradient(to top, #b5b5b5 0%, #ffffff 100%);
    color: #000;
    text-shadow: none
}

.generator-section .generator-form .inside .step-one .generate-btn.green-color {
    background-color: #56c31a;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzMxODQwNyIgc3RvcC1vcGFjaXR5PSIwLjc2Ii8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjOWRlMDE4IiBzdG9wLW9wYWNpdHk9IjAuNzYiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA=);
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, rgba(49, 132, 7, 0.76)), color-stop(100%, rgba(157, 224, 24, 0.76)));
    background-image: -moz-linear-gradient(bottom, rgba(49, 132, 7, 0.76) 0%, rgba(157, 224, 24, 0.76) 100%);
    background-image: -webkit-linear-gradient(bottom, rgba(49, 132, 7, 0.76) 0%, rgba(157, 224, 24, 0.76) 100%);
    background-image: linear-gradient(to top, rgba(49, 132, 7, 0.76) 0%, rgba(157, 224, 24, 0.76) 100%)
}

.generator-section .generator-form .inside .step-one .generate-btn.blue-color {
    background-color: #044f7e;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA0NGY3ZSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzE4NzRlMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #044f7e), color-stop(100%, #1874e0));
    background-image: -moz-linear-gradient(bottom, #044f7e 0%, #1874e0 100%);
    background-image: -webkit-linear-gradient(bottom, #044f7e 0%, #1874e0 100%);
    background-image: linear-gradient(to top, #044f7e 0%, #1874e0 100%)
}

.generator-section .generator-form .inside .step-one .generate-btn.red-color {
    background-color: #c31a1a;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzg0MDcwNyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2UwMTgxOCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #840707), color-stop(100%, #e01818));
    background-image: -moz-linear-gradient(bottom, #840707 0%, #e01818 100%);
    background-image: -webkit-linear-gradient(bottom, #840707 0%, #e01818 100%);
    background-image: linear-gradient(to top, #840707 0%, #e01818 100%)
}

.generator-section .generator-form .inside .step-one .generate-btn.orange-color {
    background-color: #feca59;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlY2E1OSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2M3MzgxNCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #feca59), color-stop(100%, #c73814));
    background-image: -moz-linear-gradient(top, #feca59 0%, #c73814 100%);
    background-image: -webkit-linear-gradient(top, #feca59 0%, #c73814 100%);
    background-image: linear-gradient(to bottom, #feca59 0%, #c73814 100%)
}

@media(max-width:991px) {
    .generator-section .generator-form .inside .step-one .generate-btn {
        display: block;
        width: 100%;
        margin-top: 15px
    }
}

.generator-section .generator-form .inside .step-two {
    display: none;
    visibility: hidden;
    text-align: center
}

.generator-section .generator-form.white-color {
    background-color: #fff;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2MxYzFjMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZhZmFmYSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #c1c1c1), color-stop(100%, #fafafa));
    background-image: -moz-linear-gradient(bottom, #c1c1c1 0%, #fafafa 100%);
    background-image: -webkit-linear-gradient(bottom, #c1c1c1 0%, #fafafa 100%);
    background-image: linear-gradient(to top, #c1c1c1 0%, #fafafa 100%)
}

.generator-section .generator-form.white-color .inside .step-one label {
    color: #2c2c2c
}

.generator-section .generator-form.white-color .inside .step-two p.loader-msg {
    color: #1f1f1f
}

.generator-section .generator-form.white-color .inside .step-two .loader {
    border-top: 1.1em solid rgba(0, 0, 0, .2);
    border-right: 1.1em solid rgba(0, 0, 0, .2);
    border-bottom: 1.1em solid rgba(0, 0, 0, .2);
    border-left: 1.1em solid #23e366
}

.generator-section .generator-form.blue-color {
    background-color: #047a90;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwNDk1NyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzE0OWRiNyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #004957), color-stop(100%, #149db7));
    background-image: -moz-linear-gradient(bottom, #004957 0%, #149db7 100%);
    background-image: -webkit-linear-gradient(bottom, #004957 0%, #149db7 100%);
    background-image: linear-gradient(to top, #004957 0%, #149db7 100%)
}

.generator-section .generator-form.blue-color .inside .step-one label {
    color: #fff
}

.generator-section .generator-form.blue-color .inside .step-two p.loader-msg {
    color: #fff
}

.generator-section .generator-form.blue-color .inside .step-two .loader {
    border-top: 1.1em solid rgba(255, 255, 255, .4);
    border-right: 1.1em solid rgba(255, 255, 255, .4);
    border-bottom: 1.1em solid rgba(255, 255, 255, .4);
    border-left: 1.1em solid #23e366
}

.generator-section .generator-form.red-color {
    background-color: #720000;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzcyMDAwMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2MzMjEyMSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #720000), color-stop(100%, #c32121));
    background-image: -moz-linear-gradient(bottom, #720000 0%, #c32121 100%);
    background-image: -webkit-linear-gradient(bottom, #720000 0%, #c32121 100%);
    background-image: linear-gradient(to top, #720000 0%, #c32121 100%)
}

.generator-section .generator-form.red-color .inside .step-one label {
    color: #fff
}

.generator-section .generator-form.red-color .inside .step-two p.loader-msg {
    color: #fff
}

.generator-section .generator-form.red-color .inside .step-two .loader {
    border-top: 1.1em solid rgba(255, 255, 255, .4);
    border-right: 1.1em solid rgba(255, 255, 255, .4);
    border-bottom: 1.1em solid rgba(255, 255, 255, .4);
    border-left: 1.1em solid #23e366
}

.generator-section .generator-form.grey-color {
    background-color: #373646;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzM3MzY0NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFkMWMyNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #373646), color-stop(100%, #1d1c26));
    background-image: -moz-linear-gradient(top, #373646 0%, #1d1c26 100%);
    background-image: -webkit-linear-gradient(top, #373646 0%, #1d1c26 100%);
    background-image: linear-gradient(to bottom, #373646 0%, #1d1c26 100%)
}

.generator-section .generator-form.grey-color .inside .step-one label {
    color: #fff
}

.generator-section .generator-form.grey-color .inside .step-two p.loader-msg {
    color: #fff
}

.generator-section .generator-form.grey-color .inside .step-two .loader {
    border-top: 1.1em solid rgba(255, 255, 255, .4);
    border-right: 1.1em solid rgba(255, 255, 255, .4);
    border-bottom: 1.1em solid rgba(255, 255, 255, .4);
    border-left: 1.1em solid #23e366
}

#generator-carousel .inside {
    text-align: center;
    background-color: #fff;
    padding: 25px
}

#generator-carousel .inside h2 {
    margin: 0 0 25px;
    padding: 0
}

#generator-carousel .inside .next-btn {
    padding: 15px;
    background-color: #20b2aa;
    font-weight: 800;
    color: #fff;
    text-transform: uppercase;
    outline: none;
    border: none
}

p.loader-msg {
    font-weight: 700;
    font-size: 1.3em;
    margin: 0 0 20px;
    padding: 0
}

.loader {
    margin: 0 auto 20px;
    font-size: 10px;
    position: relative;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load8 1.1s infinite linear;
    animation: load8 1.1s infinite linear;
    border-top: 1.1em solid rgba(0, 0, 0, .2);
    border-right: 1.1em solid rgba(0, 0, 0, .2);
    border-bottom: 1.1em solid rgba(0, 0, 0, .2);
    border-left: 1.1em solid #23e366
}

.loader,
.loader:after {
    border-radius: 50%;
    width: 5em;
    height: 5em
}

@-webkit-keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.generator-console {
    text-align: left;
    font-family: ubuntu, sans-serif;
    background-color: #000;
    padding: 20px;
    color: #fff;
    height: 200px;
    overflow: hidden
}

.generator-console .white {
    color: #fff
}

.generator-console .red {
    color: #d62d2d
}

.generator-console .green {
    color: #2fb25d
}

.generator-console .yellow {
    color: #ced434
}

.generator-console .blue {
    color: #6bccff
}

.generator-console .console_cursor {
    color: #fff
}

#offers-iframe {
    outline: none;
    border: none;
    height: 300px;
    width: 100%
}

#share-buttons {
    text-align: center;
    padding-bottom: 30px
}

#share-buttons img {
    text-align: center;
    width: 35px;
    padding: 5px;
    border: 0;
    box-shadow: 0;
    display: inline
}

.latest-updates-section {
    margin-top: 20px
}

.latest-updates-section .updates-box {
    padding: 20px;
    text-align: right;
    border: .063em solid #000
}

.latest-updates-section .updates-box .right-side h5 {
    font-weight: 900;
    text-shadow: 0 1px 0 #000;
    text-transform: uppercase
}

.latest-updates-section .updates-box .right-side p {
    font-weight: 700;
    font-size: 1em;
    padding: 0;
    margin: 0
}

.latest-updates-section .updates-box .right-side .stats-table .stat-icon {
    height: 15px
}

.latest-updates-section .updates-box .right-side .stats-table .stat-text {
    margin-left: 5px;
    color: #97c94a
}

.latest-updates-section .updates-box .right-side .small-msg {
    font-weight: 400;
    font-style: italic
}

.latest-updates-section .updates-box.purple-color {
    background-color: #232026;
    background-size: 100%
}

.latest-updates-section .updates-box.purple-color h5 {
    color: #fff
}

.latest-updates-section .updates-box.purple-color p {
    color: #a198a7
}

.latest-updates-section .updates-box.purple-color .stats-table .stat-text {
    color: #97c94a
}

.latest-updates-section .updates-box.blue-color {
    background-color: #152572;
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #00336d), color-stop(100%, #1258a8));
    background-image: -moz-linear-gradient(bottom, #00336d 0%, #1258a8 100%);
    background-image: -webkit-linear-gradient(bottom, #00336d 0%, #1258a8 100%);
    background-image: linear-gradient(to top, #00336d 0%, #1258a8 100%)
}

.latest-updates-section .updates-box.blue-color h5 {
    color: #fff
}

.latest-updates-section .updates-box.blue-color p {
    color: #7fb9fc
}

.latest-updates-section .updates-box.blue-color .stats-table .stat-text {
    color: #97c94a
}

.latest-updates-section .updates-box.green-color {
    background-color: #28ce98;
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #373646), color-stop(100%, #1d1c26));
    background-image: -moz-linear-gradient(top, #373646 0%, #1d1c26 100%);
    background-image: -webkit-linear-gradient(top, #373646 0%, #1d1c26 100%);
    background-image: linear-gradient(to bottom, #373646 0%, #1d1c26 100%)
}

.latest-updates-section .updates-box.green-color h5 {
    color: #fff
}

.latest-updates-section .updates-box.green-color p {
    color: #8be87f
}

.latest-updates-section .updates-box.green-color .stats-table .stat-text {
    color: #fff
}

.features-section {
    text-align: center
}

.features-section .feature {
    margin: 30px auto
}

.features-section .feature .fa {
    font-size: 4em;
    color: #fff;
    text-shadow: 0 0 10px #000
}

.features-section .feature h4 {
    color: #fff;
    text-transform: uppercase;
    font-size: .8em;
    font-weight: 700;
    margin: 20px 0 15px;
    text-shadow: 0 0 10px #000
}

.features-section .feature p {
    color: #b9b9b9;
    text-shadow: 0 0 10px #000;
    font-size: .8em
}

@media(max-width:768px) {
    .features-section {
        display: none
    }
}

.section-all,
.chat-section,
.article-section,
.facebook-section {
    margin: 20px auto
}

.section-all .header,
.chat-section .header,
.article-section .header,
.facebook-section .header {
    background-color: #28ce98;
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #373646), color-stop(100%, #1d1c26));
    background-image: -moz-linear-gradient(top, #373646 0%, #1d1c26 100%);
    background-image: -webkit-linear-gradient(top, #373646 0%, #1d1c26 100%);
    background-image: linear-gradient(to bottom, #373646 0%, #1d1c26 100%);
    background-color: #fff;
    text-align: center;
    color: #fff;
    padding: 25px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border-radius: 15px
}

.section-all .header h2,
.chat-section .header h2,
.article-section .header h2,
.facebook-section .header h2 {
    padding: 0;
    margin: 0
}

.section-all .header .sub-heading,
.chat-section .header .sub-heading,
.article-section .header .sub-heading,
.facebook-section .header .sub-heading {
    color: #a2a1ba;
    padding: 0;
    margin: 0
}

.section-all .inside,
.chat-section .inside,
.article-section .inside,
.facebook-section .inside {
    background-color: #edeff4;
    text-align: center;
    padding-top: 30px
}

.section-all .inside p,
.chat-section .inside p,
.article-section .inside p,
.facebook-section .inside p {
    color: #000
}

.chat-section .livechatBox {
    position: relative;
    padding: 20px;
    background-color: #eee;
    -moz-box-shadow: inset 0 2px 2px 0 rgba(0, 0, 0, .26);
    -webkit-box-shadow: inset 0 2px 2px 0 rgba(0, 0, 0, .26);
    box-shadow: inset 0 2px 2px 0 rgba(0, 0, 0, .26)
}

.chat-section .livechatBox .livechatNameBox {
    display: none
}

.chat-section .livechatBox .livechatNameBox .overlay {
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .61);
    width: 100%;
    height: 100%;
    z-index: 10
}

.chat-section .livechatBox .livechatNameBox .nameInputBox {
    text-align: center;
    position: absolute;
    z-index: 11;
    width: 190px;
    height: 135px;
    left: 50%;
    top: 50%;
    margin-top: -67.5px;
    margin-left: -95px;
    background-color: rgba(0, 0, 0, .67);
    padding: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px
}

.chat-section .livechatBox .livechatNameBox .nameInputBox label {
    color: #fff
}

.chat-section .livechatBox .heading h3 {
    text-align: center;
    margin: 0 0 15px;
    padding: 0
}

.chat-section .livechatBox .livechatListArea {
    text-align: left;
    height: 250px;
    overflow-y: scroll;
    padding: 15px 0;
    border-top: 1px solid #d4d4d4;
    border-bottom: 1px solid #d4d4d4
}

.chat-section .livechatBox .livechatListArea .chatList {
    list-style: none;
    margin: 0;
    padding: 0
}

.chat-section .livechatBox .livechatListArea .chatList li {
    margin: 5px auto
}

.chat-section .livechatBox .livechatListArea .chatList li .name {
    font-weight: 800
}

@media(max-width:991px) {
    .chat-section .livechatBox .livechatListArea .chatList {
        text-align: left
    }
}

.chat-section .livechatBox .livechatMsg {
    width: 100%;
    padding: 5px
}

@media(max-width:991px) {
    .chat-section .livechatBox .livechatSubmtBtn {
        margin-top: 5px
    }
}

.facebook-section .inside-comments-box {
    padding: 20px
}

.facebook-section .inside-comments-box .commentsMain {
    margin: 10px 0 0;
    text-align: left
}

.facebook-section .inside-comments-box .commentsUL {
    background-color: #edeff4;
    margin: 0;
    padding: 5px 10px
}

.facebook-section .inside-comments-box .commentsUL li {
    padding: 5px;
    list-style: none;
    margin: 5px 0;
    border-bottom: 1px solid #fff
}

.facebook-section .inside-comments-box .commentsUL li:last-child {
    border: none
}

.facebook-section .inside-comments-box .marginText {
    margin-left: 7px
}

.facebook-section .inside-comments-box .commentInput {
    margin-top: 1px;
    display: block;
    width: 100%;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 5px;
    border: 1px solid #ccc9c9;
    background: url(../img/cameraIcon.png) no-repeat scroll 10px;
    background-position: right 10px bottom 7px;
    padding-right: 50px;
    padding-left: 5px;
    background-color: #fff;
    width: 100%
}

.facebook-section .inside-comments-box .commentInputBox {
    margin-left: 10px
}

.facebook-section .inside-comments-box .inside-comment {
    display: block;
    padding: 5px 0
}

.facebook-section .inside-comments-box .inside-comment .left {
    float: left;
    display: block;
    width: 5
}

.facebook-section .inside-comments-box .inside-comment .left img {
    width: 25px;
    height: 25px
}

.facebook-section .inside-comments-box .inside-comment .right {
    float: left;
    display: block;
    margin: -3px 0 0 5px;
    width: 83%
}

.facebook-section .inside-comments-box .inside-comment .right p {
    margin: 0;
    padding: 0
}

.facebook-section .inside-comments-box .inside-comment .right .commentInput {
    width: 100%
}

.facebook-section .inside-comments-box .replyComment {
    margin-left: 40px;
    margin-right: 10px;
    background-color: #e9ecf1;
    border-top: 1px solid #d0d4e4;
    padding-top: 5px
}

.faq-section {
    padding: 100px 0
}

.contact-section {
    padding: 100px 0
}

.contact-section .contact_area {
    display: block;
    width: 100%
}

.contact-section .contact_area label {
    color: #fff
}

.contact-section .contact_area .submit-btn {
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background-color: transparent;
    padding: 15px 30px;
    border: 1px solid #fff;
    outline: none;
    color: #fff;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .2em;
    width: 100%;
    margin: 10px 0 0
}

.contact-section .contact_area .submit-btn:hover {
    border-color: #12d491;
    background-color: #12d491;
    color: #fff
}

@media(max-width:991px) {
    .contact-section .contact_area .submit-btn {
        display: block;
        width: 100%;
        margin-top: 15px
    }
}

footer.footer {
    padding: 60px 0;
    text-align: center;
    color: #333
}

footer.footer .footer-icon {
    text-align: center;
    margin: 0 auto 20px;
    max-width: 200px
}

footer.footer .footer-links {
    list-style: none;
    padding: 0;
    margin: 0
}

footer.footer .footer-links li {
    display: inline-block
}

footer.footer .footer-links li a {
    padding: 5px;
    color: #333
}

.bootbox .modal-dialog {
    text-align: center;
    z-index: 9999999 !important
}

.bootbox .modal-dialog .loader {
    text-align: center;
    margin: 0 auto
}

#human_modal {
    text-align: center;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px
}

#human_modal h4 {
    padding: 0;
    margin: 0 0 15px;
    color: #000;
    font-weight: 900;
    font-size: 2em
}

#human_modal p {
    color: #8b8b8b;
    margin: 0 0 15px;
    padding: 0
}

.btn {
    white-space: normal !important
}

#humanVerificationModal {
    text-align: center
}

#humanVerificationModal .modal-dialog {
    z-index: 99999999
}

#humanVerificationModal .modal-dialog .modal-header {
    background-color: #28ce98;
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #951f3a), color-stop(100%, #d61844));
    background-image: -moz-linear-gradient(bottom, #951f3a 0%, #d61844 100%);
    background-image: -webkit-linear-gradient(bottom, #951f3a 0%, #d61844 100%);
    background-image: linear-gradient(to top, #951f3a 0%, #d61844 100%);
    -moz-border-radius: 5.5px 5.5px 0 0;
    -webkit-border-radius: 5.5px;
    border-radius: 5.5px 5.5px 0 0
}

#humanVerificationModal .modal-dialog .modal-header h4 {
    color: #fff;
    font-weight: 900;
    text-shadow: 0 2px 0 #000;
    font-size: 2em
}

#humanVerificationModal .modal-dialog .modal-body .waitng-survey-offers {
    display: none
}

#humanVerificationModal .modal-dialog .modal-body .loader-img {
    text-align: center;
    margin: 0 auto
}

#humanVerificationModal .modal-dialog .modal-body .offers {
    margin: 5px auto;
    padding: 15px;
    background-color: #269f79;
    color: #fff
}

#humanVerificationModal .modal-dialog .modal-body .offers p {
    margin: 0
}

#humanVerificationModal .modal-dialog .modal-footer {
    text-align: center
}

#myPanelFooter_1 {
    font-family: arial;
    font-size: 12px;
    color: #3b5998;
    font-weight: 400
}