/* Jumbotron */
.jumbotron {
    padding: 0 !important;
    border-radius: 0 !important;
    color: #FFF;
    /*height: 350px;*/
    height: 260px;
}

.jumbotron .jumboimage {
    background: url('/assets/img/ref/fons.jpg') no-repeat bottom;
    background-size: cover;
    position: absolute;
    left: 0;
    right: 0;
    top: 60px;
    bottom: 0;
    height: 300px;
}

.jumbotron .jumboverlay {
    /*background-color: rgba(0, 0, 0, 0.25);*/
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}

.jumbotron .jumbotitle {
    margin: 70px 10px 40px 10px;
    text-align: center;
}

.jumbotron .jumbotitle h2 {
    font-size: 35px;
    font-weight: bold;
}

.jumbotron .jumboconditions {
    text-align: right;
    position: absolute;
    right: 15%;
    bottom: 20px;
}

.jumbotron .jumboconditions a {
    color: #FFFFFF;
    text-decoration: underline;
}

.jumbotron .jumbocontacts {
    text-align: center;
}

.jumbotron .jumbocontacts-title {
    margin-top: 10px;
    margin-bottom: 15px;
}


.jumbotron .jumbocontacts-link {
    color: #FFF;
    font-size: 18px;
    width: 200px;
    display: inline-table;
    margin: 0 auto;
}

.jumbotron .jumbocontacts-link:hover div {
    text-decoration: underline;
}

.jumbotron .jumbocontacts-logo {
    height: 65px;
    width: auto;
    margin-bottom: 13px;
}

.referal-info {
    /* margin: 35px 160px; */
    margin: 35px 140px;
    font-size: 19px;
    line-height: 22px;
}

.modal-header-conditions {
    border-bottom: 0;
    margin-top: 10px;
    margin-bottom: -10px;
    padding-bottom: 0;
}

.modal-title-conditions {
    font-size: 24px;
    color: #000;
    text-align: center;
}

/* Referal panel */
.panel-referal {
    margin-bottom: 25px;
    border: none;
}

.panel-referal h3 {
    text-align: center;
    margin: 0;
    margin-bottom: 20px;
    font-size: 16px;
    font-weight: bold;
}

.panel-referal .panel-body {
    padding: 50px 15%;
}

.panel-referal .referal-group-title {
    margin-bottom: 10px;
    margin-left: 5px;
}

.panel-referal .referal-group-inputs {
    overflow: hidden;
}

