/******************
    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
*/
:root {
/*
image('./files/myfile.png'
bgimagelogin.jpg
  --bkg-logo:       url('/upload/image/loghi/Logo-rosso@3x-scaled-Trasp-200x200.png');
  --bkg-body:      url('/upload/image/wp/LS_Tramonto_(1024x683)_(148 KB).jpg');
  --bkg-body:      url('/upload/image/wp/LS_Tramonto_mar Nero_(1400x1050)_(137 KB).jpg');
*/
  --bkg-logo:       url('/upload/image/loghi/Logo-rosso@3x-scaled-Trasp-200x200.png');
  --bkg-opacity:    url('/upload/image/tileable/SfondoBiancoOpaco30-100x100.png');
  --bkg-body:      url('/upload/image/wp/bgimagelogin.jpg');
  
  --bkg-group-opacity:    url('/upload/image/tileable/SfondoBiancoOpaco40-100x100.png');
  --bkg-group: url('/upload/image/tileable/T_Old_white_paper_used_by_Rubens_(2632x2632)_(53 KB).jpg');
}
    /*
    #main-col #limesurvey .question-container { background-image: url('/upload/image/wp/LS_Tramonto_mar Nero_(1400x1050)_(137 KB).jpg'); }
    #main-col #limesurvey .question-container { background-image: url('/upload/image/tileable/T_Materica_Quarz_(724x528)_(121 KB).jpg'); }
    */
/*
*/


#surveys-list-container { max-width: 900px !important; margin-top: 50px; margin-left: auto; margin-right: auto ; }
#surveys-list-container .ls-logo  { display: none; }
#surveys-list-container .survey-list-heading h2 { margin: auto; }
#surveys-list-container #surveys-list-jumbotron
    { width: max-content; background-color: lightgreen; padding: 1rem 2rem .5rem; border-radius: 1rem;}
#surveys-list-container #surveys-list-jumbotron .text-center { margin-top: 50px; font-size: 3rem; }
#surveys-list-container .survey-list .surveytitle { border-radius: .7rem !important; border-color: greenyellow; }

.surveys-list-container:after { content: "In caso di difficoltà contattare l'Helpdesk all'URL:  helpdesk.sn-di.it"; 
    background-color: aliceblue; padding: .5rem 1rem; border-radius: .5rem; margin-left: 40px;
    }
.survey-contact { display: none; }

