@font-face {
    font-family: 'Raleway-Regular';
    src: url('../fonts/ralewayregular.eot');
    src: url('../fonts/ralewayregular.eot?#iefix') format('embedded-opentype'), url('../fonts/ralewayregular.woff') format('woff'), url('../fonts/ralewayregular.ttf') format('truetype'), url('../fonts/ralewayregular.svg#ralewayregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Lobster1.4';
    src: url('../fonts/lobster14.eot');
    src: url('../fonts/lobster14.eot?#iefix') format('embedded-opentype'), url('../fonts/lobster14.woff') format('woff'), url('../fonts/lobster14.ttf') format('truetype'), url('../fonts/lobster14.svg#lobster14') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
                    font-family: 'OpenSans';
                    src: url('../fonts/opensansregular0.eot');
                    src: url('../fonts/opensansregular0.eot?#iefix') format('embedded-opentype'),
                             url('../fonts/opensansregular0.woff') format('woff'),
                             url('../fonts/opensansregular0.ttf') format('truetype'),
                             url('../fonts/opensansregular0.svg#opensansregular0') format('svg');
                    font-weight: normal;
                    font-style: normal;
            }
input:focus, input:active, textarea:focus, textarea:active, a:focus, a:active {
    outline: 0px none !important;
}

ul, ol, h1, h2, h3, h4, h5, h6, p {
    margin: 0;
    padding: 0;
}

body {
    font-family: 'OpenSans';
    font-size: 16px;
    line-height: 22px;
    color: #ecf0f1;
    background: #f4f3f1;
}
h1 {
    font-size: 55px;
    font-family: 'Arial';
    line-height: 50px;
    font-weight: bold;
}
h2 {
    font-size: 28px;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 32px;
}

h3 {
    font-size: 21px;
    font-family: 'OpenSans';
    line-height: 26px;
    color: #fff0f5;
}
h4 {
    font-size: 16px;
    font-family: 'Garamond';
    line-height: 24px;
    color: #2f2f2f;
}
h5 {
    font-size: 15px;
    font-family: 'Garamond';
    line-height: 22px;
}
h6 {
    font-size: 14px;
    font-family: 'Garamond';
    line-height: 22px;
    font-weight: normal;
}
p {
    margin-bottom: 18px;
}
a {
    text-decoration: none;
    color: #bdc3c7;
    
}
a:hover,a:active {
    color: #7e8c8d;
    text-decoration: none;
}
a,
a:active,
a:focus,
a:hover{
    outline:none;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
strong {
    font-weight: bold;
}
img {
    max-width: 100%;
}

/*** Begin Header Section *************************************************************************************/
.header-top {
    width: 100%;
    float: left;
    padding: 10px 0 10px 11px;
}
.social-block {
    width: 100%;
    float: left;
}
.header-top .social-top-block {
    padding-top: 20px;
}
.header-top .social-top-block ul li span {
    color: #363636;
}
.header-top .social-top-block ul li .gray-twitter:hover span {
    color: #1abc9c;
}
.link-block a {
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    line-height: 19px;
    padding: 12px 16px 11px 17px;
    vertical-align: middle;
    display: table-cell;
}
.link-block {
    float: right;
    width: auto;
    padding-top: 10px;
}
.join-block {
    width: auto;
    display: inline-block;
}
.join-block a {
    text-shadow: 1px 1px #012d1e;
    height: 42px;
}
.join-block a:hover {
    background: #16a086;
}
.login-block {
    width: auto;
    display: inline-block;
    margin-left: 4px;
}
.login-block a {
    text-shadow: 1px 1px #310402;
    background:#c0392b;
    padding: 12px 20px 11px;
     height: 42px;
     -webkit-box-shadow: 0 1px 0 #d97b71 inset, 0 -1px 2px #8d291f inset;
    -moz-box-shadow:   0 1px 0 #d97b71 inset, 0 -1px 2px #8d291f inset;
    box-shadow:     0 1px 0 #d97b71 inset, 0 -1px 2px #8d291f inset;
    
}
.login-block a:hover{
    background: #b62c21;
    -webkit-box-shadow:  0 1px 0 #cf6b63 inset, 0 -1px 2px #831f17 inset;
    -moz-box-shadow:   0 1px 0 #cf6b63 inset, 0 -1px 2px #831f17 inset;
    box-shadow:      0 1px 0 #cf6b63 inset, 0 -1px 2px #831f17 inset;
   
}
/*** End Header Section ***************************************************************************************/

/*** Begin Content Section ************************************************************************************/
.banner-block {
    width: 100%;
    float: left;
    /*background: url(../images/foodie.jpg) no-repeat center center;
     background-size: cover;*/
    position: relative;
}
.banner-block img {
    width: 100%;
}
.banner-image-outer {
    width: 100%;
    float: left;
}
.banner-block .overlay-outer {
    background:rgba(0, 0, 0, 0.5);
}
.banner-content-outer {
    bottom: auto;
    float: left;
    height: 100%;
    left: 0;
    position: absolute;
    right: auto;
    top: 145px;
    width: 100%;
}
.banner-content {
    margin: 0 auto;
    max-width: 750px;
    text-align: center;
    width: 100%;
}
.banner-content h1 {
    padding-bottom: 45px;
      font-size: 48px;
    font-family: 'Lobster1.4';
        line-height: 59px;
}

.banner-content h3 {
    font-family: 'OpenSans';
}
.banner-content h3 span {
    background: #c1392b;
    margin-bottom: 12px;
    display: inline-block;
    padding: 0px 5px 4px;
}
.video-outer {
    padding-top: 50px;
    width: 100%;
    max-width: 604px;
    margin: 0 auto;
}
.video-inner {
    width: 100%;
    float: left;
}
.embed-container {
    height: 0;
    max-width: 100%;
    overflow: hidden;
    padding-bottom: 66%;
    position: relative;
}

.embed-container iframe, .embed-container object, .embed-container embed {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    border: 0;
}
.customize-block {
    width: 100%;
    float: left;
    padding: 18px 0 17px;
}
.customize-inner {
    width: 100%;
    float: left;
    text-align: center;
}
.customize-inner h3 {
    color: #363636;
    font-family: 'Raleway-Regular';
    padding: 10px 0 20px;
}
.customize-inner p {
    color: #363636;
    font-family: 'Raleway-Regular';
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 14px;
    line-height: 33px;
}

.profile-block {
    width: 100%;
    float: left;
    background: url(../images/swag.jpg) no-repeat center center;
    background-size: cover;
    position: relative;
    padding: 30px 0 0;
}
.profile-block .overlay-outer {
    background: rgba(183, 47, 47, 0.82);
}
.profile-inner-link {
    width: 100%;
    float: left;
    text-align: center;
}
.profile-inner {
    width: 100%;
    float: left;
}
.profile-inner a {
    text-align: center;
    margin-bottom: 21px;
}
.profile-inner h3 {
    text-align: center;
}
.comment-show {
    width: 100%;
    float: left;
    padding-top: 34px;
}
.comment-inner {
    float: left;
    width: 100%;
}
.comment-show ul {
    width: 100%;
    float: left;
    padding-top: 0;
}
.comment-show ul li {
    width: 100%;
    float: left;
    list-style: none;
    font-size: 20px;
    font-family: 'Lobster1.4';
    padding-top: 37px;
}
.comment-left {
    float: left;
    width: 18%;
}
.comment-left li {
    text-align: right;
}
.comment-right {
    float: right;
    width: 17%;
}
.comment-middle {
    float: left;
    text-align: center;
    width: 65%;
    padding-top: 6px;
}
.about-block {
    width: 100%;
    float: left;
    padding: 33px 0 22px;
}

.about-block h2 {
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    color: #363636;
    font-weight: bold;
    padding-bottom: 25px;
}
.about-block h3 {
    text-align: center;
    font-family: 'Lobster1.4';
    color: #c1392b;
    padding-bottom: 23px;
    font-size: 28px;
    line-height: 33px;
}
.about-inner {
    width: 100%;
    float: left;
}
.image-outer {
    margin: 0 auto;
    max-width: 700px;
    text-align: center;
    width: 100%;
    position: relative;
}
.left-image {
    display: inline-block;
}
.right-image {
    display: inline-block;
    padding-left: 38px;
    vertical-align: bottom;
}
.arrow {
    display: inline-block;
    position: absolute;
    top: -20px;
    width: 60px;
}
.earn-profile-block {
    width: 100%;
    float: left;
    background: rgba(54, 54, 54, 1);
    text-align: center;
    padding: 38px 0 48px;
}
.earn-profile-block p {
    width: 100%;
    float: left;
    background: rgba(54, 54, 54, 1);
    text-align: center;
    font-size: 20px;
    font-family: 'OpenSans';
    margin-bottom: 20px;
}
.green-button {
    color: #fff;
    font-family: 'Lobster1.4';
    font-size: 26px;
    font-weight: normal;
    line-height: 31px;
    text-align: center;
    text-shadow: 1px 1px #012d1e;
    background: #1bbc9b;
    padding: 17px 40px;
    display: inline-block;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-box-shadow:0 1px 0 #5ed5bd inset, 0 -1px 2px #138970 inset;
    -moz-box-shadow:   0 1px 0 #5ed5bd inset, 0 -1px 2px #138970 inset;
    box-shadow:         0 1px 0 #5ed5bd inset, 0 -1px 2px #138970 inset;
    height: 65px;
}
.green-button:hover{
   background: #15b38d;
    -webkit-box-shadow:0 1px 0 #55ccaf inset, 0 -1px 2px #0f8064 inset;
    -moz-box-shadow:   0 1px 0 #55ccaf inset, 0 -1px 2px #0f8064 inset;
    box-shadow:        0 1px 0 #55ccaf inset, 0 -1px 2px #0f8064 inset;
    color:#ecf0f1;
}
.earn-profile-inner .green-button {
    margin-top: 16px;
}
/*** End Content Section **************************************************************************************/

/*** Begin Footer Section *************************************************************************************/
.footer-top {
    width: 100%;
    float: left;
    background: url(../images/TB_swag.jpg) no-repeat center center;
    background-size: cover;
    position: relative;
    padding: 18px 0 20px;
}
.footer-top .overlay-outer {
    background: rgba(8, 64, 52, 0.75);
}
.overlay-outer {
    bottom: auto;
    float: left;
    height: 100%;
    left: 0;
    position: absolute;
    right: auto;
    top: 0;
    width: 100%;
}
.footer-top-inner {
    width: 64%;
    float: left;
    padding-left: 34px;
}
.footer-top-inner h2 {
    color: #ecf0f1;
    font-family: 'Lobster1.4';
    padding-bottom: 15px;
}
.footer-top-inner img {
    padding-bottom: 10px;
}
.footer-top-inner p {
    color: #ecf0f1;
    font-family: 'OpenSans';
    line-height: 20px;
    margin-bottom: 14px;
}
.footer-top-inner ul {
    width: 100%;
    float: left;
}
.footer-top-inner ul li {
    float: left;
    list-style: none;
    padding-right: 25px;
}
.footer-top-inner ul li a {
    float: left;
    font-size: 22px;
    font-family: 'Lobster1.4';
    text-decoration: underline;
    color: #bdc3c7;
}
.footer-top-inner ul li a:hover {
    color: #ecf0f1;text-decoration: none;
}
.footer-bottom {
    width: 100%;
    float: left;
    padding: 22px 0 28px;
    background: rgba(54, 54, 54, 1);
}
.copy-right {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 17px;
    color: #bdc3c7;
    padding-top: 10px;
}
.social-top-block {
    width: 100%;
    float: left;
}
.social-top-block ul {
    float: right;
    width: auto;
}
.social-top-block ul li {
    float: left;
    list-style: none;
    padding-left: 12px;
}
.social-top-block ul li a {
    float: left;
}
.social-top-block ul li span {
    text-transform: uppercase;
    color: #bdc3c7;
    padding-left: 13px;
    font-weight: bold;
    line-height: 14px;
    letter-spacing: .2px;
    font-size: 18px;
    font-family: 'OpenSans';
}
.social-top-block ul li img {
    float: left;
}
.social-top-block ul li a:hover img {
    opacity: .8;
}
.gray-twitter img {
    padding-top: 6px;
}
.gray-twitter img.hover-green {
    display: none;
}
.gray-twitter:hover img {
    display: none;
}
.gray-twitter:hover span {
    color: #1abc9c;
}
.gray-twitter:hover img.hover-green {
    display: block;
}
/*** End Footer Section ***************************************************************************************/

@media screen and (-webkit-min-device-pixel-ratio:0) {
    /* Safari and Chrome, if Chrome rule needed */
    .link-block a {
       display: inline-block;
    }
    ::i-block-chrome, .join-block {
        width: 150px;
    }
    ::i-block-chrome, .link-block a {
        padding: 12px 19px;
        display: inline-block;
    }
}
/* loader */
.loader {
    display: inline-block;
    font-size: 10px;
    margin: 15px auto 0 auto;
    text-indent: -9999em;
    width: 2em;
    height: 2em;
    border-radius: 50%;
    background: #000000;
    background: -moz-linear-gradient(left, #000000 10%, rgba(0,0,0, 0) 42%);
    background: -webkit-linear-gradient(left, #000000 10%, rgba(0,0,0, 0) 42%);
    background: -o-linear-gradient(left, #000000 10%, rgba(0,0,0, 0) 42%);
    background: -ms-linear-gradient(left, #000000 10%, rgba(0,0,0, 0) 42%);
    background: linear-gradient(to right, #000000 10%, rgba(0,0,0, 0) 42%);
    position: relative;
    -webkit-animation: load3 1.4s infinite linear;
    animation: load3 1.4s infinite linear;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}
.loader:before {
    width: 50%;
    height: 50%;
    background: #000000;
    border-radius: 100% 0 0 0;
    position: absolute;
    top: 0;
    left: 0;
    content: '';
}
.loader:after {
    background: #FFFFFF;
    width: 75%;
    height: 75%;
    border-radius: 50%;
    content: '';
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
#betatoken {
    padding: 0 6px;
}
.fb-ico:before {
    content: "f";
}
.fb-login-button {
    color: #FFFFFF!important;
}

.fa-facebook-f:before, .fa-facebook:before {
    content: "\f09a";
}
@-webkit-keyframes load3 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes load3 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.error-message {
    padding: 15px;
    color: #FF0000;
}