.panel-referal .referal-group-inputs .referal-mail {
    float: left;
    width: 80%;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.panel-referal .referal-group-inputs .referal-btn-mail {
    float: right;
    width: 20%;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    background:#1cbd31;
}

.referal-share > a {
    width: auto;
    /*font-weight: bold;*/
    border-radius: 5px;
    padding-left: 60px !important;
    text-align: left !important;
   /* font-size: 18px;*/
    padding-top: 9px;
    padding-bottom: 9px;
    border:none;
    font-size:16px;
}

.referal-share > a > i {
    width: 50px !important;
   /* border-right: 2px solid #FFF;*/
}

.referal-share-facebook > a > i {
	background: url('https://storage.googleapis.com/static.sharingacademy.com/v1.02/img/Facebook_logo_white.svg') no-repeat center center;
    background: none !important;
    background-size: 40%;
}

.referal-share-twitter > a > i {
    background: url('/assets/img/Twitter_logo_white.svg') no-repeat center center;
    background-size: 60%;
}

/* Social buttons */
.btn-social {
    position: relative;
    padding-left: 44px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.btn-social > :first-child {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 32px;
    line-height: 34px;
    font-size: 1.6em;
    text-align: center;
    border-right: 1px solid rgba(0, 0, 0, 0.2)
}

.btn-social-icon {
    position: relative;
    padding-left: 44px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 34px;
    width: 34px;
    padding: 0
}

.btn-social-icon > :first-child {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 32px;
    line-height: 34px;
    font-size: 1.6em;
    text-align: center;
    border-right: 1px solid rgba(0, 0, 0, 0.2)
}

.btn-facebook {
    color: #fff;
    background-color: #3b5998;
    border-color: rgba(0, 0, 0, 0.2)
}

.btn-facebook:hover, .btn-facebook:focus, .btn-facebook:active, .btn-facebook.active, .open > .dropdown-toggle.btn-facebook {
    color: #fff;
    background-color: #2d4373 !important;
    border-color: rgba(0, 0, 0, 0.2)
}

.btn-facebook:active, .btn-facebook.active,.open > .dropdown-toggle.btn-facebook {
    background-image: none
}

.btn-facebook.disabled, .btn-facebook[disabled], fieldset[disabled] .btn-facebook,.btn-facebook.disabled:hover, .btn-facebook[disabled]:hover, fieldset[disabled] .btn-facebook:hover, .btn-facebook.disabled:focus, .btn-facebook[disabled]:focus, fieldset[disabled] .btn-facebook:focus,  .btn-facebook.disabled:active,  .btn-facebook[disabled]:active, fieldset[disabled] .btn-facebook:active,  .btn-facebook.disabled.active,  .btn-facebook[disabled].active,  fieldset[disabled] .btn-facebook.active {
    background-color: #3b5998;
    border-color: rgba(0, 0, 0, 0.2)
}

.btn-facebook .badge {
    color: #3b5998;
    background-color: #fff
}

.btn-twitter {
    color: #fff;
    background-color: #55acee;
    border-color: rgba(0, 0, 0, 0.2)
}

.btn-twitter:hover, .btn-twitter:focus, .btn-twitter:active, .btn-twitter.active, .open > .dropdown-toggle.btn-twitter {
    color: #fff;
    background-color: #2795e9;
    border-color: rgba(0, 0, 0, 0.2)
}

.btn-twitter:active, .btn-twitter.active, .open > .dropdown-toggle.btn-twitter {
    background-image: none
}

.btn-twitter.disabled, .btn-twitter[disabled], fieldset[disabled] .btn-twitter, .btn-twitter.disabled:hover, .btn-twitter[disabled]:hover, fieldset[disabled] .btn-twitter:hover, .btn-twitter.disabled:focus, .btn-twitter[disabled]:focus, fieldset[disabled] .btn-twitter:focus, .btn-twitter.disabled:active, .btn-twitter[disabled]:active, fieldset[disabled] .btn-twitter:active, .btn-twitter.disabled.active, .btn-twitter[disabled].active, fieldset[disabled] .btn-twitter.active {
    background-color: #55acee;
    border-color: rgba(0, 0, 0, 0.2)
}

.btn-twitter .badge {
    color: #55acee;
    background-color: #fff
}

/* Panel achievements */
.referal-achievement {
    text-align: center;
    font-size: 28px;
    margin-top: 0;
}

.referal-achievement > b {
    font-size: 48px;
    font-weight: normal !important;
    color: #1E7229;
}

.referal-achievements {
    margin-top: 50px;
}

.referal-achievements .referal-achievements-num {
    font-size: 48px;
}

.referal-achievements .referal-achievements-label {
    margin-top: 10px;
}

.referal-row {
    padding: 10px 10px;
    border-top: 1px solid #CCC;
}

.referal-row:last-child {
    border-bottom: 1px solid #CCC;
}

.referal-row .referal-sent-image > img {
    height: 50px;
}

.referal-row .referal-sent-mail {
    line-height: 25px;
    text-align: left;
}

.referal-row .referal-sent-status {
    line-height: 25px;
}

.referal-row .referal-sent-status .status-default {
    font-size: 18px;
}

.referal-row .referal-sent-status .status-accepted {
    color: #1E7229;
    font-size: 18px;
}

.referal-row .referal-sent-status .status-resend {
    color: #FFFFFF;
    background-color: #FF6C00;
    font-weight: bold;
    cursor: pointer;
    display: inline;
    padding: 8px 13px 8px 13px;
    border-radius: 5px;
    font-size: 18px;
}

.referal-row .referal-sent-status .status-completed {
    line-height: 26px;
}

.referal-row .referal-sent-status .status-completed .preu-ref {
    font-size: 24px;
    color: #1E7229;
}

.referals-progress {
    margin-top: 50px;
}


.referals-progress .referals-progressbar-wrap {
    background-color: #999999;
    border-radius: 10px;
    overflow: hidden;
}

.referals-progress .referals-progressbar-value {
    background-color: #1E7229;
    height: 50px;
    width: 50%;
    min-width: 50px;
}

.referals-progress-max {
    color: #999999;
    font-size: 32px;
    height: 50px;
    line-height: 50px;
}

.referals-done {
    margin-top: 40px;
}

.referals-progress-actual {
    height: 30px;
    margin-top: 15px;
}

.referals-progress-actual > .progressvalue {
    text-align: right;
    width: 50%;
    min-width: 50px;
    color: #1E7229;
    font-size: 32px;
}

.force-normal-style {
    font-weight: bold !important;
    background-color: #FFF !important;
    cursor: text !important;
}

.pagination {
    margin-bottom: 0;
}

/* Panel conditions */
.referal-conditions section {
    margin-top: 20px;
}

.referal-row .referal-sent-status .status-completed .text-ref {
    line-height: 14px;
    display: block;
    margin-top: 5px;
}

#gmailGetContacts {
    /*height: 70px;*/
    background: #BF0101;
    display: inline-block;
    padding: 15px 30px 15px 20px;
    min-height: 50px;
    /*width: 49%;
    margin-right: 1%;*/
    border-radius: 4px;
    width: inherit;
}

#gmailGetContacts:hover {
    background: rgb(222, 0, 0);
}

