body {
    font-family: Roboto, sans-serif;
    font-weight: 300;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    width: 100%;
}

a {
    text-decoration: none;
}

section {
    display: flex;
}

.container {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    margin: 0 auto;
}

.row {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: space-around;
}


#sec-links {
    max-width: 100vw;
    height: 50vh;
    color: #fff;
    background-image: url(./images/otbg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    background-attachment: fixed;
    top: 0;
}

#sec-faqs {
    background-color: #fff;
    width: 100vw;
    height: 50vh;
    overflow: auto;
}

section .container {
    padding: 1em 2em;
}

.top-container {
    margin: auto;
}



/* Links Section */

.system-name {
    flex: 0;
    margin: 1em 0;

}

#section-title-one {
    font-size: 2rem;
    margin-top: 2rem;
    padding: 5px 10px;
}

.ops-links-row {
    justify-content: space-evenly !important;
    align-items: center !important;
}

.ops-links {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #fff;
    text-decoration: none;
}

.ops-links:focus {
    outline: none;
}

.ops-link-title {
    font-size: 1.2em;
    padding: 5px;
}

.ops-links:hover {
    color: #bebebe;
}

.ops-links img {
    height: 10rem;
}


/* FAQ SECTION */
.row-faq-title {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    width: 100%;
    flex-grow: 0;
}

.row-faq-items {
    flex-wrap: wrap;
    justify-content: start;
}

.faq-item {
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    margin: 1em;
    border-radius: 5px;
    flex-basis: 25%;
    background-color: #f9f9f9;
    box-shadow: 0 5px 10px 0px rgba(0, 0, 0, 0.2);
    max-height: 15em;
}

.faq-item a {
    color: #000;
}

.faq-item a:hover {
    color: #1b5396;
}

.faq-ul {
    list-style: none;
    padding: 0.5em 0.5em;
    margin: 0;
    font-size: 1.2em;
    /*min-height: 11em;*/
    overflow: auto;
}

.faq-list {
    padding: 0.4em 0.5em;
    font-size: 1em;
    border-bottom: 2px solid #e4e4e4;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row-reverse;
}

.faq-list:hover {
    background-color: #e4e4e4;
}

.faq-new-window {
    height: 0.8em;
    padding-left: 2em;
}

.faq-list-item {
    padding: 10px 20px;
}

.faq-sec-title {
    padding: 0.5em;
    background-color: #1b5396;
    margin: 0;
    border-radius: 5px 5px 0 0;
    color: #fff;
    font-size: 1em;
}

#section-title-two {
    font-size: 1.3em;
    margin: 0px;
    padding: 0.3em 1em;
    color: #2b2b2b;
}

::-webkit-scrollbar {
    width: 8px;
}
  
::-webkit-scrollbar-track {
    box-shadow: none;
    border-radius: 0;
}
   
::-webkit-scrollbar-thumb {
background: #b5b2b2;
border-radius: 105px;
}

::-webkit-scrollbar-thumb:hover {
background: #1b5396; 
}