/******************
    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
*/                                                                           
@font-face {
  font-family: "cafe19";
  font-weight: 100;
  font-style: normal;
  src: url('../files/FONT_CAFE19_2024_MEDIUM_B.woff2') format('woff2');
}
@font-face {
  font-family: "oswald_cus";
  font-weight: 200;
  font-style: normal;
  src: url('../files/Oswald-Regular.ttf');
}
body {
  font-family: oswald_cus !important;
  font-weight: 100;
  font-size: 18px !important;
  color: white;
  background: none;
  line-height: 1.6;
  background-image: url("https://compagnie-synapse.com/wp-content/uploads/2023/09/BG_Events-scaled.jpg") !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  background-size: cover !important;
  background-color: #00000057 !important;
  background-blend-mode: multiply;
  background-position: 50% 50% !important;
}
p {
    line-height: 1.6;
}
/*links*/
a {
    color: #EE7524;
    font-size:inherit !important;
    font-weight:inherit !important;
}
a:hover {
    color: #AC1544;
}
li::marker {
  color: #AC1544;
}

.completed-Content,.completed-heading,body.error-page .error-title p,.error-content, .assessment-heading, .assessments.table {
  color: white !important;
}

.text-info {
    color: #EE7524 !important;
}
.col-centered.col-xl-8 {
  background: rgba(0,0,0,0.34);
  border-radius: 10px;
  padding-top: 25px;
  padding-right: 50px;
  padding-bottom: 0px;
  padding-left: 50px;
  margin-top: 25px;
  margin-bottom:25px;
  box-shadow: 0px 0px 25px #00000070; 
  backdrop-filter: blur(5px);
}
.large-heading, .group-title, .nav-title>h1 {
  color:white !important;
  font-family:cafe19;
  letter-spacing: 5px;
  text-transform: uppercase;
  margin:0;
}
.pre-title {
  color:#AC1544 !important;
  font-family:cafe19;
  letter-spacing: 5px;
  text-transform: uppercase;
  line-height: 1.5;
  font-weight:900 ;
}
#welcome-container {
  max-width: none;
}
.navbar {
    background:rgba(0,0,0,0.34) !important;
    box-shadow: 0px 0px 25px #00000070 !important;
    border-radius: 10px !important;
    backdrop-filter: blur(5px);
    flex-wrap: nowrap !important;
    padding-bottom: 0 !important;
}

.ri-more-fill {
  color: white !important;
}
.alert-warning {
    border: none;
    background-color: #FFD400C9;
    color: #000;
}
.alert-error {
    border: none;
    background-color: #FF4800C9;
    color: #000;
}
.has-error {
  box-shadow: 5px 5px 0 #FFD400C970 !important;
}
.has-warning{
  box-shadow: 5px 5px 0 #FF4800C970 !important;
}
.ls-questionhelp {
  color: #DDDD;
}
.question-valid-container {
  margin: 0 !important;
}
.row {
  margin-bottom: 5px;
  margin-top: 0;
}
.ls-question-message {
  color: #b3b3b3 !important;
}
.ls-privacy-block {
  font-size:18px;
  line-height: 1.6;
  color: #b3b3b3 !important;
}


.form-control, .form-change-lang #lang-select,
.checkbox-item label::before{
  color: white;
  background-color: #00000087;
  border: 0.1px solid #5a5a5a6b;
  border-radius: 10px;
}


.form-control, .form-control:hover, .form-control:active{
    box-shadow:none !important;
}

.form-control:focus {
    box-shadow: 8px 8px 0px #AC1544 !important;
    background: rgba(255, 255, 255, 0.1);
    color:white;
}