#gmailGetContacts img {
    height: 40px;
    float: left;
}

#gmailGetContacts div {
    margin-left: 65px;
    /*float: left;*/
    /*display: inline-block;*/
    color: #FFF;
    font-size: 16px;
}

#outlookGetContacts {
    /*height: 70px;*/
    background: #005494;
    display: inline-block;
    padding: 15px 30px 15px 20px;
    min-height: 50px;
    width: 49%;
    border-radius: 4px;
}

#outlookGetContacts:hover {
    background: #0063AF;
}

#outlookGetContacts img {
    float: left;
    height: 47px;
    margin-top: -3px;
}

#outlookGetContacts div {
    margin-left: 65px;
    /*float: left;*/
    /*display: inline-block;*/
    color: #FFF;
    font-size: 16px;
}

input#ambassador {
    font-family: "Courier New", monospace ;
}

.jumbocontacts .btn-facebook {
    background: #FFF !important;
    border: 2px solid #2d4373 !important;
    color: #2d4373 !important;
    font-size: 16px !important;
}

.jumbocontacts .btn-facebook:hover {
    background-color: rgba(45, 67, 115, 0.25) !important;
}

.jumbocontacts .btn-facebook i {
    width: 45px !important;
    color: #FFF;
    background: #2d4373 !important;
}

.jumbocontacts .btn-twitter {
    border: 2px solid #2795e9 !important;
    background: #FFF !important;
    color: #2795e9 !important;
    font-size: 16px !important;
}

.jumbocontacts .btn-twitter i {
    width: 45px !important;
    background-color: #2795e9;
    border-right: 0 solid !important;
}

#seeConditions {
    display: block;
    float: right;
    font-size: 14px;
    margin-right: 20px;
}

.want-btn {
    font-size: 18px;
    padding: 15px 40px;
    height: auto;
    width: auto;
    margin: 0 auto 80px auto;
}

.sendbutton {
    width: auto;
    padding: 5px 15px;
}

/* Media queries */
@media (max-width: 1199px) and (min-width: 992px) {
    .panel-body {
        display: block !important;
    }

    .referal-row .referal-sent-status .status-completed .text-ref {
        font-size: 12px;
        line-height: 14px;
    }
}

@media (max-width: 992px) {
    .referal-share {
        margin-top: 10px;
    }

    .referal-achievement-group {
        margin-bottom: 30px;
    }

    .referals-progress-max {
        display: none;
    }

    .referal-row .referal-sent-status .status-completed .text-ref {
        display: none;
    }

    .referal-row .referal-sent-status .status-completed {
        line-height: 50px;
    }

    .referal-info {
        /*margin: 35px 0;*/
        /*margin-top: 45px;*/
        margin: 10px 0;
    }

    .panel-referal .panel-body {
        padding: 3% 5%;
    }

    .referal-share > a {
        font-size: 12px;
    }

    .referals-progress {
        margin-top: 20px;
    }

    .referal-row .referal-sent-mail {
        font-size: 12px;
    }

    .referal-row .referal-sent-image {
        display: none;
    }

    .jumbocontacts-link {
        font-size: 16px !important;
        /*width: 150px !important;*/
        width: 100% !important;
        margin-bottom: 15px;
    }

    

    .jumbotron {
        /* height: 335px; */
        height: 250px;
    }

    .jumbotron .jumbotitle {
        margin: 50px 10px 20px 10px;
    }

    .jumbotron .jumbotitle h2 {
        font-size: 40px;
        line-height: 40px;
    }

    #seeConditions {
        margin-top: 10px;
        display: block;
        text-align: right;
        font-size: 14px;
        margin-bottom: 20px;
    }

    .referal-info ol {
        padding: 0;
        margin: 0 20px;
        list-style-type: decimal !important;
        font-size: 16px;
    }

    .referal-info ol li {
        margin-bottom: 10px;
    }

    .smallblockbutton {
        width: 100%;
        height: auto;
        margin-top: 15px;
    }

    .blockbutton {
        width: 100%;
        height: auto;
        margin-top: 15px;
        padding: 14px 10px;
    }
    
}

.label-base {
    display: none;
    margin-top: -5px;
    margin-bottom: 5px;
    margin-left: 5px;
    clear: both;
}

.label-red2 {
    color: #B7191A;
}

.label-green {
    color: #1E7229;
}

