/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/

/**************************************************************
  Notes for maintainers

  - This file overrides LimeSurvey template styles only
  - Core templates should not be edited directly
  - Font, spacing, and colour decisions are centralized
  - Change styles here to stay compatible with updates
**************************************************************/

/* ==========================================================
   BASE TYPOGRAPHY / FONTS / COLOURS
   ========================================================== */

body {
    font-size: 14px;            /* Non-survey UI fallback */
    color: #494949;
    background-color: #f6f6f6;
}

/* Survey content lives inside .outerframe */
.outerframe {
    font-family: Myriad-Pro, Calibri, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.42857143;
}

/* Manual hyphenation for consistent text wrapping */
p,
h1,
h2 {
    -webkit-hyphens: manual !important;
       -moz-hyphens: manual !important;
        -ms-hyphens: manual !important;
            hyphens: manual !important;
}

/* ==========================================================
   LINKS
   ========================================================== */

a,
a:visited,
a:link,
a:active {
    color: #1a5a96;
    text-decoration: underline;
}

a:hover {
    text-decoration: none;
}

/* ==========================================================
   HEADINGS
   ========================================================== */

h1,
.h1 {
    font-size: 24px;
    font-weight: 600;
}


.group-title h1,
.group-title h2,
.group-title h3 {
    margin-top: 0;
}


.group-title {
    text-align: left;
    font-size: 26px;
    margin-top: 10px;
    margin-bottom: 28px;
}

.question-title-container {
    color: white;
    font-size: 20px;
    background-color: #335c85;
}

/* ==========================================================
   NAVIGATION
   ========================================================== */

.navbar-default {
    background-color: #003366;
    border-color: transparent;
}

.navbar-default .navbar-nav > li > a {
    color: #ffffff;
}

.navbar-default .navbar-nav > li > a:hover {
    text-decoration: underline;
}

.navbar-brand {
    padding: 0;
}

ul.inline {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

ul.inline li {
    float: left;
    padding: 2px 10px;
}

ul.inline li a {
    color: white;
    display: block;
    text-align: center;
}

.logo {
    margin-right: 8px;
}

/* ==========================================================
   LAYOUT
   ========================================================== */

#main-col {
    margin: 1em;
}

#outerframeContainer,
#dynamicReloadContainer {
    margin-bottom: 30px;
}

/* Ensure hyphen rules apply to nested markup */
.outerframe div {
    -webkit-hyphens: manual !important;
       -moz-hyphens: manual !important;
        -ms-hyphens: manual !important;
            hyphens: manual !important;
}

/* ==========================================================
   WELCOME / INTRO
   ========================================================== */

#surveydescription,
#surveynametitle,
#welcome-container h1 {
    text-align: left;
    color: #494949;
}

.jumbotron {
    padding: 20px 0;
}

/* ==========================================================
   QUESTION GROUPS
   ========================================================== */

/* Control spacing between groups */
.group-container.space-col {
    margin-top: 0;
    margin-bottom: 0;
}

/*--- Group description colour (removed)
.group-description {
   background-color: #ecf0f1;
    padding: 20px 60px 30px;
}
---*/

/* Group description text */
.group-description {
    font-size: 17px;
    line-height: 1.5;
}


.group-description.well { 
    border: none; /* hide the box*/
    padding: 10px 0;
}

.group-description.row {
    margin-left: 0;
    margin-right: 0;
}

.group-description a:hover {
    text-decoration: none;
}

/* ==========================================================
   QUESTIONS
   ========================================================== */

.question-container {
    margin-bottom: 10px; /* space between questions */
}

.questionvalidcontainer {
    text-align: left;
    background: #f1f1f2;
    padding: 10px 0;
}

.questionvalidcontainer .text-info {
    font-weight: normal;
    margin-left: 20px;
    padding: 8px 0;
}

.answer-container {
    background-color: white;
    padding-top: 1em;
}

.answer-container li {
    margin-bottom: 8px;
}

.answer-container tbody tr th,
.answer-container tbody tr td,
thead tr.ls-heading th,
thead tr.ls-heading td,
table.ls-answers {
    border: 0;
}

tbody tr.ls-odd {
    background-color: #f9f9f9;
}

tbody tr.ls-even {
    background-color: #ecf0f1;
}

.question-text a {
    color: #fcba19;
}

.question-text a:hover {
    text-decoration: none;
}

/* ==========================================================
   FORM CONTROLS
   ========================================================== */

.radio label::before,
.checkbox label::before {
    border: 1px solid #2C3E50 !important;
}

/* ==========================================================
   BUTTONS
   ========================================================== */

.btn-lg,
.btn-group-lg > .btn {
    padding: 6px 12px;
    font-size: 16px;
}

.btn-primary,
.btn-default,
.btn-info,
.btn-primary:visited,
.btn-default:visited {
    color: #ffffff;
    background-color: #003366;
    border-color: #003366;
}

.btn-primary:hover,
.btn-default:hover {
    background-color: #335C85;
}

.btn-info:hover {
    background-color: #337ab7;
}

/* ==========================================================
   PROGRESS
   ========================================================== */

.progress {
    height: 28px;
}

.progress-bar {
    background-color: #003366;
    font-size: 15px;
    line-height: 22px;
}

/* ==========================================================
   ALERTS / MODALS
   ========================================================== */

.alert-info {
    background-color: #d9edf7;
    border-color: #bce8f1;
    color: #31708f;
}

.alert-warning {
    background-color: #003366;
    border-color: #003366;
    color: #ffffff;
    font-weight: 400;
}

.alert-warning p {
    font-weight: 400;
}

.modal-header {
    background-color: #335C85;
    color: white;
}

/* ==========================================================
   FOOTER
   ========================================================== */

/* Respondent-visible footer styling */
#footer {
    background-color: transparent;
    border-top: 2px solid #fcba19;
}

#footerAdminSection {
    background-color: #003366;
}

#footerAdminLinks a {
    color: #ffffff;
}

/* ----------------------------------------------------------
   Admin / Preview Footer (admin users only)
   ----------------------------------------------------------
   - Applies only in admin / preview contexts
   - Safe for respondents (not rendered for them)
---------------------------------------------------------- */

#footer.expanded {
    z-index: 1040;
}

#footer hr {
    background: none repeat scroll 0 0 #4b5e73;
    border: 0;
    height: 1px;
    margin: 10px 0;
}

#footer #footerWrapper {
    width: 100%;
    bottom: 0;
}

#footerAdminSection ul {
    clear: both;
    padding: 10px 0;
}


/* ==========================================================
   MOBILE RESPONSIVE
   ========================================================== */

/* Mobile and tablet handling for dual-scale questions */
@media only screen and (max-width: 760px),
       (max-device-width: 1024px) and (min-device-width: 768px) {

    .dual_scale_separator:after {
        width: 100%;
        min-height: 0;
        height: 1px;
        left: 0;
        margin: 14px 0;
    }
}

/* Desktop and larger tablet layout */
@media (min-width: 768px) {

    ul.inline li + li {
        border-left: 1px solid #4b5e73;
    }

    #footerMediaLinks ul {
        padding-top: 22px;
    }
}

/* TEST CODE 

* {
    outline: 1px solid red;
}

*/