/* Buttons */
.btn-primary, .ls-move-btn, .btn-outline-secondary  {
  text-transform: uppercase;
  color: white;
  background-color: #AC1544;
  border:none;
  border-radius: 5px;
  font-size: 20px;
}
.btn-primary:hover, .ls-move-btn:hover, .btn-outline-secondary:hover {
  color: white;
  background-color: #1E1E1E;
  box-shadow: 0px 0px 0px 3px #AC1544AA;
}
.btn-primary:focus, .ls-move-btn:focus,.btn-primary:active, .ls-move-btn:active,
.btn-primary:active:focus, .ls-move-btn:active:focus, .btn-outline-secondary:active, .btn-outline-secondary:active:focus{
  color: #AC1544;
  background-color: #FFFFFFDD;
  box-shadow: 0px 0px 0px 3px #FFFFFFDD;
}
.form-change-lang #language-changer-select, .form-change-lang #lang-select::after  {
    color: white;
}

/* Checkboxes */
.checkbox-item label::before {
    border-color: rgba(255,255,255,0.8) !important;
    border-radius:5px !important;
    height: 20px;
    width: 20px;
}
.checkbox-item label::after {
  margin-left: -22px !important;
}
.checkbox-item input[type=checkbox]:checked + label,
.checkbox-item input[type=checkbox]:checked + label::after {
    background-color: transparent !important;
    color: #AC1544 !important;
}
.checkbox-item {
  margin-bottom: 0px !important;
  margin-top: 10px !important;
}
.checkbox-item label{
  padding-left: 10px;
}
}
.dropdown-menu, .dropdown-toggle {
  background-color: #272727 !important;
}
.dropdown-menu.show {
  background-color: rgba(0,0,0,0.9) !important;
}

.dropdown-header, .nav-link, .dropdown-toggle {
  color: white !important;
}
[class*="btn-outline-"]:hover, 
[class*="btn-outline-"]:active,
[class*="btn-outline-"]:focus{
  color: #1E1E1E !important;
  background-color: #ffffff;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus{
  background-color: #AC1544 !important;
}
.ls-label-question {
  font-size: 20px !important;
  font-weight: normal !important;
  line-height: 22px !important;
}
.text-primary, .control-label, .checkbox-label.control-label {
    color: white !important;
    font-weight: 100 !important;
    font-size: 18px !important;
}

.top-container.container-fluid {
    background:none;
    
}

/* Progress Bar */
.top-container .progress {
  height: 10px;
  box-shadow: 0px 0px 25px #00000070; 
}
.top-content:has(.progress){
    padding-top:3px;
}

.progress {
  position: fixed;
  z-index: 1050;
  width: calc(66.66666667% - 20px);
  background-color: #11111188;
  box-shadow: 0px 0px 25px #00000070; 
}
@media screen and (max-width: 1200px) {
      .progress {
         width: calc(100% - 20px);
      }
}
.progress-bar {
  background: linear-gradient(70deg,#EE7524,#ac1444);
  box-shadow: none;
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover {
  background-color: #AC1544 !important;
}

/* PopUp */
.modal-dialog {
    background:none;
}
.modal-content {
  background-color: #3e3e3ea3;
  border-radius: 10px;
}
.modal-body {
    padding-top: 0px;
    padding-bottom: 0px;
}

/*Remove anonymous warning*/
.ls-privacy-block:first-child{
    display:none;
}

/*Hide group and survey titles*/
.group-title, .survey-name {
    display: none;
}


/*Titles*/
.form-heading {
    font-size: 20px !important;
}

h2,h3 {
    color:#AC1544;
    font-size: 23px;
    text-transform: uppercase;
}

.asterisk {
    font-size:10px;
    color:#AC1544;
}
.ls-answers label, .answer-item label, .control-label {
  font-weight: 600;
  font-size: 1.14rem;
}

/*Drop down menu*/

.troupe {
  background-color: rgba(0,0,0,0.5);
  border-radius: 10px;
  padding: 20px 5px 10px 5px;
  margin-bottom: 25px;
}

input, textarea {
  font-size: 16px !important;
}
.form-select {
  font-size: 16px;
  padding: 15px;
}
select.form-control:focus {
  background: rgb(20, 20, 20) !important;
}
option {
  background: rgb(0, 0, 0, 0.5);
  font-family: oswald;
}

/*Tooltips*/
.tooltip{
    font-family:oswald !important;
}