#welcome-container h1 { font-size: 2.2rem; }

    #navbar-toggler .ri-more-fill { font-size: 2rem !important; background: beige; border-radius: 44px; color: navy; border: 1px solid navy; padding: 8px 16px; }
    #navbar-toggler .ri-more-fill:hover { background: #ffffffc4 !important; }
    #navbar-toggler .ri-more-fill::before { content: "Interrompi / Riprendi"; }
    #ls-button-submit { font-size: 2rem; }
    .control-label { margin: auto; border-bottom: 1px dotted navy; }
   

    .save-message, .load-form, .save-form { background: ivory; padding: 16px 28px; border-radius: 16px; }
    #navbar-toggler .ri-more-fill,
    .save-message, .load-form, .save-form {
        background-image: var(--bkg-group-opacity), var(--bkg-group) !important;
        background-repeat: repeat, no-repeat;
        background-size: cover, cover;
        background-attachment: fixed;
        background-position: center, center !important;
        background-position: center, center !important;

        box-shadow: 
            inset -4px -4px 8px 0 rgba(0, 0, 0, 0.3), inset -6px -6px 20px 0 rgba(0, 0, 0, 0.1), 
            inset 4px 4px 8px 0 rgba(255, 255, 255, 0.9), inset 6px 6px 20px 0 rgba(255, 255, 255, 0.7), 
            4px 4px 12px 0 rgba(0, 0, 0, 0.3), 6px 6px 12px 0 rgba(0, 0, 0, 0.1);
        background-color: gray;
}
    .completed-wrapper, .printanswers-container, .register-container { background-color: beige; padding: 8px 24px; border-radius: 16px; width: fit-content; float: right; }
    .url-wrapper-survey-print a { font-size: 28px; }

    body { 
        background-image:   var(--bkg-logo), var(--bkg-opacity), var(--bkg-body);
        background-repeat: no-repeat, repeat, no-repeat;
        background-size: 140px, cover, cover;
        background-attachment: fixed;
        background-position: left, center, center !important;
        background-position: 20px 50px, center, center !important;
    }

    .survey-list-heading .form-heading,
    .survey-contact,
    .captcha-page .form-heading     { background-color: azure; width: fit-content; padding: 6px; border-radius: 8px; }


    .logo-container > img { padding: 0; }
    
    #dynamicReloadContainer .navbar { background-image: linear-gradient(to bottom right, #369514, #ffff08); border-radius: 16px; }
    .navbar-brand { padding: 0px; height: auto; min-height: 30px; }

    #welcome-container,
    #main-dropdown,
    .privacy.row, 
    .group-outer-container.space-col,
    .modal-content { 
        background-image: var(--bkg-group-opacity), var(--bkg-group) !important;
        background-repeat: repeat, no-repeat;
        background-size: cover, cover;
        background-attachment: fixed;
        background-position: center, center !important;
        background-position: center, center !important;

        background-color: ivory;
        border-radius: 16px; padding: 12px; 
        border: 1px solid rgba(0, 0, 0, 0.5);
        box-shadow: 
            inset -4px -4px 8px 0 rgba(0, 0, 0, 0.5), inset -6px -6px 20px 0 rgba(0, 0, 0, 0.3), 
            inset 4px 4px 8px 0 rgba(255, 255, 255, 0.9), inset 6px 6px 20px 0 rgba(255, 255, 255, 0.7),
            4px 4px 12px 0 rgba(0, 0, 0, 0.3), 6px 6px 12px 0 rgba(0, 0, 0, 0.5);
        box-shadow: 
            inset -4px -4px 8px 0 rgba(0, 0, 0, 0.3), inset -6px -6px 20px 0 rgba(0, 0, 0, 0.1), 
            inset 4px 4px 8px 0 rgba(255, 255, 255, 0.9), inset 6px 6px 20px 0 rgba(255, 255, 255, 0.7), 
            4px 4px 12px 0 rgba(0, 0, 0, 0.3), 6px 6px 12px 0 rgba(0, 0, 0, 0.1);
    }
    .question-container { 
/*
        background-image: url('/upload/image/tileable/T_Old_white_paper_used_by_Rubens_(2632x2632)_(53 KB).jpg') !important;
*/
        background-image: var(--bkg-group-opacity), var(--bkg-group) !important;

        margin: 16px 8px !important; padding: 4px 4px 12px 4px !important;
        border-radius: 12px;
    	background: #ffffff5e; color: navy;
        border: 1px solid rgba(0, 0, 0, 0.3);
        box-shadow: 
            inset -4px -4px 8px 0 rgba(0, 0, 0, 0.3), inset -6px -6px 20px 0 rgba(0, 0, 0, 0.1), 
            inset 4px 4px 8px 0 rgba(255, 255, 255, 0.9), inset 6px 6px 20px 0 rgba(255, 255, 255, 0.7), 
            4px 4px 12px 0 rgba(0, 0, 0, 0.3), 6px 6px 12px 0 rgba(0, 0, 0, 0.1);

 
 /*
        box-shadow: inset -1px -1px 9px 3px rgba(0, 0, 0, 0.5), inset -1px -1px 9px 12px rgba(0, 0, 0, 0.2) , 0px 0px 20px 0 rgba(0, 0, 0, 0.7);
        box-shadow: inset -1px -1px 9px 1px rgba(0, 0, 0, 0.41), inset -1px -1px 19px 2px rgba(0, 0, 0, 0.19) , 0px 0px 20px 0 rgba(0, 0, 0, 0.7);

        border-left: 1px solid #00000045; border-top: 1px solid #00000045;
 
   	 box-shadow: inset -1px -1px 7px 2px rgba(0, 0, 0, 0.4), inset -1px -1px 22px 12px rgba(0, 0, 0, 0.6);

        box-shadow: 
            inset -4px -4px 8px 0 rgba(0, 0, 0, 0.5), inset -6px -6px 20px 0 rgba(0, 0, 0, 0.3), 
            inset 4px 4px 8px 0 rgba(255, 255, 255, 0.7), inset 6px 6px 20px 0 rgba(255, 255, 255, 0.5),
            4px 4px 12px 0 rgba(0, 0, 0, 0.2), 6px 6px 12px 0 rgba(0, 0, 0, 0.4);


        box-shadow: 
            inset -3px -3px 12px 6px rgba(0, 0, 0, 0.5), 4px 4px 12px 0 rgba(0, 0, 0, 0.3), 6px 6px 12px 0 rgba(0, 0, 0, 0.2);
, inset -4px -4px 12px 0 rgba(0, 0, 0, 0.4)
*/

    }
    .question-container:hover { 
        border: 1px solid rgba(0, 0, 0, 0.7);
        background: #ffffff54 !important;
/*
        background: #ffffff85 !important;
        box-shadow: inset -1px -1px 9px 3px rgba(0, 0, 0, 0.7), inset -1px -1px 9px 12px rgba(0, 0, 0, 0.3), 0px 0px 20px 0px rgba(0, 0, 0, 0.7);


        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); 
            box-shadow: 
            inset -4px -4px 8px 0 rgba(0, 0, 0, 0.5), inset -6px -6px 20px 0 rgba(0, 0, 0, 0.3),
            inset 4px 4px 8px 0 rgba(255, 255, 255, 0.9), inset 6px 6px 20px 0 rgba(255, 255, 255, 0.7),
            4px 4px 12px 0 rgba(0, 0, 0, 0.3), 6px 6px 12px 0 rgba(0, 0, 0, 0.5);
*/
    }
    .question-title-container { background-color: transparent !important; }	
	.modal-content--- { background: #ffffff5e; }
	.group-title {
        font-weight: 600 !important;
        font-size: 2.85rem !important;
        line-height: unset !important;
        margin-top: .1em !important;
        margin-bottom: 10px;
	    text-align: center;
	}
    #welcome-container { max-width: unset; }
    .survey-name { text-align: center; }
    .ls-label-question {}
    
    .question-container table td, .question-container table th { border: 1px solid #04000021; }

/* ======= Domanda numerica ======= 
    .numeric > .question-title-container { width: 70%; padding: 0 12px; }
    .numeric > .answer-container { width: 30%; padding: 0 12px; margin: 6px 0 0 0; } 
    .numeric div { padding: 0; margin: 0; }

    .numeric .question-valid-container.text-info,
    .numeric .question-help-container.text-info { margin: 0; padding: 0 12px; width: 100%;}
    .numeric .question-valid-container.text-info .ls-question-message,
    .numeric .question-help-container.text-info .ls-question-message { padding: 0 12px; float: left; }
*/
/* ======= Domanda numerica ======= */
    .row.numeric.question-container > .question-title-container { width: 70%; padding: 0 12px; }
    .row.numeric.question-container > .answer-container { width: 30%; padding: 0 12px; margin: 6px 0 0 0; } 
    .row.numeric.question-container div { padding: 0; margin: 0; }

    .row.numeric .question-valid-container.text-info,
    .row.numeric .question-help-container.text-info { margin: 0; padding: 0 12px; width: 100%;}
    .row.numeric .question-valid-container.text-info .ls-question-message,
    .row.numeric .question-help-container.text-info .ls-question-message { padding: 0 12px; float: left; }





@media (max-width:50px) { /* ---->>> Test */
}
    
@media (max-width:50px) { /* ---->>> Test */
    .logo-container > img { padding: 0; }
    .navbar-brand { padding: 5px; }
    .navbar { border-radius: 16px; }
    .question-title-container { padding: .3em 1em; }
    .question-valid-container.bg-primary.text-info, 
    .question-title-container.bg-primary.col-xs-12 { background-color: transparent !important; }
    .bg-primary { background-color: transparent !important;}
    .text-info { color: navy !important; }
    .question-container { padding-top: 16px !important; }
    
    .question-valid-container.text-info,
    .question-help-container.text-info { width: 90%; margin: 12px auto; ; } /*  padding: 4px; border-radius: 12px; border: 1px solid green */

    #main-col #limesurvey .question-title-container { margin-top: 6px; }

/* ======= Domanda numerica ======= */
    .row.numeric.question-container > .question-title-container { width: 70%; padding: 0 12px; }
    .row.numeric.question-container > .answer-container { width: 30%; padding: 0 12px; margin: 6px 0 0 0; } 
    .row.numeric.question-container div { padding: 0; margin: 0; }

    .row.numeric .question-valid-container.text-info,
    .row.numeric .question-help-container.text-info { margin: 0; padding: 0 12px; width: 100%;}
    .row.numeric .question-valid-container.text-info .ls-question-message,
    .row.numeric .question-help-container.text-info .ls-question-message { padding: 0 12px; float: left; }

    #outerframeContainer { width: auto; }

    /*
    @media (min-width: 1200px) { #dynamicReloadContainer { width: 1170px; } }
    @media (min-width: 992px)  { #dynamicReloadContainer { width: 970px; } }
    @media (min-width: 768px)  { #dynamicReloadContainer { width: 750px; } }
    */

    #dynamicReloadContainer { max-width: 1100px; margin: 18px auto 0 auto; }

    #dynamicReloadContainer { 
        background-image: var(--bkg-group-opacity), var(--bkg-group) !important;
/*
        background-image: url('/upload/image/tileable/T_Old_white_paper_used_by_Rubens_(2632x2632)_(53 KB).jpg') !important; 
*/
        background-color: ivory;
        border-radius: 16px; padding: 12px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }
    
    #dynamicReloadContainer .navbar { background-image: linear-gradient(to bottom right, #369514, #ffff08); }

    .progress { border: 1px solid green; margin-top: 12px; border-radius: 6px; }
    
    .table > tbody > tr > td, .table > tbody > tr > th, 
    .table > tfoot > tr > td, .table > tfoot > tr > th, 
    .table > thead > tr > td, .table > thead > tr > th {
          padding: 6px 2px;
          line-height: 1;
          vertical-align: top;
          border: 1px solid #0000805e !important;
    }

    .modal-dialog { 
        background-image: var(--bkg-group-opacity), var(--bkg-group) !important;
/*
        background-image: url('/upload/image/tileable/T_Old_white_paper_used_by_Rubens_(2632x2632)_(53 KB).jpg') !important; 
*/
        background-color: ivory;
        border-radius: 16px; padding: 12px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }

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


    .privacy.row, 
    #welcome-container, 
    .survey-name, 
    .survey-description, 
    .survey-welcome, 
    .row.question-container, 
    .group-title, 
    .ls-label-question {
        margin: 0px !important; padding: 4px !important;	
        border: 1px solid navy; border-radius: 12px;
    	background: ivory; color: navy;
    	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); 
    	/* 
    	*/
    }
    .group-container.space-col > div { margin: 12px !important;}
    .text-danger.fa.fa-asterisk.small { top: -18px; }
    .question-item { padding-top: 4px !important; padding-bottom: 4px; }
    .form-group { margin-bottom: 0; }


    .question-item.answer-item.checkbox-item,
    .answer-item.radio-item { margin-bottom: 0; }
    .ls-label-xs-visibility { margin: 0 auto; }

    table thead th { text-align: center !important; }
    table tbody th { text-align: justify !important; }
    #changes__ace.ace_editor { resize: both; }


@media { /* ---->>> Buoni */

    /* <<<>>> Sfondo, bordi ed ombre dei contenitori pagina e domanda */
        .label.control-label { color: navy;}
    
    /*    .ls-question-message,
    */
    .privacy.row,
    #welcome-container,
        .survey-name,
        .survey-description,
        .survey-welcome,
        .row.question-container,
        .group-title,
        .ls-label-question
        { margin: 12px; padding: 6px; 
            border: 1px solid navy; border-radius: 12px; background: ivory; color: navy;
/*
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
*/        
        }
    #welcome-container > h1,
    #welcome-container > div { box-shadow: none; border: none; }
    .alert.alert-warning { background: antiquewhite; color: red; width: fit-content; margin-left: auto; margin-right: auto; border-radius: 16px; }
    #main-col #limesurvey .question-container .question-text h3 { margin: 0 12px; }
    #main-col #limesurvey .question-title-container { /*width: fit-content;*/ margin-left: auto; margin-right: auto; border-radius: 16px; }

    #main-col #limesurvey .question-container { border: 1px solid #0000805e !important; border-radius: 16px; background-color: #ffffff57; }
    #main-col #limesurvey .question-container { border: 1px solid #0000805e !important; border-radius: 16px; background-color: #ffffff5e; }
    #main-col #limesurvey .question-container { border: 1px solid #0000805e !important; border-radius: 16px; background-color: #0000001c; }
    
    .privacy.row { background-color: transparent; border: none; }
    /*
    .ls-even { background-color: Linen !important; }
    */
    .ls-even { background-color: #f9f9f966 !important; }


    
    .radio-label.control-label,
    .answers-list.radio-list > th,
    .questions-list > th { text-align: justify !important; }
    .answer-item.radio-item { vertical-align: middle; }

    .question-valid-container.bg-primary.text-info,
    .question-title-container.bg-primary.col-xs-12 { background-color: transparent !important;}

    /*    
    */
    /* <<<>>> radio, checkbox e testo "Altro" */
    /*  .form-control   Casella testo lunga */
    /*
    .answer-item.radio-item.form-control::placeholder
        .div.ls-answers.answer-item.ext-item 
        .answer-container.textarea.form-control
    */
    /* <<<>>> radio, checkbox e testo "Altro" */
        .radio-item input[type="radio"] + label::before,
        .checkbox-item input[type="checkbox"]  + label::before,
        .form-control.input-sm { border: 1px solid navy; }
    
    /* <<<>>> testo risposte 
        .label:nth-child(2) {color: navy; border: 0px solid red; }
    */
/*  le domande hanno altezza diversa ?????
    .question-text,
    .ls-label-question {margin: 6px; padding: 6px; font-size: 18px; }
*/
    .outerframecontainer { 
        border: 1px solid navy; border-radius: 12px; background: lightgray; 
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19) !important;
    }

    .ls-label-question {background-color: lightgray; font-size: 18px; }
    .survey-description { font-size: 18px; }
    .group-title { font-size: 24px; }
    .survey-name { font-size: 28px; }
/*
    .privacy.row {text-align: justify;}
*/

    .answers-list.radio-list.ls-even { background-color: lightgray; }

/*
    .answers-list.radio-list.ls-even::hover { background-color: yellow !important; }
    .ls-odd { background-color: lightgray; }

    .tr.ls-even:hover { background-color: yellow !important; }

    .radiogroup.ls-even { background-color: red; }
    .table-hover,
    .radiogroup.ls-even::hover 
    .ls-answers > tbody > 
*/

    .ls-answers.answer-item.text-item .form-control { resize: vertical; }
}


@media (max-width:44px) {
}


@media (max-width:44px) {
}





@media (max-width:50px) { /* ---->>> Test */


#progress-wrapper .ui-widget-header { background-color: yellow; }
#progress-wrapper .ui-widget-content,
#progress-wrapper .ui-widget-header { border: 1px solid red; }

.top-container .progress { border: 1px solid red; background-color: yellow; }

}

@media (max-width:50px) { 
} 
/* fine @media {} */

}