/*
 * FONTS
 *
 * Regular - 400
 * Semi-Bold - 600
 * Extra-Bold - 800
 */
@import url('//fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,800');

/* GERAL */
html, body { font-family: 'Open Sans', sans-serif; }
html { background-repeat: no-repeat; background-attachment: fixed; background-position: center center; background-color: transparent; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
body { background-color: transparent; }

body #wrap #main{min-height: 570px; overflow: visible;}

/* FORM */
form .form-group .help-block { color: #aa0000 !important; font-size: 1em !important; }
form .form-group button[type="submit"] {height: 32px; color: #ffffff; font-size: 1.2em; margin: 15px auto; border-style: solid; border-width: 2px; border-color: transparent; background-color: transparent; text-align: center; text-transform: lowercase; display: block; border-radius: 16px; cursor: pointer; }
form .form-group button[type="submit"][disabled="disabled"] { background-color: #bababa; cursor: default; }
.profile-edit-wrapper form .form-success { color: #73bf43 !important; font-size: 1em !important; }
.new-user-QRCode-wrapper form .form-success { color: #73bf43 !important; font-size: 1em !important; }

/* PROFILE AREA */
.profile-area { }
.profile-area img.profile-picture { width: 60px; height: 60px; margin: 0 0 0 20px; border-radius: 30px; float: right; }

/* BADGES */
span.badge { margin: 0 auto; display: block !important; background-color: transparent;}
span.badge.ranking {width: 40px;height: 40px; background-repeat: no-repeat; background-attachment: scroll; background-position: center center;  background-size: 100% auto; }
div.badges span.badge img { width: 70px;}
div.badges .grayscale img {-webkit-filter: grayscale(100%);filter: grayscale(100%);opacity: 0.1;filter: alpha(opacity=40);}
div.badges .grayscale .badge-title{opacity: 0.3;}
span.badge img.menu{width: 100% !important;height: 100% !important;}

/* HEADER */
.navbar-custom { margin: 0; border: 0 none; border-radius: 0; z-index: 9; }
.navbar-custom .navbar-header { }
.navbar-custom .navbar-header .navbar-toggle { border: medium none; margin: 40px 10px 0 0; }
.navbar-custom .navbar-header .navbar-toggle:hover,
.navbar-custom .navbar-header .navbar-toggle:focus { background-color: transparent; }
.navbar-custom .navbar-header .navbar-toggle .icon-bar { background-color: #333333; }
.navbar-custom .navbar-header .navbar-brand { width: 100px; min-height: 77px; margin: 20px 0 0 0; padding: 0; outline: none; background-repeat: no-repeat; background-attachment: scroll; background-position: center center; background-color: transparent; }
.navbar-custom .navbar-header.full { }
.navbar-custom .navbar-header.full .navbar-brand { width: 100%; text-align: center; }
.navbar.navbar-custom .profile-area { position: absolute; top: 40px; right: 15px; }

/* HEADER - MENU */
.navbar-collapse { border: none; padding: 0; }
.navbar-collapse ul.navbar-nav { width: 100px; position: absolute; left: 0; top: 50%; margin: 95px 0 0 0; }
.navbar-collapse ul.navbar-nav > li { margin: 10px 20px; }
.navbar-collapse ul.navbar-nav > li > a { width: 54px; height: 54px; border-radius: 27px; border-style: solid; border-width: 2px; border-color: transparent; text-indent: -999px; overflow: hidden; outline: none; }
.navbar-collapse ul.navbar-nav > li > a.icon { background-repeat: no-repeat; background-attachment: scroll; background-position: center center; background-color: transparent; }
.navbar-collapse ul.navbar-nav > li > a:hover,
.navbar-collapse ul.navbar-nav > li > a:focus { background-color: transparent; }
.navbar-collapse ul.navbar-nav > .active > a,
.navbar-collapse ul.navbar-nav > .active > a:hover,
.navbar-collapse ul.navbar-nav > .active > a:focus { background-color: transparent; }
.navbar-collapse ul.navbar-nav > .disabled > a,
.navbar-collapse ul.navbar-nav > .disabled > a:hover,
.navbar-collapse ul.navbar-nav > .disabled > a:focus { color: #cccccc; background-color: transparent; }
.navbar-collapse ul.navbar-nav > .open > a,
.navbar-collapse ul.navbar-nav > .open > a:hover,
.navbar-collapse ul.navbar-nav > .open > a:focus { text-decoration: none; }


/* HEADER - OFFCANVAS MENU */
.offcanvas { background-color: transparent; border-color: transparent; }
.offcanvas ul.navbar-nav { margin: 20px 0 60px; text-align: center; }
.offcanvas ul.navbar-nav > li { display: inline-block; margin: 10px 6px; }
.offcanvas ul.navbar-nav > li > a { width: 54px; height: 54px; border-radius: 27px; border-style: solid; border-width: 2px; border-color: transparent; text-indent: -999px; overflow: hidden; outline: none; }
.offcanvas ul.navbar-nav > li > a.icon { background-repeat: no-repeat; background-attachment: scroll; background-position: center center; background-color: transparent; }
.offcanvas ul.navbar-nav > li > a:hover,
.offcanvas ul.navbar-nav > li > a:focus { background-color: transparent; }
.offcanvas ul.navbar-nav > .active > a,
.offcanvas ul.navbar-nav > .active > a:hover,
.offcanvas ul.navbar-nav > .active > a:focus { background-color: transparent; }
.offcanvas ul.navbar-nav > .disabled > a,
.offcanvas ul.navbar-nav > .disabled > a:hover,
.offcanvas ul.navbar-nav > .disabled > a:focus { color: #cccccc; background-color: transparent; }
.offcanvas ul.navbar-nav > .open > a,
.offcanvas ul.navbar-nav > .open > a:hover,
.offcanvas ul.navbar-nav > .open > a:focus { text-decoration: none; }
.offcanvas .profile-area { width: 100%; display: inline-block; margin: 0 0 0 -20px; }
.offcanvas .profile-area img.profile-picture { margin: 0 0 0 15px; }
.offcanvas ul.footer { padding: 0; margin: 60px 0 0 0; text-align: center; }
.offcanvas ul.footer li { display: inline-block; margin: 0 20px; }
.offcanvas ul.footer li a { color: #ffffff; }
.offcanvas ul.footer li a:hover { color: #999999; text-decoration: none; }

/* CIRCLES */
.circle { width: 80px; height: 80px; margin: 25px auto; background-color: transparent; display: table; position: relative; border-radius: 40px; -webkit-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.circle::before { width: 110px; height: 110px; position: absolute; top: -15px; left: -15px; content: ' '; display: block; border-radius: 55px; border-style: solid; border-width: 8px; border-color: transparent; opacity: 0.5; -webkit-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.circle span { color: #ffffff; font-size: 1.2em; display: table-cell; vertical-align: middle; text-align: center; }
.circle-s { width: 50px; height: 50px; margin: 25px 10px 25px 10px; background-color: transparent; display: table; position: relative; border-radius: 25px; -webkit-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.circle-s::before { width: 70px; height: 70px; position: absolute; top: -10px; left: -10px; content: ' '; display: block; border-radius: 35px; border-style: solid; border-width: 7px; border-color: transparent; opacity: 0.5; -webkit-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.circle-s span { color: #ffffff; font-size: 1.2em; display: table-cell; vertical-align: middle; text-align: center; }
.circle-s small { width: 100%; color: #ffffff; position: absolute; top: 65px; left: 0; display: block; text-align: center; }
.circle-s.pull-left { margin-left: 0; }
.circle-s.pull-right { margin-right: 0; }
.circle-m { width: 60px; height: 60px; margin: 0 20px 0 20px; background-color: transparent; display: table; position: relative; border-radius: 30px; -webkit-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.circle-m::before { width: 80px; height: 80px; position: absolute; top: -10px; left: -10px; content: ' '; display: block; border-radius: 40px; border-style: solid; border-width: 7px; border-color: transparent; opacity: 0.5; -webkit-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.circle-s.no-border::before,
.circle-m.no-border::before { border-width: 0; }
.circle-m span { color: #ffffff; font-size: 1.2em; display: table-cell; vertical-align: middle; text-align: center; }
/*.circle-m span > img { width: 30px; height: 23px; display: block; margin: 0 auto; }*/
.circle-m span > small { }

/* CIRCLES - SVG */
.circle svg,
.circle-s svg,
.circle-m svg { position: absolute; top: 0; left: 0; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); }
.circle svg { width: 106px; height: 106px; margin: -13px; }
.circle-m svg { width: 76px; height: 76px; margin: -8px; }
.circle-s svg { width: 64px; height: 64px; margin: -7px; }
.circle-svg { -webkit-transition: stroke-dashoffset 1s ease; -o-transition: stroke-dashoffset 1s ease; transition: stroke-dashoffset 1s ease; }

/* CONTENT */
#content { margin: 17px 0 0 0; }
#content .cell { padding: 40px 15px; margin: 0 0 40px 0; border-radius: 10px; position: relative; background-color: transparent; }
#content .cell.cell-half { min-height: 270px; }
#content .cell.cell-full { min-height: 500px; }
#content .title { color: #ffffff; font-size: 1.4em; font-weight: 600; display: block; text-align: center; text-transform: uppercase; padding: 0 0 10px; margin: 0; }
#content p { color: #ffffff; font-size: 1.2em; text-align: center; }
#content a.button { width: 100%; height: 32px; color: #ffffff; font-size: 1.2em; border-style: solid; border-width: 2px; border-color: transparent; background-color: transparent; text-align: center; text-transform: lowercase; display: block; border-radius: 16px; cursor: pointer; -webkit-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#content a.button:hover { text-decoration: none; }

/* CONTENT - WELCOME */
#content .welcome { }
#content .welcome .title { margin-bottom: 1px }
#content .welcome p { }
#content .welcome .circle { margin: 35px auto; }
#content .welcome .circle-s { float: none !important; margin: 30px auto; }
#content .welcome a.button { margin: 50px 0 20px; }

#content .welcome .updateDailyGoal p.edit { margin: 26px 0 23px 0}
#content .welcome .updateDailyGoal input { margin-top: 23px }
#content .welcome .updateDailyGoal button { width: 100% }

#content .welcome .updateDailyGoal .slider{color: #ffffff;}
#content .welcome .updateDailyGoal .slider-tick{opacity: 1}
#content .welcome .updateDailyGoal .sliderDailyGoal{margin: auto 15px;}

/* CONTENT - MEMORIZATION BOOK */
#content .memorization-book { }
#content .memorization-book .list-group-item {
    background-color: rgba(0, 0, 0, 0);
    color: #fff;
    border: 0px;
}
#content .memorization-book { padding: 40px 15px; margin: 0 0 40px 0; border-radius: 10px; position: relative; background-color: rgba(41, 41, 41, 0.78); }

.memorization-lesson { background-color: rgba(41, 41, 41, 0.9); border-radius: 10px; color:white;  }
.memorization-lesson #changingImage{ width: 100%; height: 100%; text-align: left; position: relative; margin: 40px auto; display: block; border: medium none; text-indent: -999px; overflow: hidden; background: url(../image/spinner.gif) no-repeat scroll center center transparent; min-height: 70px; cursor: pointer; }
.memorization-lesson .audio > audio { width: 100% }

#question .audio {margin-bottom: 30px;}

/* CONTENT - RANKING */
#content .ranking { }
#content .ranking .table-responsive {overflow:visible;}
/* CONTENT - TABLES */
#content .table-responsive { border: medium none; }
#content .table-responsive table { width: 100%;margin-bottom: 0;}
#content .table-responsive table thead tr td { padding: 10px 15px; color: #3d2c4d; font-weight: 600; text-align: center; }
#content .table-responsive table thead tr td img { width: 30px; margin: 0 auto; }
#content .table-responsive table tbody tr td { color: #ffffff; font-size: 1.1em; padding: 8px 0; text-align: center; vertical-align: middle; border-top-style: solid; border-top-width: 2px; border-top-color: transparent; }
#content .table-responsive table tbody tr td:first-child { text-align: left; }
#content .table-responsive table tbody tr td img { width: 48px; height: 48px; float: left; margin-right: 8px; border-radius: 24px; }
#content .table-responsive table tbody tr.selected td { font-weight: bold; }

/* CONTENT - PROFILE */
#content .profile { text-align: center; }
#content .profile img { width: 105px; height: 105px; border-style: solid; border-width: 2px; border-color: transparent; border-radius: 54px; margin: 0 auto 20px; }
#content .profile .title { text-transform: none; }
#content .profile a.edit { width: 100%; color: #ffffff; display: block; outline: none; position: relative; }
#content .profile a.edit:hover { color: #999999; text-decoration: none; }
#content .profile a.edit:focus { text-decoration: none; }
#content .profile a.edit span.edit { width: 16px; height: 16px; position: absolute; display: inline-block; margin: 0 0 0 5px; background-repeat: no-repeat; background-attachment: scroll; background-position: center right; background-color: transparent; }

/* CONTENT - HISTORY */
#content .history { }
#content .history .title { }
#content .history .circle { margin: 35px auto; }
#content .history small { color: #ffffff; font-size: 1.1em; text-align: center; display: block; }

/* CONTENT - BADGES */
#content .badges { }
#content .badges ul { list-style: outside none none; margin: 0; padding: 0; text-align: center; }
#content .badges ul li { width: 132px; color: #ffffff; font-size: 1.1em; margin: 18px 5px; display: inline-block; vertical-align: top; }
#content .badges ul li img { margin: 0 auto 10px; display: block; }

/* ROW */
.row.spacer { }

/* FOOTER */
footer { color: #ffffff; margin: 80px 0 10px; z-index: 9; }
footer span { min-height: 30px; line-height: 30px; display: block; padding: 0 0 0 35px; font-size: 0.7em; background-repeat: no-repeat; background-attachment: scroll; background-position: left center; background-color: transparent; }
footer span strong { font-size: 1.3em; }
footer ul { display: none; padding: 0; text-align: right; }
footer ul li { display: inline-block; margin: 0 0 0 20px; }
footer ul li a,
footer ul li a:focus { color: #ffffff; }
footer ul li a:hover { color: #999999; text-decoration: none; }

/* MODAL */
#modal { display: none; }
#modal iframe { max-width: 100%; }
#simplemodal-overlay { background-color: #000000; }
#simplemodal-container a.modalCloseImg { width: 24px; height: 24px; position: absolute; top: -30px; right: -30px; display: inline; cursor: pointer; background: url('../image/button-wrong.png') no-repeat scroll top left transparent; z-index: 3200; }

/* LOGIN */
.login-area { margin: 0 auto 70px;}
.login-area label { color: #ffffff; font-size: 1.2em; font-weight: 400; text-transform: lowercase; }
.login-area input[type="email"],
.login-area input[type="password"] { width: 100%; height: 40px; color: #ffffff; text-align: center; margin: 0 0 12px; padding: 5px 10px; border-radius: 20px; border: 2px solid transparent; background-color: transparent; }
.login-area .button { width: 60%; height: 32px; color: #ffffff; font-size: 1.2em; margin: 15px auto; border-style: solid; border-width: 2px; border-color: transparent; background-color: transparent; text-align: center; text-transform: lowercase; display: block; border-radius: 16px; cursor: pointer; -webkit-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.login-area .button:hover { text-decoration: none; }
.login-area a.warning { color: #999999; font-weight: 600; display: block; text-transform: lowercase; }
.login-area a.warning:hover { text-decoration: none; }
.login-area a.forgotPassword { color: #ffffff }

/* SOBRE */
.sobre-wrapper { }
.sobre-wrapper h1 { color: #ffffff; text-align: center; }
.sobre-wrapper p { }
.sobre-wrapper .video-sobre { margin: 30px auto; }

/* CONTATO */
.contato-wrapper { }
.contato-wrapper h1 { color: #ffffff; text-align: center; }
.contato-wrapper p { }
.contato-wrapper form { }
.contato-wrapper form .form-group { }
.contato-wrapper form .form-group label { color: #ffffff; font-weight: 400; }
.contato-wrapper form .form-group input[type="text"],
.contato-wrapper form .form-group input[type="email"] { color: #ffffff; max-width: 100%; height: 40px; text-align: center; margin: 10px 0; padding: 5px 10px; border-radius: 20px; border: 2px solid transparent; background-color: transparent; }
.contato-wrapper form .form-group textarea { color: #ffffff; max-width: 100%; margin: 10px 0; padding: 5px 10px; border-radius: 20px; border: 2px solid transparent; background-color: transparent; }
.contato-wrapper form .form-group button { width: 40%;}


/* PROFILE EDIT */
.profile-edit-wrapper { }
.profile-edit-wrapper h1 { color: #ffffff; text-align: center; }
.profile-edit-wrapper p { }
.profile-edit-wrapper form { }
.profile-edit-wrapper form .form-group { }
.profile-edit-wrapper form .form-group label { color: #ffffff; font-weight: 400; }
.profile-edit-wrapper form .form-group label span.required { }
.profile-edit-wrapper form .form-group input[type="text"],
.profile-edit-wrapper form .form-group input[type="email"],
.profile-edit-wrapper form .form-group input[type="password"] { color: #ffffff; max-width: 100%; height: 40px; text-align: center; margin: 10px 0; padding: 5px 10px; border-radius: 20px; border: 2px solid transparent; background-color: transparent; }
.profile-edit-wrapper form .form-group button { width: 40%;}


/* NEW USER */
.new-user-QRCode-wrapper { }
.new-user-QRCode-wrapper h1 { color: #ffffff; text-align: center; }
.new-user-QRCode-wrapper p { }
.new-user-QRCode-wrapper form { }
.new-user-QRCode-wrapper form .form-group { }
.new-user-QRCode-wrapper form .form-group label { color: #ffffff; font-weight: 400; }
.new-user-QRCode-wrapper form .form-group label span.required { }
.new-user-QRCode-wrapper form .form-group input[type="text"],
.new-user-QRCode-wrapper form .form-group input[type="email"],
.new-user-QRCode-wrapper form .form-group input[type="password"] { color: #ffffff; max-width: 100%; height: 40px; text-align: center; margin: 10px 0; padding: 5px 10px; border-radius: 20px; border: 2px solid transparent; background-color: transparent; }
.new-user-QRCode-wrapper form .form-group button { width: 40%;}

/* DICTIONARY */
.dictionary-wrapper { }
.dictionary-wrapper h1 { color: #ffffff; text-align: center; }
.dictionary-wrapper form { }
.dictionary-wrapper form .form-group { }
.dictionary-wrapper form .form-group input[type="text"] { color: #ffffff; max-width: 100%; height: 40px; text-align: center; margin: 10px 0; padding: 5px 10px; border-radius: 20px; border: 2px solid transparent; background-color: transparent; }
.dictionary-wrapper form .form-group .form-control { }
.dictionary-wrapper form .form-group .form-control::-webkit-input-placeholder { color: #ffffff; }
.dictionary-wrapper form .form-group .form-control:-moz-placeholder { color: #ffffff; }
.dictionary-wrapper form .form-group .form-control::-moz-placeholder { color: #ffffff;}
.dictionary-wrapper form .form-group .form-control:-ms-input-placeholder {  color: #ffffff; }
.dictionary-wrapper .table-responsive { border: medium none; }
.dictionary-wrapper .table-responsive table { width: 100%; }
.dictionary-wrapper .table-responsive table thead tr td { padding: 10px 15px; color: #3d2c4d; font-weight: 600; text-align: left; }
.dictionary-wrapper .table-responsive table thead tr td:first-child { width: 15%; }
.dictionary-wrapper .table-responsive table tbody tr td { color: #ffffff; font-size: 1.1em; padding: 8px 0; text-align: left; vertical-align: middle; border-top-style: solid; border-top-width: 2px; border-top-color: transparent; }
.dictionary-wrapper .table-responsive table tbody tr td b { }

/* CHAT EDIT */
.chat-wrapper { }
.chat-wrapper h1 { color: #ffffff; text-align: center; }
.chat-wrapper p { }
.chat-wrapper a.button { margin: 50px auto 20px; }

/* QUESTIONS */
#content #question {max-width: 1000px; margin: 0 auto;}
#content #question .admin-info {margin-top: 50px; color: #dedede; border-style: solid; border-width: 1px; border-color: rgba(255, 255, 255, 0.6);}
#content #question .admin-info h3{margin: 10px 0 20px 0}
#content #question .admin-info p{text-align: left;margin-left: 15px; color: #dedede; }

/* MEDIA QUERIES */
/* small devices (tablets, 768px and up) */

/* MODAL SPEAKER */
.scientist .speaker{
    background-image: url('../image/badge_sci.png');
}
.swal2-modal .speaker {
    width: 150px;
    height: 150px;
    margin: 30px 0 0 455px;
    position: fixed;
    border-radius: 75px;
    border: white solid 4px;
}

.swal2-modal {
    overflow: visible !important;
    border-radius: 178px 178px 0 178px !important;
}

.swal2-modal h2 {
    line-height: 45px !important;
    margin-bottom: 40px !important;
}

/* TOAST */
#toast-container {
    margin-right: 80px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

#toast-container .toast {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    opacity: 0.9;
}

#toast-container .toast-success {
    background-color: white !important;
    color: black;
}

/* LOADING BAR */

#loading-bar-container{
    min-height: 23px;
}
#loading-bar .bar {
    position: inherit !important;
}
#loading-bar-spinner {
    position: inherit !important;
    margin: 7px 0 0 7px;

}

@media (min-width: 481px) {
    /* TOAST */
    .toast-message .speaker {
        background-image: url('../image/rebeca75.png');
        height: 75px;
        width: 75px;
        position: absolute;
        left: 332px;
        top: 0px;
        border-radius: 33px;
        z-index: 2;
    }
}

@media (min-width: 768px) {
    .login-area {max-width: 450px;}

    .navbar-custom .navbar-header .navbar-brand { margin: 40px 0 0 0; }

    #content .cell { margin: 15px 0; }
    #content .cell.cell-half { min-height: 353px; }
    #content .cell.cell-full { min-height: 500px; }

    .row.spacer { margin-top: 40px; }

    #content .welcome .circle-s.pull-right { float: right !important; }

    .question-wrapper .question .highlight span { margin-left: 0; }
    .question-wrapper .question p.filltheblanks input.complete.short { width: auto; text-align: left; padding-left: 4% }
    .question-wrapper .question .select-list { text-align: center; }
    .question-wrapper .question .select-list a.select-item { margin: 10px 5px 0 0; }

    /* TOAST */
    #toast-container .toast:after
    {
        content: '';
        position: absolute;
        border-style: solid;
        border-width: 21px 0 21px 30px;
        border-color: transparent white;
        display: block;
        width: 0;
        z-index: 1;
        right: -30px;
        top: 17px;
    }
    #toast-container:hover .toast:after
    {
        opacity: 1;
    }

    #toast-container {
        margin-right: 140px;
    }
}

@media (max-height: 900px){
    .question-wrapper .question .image img {max-height: 250px;}
}

/* medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .navbar-custom .navbar-header.full .navbar-brand { width: 100px; }

    #content .title { font-size: 1.2em; }

    #content .cell.cell-half { min-height: 373px; }

    #content .welcome .circle-s.pull-right { float: none !important; }

    #content .profile a.edit { width: 100%; }

    .question-wrapper .question a.next { bottom: -50px; right: -50px; left: auto; margin: 0; }
    .question-wrapper .question a.arrow-right { top: 45%; right: -70px; }
    /*TODO: Isso aqui estava dando erro com telas de tamanho*/
    .question-wrapper .question ul.multiplechoice li { display: inline-block; }
    .question-wrapper .question p.filltheblanks input.complete { margin: 5px 10px; }
    .question-wrapper .question p.selectfromlist input.complete { margin: 5px 10px; }

    footer span { font-size: 1em; }
    footer span strong { font-size: 1em; }
    footer ul { display: block; }
}

/* large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

    #content .title { font-size: 1.4em; }

    #content .cell.cell-half { min-height: 353px; }

    #content .profile a.edit { width: 100%; }

    #content .welcome .circle-s { }
    #content .welcome .circle-s.pull-right { float: right !important; }

    #content .ranking .table-responsive table thead tr td{padding-left: 2px;padding-right: 2px;}
}

@media (min-width: 1241px) {
    #content .cell {padding: 40px}
}
@media (min-width: 1241px) {
    #content .memBook {padding: 40px}
}

/* custom size - very large devices */
@media (min-width: 1600px) {
    #content .welcome .circle-s.pull-right { float: none !important; }
    .question-wrapper .question ul.multiplechoice li { display: block; }
}
/*RESOURCES*/

.audio-resource {
    width: 100%;
}


.btn-facebook {
    padding-left: 36px;
    min-width: 175px;
    width: 60%;
    margin: auto;
    color: #fff;
    background-color: #3b5998;
    border: 1px solid #335190;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUBAMAAAB%2FpwA%2BAAAAGFBMVEUAAAD%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F8jfp1fAAAAB3RSTlMA7D8UYSuqwY7ItgAAAEdJREFUCNdjUCyHAiEGcRizkKEcDiDMQmeGcChTmIGBHcp0YDBVhzIN2OBqgdIYzAIGIDBHMNURTHcktWQzxWHMQgZFGFMIAFerRr2lTcdCAAAAAElFTkSuQmCC");
    background-position: 10px center;
    background-repeat: no-repeat;
}

.btn-facebook:hover,
.btn-facebook:focus {
    color: #fff;
    background-color: #294786;
}

/*RESOURCES*/

.modal-dialog .modal-content {
    background-color: transparent;
}

.podium .podium-row-1{
    margin-top: 20px;
    margin-bottom: 20px;
}
.podium .picture-medal .podium-picture-1 {
    width: 100%;
    border-radius: 30px;
}

.podium .podium-picture-2 {
    width: 50px;
    height: 50px;
    border-radius: 25px;
}

.podium .podium-picture-3 {
    width: 40px;
    height: 40px;
    border-radius: 20px;
}

.my-status{
    border-top: solid gray;
    margin-top: 20px;
    padding-top: 20px;
}
.podium .picture-medal{
    width: 60px;
    height: 60px;
    position:relative;
    margin: auto;
}

.podium .picture-medal .medal{
    position:absolute;
    width:30px;
    top:-6px;
    right:-17px;
}
.podium .picture-medal .medal.second{
    width:25px;
    right:-12px;
}
.podium .picture-medal .medal.third{
    width:20px;
    right:-8px;
}
.competences-checkboxes {
    padding-left: 30px;
}
.competences-list {
    max-height: 350px;
    overflow-y: scroll;
    color:#ffffff;
}
.competences-legend{
    color:#ffffff;    
}