@media only screen and (min-width:992px) and (max-width: 1199px) {
.embed-container {    padding-bottom: 59%;}
.video-outer {    max-width: 497px;    padding-top: 23px;}
.banner-content h1 {    font-size: 40px;    line-height: 50px;    padding-bottom: 24px;}
.banner-content-outer {    top: 96px;}


}


@media only screen and (min-width: 768px) and (max-width: 991px) {
.embed-container {    padding-bottom: 55%;}
.video-outer {    max-width: 497px;    padding-top: 23px;}
.banner-content h1 {  font-size: 35px;    line-height: 41px;    padding-bottom: 18px;}
.banner-content-outer {    top: 67px;padding-left: 10%; padding-right: 10%;}
.banner-content h3 span {    margin-bottom: 8px;    padding: 0 5px 4px;}
h3 {    font-size: 18px;    line-height: 22px;}
.video-outer {    max-width: 400px;    padding-top: 12px;}
.comment-left {    padding-right: 20px;}
.comment-show ul li {    font-size: 16px;    padding-top: 28px;}
.comment-middle {    padding-top: 6px;    width: 62%;}
.comment-right {    width: 20%;padding-left: 18px;}
.customize-inner p {    font-size: 17px;    line-height: 30px;    margin-bottom: 10px;}
.customize-inner h3 {    padding: 10px 0 15px;}
.customize-block {    padding: 18px 0 12px;}
.green-button {    font-size: 22px;    line-height: 28px;}
h2 ,.about-block h3{    font-size: 25px;    line-height: 30px;}
.about-block h2 {    padding-bottom: 15px;}
.earn-profile-block p {    font-size: 18px;    margin-bottom: 12px;}
.earn-profile-block {    padding: 30px 0 40px;}


}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {

    .header-top {    padding: 13px 10px 20px;    text-align: center;}
    .header-top .social-top-block {    display: none;}
    .logo-block img{max-width: 266px;}
    .link-block {    width: 100%;}
    .link-block a {    padding: 6px 14px 5px;}
    .join-block a {    height: 32px;}
    .banner-content-outer {    top: 36px;}
    .login-block a {     height: 32px;}
    .banner-content {    margin: 0 auto;    max-width: 250px;    text-align: center;    width: 100%;}
    .banner-content h1 {        font-size: 36px;    line-height: 44px;    padding-bottom: 26px;}
    .banner-content h1 span{display: none;}
    h3 {    font-size: 16px;    line-height: 18px;}
    .banner-content h3 span {    margin-bottom: 8px;    padding: 0 5px 4px;}
    .video-outer {    max-width: none;    padding-top: 50px;    width: 100%;}
    .embed-container {    padding-bottom: 77%;}
    .comment-left {    width: 44%;}
    .comment-right {    width: 44%;}
    .video-outer {    padding-top: 10px;}
    .customize-block {    padding: 10px 0 17px;}
    .green-button {   height: auto;   font-size: 25px;    max-width: 220px;    padding:6px 12px 13px;}
    .profile-block {    padding: 20px 0 0;}
    .profile-inner a {    margin-bottom: 15px;}
    .comment-show {    padding-top: 0;}
    .comment-show ul li {    padding-top: 16px;}
    .comment-middle {    float: none;    margin: 0 auto;    max-width: 318px;    padding-top: 0;    width: 100%;}
    .comment-middle img{padding-top: 20px;}
    .about-block {    padding: 15px 0 20px;}
    .customize-inner h3{   font-size: 15px; padding:8px 0 15px;   line-height: 25px; color: #363636;   font-family: 'Raleway-Regular';}
    .customize-inner p { font-size: 15px;    line-height: 26px;    margin-bottom: 14px; margin:0 0 15px; padding-bottom: 15px;border-bottom: 1px solid #bec3c7;}
    .about-inner {   float: none;    margin: 0 auto;    max-width: 292px;    width: 100%;}
    .about-inner h3{padding-left: 5%; padding-right: 5%;   font-size: 26px;}
    .about-block h2 {    padding-bottom: 18px;}
    .right-image {    padding-left: 0;padding-top: 20px;}
    .left-image img{ width: 287px;}
    .right-image img{ width: 281px;}
    .arrow {    left: 17px;    position: absolute;    right: 0;    top: -29px;    width: auto;}
    .arrow img {    max-width: 30px;}
    .left-image {   padding-top: 27px;}
    .earn-profile-block {    padding: 20px 0 20px;}
    .earn-profile-block p {    font-size: 15px;    margin-bottom: 8px;}
    .earn-profile-inner .green-button {    margin-top: 10px;}
    .footer-top-inner {    float: none;    margin: 0 auto;    max-width: 246px;    padding-left: 0;    text-align: center;    width: 100%;}
    .footer-top-inner h2{    font-size: 26px;    line-height: 30px;}
    .footer-top-inner p {font-size: 14px;    line-height: 19px;}
    .footer-top-inner ul li { float:none;  display: inline-block;  padding-right: 0;padding-left: 25px;}
    .footer-top-inner ul li:first-child {    padding-right: 0;padding-left: 0;}
    .footer-top-inner ul {    display: inline-block;    float: none;    margin: 0 auto;    max-width: 246px;    text-align: center;    width: 100%;}
    .footer-bottom { text-align: center;   padding: 20px 0;}
    .copy-right {   font-size: 14px;    line-height: 17px;    padding-top: 0;}
    .footer-bottom  .pull-right{float: none !important;  display: inline-block;}
    .social-top-block ul {    float: left;    text-align: center;    width: 100%;padding-bottom: 10px;}
    .social-top-block ul li {    display: inline-block;    float: none;      padding-left: 12px;}
    .customize-inner {    float: none;    margin: 0 auto;    max-width: 230px;    text-align: center;    width: 100%;}


}

@media only screen and (max-width: 479px) {
    .banner-image-outer{overflow: hidden;}
    .banner-block img {   left: 50%;    margin-left: -240px;    max-width: none;    position: relative;    width: 480px;}
    .comment-show ul li { padding-top: 12px;    font-size: 18px;}
    .about-block h2 {    padding-bottom: 14px;}
}

html {
    position: relative;
    width: 100%;
}

body {
    display: flex;
    min-height: 100vh;
    overflow-x: hidden;
    flex-direction: column;
}

.container-flex-register {
    position: relative;
    flex: 1 1 100%;
    text-align: center;
    align-items: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(../images/tast.jpg);
}

.container-flex-register > div {
    padding: 6em;
    background: rgba(0, 0, 0, 0.5);
}

.container-flex-register > div > form > input {
    width: 600px !important;
}

.container-flex-register > div > form > a {
    width: 300px !important;
    border: #c1392b;
    background-color: #c1392b;
}

@media(max-width: 768px) {

    .container-flex-register > div {
        padding: 3em;
    }

    .container-flex-register > div > h1 {
        font-size: 40px;
    }

    .container-flex-register > div > form > input {
        width: 100% !important;
    }

    .container-flex-register > div > form > a {
        width: 100% !important;
    }
}