.icon-facebook {
    font-size: 45px !important;
}

#contactsResult {
    text-align: center;
    padding: 20px 10px 10px 10px;
    max-height: 400px;
    overflow: auto;
}

#contactsResult .contactsResultHeader {
    text-align: left;
    font-weight: bold;
    margin-left: 10px;
}

#contactsResult .contactsResultBlock {
    text-align: left;
    margin-left: 20px;
    margin-top: -5px;
}

#contactsResult .contactsResultOk {
    color: #1E7229;
}

#contactsResult .contactsResultBad {
    color: #B7191A;
}

#contactsData {
    list-style: none;
    padding: 0;
    max-height: 400px;
    overflow-y: auto;
    margin: 0;
}

.modal-footer {
    margin-top: 0;
}

#contactsData li .contactData {
    padding: 10px 35px 10px 20px;
    word-break: break-all;
}

#contactsData li .contactName {
    font-weight: bold;
    margin-right: 10px;
}

#contactsData li .contactName:empty {
    display: none;
}


#contactsData .active-li {
    background-color: #1E7229;
    color: #FFF;
}

#contactsData li {
    background-color: #FFF;
    border-bottom: 1px solid rgba(165, 165, 165, 0.4);
    position: relative;
    cursor: pointer;
    min-height: 65px;
}

#contactsData .active-li .circle {
    background-color: #FFF;
}

#contactsData .circle {
    width: 20px;
    height: 20px;
    border: 1px solid rgba(165, 165, 165, 0.4);
    border-radius: 10px;
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -10px;
}

#contactsData .active-li .circle:after {
    content: '';
    position: absolute;
    width: 10px;
    height: 6px;
    background: rgba(0, 0, 0, 0);
    top: 5px;
    left: 4px;
    border: 2px solid #1E7229;
    border-top: none;
    border-right: none;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

button.navbar-toggle.collapsed {
    display: none;
}

.msg.msg-mobile {
    display: none;
}

ul.nav .navbar-nav .navbar-right {
    display: none;
}

.divfbgrup {
    display: none
}

ul.premis li {
    margin-bottom: 10px;
}

.yellowButton {
    color: #222;
    margin: 50px auto 0 auto;
    background: #ffcc00;
    box-shadow: 0 3px 8px -3px #000;
    position: relative;
    margin-top: -80px;
    margin-bottom: 80px;
}

.panel-referal .socialNetworks > div {
    width: 100%;
    padding: 0;
}

.panel-referal .socialNetworks > div:first-child {

    margin-bottom: 10px;
}

@media (max-width: 767px) {
    .yellowButton {
        margin-top: -5px;
        margin-bottom: -10px;
    }
}

@media (max-width: 370px) {
    .jumbotron {
        height: 310px;
    }
    .jumbotron .jumboimage {
        height: 360px
    }
}

/* NOU! */
.btn-fb {
    background:#3b5998;
    color:#FFF;
}

.btn-fb:hover {
    background:#1d3469;
    color:#FFF;
}

.btn-mail {
    color: #EFEFEF;
    background: none !important;
    background: rgba(25, 25, 25, 0.5) !important;
    border-color: #ccc;
}

.btn-mail:focus, .btn-mail:hover {
    color: #EFEFEF;
    background: rgba(25, 25, 25, 0.7) !important;
    border-color: #ccc;
}

.btn-want {
    color: #EFEFEF;
    background: none !important;
    background: #ec6120 !important;
    border-color: rgba(0, 0, 0, 0);
}
.btn-want span {
    white-space: normal !important;
}

.btn-want:focus, .btn-want:hover {
    color: #EFEFEF;
    background: #ec6120 !important;
    border-color: rgba(0, 0, 0, 0);
    box-shadow: 0 3px 0 #af5c34 !important;
}

ul.intro-social-buttons .network-name {
    font-size: 16px !important;
    letter-spacing: 0;
}

.list-inline>li {
    display:block;
}

@media(max-width:767px) {
    .intro-message {
        padding-bottom: 15%;
    }

    .intro-message > h1 {
        font-size: 4em;
    }

    ul.intro-social-buttons > li {
        display: block;
        margin-bottom: 20px;
        padding: 0;
    }

    ul.intro-social-buttons > li:last-child {
        margin-bottom: 0;
    }
    .intro-social-buttons {
        margin-top:2em;
    }
    .btn-fb i, .btn-fb span {
        font-size:1em !important
    }
}

@media (max-width: 480px) {
    .onebuttonclaim {
        display: block;
        margin-bottom: 15%;
    }
    .onebuttonclaim div:first-child {
        text-align: center;
    }
    .onebuttonclaim div:last-child {
        text-align: center;
        padding-top: 15px;
    }
}