
.d-none {
    display: none !important;
}
ul li {
    list-style: none;
}

.center {
    display: grid;
    place-items: center;
}

.heading {
    /* background-color: rgb(137, 144, 241); */
    /* background-color:  rgb(217, 233, 183); */
    /* color: rgb(44, 150, 221); */
    display: grid;
    grid-template-columns: 200px 0.5fr 1fr;
    background-color: #4a90e2;
    /* height: 100px;   */
    height: 65px;
    box-shadow: 1px 1px 1px 0px rgba(251, 255, 3, 0.774);
    margin-bottom: 10px;
    position: sticky;
    width: 100%;
    top: 0;
    z-index: 10;
}
.headinglogo-img {
    background: white;  
}
.heading h1 {
    grid-column: 2;
     /* padding: 20px 50px; */
     padding: 11px 50px;
     /* font-size: 50px; */
     font-size: 29px;
     color: white;
     font-weight: bold;

    /* grid-column: 1; 
    grid-row: 1;   
    justify-self: center;  
    align-self: center;     */
}
.exam-navbar {
  grid-column: 3; 
  grid-row: 1;   
  justify-self: center;  
  align-self: end; 
  margin-bottom: 13px;
  margin-right: 10px;
}
.exam-navbar a {
    background-color: #4a90e2;
    color: white;
    font-weight: bold;
    text-decoration: none;
    padding: 10px;
    line-gap-override: 0.5;
}
.exam-navbar a:hover {
    background-color: #a5cffc;
    color: #4a90e2;
}
a.nav-active {
    background-color: #a5cffc;
    color: #4a90e2;
}
.exam-section-A {
    width: 100%;
    height: 100%;
    /* float: left;
    display: flex;
    flex-direction: row; */
}
.exam-selection label {
    /* font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif; */
    color: rgb(49, 3, 19);
}

.exam-selection input {
    /* font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif; */
    color: rgb(7, 1, 1);
}

.exam-prepare-div {
  width: 400px;
  height: 40px;
  float: left;
  margin-left: 20px;
}

.exam-type {
    display: flex;
    justify-content: flex-start;
    gap: 10px;
    flex-wrap: wrap;
}
.dropdown {
    width: 100%;
    padding: 16px 20px;
    border-color: rgb(194, 194, 194);
}
.dropdown:hover {
    border-color: #007bff;
    color: rgb(0, 0, 0);
}
.dropdown:focus {
    color: rgb(0, 0, 0);
    background-color: #fff;
    border-color: #007bff;
}
div {
    margin-bottom: 10px;
}
.display-none {
    display: none;
}
/* .exam-quesiton-paper {
    margin-left: 1%;
    width: 30%;
    display: flex;
    flex-direction: row;

} */
.exam-quesiton-paper  {
    margin-left: 10px;
    width: 100%;
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
    align-content: stretch;
    justify-content: space-evenly;
    align-items: flex-start;
}

.options {
    display: flex;
}

#generate-link {
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-content: space-evenly;
    gap: 5px;
    margin: 10px;
}
.Exam-Link {
    border-left: 4px dashed #4a90e2;
    background-color: rgb(227, 240, 245);
    padding: 10px 20px;;
    /* font-family: Georgia, 'Times New Roman', Times, serif; */
    box-shadow: 1px 1px 10px 1px rgb(43, 41, 49);
}
.Exam-Link p {
    font-size: 12.5px;
    font-weight: bold;
    /* font-family: Verdana, Geneva, Tahoma, sans-serif; */
    color: black;
}
.examlinks {
    background-color: white;
    width: 100%;
    border: 1px solid rgb(250, 244, 244);
    box-shadow: 1px 1px 1px 1px rgb(131, 122, 122);
    padding: 16px 16px;
}
.copylink {
    float: right;
}
.exam-link-heading {
    background-color: #4a90e2;
    padding: 10px;
    font-weight: bold;
    color: white;
    border-radius: 2%;
    box-shadow: 1px 1px 2px 1px rgb(93, 167, 93);
}
.exam-link-heading h2 {
    color: white;
}
#exam-link-copy {
    float: right;
    cursor: pointer;
}
#exam-link-copy:hover {
    text-decoration: underline;
}


