/******************
    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
*/
    /* Error page*/
    #block_error{
        margin:40px 20px 40px 20px;
    }
    
    /*Survey list page*/
    .survey-contact{
        font-size:12px;
    }
    .survey-list{
        margin-bottom:15px;
    }

    /* Welcome page */
    .survey-description{
        margin-bottom:2em;
    }
    
    /*Footer styles*/
    body {
        padding-bottom: 0; /* no bottom padding, footer should be bottom aligned */
        padding-top: 60px;/* now is redefine in JS to fit any title length */
        flex-direction: column; /* article, then footer */
        display: flex; /* flex, to extend the content to full size */
        min-height: 100vh; /* full height, to bottom-align footer */
    }
    body > article {
        flex: 1 0 auto; /* the main article should use as much space as possible */
    }
    body > footer {
        background-color: #000000;
        font-size:90%;
        padding:1em 0 2em 0;
        color: #ffffff;
        margin-bottom:-1px; /* removes 1px gap at bottom of page*/
    }
    
    footer nav ul{
        padding-left:0px;
    }
    footer nav li{
        display:inline;
    }
    footer nav li:not(:first-child)::before {
        content:"| ";
    }
    footer p{
        color:#ffffff;
    }
    footer a{
        color:#ffffff;
    }
    footer a:hover{
        color:#ffffff;
    }
    #footer-logo {
         display:inline;  
     } 
     
    #footer-logo img {
        max-width:330px;
        margin:2em 1em 0 2em;
        vertical-align:top;
    }
    
    #footer-copyright {
        display:inline-block;
        margin:2em 1em 0 2em;
    }
    
    /* Header styles*/
    .navbar-header{
        margin-right:20px;
    }
    .logo-container{
        width:220px;
    }
    #survey-title{
        margin-right:10px;
    }
    #survey-title h1{
        margin-top: 13px;
        font-size:1.4em;
        padding-left:10px;
        line-height:1.3em;
    }
    @media (min-width: 1px) and (max-width: 767px) {
        .navbar-header{
            float:right;
            margin-left:10px;
        }
        #survey-title h1{
            font-size:1.2em;
            margin-left:10px;
        }
        #navbar{
            width:100%;
            text-align:right;
        }
        .ls-answers{
            padding-bottom: 1em;
        }
    }

    /* Question Styles */
    /*Icon padding*/
    .text-info .fa{
        margin-right:4px;
    }
    .asterisk{
        margin-right:4px;
    }
    .checkbox-item label::after{
        color:white;
        text-align:left;
    }
    .button-item .ls-icon{
        display:inline;
    }
    .button-item .ls-icon::before{
        vertical-align:middle;
        margin-right:2px;
    }
    
    /*table rows and hover*/
    tbody>tr:nth-child(even){
        background-color: #fff;
    }
    thead>tr{
        background-color: #fff;
    }
    .table-hover>tbody>tr:hover{
        background-color: #eaf1f7;
    }
    
    .numeric-item input[data-number='1'] {     text-align: left; }
    
    /* Changes hover effect for mobile devices */
    @media only screen and (max-width: 760px), (max-device-width: 1024px) and (min-device-width: 768px){
     table.ls-answers > tbody > tr:hover {
        background-color: #eaf1f7;
    }}

 
    /*increase size of other option in multiple select/radio list */
    .multiple-opt input[type="text"].form-control {
    width: 800px;
    }

    .list-radio input[type="text"].form-control {
    width: 800px;
    }