body {
background-color: #ffffff;
font-family: "Montserrat"
, sans-serif;
}

.logo{
    width: 150px;
}

h2{
    text-align: center;
    font-family: "Montserrat", sans-serif;
    font-weight: 900;
    color: #f5f5f2;
    text-shadow: #f5f5f2 0vw 0vw 0.2vw;
    width: 75%;
    margin-left: auto;
    margin-right: auto;
}

h1{
    text-align: center;
    font-family: "Montserrat", sans-serif;
    font-weight: 900;
    background-color: rgba(245, 245, 242, 0.05);
    width: 75%;
    margin-left: auto;
    margin-right: auto;
}

p{
    text-align: center;
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
    width: 75%;
    background-color: rgba(245, 245, 242, 0.05);
    margin-left: auto;
    margin-right: auto;
}

ul {
  position: fixed;
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  right: 1vw;
}

ul li {
  float: right;
}

ul li a {
display: block;
color: #121212;
text-align: center;
padding: 14px 16px;
text-decoration: none;
width: 162px;
}

ul li a:hover {
 color: #1d2e54;
}

.dropdown{
cursor: pointer;

}

.dropdown.active div.content {
    display: inline !important;
}

.dropdown div.content {
    display: none !important;
    background-color:#325295;
    /* min-width: 200px; */

}

.content a{

    color:#1d2e54;
    text-decoration: none;
    display: block;
    transition: 0.25s ease-in-out;
}

.content a:hover{
    color: #325295;
    background-color: #1d2e54;
}


.dropdown:hover div.content{
    display: block !important;
}

hr{
    width: 75%;
    margin-left: auto;
    margin-right: auto;
    border-color: black;
    color:#1d2e54;
    background-color:#1d2e54;
    height: 0.2vw;
}

form {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: rgba(245, 245, 242, 0.02);
    text-align: center;
    padding: 1.482rem;
    gap: 0.482rem;
}

form input{
    width: 30%;
    text-align: center;
}

form select{
    width: 30%;
    text-align: center;
}

form div{
    width: 30%;
    text-align: center;
}

.slidecontainer {
  width: 100%; /* Width of the outside container */
}

/* The slider itself */
.slider {
  -webkit-appearance: none;  /* Override default CSS styles */
  appearance: none;
  width: 100%; /* Full-width */
  height: 25px; /* Specified height */
  background: #d3d3d3; /* Grey background */
  outline: none; /* Remove outline */
  opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
  -webkit-transition: .2s; /* 0.2 seconds transition on hover */
  transition: opacity .2s;
}

/* Mouse-over effects */
.slider:hover {
  opacity: 1; /* Fully shown on mouse-over */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
.slider::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 25px; /* Set a specific slider handle width */
  height: 25px; /* Slider handle height */
  background: #325295; /*background */
  cursor: pointer; /* Cursor on hover */
}

.slider::-moz-range-thumb {
  width: 25px; /* Set a specific slider handle width */
  height: 25px; /* Slider handle height */
  background:#325295; /*background */
  cursor: pointer; /* Cursor on hover */
}

#infos{
    height: 40px;
}