footer {
  background-color: #333;
  color: white;
  padding: 10px 0 0 0;
  text-align: center;
}

.remove-question {
    color: rgb(150, 84, 84);
    font-weight: bold;
    float: right;
}
.remove-question:hover {
    text-decoration: underline;
    cursor: pointer;
}

.match-header {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 10px;
}
.match-options-container {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
    text-align: center;
    align-self: center;
    align-content: center;
}
.match-options {
    display: grid;
    grid-template-columns: 2fr 2fr;
    gap: 20px;
    text-align: center;
    align-self: center;
    align-content: center;
}
.match-options-preview {
    background-color: #1076e2;
    padding: 5px;
    box-shadow: 1px 1px 5px 0px rgb(173, 131, 131);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    text-align: center;
    align-self: center;
    align-content: center;
}
.match-options-preview label {
    font-size: 14px;
    color: white;
    font-weight: bold;
}
.match-display {
    display: grid;
    grid-template-columns: repeat(3, 1fr); 
    gap: 10px;
}
.match-display label {
    word-wrap: break-word;  /* Prevents overflow by wrapping long words */
    overflow-wrap: break-word; /* Ensures long words break properly */
    word-break: break-word; /* Optional, ensures long words break if needed */
}
.actionbtns {
    float: right;
    display: flex;
    gap: 5px;
    color: blue;
    text-decoration: underline;
    font-weight: bold;
}

.questions-items input {
    border: none;
    border-bottom: 2px solid black;
    outline: none;         
    background: transparent;  
    font-size: 16px;       
}
.questions-items input:focus {
border-bottom: 2px solid #007BFF;  
}
#titleorgin {
    font-size: 16px;
    color: white;
    font-weight: bold;
}

div[id^="Q_Div"] > label:first-of-type  {
    font-weight: bolder;
    /* margin-left: 22px; */
    margin-bottom: 10px;
    font-size: 22px;
    color: rgba(52, 4, 75, 0.705); 
}

@media (max-width:800px) {
    .heading {
        height: 100px;
    }
    .headinglogo-img {
        background: white;
        height: 100%;
    }
    #generate-link {
        display: grid;
        grid-template-columns: 1fr;
        justify-content: space-evenly;
        gap: 5px;
        margin: 10px;
        padding: 10px;
    }
    .tab-container {
        zoom: 0.6;
    }
}


/*Menu*/
.menu {
      display: flex;
      gap: 10px;
      margin-top: 16px;
      z-index: 100;
    }

    .menu a {
      /* text-decoration: none;
      color: white;
      text-transform: uppercase;
      font-weight: bold;
      padding: 10px;
      line-gap-override: 0.5; */
        background-color: #4a90e2;
        color: white;
        font-weight: bold;
        text-decoration: none;
        padding: 10px;
        line-gap-override: 0.5;
    }
   .menu a.nav-active {
        background-color: #a5cffc;
        color: #4a90e2;
    }

    .menu a:hover {
       /* background-color: white;
      color: blue; */
      text-decoration: none;
       background-color: #a5cffc;
        color: #4a90e2;
    }

    .hamburger {
      display: none;
      flex-direction: column;
      cursor: pointer;
      float: right;
    }

    .hamburger span {
      height: 3px;
      width: 25px;
      background: white;
      margin: 4px 0;
    }

    /* Responsive: Show hamburger and hide menu on small screens */
     @media (max-width: 1200px) {
        .heading {
            zoom: 0.7;
        }
       
      .menu.active {
        display: flex;
      }

      .heading h1  {
        padding: 10px 25px;
      }
    }
     @media (max-width: 768px) {
      .menu {
        display: none;
        position: absolute;
        top: 60px;
        right: 30px;
        /* background-color: #333; */
        background: linear-gradient(to bottom right, #6a11cb, #2575fc);
        flex-direction: column;
        padding: 10px;
        border-radius: 5px;
      }

      .menu.active {
        display: flex;
      }

      .hamburger {
        display: flex;
        flex-direction: column-reverse;
        align-content: stretch;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: flex-end;
      }
      .heading h1  {
        padding: 10px 25px;
      }
    } 


/*Menu*/