.hidden { display: none; } .dynamic_dropdown{ margin-left: 1.4rem; margin-bottom: 1rem; } .filter{ margin-left: 1.4rem; } .dynamic{ display: flex; } .dynamic #portInputDiv{ width: 18rem; } .filter select{ width: 18rem; } .button-container { display: flex; justify-content: flex-end; padding: 20px; } .button { margin-top: auto; /* Pushes the submit button to the bottom */ text-align: right; } img{ display: block; } img.plus{ width: 1.5rem; height: 1.5rem; cursor: pointer; margin-bottom:0.1rem; padding: 0; margin-left: 0.2rem; } img.minus{ width: 1.5rem; height: 1.5rem; cursor: pointer; margin: 0; padding: 0; margin-left: 0.2rem; } img.plus:hover{ content: url(../images/add_hover.png); } img.minus:hover{ content: url(../images/minus_hover.png); } .filter_section{ width: 100%; } .add_sec .image{ display: flex; } .options{ display: flex; gap: 1rem; margin-left: 0.7rem; } .check{ background-color: transparent; border: 1px solid #2762b4; border-radius: 0.5rem; margin-bottom: 1rem; display: flex; gap: 1rem; width: 19.5rem; height: 3rem; padding-top: 0.8rem; padding-left: 0.3rem; } .check:hover{ background-color: rgba(255, 255, 255, 0); border: 2px solid #23559b; border-radius: 0.5rem; margin-bottom: 0.8rem; display: flex; gap: 1rem; width: 19.4rem; outline: 1px #2058a5; height: 2.9rem; padding-top: 0.8rem; padding-left: 0.3rem; } .check input[type="checkbox"]{ width: 1rem; height: 1.5rem; } .check input[type="checkbox"]:hover{ width: 0.9rem; height: 1.3rem; cursor: pointer; border: 1px solid rgba(18, 110, 171, 0.805); } .check label{ font-size: 0.9rem; font-weight: normal; } .button{ width: 6rem; height: 2rem; border-radius: 0.4rem; background-color: #235295; border: transparent; margin-left: 1rem; } .button button{ width: 100%; height: 2rem; font-size: 1rem; border-radius: 0.4rem; background-color: #235295; border: transparent; color: white; } .button button:hover{ width: 99%; height: 2rem; border-radius: 0.4rem; font-size: 0.9rem; background-color: #2a69c3; border: transparent; color: rgba(255, 255, 255, 0.879); } .second_sec{ width: 100%; } .filter select:hover{ border: 2px solid rgb(8, 70, 132); } /* ---------CONNECTION PROFILE ---------------------- */ .multiselect { position: relative; display: inline-block; width: 200px; } .selectBox { position: relative; display: inline-block; width: 100%; } .selectBox select { width: 100%; padding: 10px; } .overSelect { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .checkboxes { display: none; border: 1px #dadada solid; position: absolute; background-color: white; width: 100%; z-index: 1; } .checkboxes label { display: block; padding: 10px; } .checkboxes label:hover { background-color: #f1f1f1; }