/* Smooth scrolling behavior */
html {
  scroll-behavior: smooth;
}

@font-face {
  font-family: 'Clash Display';
  src: local('fonts/ClashDisplay-Medium.woff2') format('woff2'),
       local('fonts/ClashDisplay-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* Prevents invisible text */
}
@font-face {
  font-family: 'Clash Display Bold';
  src: local('fonts/ClashDisplay-Bold.woff2') format('woff2'),
       local('fonts/ClashDisplay-Bold.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* Prevents invisible text */
}
@font-face {
  font-family: 'Roboto Mono';
  src: local('fonts/Roboto_Mono/RobotoMono-Regular.ttf') format('ttf');
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* Prevents invisible text */
}
@font-face {
  font-family: 'Oxygen';
  src: local('fonts/Oxygen-V300.ttf') format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* Prevents invisible text */
}

/* Simple Bank AI architecture comparison table styles */

/* Glassmorphism Fintech Table Styles */
:root {
    --fintech-blue: #419ce2;
    --glass-white: rgba(255, 255, 255, 0.7);
    --border-light: rgba(255, 255, 255, 0.3);
    --shadow-soft: 0 8px 10px rgba(65, 156, 226, 0.15);
}

.glass-table-wrapper {
    padding: 0.5rem;
    background: linear-gradient(135deg, #f0f4f8 0%, #d9e2ec 100%); /* Soft background for contrast */
    border-radius: 20px;
    font-family: 'Roboto Mono', monospace;
}

.fintech-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--glass-white);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--border-light);
    border-radius: 16px;
    box-shadow: var(--shadow-soft);
    overflow: hidden;
}

/* Header Styling */
.fintech-table thead tr {
    background: rgba(255, 255, 255, 0.5);
}

.fintech-table th {
    padding: 1.25rem;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 1px;
    color: #334e68;
    border-bottom: 1px solid rgba(65, 156, 226, 0.1);
}

.ai-column-header {
    color: var(--fintech-blue) !important;
    background: rgba(65, 156, 226, 0.05);
}

/* Cell Styling */
.fintech-table td {
    padding: 1.25rem;
    font-size: 0.875rem;
    color: #486581;
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}

.ai-highlight-cell {
    font-weight: 700;
    color: var(--fintech-blue);
    background: rgba(65, 156, 226, 0.02);
}

/* Strategic Impact Pills */
.pill {
    display: inline-block;
    padding: 4px 12px;
    background: rgba(65, 156, 226, 0.15);
    color: var(--fintech-blue);
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.75rem;
}

/* --- Responsive Mobile View (Stacks into Cards) --- */
@media screen and (max-width: 768px) {
    .fintech-table, thead, tbody, th, td, tr { display: block; }
    
    .fintech-table thead tr { position: absolute; top: -9999px; left: -9999px; }
    
    .fintech-table tr {
        margin-bottom: 1rem;
        border: 1px solid var(--border-light);
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.9);
    }
    
    .fintech-table td {
        border: none;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        position: relative;
        padding-left: 45%;
        text-align: right;
    }
    
    .fintech-table td:before {
        content: attr(data-label);
        position: absolute;
        left: 1rem;
        width: 40%;
        text-align: left;
        font-weight: 700;
        text-transform: uppercase;
        font-size: 0.65rem;
        color: #627d98;
    }
    
    .ai-highlight-cell { background: rgba(65, 156, 226, 0.1); }
}

/* End of Simple Bank AI architecture comparison table styles */

/* Utility classes for removing user selection and drag behavior */
.no-user-select {
  -webkit-user-select: none;
  user-select: none;
}

.no-user-drag {
  -webkit-user-drag: none;
}

/* Global H1 font: ensure all H1 headings use Clash Display */
h1 {
    font-family: "Clash Display Medium", sans-serif !important;
    font-weight: 500 !important;
}
/* Global H2 font: ensure all H2 headings use Clash Display */
h2 {
    font-family: "Clash Display", sans-serif !important;
    text-align: left !important;
    font-weight: 300 !important;
    margin: 40px 0px 30px 0px !important;
    font-size: 35px !important;
    line-height: 50px !important;
    color: rgb(65, 156, 226)!important;
    max-width: 700px !important;
}
/* Global H3 font: Global font styling for Blue Quotes */
h3 {
    font-family: "Clash Display", sans-serif !important;
    margin-bottom: 40px !important;
}

h4 {
    font-family: "Clash Display Light", sans-serif !important;
    margin-bottom: 40px !important;
    text-align: left !important;
    font-weight: 200 !important;
    margin: 40px 0px 40px 0px !important;
    font-size: 30px !important;
    line-height: 40px !important;
    color: rgb(65, 156, 226) !important;
    max-width: 700px !important;
}
/* Style for paragraph headers */

@media all {
    #h3-paragraph-header {
    font-family:"Clash-Display", sans-serif;
    font-size: 20px;
    line-height: 30px;
    margin: 0px 0px 20px 0px;
    font-weight: 500;
    opacity: 1.00;
 }
}

@media (min-width: 200px) and (max-width: 768px) {
    #h3-paragraph-header {
        margin: 0px 0px 0px 0px;

    }
}



 /*style of the images*/

figure {
  border: thin silver solid;
  display: flex;
  flex-flow: column;
  padding: 5px;
  margin: auto;
}

img {
  max-width: 1200px
  max-height: 800px;
}

figcaption {
  background-color: #ffffff;
  color: rgb(72, 72, 72);
  font-family: "Oxygen Mono", monospace;
  font: italic smaller sans-serif;
  padding: 3px;
  text-align: center;
}

/*style of the tiles on the portfolio page*/
#tile-title {
    font-family: "Clash Display", sans-serif !important;
    text-align: left !important;
    font-weight: 400 !important;
    margin: 10px 0px 20px 0px !important;
    font-size: 28px !important;
    line-height: 40px !important;
    color: rgb(12, 21, 29) !important;
}

/* Global case study tile container */
.case-study-tile {
    background-color: rgb(255, 255, 255);
    padding: 20px 20px 20px 20px;
    border-width: 1px 1px 1px 1px;
    border-style: solid solid solid solid;
    border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
    margin: 0px 0px 20px 0px;
}

/* Case study tile image */
.case-study-tile img {
    width: 100%;
    height: 100%px;
    overflow-y: hidden;
    margin: 0px 0px 20px 0px;
}

/* Case study tile button */
.case-study-tile .btn-cta {
    display: block;
    width: 100%;
    margin: 0px 0px 20px 0px;
    padding: 10px 20px !important;
    box-sizing: border-box;
}

/* Global social network tile */
.social-tile {
    text-align: left;
    padding: 0px 0px 0px 0px;
    align-items: center;
    margin: 10px 10px 10px 0px;
}

.social-tile a {
    display: flex;
    flex-direction: row;
    align-items: left;
}

.social-tile img {
    display: flex;
    float: right;
    margin-left: 0;
    margin-right: 10px;
    width: 75px;
    height: 75px;
    margin-bottom: 15px;
    object-fit: contain;
}

.social-tile p {
    font-family: "Oxygen", sans-serif;
    font-size: 25px;
    font-weight: 300;
    color: rgb(33, 38, 41);
    margin: 25px 0px 0 0px;
}
/* Style the navbar */
#navbar {
  position: sticky;
  top: 0;
  overflow: hidden;
  background-color: #FFFFFF;
}

/* Global site header / navigation */
.site-header,
#brqslm-b {
    display: flex;
    align-items: center;
    gap: 24px;
    font-family: "Roboto Mono", sans-serif;
    font-size: 20px;
    margin: 0;
}

.site-header a,
#brqslm-b a {
    text-decoration: none;
    color: #000000;
    line-height: 20px;
}

/* Normalize header link spacing across all pages. Some pages include
     page-specific <style> blocks that set a negative bottom margin on
     `#brqslm-b a` which shrinks the distance to the top edge. Use
     a strong override so the header spacing is consistent. */
.site-header a,
#brqslm-b a {
    margin: 6px 0 0 0 !important;
    display: inline-block;
    padding: 0 6px;
}

/* Ensure the header sits above sections and isn't visually overlapped by elements
     that use negative margins. Keep it sticky at the top and provide a small
     vertical padding so content below doesn't collide visually. */
.site-header {
    position: sticky;
    top: 0;
    background: #ffffff;
    z-index: 1000;
    padding: 10px 0;
}


/* spacing: apply margin only to non-first links */
.site-header a:not(:first-child),
#brqslm-b a:not(:first-child) {
    margin-left: 10px;
}

/* Underline-on-hover behavior is defined in .underline-on-hover a::after above */

/* sticky menu bar */
.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 20px;
}

html {
  scroll-behavior: smooth;
}

body {
  font-size: 20px;
  text-align: left;
}
/* Header nav underline-on-hover: animated underline, keyboard-focus friendly */
.underline-on-hover a {
    text-decoration: none;
    color: inherit;
    position: relative;
    padding-bottom: 2px;
}
.underline-on-hover a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -4px;
    height: 2px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 180ms ease;
}
.underline-on-hover a:hover::after,
.underline-on-hover a:focus-visible::after {
    transform: scaleX(1);
}

/* Ensure visible focus state for keyboard users */
.underline-on-hover a:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(65,156,226,0.15);
}

/* Slide-up reveal animation — only runs when element becomes visible (gets .is-visible) */
.slide-up {
    opacity: 0;
    transform: translateY(20px);
}
.slide-up.delay-1 { --slide-up-delay: 0.12s; }
.slide-up.delay-2 { --slide-up-delay: 0.30s; }
.slide-up.delay-3 { --slide-up-delay: 0.50s; }

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.slide-up.is-visible {
    animation-name: slideUp;
    animation-duration: 600ms;
    animation-timing-function: cubic-bezier(.2,.8,.2,1);
    animation-fill-mode: forwards;
    animation-delay: var(--slide-up-delay, 0s);
}

@media (prefers-reduced-motion: reduce) {
    .slide-up,
    .slide-up.is-visible {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}

/* Button styles: CTA buttons with hover/focus interaction
   Applies to .btn-cta elements (View Portfolio, View Case Study, Download CV, etc.)
   Default: blue border with blue text on transparent background
   Hover/Focus: filled blue background with white text
 */
.btn-cta {
    font-family: "Roboto Mono", sans-serif;
    font-size: 16px;
    text-align: center;
    color: rgb(65, 156, 226);
    line-height: 20px;
    border: 1px solid rgb(65, 156, 226);
    padding: 10px 20px;
    background-color: transparent;
    transition: all 200ms ease;
    cursor: pointer;
    display: inline-block;
}

.btn-cta:hover,
.btn-cta:focus-visible {
    color: #FFFFFF;
    background-color: rgb(65, 156, 226);
    border-color: rgb(65, 156, 226);
    outline: none;
}

/* Ensure keyboard focus is visible */
.btn-cta:focus-visible {
    box-shadow: 0 0 0 3px rgba(65, 156, 226, 0.3);
}

/* Tag/Pill component - outline style with border and text, no animation
   Used for categorizing content (skills, technologies, tools, categories)
   Multiple color variants available
 */
.tag {
    display: inline-flex;
    align-items: center;
    font-family: "Roboto Mono", sans-serif;
    font-size: 14px;
    padding: 6px 16px;
    border-radius: 15px;
    border: 1px solid;
    background-color: transparent;
    margin-right: 8px;
    margin-bottom: 14px;
    cursor: default;
}

/* Icon placeholder inside a tag. Default-hidden; enabled by adding `has-icon` to the tag */
.tag .tag-icon,
.tag .tag-icon img {
    display: none;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    margin-right: 8px;
    object-fit: contain;
    vertical-align: middle;
}

.tag.has-icon .tag-icon,
.tag.has-icon .tag-icon img {
    display: inline-block;
}

/* Optional helper class when using a background-image instead of an <img> */
.tag .tag-icon--bg {
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    display: none;
}

.tag.has-icon .tag-icon--bg {
    display: inline-block;
}

/* Tag color variants */
.tag-blue {
    color: #419CE2;
    border-color: #419CE2;
}
.tag-black {
    color: #333333;
    border-color: #333333;;
}
.tag-blue-filled {
    color: #ffffff;
    border-color: #419CE2;
    background-color: #419CE2;
}

.tag-red {
    color: #D42A39;
    border-color: #D42A39;
}

.tag-orange {
    color: #F07714;
    border-color: #F07714;
}

.tag-green {
    color: #57CF35;
    border-color: #57CF35;
}

.tag-dark-blue {
    color: #466F96;
    border-color: #466F96;
}

.tag-yellow {
    color: #F9BF08;
    border-color: #F9BF08;
}

/* Hero View Portfolio button */
#brqslm-j {
    transition: all 200ms ease !important;
}

#brqslm-j:hover,
#brqslm-j:focus-visible {
    color: #FFFFFF !important;
    background-color: rgb(65, 156, 226) !important;
    border-color: rgb(65, 156, 226) !important;
    outline: none;
}

#brqslm-j:focus-visible {
    box-shadow: 0 0 0 3px rgba(65, 156, 226, 0.3) !important;
}

/* Hero background is controlled by `#brqslm-f` background-image (no pseudo-element).
   Revert to using a CSS background so the image behaves as before. */

@media all {
    #brqslm-cj {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 80px 0px;
    }
}
@media all {
    #brqslm-cc {
        background-color: rgb(50, 51, 51);
    }
}
@media all {
    #brqslm-cf {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 80px 0px;
        font-weight: 500;
    }
}
@media all {
    #brqslm-cn {
        font-family:"Roboto Mono", sans-serif;
        font-size: 13px;
        font-weight: 200;
        margin: 40px 0px 40px 0px;
        text-align: right;
    }
    #brqslm-cs {
        margin: 40px 0px 0px 0px;
        display: inline;
        width: 100%;
    }
    #brqslm-c {
        background-color: rgb(255, 255, 255);
        margin: 0px 0px 0px 0px;
    }
}
@media all {
    #brqslm-cd,
    #brqslm-ck {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        font-size: 30px;
        color: rgb(65, 156, 226);
        max-width: 750px;
    }
    #brqslm-cd { margin: 80px 0px 80px 0px; }
    #brqslm-ck { margin: 40px 0px 40px 0px; }
}
@media all {
    #brqslm-cm {
        font-family:"Oxygen", sans-serif;
        font-size: 25px;
        font-weight: 200;
        padding: 0px 0px 0px 0px;
        margin: 0px 0px 40px 0px;
    }
}
@media all {
    #brqslm-e a,
    #brqslm-d a,
    #brqslm-b a {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        color: rgb(65, 156, 226);
        margin: 6px 0px 0px 0px;
    }
    #brqslm-e a { margin: 6px 0px 0px 20px; }
}
@media all {
    #brqslm-cg {
        font-family:"Oxygen", sans-serif;
        font-size: 25px;
        font-weight: 200;
        margin: 0px 0px 40px 0px;
    }
}
@media all {
    #brqslm-aw {
        font-family:"Roboto mono", sans-serif, !important;
        font-weight:500 !important;
        color: #232323 !important;
        font-size: 25px;
        text-shadow: 0px 0px 0px;
        margin: 0px 0px 0px -20px;
    }
}
@media all {
    #brqslm-av .navbar-inner {
        background-image: url("none");
        background-position: 0% 0%;
        background-size: auto auto;
        background-repeat: repeat;
        background-attachment: scroll;
        background-clip: border-box;
        box-shadow: 0px 0px 0px 0px;
        border-width: 0px 0px 0px 0px;
        border-radius: 0px 0px 0px 0px;
        background-color: rgba(255, 255, 255, 0.00);
        margin: -42px 0px 20px 0px;
        text-align: left;
    }
}

@media all {
    #brqslm-j {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        margin: 20px 20px 10px 20px;
        text-align: center;
        color: rgb(65, 156, 226);
        line-height: 20px;
        width: 220px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
        height: 20px;
        padding: 10px 0px 10px 0px;
        
    }
}
@media all {
    #brqslm-h {
        font-family:"Oxygen", sans-serif;
        font-size: 25px;
        line-height: 40px;
        text-align: right;
        font-weight: 200;
        color: rgb(227, 245, 255);
        opacity: 0.75;
        margin: 25px 0px 10px 40px;
    }
}

 


@media all {
    #brqslm-cl {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        margin: 3px 0px 80px 0px;
        text-align: center;
        color: rgb(65, 156, 226);
        line-height: 20px;
        float: left;
        padding: 10px 20px 10px 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
    }
}
@media all {
    #brqslm-co {
        font-family:"Oxygen", sans-serif;
        font-size: 25px;
        font-weight: 200;
        color: rgb(65, 156, 226);
        margin: 0px 8px 10px 0px;
    }
    #brqslm-cp {
        font-family:"Oxygen", sans-serif;
        font-size: 25px;
        font-weight: 200;
        color: rgb(20, 65, 123);
        margin: 0px 0px 10px 0px;
    }
    #brqslm-bu {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 80px 0px 30px 0px;
        color: rgb(20, 65, 123);
        font-size: 35px;
        line-height: 50px;
    }
}
@media all {
    #brqslm-m {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 80px 0px 30px 0px !important;
        color: rgb(20, 65, 123);
        font-size: 35px;
        line-height: 50px;
    }
}
@media all {
    #brqslm-l {
        margin: 80px 0px 51px 0px;
    }
}
@media all {
    #brqslm-k,
    #brqslm-at {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
}
@media all {
    #brqslm-ab {
        margin: 0px 0px 60px 0px;
    }
}
@media all {
    #brqslm-bu,
    #brqslm-m,
    #brqslm-q {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 80px 0px 30px 0px;
        font-size: 35px;
        line-height: 50px;
    }
    #brqslm-bu { color: rgb(20, 65, 123); }
}
/* Button styles - combined identical rules */
@media all {
    #brqslm-o,
    #brqslm-s,
    #brqslm-bw {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        margin: 0px 0px 80px 0px;
        text-align: center;
        color: rgb(65, 156, 226);
        line-height: 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
        padding: 10px 20px 10px 20px;
        transition: all 200ms ease;
        cursor: pointer;
        display: inline-block;
    }
    
    #brqslm-bw:hover,
    #brqslm-bw:focus-visible {
        color: #FFFFFF;
        background-color: rgb(65, 156, 226);
        border-color: rgb(65, 156, 226);
        outline: none;
    }
    
    #brqslm-bw:focus-visible {
        box-shadow: 0 0 0 3px rgba(65, 156, 226, 0.3);
    }
}
@media all {
    #brqslm-a {
        margin: 80px 0px 80px 0px;
    }
    #brqslm-u {
        background-color: rgba(168, 169, 183, 0.13);
        margin: 0px 0px 0px 0px;
        background-image: url("none");
        background-position: 0% 0%;
        background-size: auto auto;
        background-repeat: repeat;
        background-attachment: scroll;
        background-clip: border-box;
    }
}
@media all {
    #brqslm-ci a {
        font-family:"Roboto Mono", sans-serif;
        font-weight: 400;
        font-size: 16px;
    }
    #brqslm-ci {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 40px 0px 0px 0px;
        color: rgb(53, 53, 53);
        background-color: rgba(168, 169, 183, 0.13);
        padding: 10px 10px 10px 10px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
    }
}



@media all {
    #brqslm-ff a {
        font-family:"Roboto Mono", sans-serif;
        font-weight: 400;
        font-size: 16px;
    }
    #brqslm-ff {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 20px 0px 0px 0px;
        color: rgb(53, 53, 53);
        background-color: rgba(168, 169, 183, 0.13);
        padding: 10px 10px 10px 10px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
    }
}
@media all {
    #brqslm-fj a {
        font-family:"Roboto Mono", sans-serif;
        font-weight: 400;
        font-size: 16px;
    }
    #brqslm-fj {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 20px 0px 60px 0px;
        color: rgb(53, 53, 53);
        background-color: rgba(168, 169, 183, 0.13);
        padding: 10px 10px 10px 10px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
    }
}
@media all {
    #brqslm-ce {
        margin: 0px 0px 0px 0px;
        border-width: 1px 0 0 0;
        border-style: solid none none none;
        border-color: rgb(208, 208, 208) transparent transparent transparent;
    }
}
@media all {
    #brqslm-n {
        margin: 0px 0px 40px 0px;
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
    }
    #brqslm-t {
        margin: 0px 0px 40px 0px;
        font-family:"Roboto Mono", sans-serif;
        text-align: left;
        font-size: 16px;
        line-height: 24px;
    }
}
@media all {
    #brqslm-bv {
        margin: 0px 0px 40px 0px;
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
    }
}
@media all {
    #brqslm-bh {
        font-family:"Oxygen", sans-serif;
        font-size: 70px;
        margin: 100px 0px 40px 0px;
        font-weight: 500;
        line-height: 75px;
        text-align: center;
        color: rgb(255, 255, 255);
    }
}
@media all {
    #brqslm-bb {
        text-align: center;
        color: rgba(242, 254, 243, 0.00);
    }
    #brqslm-bl {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 80px 0px 80px 0px;
        font-size: 30px;
        color: rgb(65, 156, 226);
        max-width: 700px;
    }
    #brqslm-bn {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 80px 0px;
    }

    @media all {
                #image-container-border {
                    margin: 0px 0px 60px 0px;
                    border-width: 1px 1px 1px 1px;
                    border-style: solid solid solid solid;
                    border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
}
    }

@media (min-width: 480px) and (max-width: 767px) {
                #image-container-border {
                    margin: 0px 0px 40px 0px;
                }
    }

@media all {
                #image-container-border {
                    margin: 0px 0px 60px 0px;
                    border-width: 1px 1px 1px 1px;
                    border-style: solid solid solid solid;
                    border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
}
    }

    @media all {
                #image-container {
                    margin: 0px 0px 60px 0px;
                    
                }
    }

@media (min-width: 480px) and (max-width: 767px) {
                #image-container {
                    margin: 0px 0px 40px 0px;
                  
                }
    }

@media (min-width: 770px) and (max-width: 1024px) {
                #image-container {
                    margin: 0px 0px 40px 0px;
                    
                }
    }
@media (min-width: 1025 px)  {
                #image-container {
                    margin: 0px 0px 40px 0px;
                }
    }
@media all {
                #video-container {
                    margin: 0px 0px 60px 0px;
                    width: 100%;
                    
                    
                }
    }

 @media (min-width: 1024 px) {
                #video-container {
                    margin: 0px 0px 40px 0px;
                    max-width: 1000px !important;
                  
                }
    }

@media (min-width: 770 px) and (max-width: 1024px) {
                #video-container {
                    margin: 0px 0px 40px 0px;
                    max-width: 770px !important;
                  
                }
    }

@media (min-width: 480px) and (max-width: 767px) {
                #video-container {
                    margin: 0px 0px 40px 0px;
                    max-width: 480px !important;
                  
                }
    }
@media (min-width: 0px) and (max-width: 480px) {
                #video-container {
                    margin: 0px 0px 40px 0px;
                    max-width: 400px !important;
                  
                }
    }
    
    #brqslm-ah {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 80px 0px 80px 0px;
        font-size: 30px;
        color: rgb(65, 156, 226);
        max-width: 700px;
    }
    #brqslm-ag {
        font-family:"Oxygen", sans-serif;
        font-size: 30px;
        line-height: 40px;
        margin: 0px 0px 80px 0px;
        color: rgb(65, 156, 226);
        font-weight: 200;
    }
    #brqslm-be {
        background-image: url("../img/briqs-imac-presentation-image_smaller-1.jpeg");
        background-position: 0% 0%;
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-clip: border-box;
        height: 490px;
    }
}
@media all {
    #brqslm-bk {
        color: rgb(242, 254, 243);
        font-size: 20px;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 0px 0px 100px 0px;
        text-align: center;
        line-height: 35px;   }
}
@media all {
    #brqslm-af {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-ax {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-bs {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-ct {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-cu {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-cv {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-cz {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-da {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-dc {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-dd {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-cy {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }

    #brqslm-dg {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-dh {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-dj {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-dk {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-dl {
        font-family:"Oxygen", sans-serif;
        font-size: 30px;
        line-height: 40px;
        margin: 0px 0px 80px 0px;
        color: rgb(65, 156, 226);
        font-weight: 200;
    }
    #brqslm-do {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-ak {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
    }
    #brqslm-x {
        font-family:"Oxygen", sans-serif;
        font-weight: 500;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
    }
    #brqslm-dp {
        font-family:"Oxygen", sans-serif;
        font-size: 30px;
        line-height: 40px;
        margin: 0px 0px 80px 0px;
        color: rgb(65, 156, 226);
        font-weight: 200;
    }
    #brqslm-g {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-dq {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-dr {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-dt {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-du {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-ea {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-es {
        font-family:"Roboto Mono", sans-serif;
        font-size: 13px;
        font-weight: 200;
        margin: 40px 0px 40px 0px;
        text-align: right;
    }
    #user-comment-card {
        margin: 0px 0px 20px 0px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
    }

    #brqslm-eh {
        background-color: rgb(255, 255, 255);
        padding: 20px 20px 10px 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
        margin: 0px 0px 20px 0px;
    }
    #brqslm-ei {
        background-color: rgb(255, 255, 255);
        padding: 20px 20px 10px 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
        margin: 0px 0px 20px 0px;
    }
}
@media all {
    #brqslm-az {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
}
@media all {
    #brqslm-ej {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 0px 0px 30px 0px;
        color: rgb(20, 65, 123);
        font-size: 22px;
        line-height: 35px;
    }
}
@media all {
    #brqslm-ek {
        margin: 0px 0px 40px 0px;
    }
}
@media all {
    #brqslm-eg {
        margin: 0px 0px 40px 0px;
        padding: 0px 0px 0px 0px;
    }
}
@media all {
    #brqslm-ee {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        margin: 0px 0px 20px 0px;
        text-align: center;
        color: rgb(65, 156, 226);
        line-height: 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
        padding: 10px 0px 10px 0px;
    }
}
@media all {
    #brqslm-el {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        margin: 0px 0px 20px 0px;
        text-align: center;
        color: rgb(65, 156, 226);
        line-height: 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
        padding: 10px 0px 10px 0px;
    }
}
@media all {
    #brqslm-ez {
        font-family:"Oxygen", sans-serif;
        font-size: 30px;
        line-height: 40px;
        margin: 0px 0px 80px 0px;
        color: rgb(65, 156, 226);
        font-weight: 200;
    }
    #brqslm-aa {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-fa {
        margin: 0px 0px 60px 0px;
    }
    #brqslm-br {
        font-family:"Oxygen", sans-serif;
        font-size: 30px;
        line-height: 40px;
        margin: 0px 0px 80px 0px;
        color: rgb(65, 156, 226);
        font-weight: 200;
    }
    #brqslm-fd {
        font-family:"Oxygen", sans-serif;
        font-size: 30px;
        line-height: 40px;
        margin: 0px 0px 80px 0px;
        color: rgb(65, 156, 226);
        font-weight: 200;
    }
    #brqslm-bj {
        background-color: rgb(255, 255, 255);
    }
    #brqslm-ba {
        margin: 0px 0px 20px 0px;
    }
    #brqslm-gi .navbar-inner {
        margin: 23px 0px 20px 0px;
        background-color: rgba(255, 255, 255, 0.00);
        background-image: url("none");
        background-position: 0% 0%;
        background-size: auto auto;
        background-repeat: repeat;
        background-attachment: scroll;
        background-clip: border-box;
        box-shadow: 0px 0px 0px 0px;
        border-style: none none none none;
    }
    #brqslm-gl {
        font-family:"Oxygen", sans-serif;
        font-size: 25px;
        color: rgb(0, 0, 0);
        margin: 0px 0px 0px -20px;
    }
    #brqslm-en a {
        font-family:"Roboto Mono", sans-serif;
        color: rgb(65, 156, 226);
        font-size: 16px;
        margin: 6px 0px 0px 0px;
    }
    #brqslm-eo a {
        font-family:"Roboto Mono", sans-serif;
        color: rgb(65, 156, 226);
        font-size: 16px;
        margin: 6px 0px 0px 0px;
    }
    #brqslm-em a {
        font-family:"Roboto Mono", sans-serif;
        color: rgb(65, 156, 226);
        font-size: 16px;
        margin: 6px 0px 0px 20px;
    }
    #brqslm-gj {
        background-color: rgb(35, 35, 35);
        margin: -25px 0px 0px 0px;
    }
}
@media all {
    #brqslm-ed {
        font-family:"Oxygen", sans-serif;
        font-size: 30px;
        line-height: 40px;
        margin: 40px 0px 40px 22px;
        color: rgb(65, 156, 226);
        font-weight: 200;
    }
    #brqslm-ef {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 0px 0px 30px 0px;
        color: rgb(83, 151, 190);
        font-size: 22px;
        line-height: 35px;
        padding: 0px 0px 0px 0px;
    }
}
@media all {
    #brqslm-ay {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
}
@media all {
    #brqslm-bm {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 80px 0px;
    }
    #brqslm-gb {
        font-family:"Oxygen", sans-serif;
        font-weight: 500;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
    }
    #brqslm-fv {
        font-family:"Oxygen", sans-serif;
        font-weight: 500;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
    }
    #brqslm-er {
        background-color: rgba(168, 169, 183, 0.13);
        padding: 0px 20px 60px 20px;
    }
}
@media all {
    #grey-container{
        padding: 40px 20px 20px 20px;
        background-color: rgba(168, 169, 183, 0.13);
        margin: 0px 0px 20px 0px;
    }
}
@media all {
    #brqslm-y {
        margin: 0px 0px 0px 0px;
    }
    #brqslm-ac {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 0px 0px;
    }
    #brqslm-w {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-ae {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    
}
@media all {
    #brqslm-cw {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-db {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-cx {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-df {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-di {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-dm {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-dn {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
    }
    #brqslm-ds {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-eb {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 80px 0px;
    }
    #brqslm-dz {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 80px 0px;
    }
    #brqslm-ev {
        text-align: center;
        color: rgba(242, 254, 243, 0.00);
    }
    #brqslm-et {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 80px 0px 80px 0px;
        font-size: 30px;
        color: rgb(65, 156, 226);
        max-width: 700px;
    }
    #brqslm-fcx {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 80px 0px;
    }
    #brqslm-fcs {
        color: rgb(242, 254, 243);
        font-size: 20px;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 0px 100px 100px 100px;
        text-align: center;
        line-height: 35px;
    }
}
@media all {
    #brqslm-fh {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-fz {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-fcw {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-fci {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-hx {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-hp {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-hf {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
    }
    #brqslm-fc {
        font-family:"Roboto Mono", sans-serif;
        font-size: 13px;
        font-weight: 200;
        margin: 40px 0px 40px 0px;
        text-align: right;
    }
    #brqslm-hu {
        background-color: rgb(255, 255, 255);
        padding: 20px 20px 10px 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
        margin: 0px 0px 20px 0px;
    }
    #brqslm-hb {
        background-color: rgb(255, 255, 255);
        padding: 20px 20px 10px 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
        margin: 0px 0px 20px 0px;
    }
}
@media all {
    #brqslm-if {
        font-family:"Clash Display Medium", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
}
@media all {
    #brqslm-fg {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 0px 0px 30px 0px;
        color: rgb(20, 65, 123);
        font-size: 22px;
        line-height: 35px;
    }
}
@media all {
    #brqslm-ih {
        margin: 0px 0px 40px 0px;
    }
}
@media all {
    #brqslm-fcy {
        margin: 0px 0px 40px 0px;
        padding: 0px 0px 0px 0px;
    }
}
@media all {
    #brqslm-hg {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        margin: 0px 0px 20px 0px;
        text-align: center;
        color: rgb(65, 156, 226);
        line-height: 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
        padding: 10px 0px 10px 0px;
    }
}
@media all {
    #brqslm-gr {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        margin: 0px 0px 20px 0px;
        text-align: center;
        color: rgb(65, 156, 226);
        line-height: 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
        padding: 10px 0px 10px 0px;
    }
}
@media all {
    #brqslm-ew {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-ge {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 30px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-ii {
        background-image: url("../img/MondadoriHeaderImage.jpeg");
        background-position: 0% 0%;
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-clip: border-box;
        height: 490px;
    }
}
@media all {
    #brqslm-ex {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 0px 0px 30px 0px;
        color: rgb(93, 84, 194);
        font-size: 22px;
        line-height: 35px;
        padding: 0px 0px 0px 0px;
    }
}
@media all {
    #brqslm-ep {
        background-color: rgb(255, 255, 255);
    }
    #brqslm-gm .navbar-inner {
        margin: 23px 0px 20px 0px;
        background-color: rgba(255, 255, 255, 0.00);
        background-image: url("none");
        background-position: 0% 0%;
        background-size: auto auto;
        background-repeat: repeat;
        background-attachment: scroll;
        background-clip: border-box;
        box-shadow: 0px 0px 0px 0px;
        border-style: none none none none;
    }
    #brqslm-gt {
        font-family:"Oxygen", sans-serif;
        font-size: 25px;
        color: rgb(0, 0, 0);
        margin: 0px 0px 0px -20px;
    }
    #brqslm-gh a {
        font-family:"Roboto Mono", sans-serif;
        color: rgb(65, 156, 226);
        font-size: 16px;
        margin: 6px 0px 0px 20px;
    }
    #brqslm-fx a {
        font-family:"Roboto Mono", sans-serif;
        color: rgb(65, 156, 226);
        font-size: 16px;
        margin: 6px 0px 0px 0px;
    }
    #brqslm-gs a {
        font-family:"Roboto Mono", sans-serif;
        color: rgb(65, 156, 226);
        font-size: 16px;
        margin: 6px 0px 0px 0px;
    }
    #brqslm-fk {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
    }
    #brqslm-cb {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-fco {
        font-family:"Oxygen", sans-serif;
        font-size: 70px;
        margin: 100px 0px 40px 0px;
        font-weight: 500;
        line-height: 75px;
        text-align: center;
        color: rgb(255, 255, 255);
    }
}
@media all {
    #brqslm-ga {
        background-color: rgb(35, 35, 35);
        margin: -25px -20px 0px -20px;
    }
}
@media all {
    #brqslm-fs {
        font-family:"Oxygen", sans-serif;
        font-size: 30px;
        line-height: 40px;
        margin: 40px 0px 40px 22px;
        color: rgb(65, 156, 226);
        font-weight: 200;
    }
    #brqslm-hq {
        text-align: left;
        font-family:"Roboto Mono", sans-serif;
        font-weight: 200;
        margin: 0px 0px 40px 0px;
        font-size: 16px;
        color: rgb(35, 35, 35);
        max-width: 700px;
    }
    #brqslm-fr {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-fe {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 80px 0px;
    }
    #brqslm-gp {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
}
@media all {
    #brqslm-gc {
        margin: 0px 0px 80px 0px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
    }
    #brqslm-ey {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-gw {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 30px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-cq {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-ca {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        color: rgb(35, 35, 35);
    }
    #brqslm-fp {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-hh {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
    }
    #brqslm-ai {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
    }
    #brqslm-aj {
        font-family:"Oxygen", sans-serif;
        font-size: 30px;
        line-height: 40px;
        margin: 0px 0px 80px 0px;
        color: rgb(65, 156, 226);
        font-weight: 200;
    }
    #brqslm-gn {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 30px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-fi {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-eu {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-he {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-fu {
        background-color: rgba(168, 169, 183, 0.13);
        padding: 0px 20px 60px 20px;
    }
}
@media all {
    #brqslm-al {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-am {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 30px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
}
@media all {
    #brqslm-an {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
}
@media all {
    #brqslm-hm {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-gd {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-fce {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 80px 0px;
    }
    #brqslm-iur {
        font-family:"Oxygen", sans-serif;
        font-size: 70px;
        margin: 100px 20px 40px 20px;
        font-weight: 500;
        line-height: 75px;
        text-align: center;
        color: rgb(255, 255, 255);
    }
}
@media all {
    #brqslm-iuj {
        text-align: center;
        color: rgba(242, 254, 243, 0.00);
    }

/* Blue Text quotes styling */ 

    #brqslm-iub {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 60px 0px 80px 0px;
        font-size: 30px;
        color: rgb(65, 156, 226);
        max-width: 700px;
    }
    #brqslm-is {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 80px 0px;
    }
    
}
@media all {
    #brqslm-iu {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-ghc {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-iua {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-iw {
        font-family:"Oxygen", sans-serif;
        font-weight: 500;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
    }
    #brqslm-hj {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
    }
    #brqslm-ghi {
        font-family:"Roboto Mono", sans-serif;
        font-size: 13px;
        font-weight: 400;
        margin: 40px 0px 40px 0px;
        text-align: right;
    }
    #brqslm-ghe {
        background-color: rgb(255, 255, 255);
        padding: 20px 20px 10px 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
        margin: 0px 0px 20px 0px;
    }
    #brqslm-ho {
        background-color: rgb(255, 255, 255);
        padding: 20px 20px 10px 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
        margin: 0px 0px 20px 0px;
    }
}
@media all {
    #brqslm-iud {
        margin: 0px 0px 40px 0px;
    }
}
@media all {
    #brqslm-gz {
        margin: 0px 0px 40px 0px;
        padding: 0px 0px 0px 0px;
    }
}
@media all {
    #brqslm-gf {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        margin: 0px 0px 20px 0px;
        text-align: center;
        color: rgb(65, 156, 226);
        line-height: 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
        padding: 10px 0px 10px 0px;
    }
}
@media all {
    #brqslm-iut {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        margin: 0px 0px 20px 0px;
        text-align: center;
        color: rgb(65, 156, 226);
        line-height: 20px;
        border-width: 1px 1px 1px 1px;
        border-style: solid solid solid solid;
        border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
        padding: 10px 0px 10px 0px;
    }
}
@media all {
    #text-paragraph {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-iul {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-iup {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
    }
    #brqslm-gg {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 30px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-gq {
        margin: 0px 0px 80px 0px;
        width:100%;
    }
    #brqslm-iuu {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 0px 0px 30px 0px;
        color: rgb(93, 84, 194);
        font-size: 22px;
        line-height: 35px;
        padding: 0px 0px 0px 0px;
    }
}
@media all {
    #brqslm-ha {
        background-color: rgb(255, 255, 255);
    }
    #brqslm-gx .navbar-inner {
        margin: 23px 0px 20px 0px;
        background-color: rgba(255, 255, 255, 0.00);
        background-image: url("none");
        background-position: 0% 0%;
        background-size: auto auto;
        background-repeat: repeat;
        background-attachment: scroll;
        background-clip: border-box;
        box-shadow: 0px 0px 0px 0px;
        border-style: none none none none;
    }
    #brqslm-gu {
        font-family:"Oxygen", sans-serif;
        font-size: 25px;
        color: rgb(0, 0, 0);
        margin: 0px 0px 0px -20px;
    }
    #brqslm-gy a {
        font-family:"Roboto Mono", sans-serif;
        color: rgb(65, 156, 226);
        font-size: 16px;
        margin: 6px 0px 0px 20px;
    }
    #brqslm-gv a {
        font-family:"Roboto Mono", sans-serif;
        color: rgb(65, 156, 226);
        font-size: 16px;
        margin: 6px 0px 0px 0px;
    }
    #brqslm-hc a {
        font-family:"Roboto Mono", sans-serif;
        color: rgb(65, 156, 226);
        font-size: 16px;
        margin: 6px 0px 0px 0px;
    }
    #brqslm-fy {
        background-color: #232323;
        margin: -25px 0px 0px 0px;
    }
}
@media all {
    #brqslm-iuk {
        font-family:"Oxygen", sans-serif;
        font-size: 30px;
        line-height: 40px;
        margin: 40px 0px 40px 22px;
        color: rgb(65, 156, 226);
        font-weight: 200;
    }
    #brqslm-ht {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 0px 0px 30px 0px;
        color: rgb(83, 151, 190);
        font-size: 22px;
        line-height: 35px;
    }
}
@media all {
    #brqslm-iuh {
        background-image: url("../img/AllianzHomeMockUp.jpeg");
        background-position: 0% 0%;
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-clip: border-box;
        height: 490px;
    }
}
@media all {
    #brqslm-hk {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-iuc {
        background-color: rgb(2, 20, 49);
    }
}
@media all {
    #brqslm-fm {
        margin: 40px 0px 40px 0px;
    }
}

@media all {
   #section-container{
        margin: 20px 0px 20px 0px;
    }
}
@media (min-width: 280px) and (max-width: 767px) {
                #section-container {
                    margin: 0px 0px 20px 0px;
                }
    }

@media all {
   #text-container-last{
        margin: 40px 0px 0px 0px;
    }
}
@media all {
    #brqslm-z {
        font-family:"Oxygen", sans-serif;
        font-size: 30px;
        line-height: 40px;
        margin: 0px 0px 80px 0px;
        color: rgb(65, 156, 226);
        font-weight: 200;
    }
    #brqslm-ao {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-ap {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 24px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-bd {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 30px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
    #brqslm-bc {
        text-align: left;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 0px 0px 40px 0px;
        font-size: 30px;
        color: rgb(65, 156, 226);
        max-width: 700px;
    }
    #brqslm-bg {
        margin: 0px 0px 40px 0px;
    }
    #brqslm-bi {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 30px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }

    #brqslm-bp {
        margin: 0px 0px 80px 0px;
    }
    #brqslm-bq {
        font-family:"Oxygen", sans-serif;
        font-size: 20px;
        line-height: 30px;
        margin: 0px 0px 40px 0px;
        font-weight: 500;
        opacity: 1.00;
    }
  
    #brqslm-ius {
        background-color: rgba(168, 169, 183, 0.13);
        padding: 0px 20px 60px 20px;
    }
}
@media all {
    #brqslm-bx {
        font-family:"Roboto Mono", sans-serif;
        font-size: 14px;
        line-height: 24px;
        margin: 0px 0px 60px 0px;
        font-style: italic;
    }
    #brqslm-by {
        font-family:"Roboto Mono", sans-serif;
        font-size: 16px;
        line-height: 24px;
        margin: 0px 0px 30px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-ck {
        margin: 40px 0px 60px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-cm {
        margin: 0px 0px 60px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-cg {
        margin: 0px 0px 60px 0px;
    }
}

@media (min-width: 1200px) {
    #brqslm-j {
        font-size: 18px;
        line-height: 30px;
        margin: 26px 0px 10px 0px;
        padding: 10px 20px 20px 20px;
        float: right;
        width: 220px;
    }
}

@media (min-width: 1200px) {
    #brqslm-cl {
        font-size: 18px;
        line-height: 30px;
        margin: 18px 0px 80px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-l {
        width: 1000px;
        margin: 80px 0px 80px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-o {
        font-size: 18px;
        line-height: 30px;
        margin: 18px 0px 10px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-s {
        font-size: 18px;
        line-height: 30px;
        margin: 18px 0px 10px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-bw {
        font-size: 18px;
        line-height: 30px;
        margin: 18px 0px 40px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-r {
        width: 1000px;
        margin: 80px 0px 80px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-bt {
        width: 1000px;
        margin: 80px 0px 80px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-bh {
        margin: 100px 0px 50px 0px;
        font-size: 80px;
    }
}
@media (min-width: 1400px) {
    #brqslm-bk {
        margin: 0px 450px 100px 450px;
        color: rgb(227, 245, 255);
        text-align: center;
    }
}
@media (min-width: 1200px) {
    #brqslm-ek {
        width: 1000px;
        margin: 0px 0px 20px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-eg {
        width: 1000px;
        margin: 0px 0px 20px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-ee {
        font-size: 18px;
        line-height: 30px;
        margin: 18px 0px 20px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-el {
        font-size: 18px;
        line-height: 30px;
        margin: 18px 0px 20px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-fcs {
        margin: 0px 250px 100px 250px;
        color: rgb(227, 245, 255);
        text-align: center;
    }
}
@media (min-width: 1200px) {
    #brqslm-ih {
        width: 1000px;
        margin: 0px 0px 20px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-fcy {
        width: 1000px;
        margin: 0px 0px 20px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-hg {
        font-size: 18px;
        line-height: 30px;
        margin: 18px 0px 20px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-gr {
        font-size: 18px;
        line-height: 30px;
        margin: 18px 0px 20px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-fco {
        margin: 100px 0px 50px 0px;
        font-size: 80px;
    }
}
@media (min-width: 1200px) {
    #brqslm-iur {
        margin: 100px 0px 50px 0px;
        font-size: 80px;
    }
}

@media (min-width: 1200px) {
    #brqslm-iud {
        width: 1000px;
        margin: 0px 0px 20px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-gz {
        width: 1000px;
        margin: 0px 0px 20px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-gf {
        font-size: 18px;
        line-height: 30px;
        margin: 18px 0px 20px 0px;
    }
}
@media (min-width: 1200px) {
    #brqslm-iut {
        font-size: 18px;
        line-height: 30px;
        margin: 18px 0px 20px 0px;
    }
}
@media (min-width: 768px) and (max-width: 979px) {
    #brqslm-aw {
        margin: 1px 0px 0px -20px;
        color:#000000
    }
}
@media (min-width: 768px) and (max-width: 979px) {
    #brqslm-iuc {
        margin: 0px -20px 0px -20px;
    }
}
@media (max-width: 767px) {
    #brqslm-cj {
        margin: 0px 20px 20px 0px;
    }
    #brqslm-ch {
        margin: -0px 0px 0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-cc {
        margin: 0px -20px 0px -20px;
    }
}
@media (max-width: 767px) {
    #brqslm-cf {
        margin: 0px 20px 60px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-c {
        margin: 0px -20px -20px -20px;
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-cd {
        margin: 60px 20px 60px 20px;
        font-size: 28px;
    }
}
@media (max-width: 767px) {
    #brqslm-cr {
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-e a {
        margin: 8px 0px 0px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-d a {
        margin: 8px 0px 0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-b a {
        margin: 8px 0px 0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-aw {
        margin: 3px 0px 0px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-av .navbar-inner {
        margin: 0px 0px 20px 0px;
    }
}

@media (min-width: 480px) and (max-width: 767px) {
    #brqslm-j {
        margin: 10px 20px 10px 20px;
        float: right;
    
    }
}


@media (max-width: 767px) {
    #brqslm-cl {
        margin: -41px 20px 60px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-bu {
        margin: 80px 0px 30px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-l {
        margin: 40px 0px 80px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-k {
        margin: 0px 20px 81px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-at {
        margin: 0px 20px 81px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-q {
        margin: 80px 0px 30px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-o {
        margin: 0px 20px 10px 0px;
        width: 200px;
    }
}
@media (max-width: 767px) {
    #brqslm-s {
        margin: 0px 20px 10px 20px;
        width: 200px;
    }
}
@media (max-width: 767px) {
    #brqslm-bw {
        margin: 0px 20px 10px 20px;
        width: 200px;
    }
}
@media (max-width: 767px) {
    #brqslm-p {
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-r {
        margin: 40px 0px 80px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-bt {
        margin: 40px 0px 80px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-u {
        margin: 0px -20px 0px -20px;
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-ci {
        margin: 0px 20px 81px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-ff {
        margin: 0px 20px 81px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-fj {
        margin: 0px 20px 81px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-ce {
        margin: 20px 0px 0px 0px;
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-t {
        margin: 0px 20px 40px 20px;
    }
}

@media (max-width: 767px) {
    #brqslm-be {
        margin: 0px -20px 0px -20px;
    }
}
@media (min-width: 480px) and (max-width: 767px) {
    #brqslm-bk {
        padding: 0px 20px 0px 20px;
    }
}
@media (min-width: 768px) and (max-width: 989px) {
    #brqslm-bk {
        padding: 0px 80px 0px 80px;
    }
}
@media (min-width: 990px) and (max-width: 1099px) {
    #brqslm-bk {
        margin: 0px 150px 100px 150px;
        color: rgb(227, 245, 255);
        text-align: center;
    }
}
@media (min-width: 1100px) and (max-width: 1399px) {
    #brqslm-bk {
        margin: 0px 250px 100px 250px;
        color: rgb(227, 245, 255);
        text-align: center;
    }
}
@media (max-width: 767px) {
    #brqslm-eq {
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-ej {
        margin: 20px 0px 20px 0px;
        font-size: 30px;
    }
}
@media (max-width: 767px) {
    #brqslm-ek {
        margin: 20px 0px -0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-eg {
        margin: 20px 0px -0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-ee {
        margin: 40px 20px 40px 0px;
        width: 200px;
        text-align: center;
    }
}
@media (max-width: 767px) {
    #brqslm-el {
        margin: 40px 20px 40px 0px;
        width: 200px;
    }
}
@media (max-width: 767px) {
    #brqslm-gj {
        margin: -25px -20px 0px -20px;
    }
}
@media (max-width: 767px) {
    #brqslm-ef {
        margin: 20px 0px 20px 0px;
        font-size: 30px;
        padding: 0px 0px 0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-er {
        margin: 0px -20px 0px -20px;
        padding: 0px 20px 40px 20px;
    }
}


@media (max-width: 767px) {
    #brqslm-fcs {
        padding: 0px 10px 0px 10px;
    }
}
@media (max-width: 767px) {
    #brqslm-fg {
        margin: 20px 0px 20px 0px;
        font-size: 30px;
    }
}
@media (max-width: 767px) {
    #brqslm-ih {
        margin: 20px 0px -0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-fcy {
        margin: 20px 0px -0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-hg {
        margin: 40px 20px 40px 0px;
        width: 200px;
        text-align: center;
    }
}
@media (max-width: 767px) {
    #brqslm-gr {
        margin: 40px 20px 40px 0px;
        width: 200px;
    }
}
@media (max-width: 767px) {
    #brqslm-ii {
        margin: 0px -20px 0px -20px;
    }
}
@media (max-width: 767px) {
    #brqslm-ex {
        margin: 20px 0px 20px 0px;
        font-size: 30px;
        padding: 0px 0px 0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-ga {
        margin: -25px -20px 0px -20px;
    }
}
@media (max-width: 767px) {
    #brqslm-fu {
        margin: 0px -20px 0px -20px;
        padding: 0px 20px 40px 20px;
    }
}

@media (max-width: 767px) {
    #brqslm-iud {
        margin: 20px 0px -0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-gz {
        margin: 20px 0px -0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-gf {
        margin: 40px 20px 40px 0px;
        width: 200px;
        text-align: center;
    }
}
@media (max-width: 767px) {
    #brqslm-iut {
        margin: 40px 20px 40px 0px;
        width: 200px;
    }
}
@media (max-width: 767px) {
    #brqslm-iuu {
        margin: 20px 0px 20px 0px;
        font-size: 30px;
        padding: 0px 0px 0px 0px;
    }
}
@media (max-width: 767px) {
    #brqslm-fy {
        margin: -25px -20px 0px -20px;
    }
}
@media (max-width: 767px) {
    #brqslm-ht {
        margin: 20px 0px 20px 0px;
        font-size: 30px;
    }
}
@media (max-width: 767px) {
    #brqslm-iuh {
        margin: 0px -20px 0px -20px;
    }
}
@media (max-width: 767px) {
    #brqslm-iuc {
        margin: 0px -20px 0px -20px;
    }
}
@media (max-width: 767px) {
    #text-container {
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 767px) {
    #brqslm-ius {
        margin: 0px -20px 0px -20px;
        padding: 0px 20px 40px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-c {
        margin: 20px -20px 0px -20px;
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-cd {
        font-size: 25px;
        margin: 60px 20px 60px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-cr {
        padding: 0px 0px 0px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-e a {
        margin: 8px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-d a {
        margin: 8px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-b a {
        margin: 8px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-cg {
        line-height: 35px;
    }
}
@media (max-width: 480px) {
    #brqslm-aw {
        margin: 3px 0px 0px 5px;
    }
}
@media (max-width: 480px) {
    #brqslm-av .navbar-inner {
        margin: -53px 0px 20px 0px;
    }
}


@media (max-width: 480px) {
    #brqslm-j {
        margin: 0px 20px 40px 20px;
        float:right;
        width: 150px;
    }
}


@media (max-width: 480px) {
    #brqslm-cl {
        margin: 0px 20px 10px 25px;
    }
}
@media (max-width: 480px) {
    #brqslm-bu {
        margin: 80px 20px 30px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-m {
        margin: 80px 0px 30px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-l {
        margin: 80px 0px 51px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-q {
        margin: 54px 0px 30px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-s {
        margin: 0px 20px 10px 25px;
    }
}
@media (max-width: 480px) {
    #brqslm-bw {
        margin: 0px 20px 10px 25px;
    }
}
@media (max-width: 480px) {
    #brqslm-p {
        margin: 0px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-r {
        margin: 58px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-bt {
        padding: 0px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-u {
        margin: 20px -20px 0px -20px;
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-ce {
        margin: -42px -20px 0px 0px;
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-t {
        margin: 0px 20px 20px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-bv {
        margin: 0px 0px 20px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-bh {
        margin: 81px 0px 40px 0px;
        font-size: 45px;
    }
}
@media (max-width: 480px) {
    #brqslm-bk {
        font-size: 16px;
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-ar {
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-az {
        margin: 0px 0px 40px 0px;
    }
    #brqslm-au {
        padding: 0px 20px 0px 20px;
    }
    #brqslm-eq {
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-ej {
        margin: 80px 20px 30px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-ek {
        margin: 58px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-eg {
        margin: 58px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-ef {
        margin: 54px 0px 30px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-ay {
        margin: 0px 0px 60px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-er {
        margin: 0px -20px 0px -20px;
        padding: 0px 20px 60px 20px;
    }
}
@media (max-width: 480px) {
    #grey-container {
        margin: 0px -20px 60px -20px;
        padding: 40px 20px 20px 20px;
    }
}

@media (max-width: 767px) {
                #grey-container {
                    margin: 0px -20px 80px -20px;
                }
            }

@media (max-width: 480px) {
    #brqslm-fcs {
        font-size: 16px;
        padding: 0px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-fb {
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-if {
        margin: 0px 0px 40px 0px;
    }
    #brqslm-hsd {
        padding: 0px 20px 0px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-fg {
        margin: 80px 20px 30px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-ih {
        margin: 58px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-fcy {
        margin: 58px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-ex {
        margin: 54px 0px 30px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-fco {
        margin: 81px 20px 40px 20px;
        font-size: 45px;
    }
}
@media (max-width: 480px) {
    #brqslm-ga {
        margin: -22px -20px 0px -20px;
    }
}
@media (max-width: 480px) {
    #brqslm-gp {
        margin: 0px 0px 40px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-fu {
        margin: 0px -20px 0px -20px;
        padding: 0px 20px 60px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-am {
        margin: 0px 0px 40px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-an {
        margin: 0px 0px 40px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-iur {
        margin: 81px 20px 40px 20px !important;
        font-size: 45px;
    }
}

/*this is the style for the subtext under heading on project pages */

@media all {
#brqslm-ghf {
        color: rgb(242, 254, 243);
        font-size: 20px;
        font-family:"Oxygen", sans-serif;
        font-weight: 200;
        margin: 0px 100px 100px 100px;
        text-align: center;
        line-height: 35px;
    }
}

@media (max-width: 480px) {
    #brqslm-ghf {
        font-size: 16px;
        padding: 0px 0px 0px 0px !important;
        margin: 0px 20px 50px 20px !important;
    }
}

@media (min-width: 1200px) {
    #brqslm-ghf {
        margin: 0px 250px 100px 250px;
        color: rgb(227, 245, 255);
        text-align: center;
    }
}



@media (max-width: 767px) {
    #brqslm-ghf {
        padding: 0px 10px 0px 10px !important;
        margin: 0px 20px 50px 20px !important;
    }
}

/*this is the style for parent container on project pages */
@media (max-width: 480px) {
    #brqslm-ghh {
        padding: 0px 0px 0px 0px !important;
    }
}
@media (max-width: 480px) {
    #brqslm-iud {
        margin: 58px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-gz {
        margin: 58px 0px 0px 0px;
    }
}
@media (max-width: 480px) {
    #brqslm-iuu {
        margin: 54px 0px 30px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-ht {
        margin: 80px 20px 30px 20px;
    }
}
@media (max-width: 480px) {
    #brqslm-iuc {
        padding: 0px 20px 0px 20px;
        margin: 0px -20px 0px -20px;
    }
}
@media (max-width: 480px) {
    #brqslm-ius {
        margin: 0px -20px 0px -20px;
        padding: 0px 20px 60px 20px;
    }
}@media all {
#brqslm-cj {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
margin: 0px 0px 40px 0px;
}
}
@media (max-width: 767px) {
#brqslm-cj {
margin: 0px 20px 40px 0px;
}
}
@media (max-width: 767px) {
#brqslm-ch {
margin: -0px 0px 0px 0px;
}
}
@media all {
#brqslm-cc {
background-color: rgb(50, 51, 51);
}
}
@media (max-width: 767px) {
#brqslm-cc {
margin: 0px -20px 0px -20px;
}
}
@media all {
#brqslm-cf {
font-family:"Oxygen", sans-serif;
font-size: 20px;
line-height: 24px;
margin: 0px 0px 80px 0px;
font-weight: 500;
}
}
@media (max-width: 767px) {
#brqslm-cf {
margin: 0px 20px 60px 20px;
}
}
@media all {
#brqslm-cn {
font-family:"Roboto Mono", sans-serif;
font-size: 13px;
font-weight: 200;
margin: 40px 0px 40px 0px;
text-align: right;
}
}
@media all {
#brqslm-cs {
margin: 40px 0px 0px 0px;
display: inline;
width: 100%;
}
}
@media all {
#brqslm-c {
background-color: rgb(255, 255, 255);
margin: 0px 0px 0px 0px;
}
}
@media (max-width: 480px) {
#brqslm-c {
margin: 20px -20px 0px -20px;
padding: 0px 20px 0px 20px;
}
}
@media (max-width: 767px) {
#brqslm-c {
margin: 0px -20px -20px -20px;
padding: 0px 20px 0px 20px;
}
}
@media all {
#brqslm-cd {
text-align: left;
font-family:"Oxygen", sans-serif;
font-weight: 200;
margin: 80px 0px 80px 0px;
font-size: 30px;
color: rgb(65, 156, 226);
max-width: 750px;
}
}
@media (max-width: 480px) {
#brqslm-cd {
font-size: 25px;
margin: 60px 20px 60px 20px;
}
}
@media (max-width: 767px) {
#brqslm-cd {
margin: 60px 20px 60px 20px;
font-size: 28px;
}
}
@media (max-width: 480px) {
#brqslm-cr {
padding: 0px 0px 0px 0px;
}
}
@media (max-width: 767px) {
#brqslm-cr {
padding: 0px 20px 0px 0px;
}
}
@media all {
#brqslm-ck {
text-align: left;
font-family:"Oxygen", sans-serif;
font-weight: 200;
margin: 40px 0px 40px 0px;
font-size: 30px;
color: rgb(65, 156, 226);
max-width: 750px;
}
}
@media (max-width: 480px) {
#brqslm-ck  {
font-size: 28px;
}
}
@media (min-width: 1200px) {
#brqslm-ck {
margin: 60px 0px 60px 0px;
}
}
@media all {
#brqslm-cm {
font-family:"Oxygen", sans-serif;
font-size: 25px;
font-weight: 200;
line-height: 35px;
margin: 0px 0px 40px 0px;
}
}
@media (min-width: 1200px) {
#brqslm-cm {
margin: 0px 0px 60px 0px;
}
}
@media all {
#brqslm-e a {
font-family:"Roboto Mono", sans-serif;
color: rgb(65, 156, 226);
font-size: 16px;
margin: 6px 0px 0px 20px;
}
}
@media (max-width: 480px) {
#brqslm-e a {
font-size: 10px;
margin: 6px 0px 0px 0px;
}
}
@media (max-width: 767px) {
#brqslm-e a {
margin: 8px 0px 0px 20px;
}
}
@media all {
#brqslm-d a {
font-size: 16px;
font-family:"Roboto Mono", sans-serif;
color: rgb(65, 156, 226);
margin: 6px 0px 0px 0px;
}
}
@media (max-width: 480px) {
#brqslm-d a {
font-size: 10px;
margin: 6px 0px 0px 0px;
}
}
@media (max-width: 767px) {
#brqslm-d a {
margin: 8px 0px 0px 0px;
}
}

@media all {
#brqslm-cg {
font-family:"Oxygen", sans-serif;
font-size: 25px;
font-weight: 200;
margin: 0px 0px 40px 0px;
}
}
@media (max-width: 480px) {
#brqslm-cg {
line-height: 35px;
}
}
@media (min-width: 1200px) {
#brqslm-cg {
margin: 0px 0px 60px 0px;
}
}
@media all {
#brqslm-aw {
font-family:"Oxygen", sans-serif;
color: rgb(0, 0, 0);
font-size: 25px;
text-shadow: 0px 0px 0px;
margin: 0px 20px 0px 20px;
}
}
@media (max-width: 480px) {
#brqslm-aw {
font-size: 16px;
color: rgb(0, 0, 0);
margin: 0px 20px 0px 20px;
}
}
@media all {
#brqslm-b {
margin: -42px 0px 20px 0px;
text-align: left;
}
}
@media (max-width: 480px) {
#brqslm-b {
margin: -42px 0px 20px 0px;
}
}
@media (max-width: 767px) {
#brqslm-b {
margin: 0px 2 20px 0px;
}
}

@media all {
#brqslm-b a {
text-decoration: none;
font-family:"Roboto Mono", sans-serif;
font-size: 20px;
color: rgb(65, 156, 226);
margin: 6px 30px 0px 10px;
display: inline-block;
}
}
@media (max-width: 480px) {
#brqslm-b a {
font-size: 16px;
margin: 6px 10px 0px 20px;
}
}
@media (min-width: 480px) and (max-width: 767px) {
#brqslm-b a {
font-size: 20px;
margin: 8px 20px 0px 20px;
}
}
@media all {
#brqslm-i {
font-family:"Clash Display", sans-serif;
text-align: right;
font-size: 60px;
margin: 65px 0px 0px 20px;
font-weight: 500;
line-height: 70px;
color: rgb(255, 255, 255);
}
}



@media (min-width: 0px) and (max-width: 480px) {
#brqslm-i {
margin: 40px 0px 0px 20px;
text-align: left;
font-size: 40px;
line-height: 50px;
}
}
@media (min-width: 480px) and (max-width: 767px) {
#brqslm-i {
margin: 50px 20px 0px 20px;
text-align: right;
font-size: 60px;
line-height: 60px;  
}
}
@media (min-width: 1200px) {
#brqslm-i {
margin: 90px 0px 0px 0px;
font-size: 80px;
line-height: 100px;
text-align: right;
}
}

@media all {
#brqslm-j {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
margin: 40px 0px 20px 20px;
text-align: center;
color: rgb(65, 156, 226);
line-height: 20px;
width: 220px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
height: 20px;
padding: 10px 0px 10px 0px;
float: right;
}
}
@media (max-width: 480px) {
#brqslm-j {
margin: 10px 20px 40px 20px;
padding: 15px 5px 10px 5px;
text-align: center;
color: rgb(65, 156, 226);
line-height: 16px;
float: left;
}
}
@media (min-width: 480px) and (max-width: 767px) {
#brqslm-j {
margin: 0px 20px 10px 20px;
float: right;
}
}
@media (min-width: 1200px) {
#brqslm-j {
font-size: 18px;
line-height: 30px;
margin: 50px 0px 10px 0px;
padding: 10px 20px 20px 20px;
float: right;
width: 220px;
}
}
/*Subtext about me on Hero in Home Page*/
@media all {
#brqslm-h {
font-family:"Oxygen", sans-serif;
font-size: 20px;
line-height: 35px;
font-weight: 100;
color: rgb(241, 250, 255);
opacity: 0.75;
margin: 20px 20px 20px 20px;
margin-left: 20px !important;
}
}
@media (max-width: 480px) {
#brqslm-h {
font-size: 18px;
line-height: 32px;
text-align: Left;
margin: 9px 20px 20px 20px;
max-width: 400px;
br {display: none};
}
}
@media (min-width: 480px) and (max-width: 767px) {
#brqslm-h {
margin: 15px 20px 40px 20px;
font-size: 18px;
line-height: 32px;
text-align: right;
br {display: none};

}
}

@media (min-width: 767px) and (max-width: 1200px) {
#brqslm-h {
margin: 15px 0px 0px 0px;
font-size: 22px;
line-height: 32px;
text-align: right;
}
}
@media (min-width: 1200px) {
#brqslm-h {
margin: 27px 0px 0px 0px;
font-size: 25px;
line-height: 40px;
}
}

/*styles for the hero container on the home page */


@media all {
#brqslm-f {
background-color: rgb(35, 35, 35);
margin: 0px -20px 0px -20px !important;
background-image: url("../img/iPhone-6-Isometric-view-Mockup.png");
background-position: 20% 400px;
background-size: 800px auto;
background-repeat: no-repeat;
background-attachment: fixed;
height: 650px;
overflow: hidden;
}
}
@media (min-width: 0px) and (max-width: 479px)  {
#brqslm-f {
height: 520px;
margin: -25px -20px 0px -20px;
background-size: 600px auto;
background-position: 10px 450px !important;
}
}
@media (min-width: 480px) and (max-width: 767px)  {
#brqslm-f {
height: 600px;
margin: -25px -20px 0px -20px;
background-size: 700px auto;
background-position: 10px 440px !important;
}
}
@media (min-width: 1200px) {
#brqslm-f {
height: 650px;
margin: -25px 0px 0px 0px;
background-size: 800px auto;
background-position: 35% 400px !important;
}
}

@media all {
#brqslm-cl {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
margin: 3px 0px 80px 0px;
text-align: center;
color: rgb(65, 156, 226);
line-height: 20px;
float: left;
padding: 10px 20px 10px 20px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
}
}
/* Ensure predictable right alignment when an explicit width is applied.
   The original rule used `float: left`, which causes the element to sit
   on the left and allows inline content to flow around it; when you give
   the element a fixed width it will appear to 'jump' left as the float
   behavior takes effect. The rules below remove the float and use
   auto margins so the element stays aligned to the right for all sizes.
*/
#brqslm-cl.align-right,
#brqslm-cl-right {
    float: none !important;
    display: block !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    text-align: right !important;
}

/* Convenience: apply alignment across all sizes when `#brqslm-cl` itself
   needs to be right-aligned (no extra class). Remove if you prefer class-only.
*/
#brqslm-cl.force-right {
    float: none !important;
    display: block !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    text-align: right !important;
}
@media (max-width: 480px) {
#brqslm-cl {
margin: 0px 20px 10px 25px;
}
}
@media (max-width: 767px) {
#brqslm-cl {
margin: 0px 20px 60px 20px;
}
}
@media (min-width: 1200px) {
#brqslm-cl {
font-size: 18px;
line-height: 30px;
margin: 18px 0px 80px 0px;
}
}
@media all {
#brqslm-co {
font-family:"Oxygen", sans-serif;
font-size: 25px;
font-weight: 200;
color: rgb(65, 156, 226);
margin: 0px 8px 10px 0px;
}
}
@media all {
#brqslm-cp {
font-family:"Oxygen", sans-serif;
font-size: 25px;
font-weight: 200;
color: rgb(96, 203, 178);
margin: 0px 0px 10px 0px;
}
}
@media all {
#brqslm-cv {
font-family:"Oxygen", sans-serif;
font-size: 25px;
font-weight: 200;
color: rgb(93, 84, 194);
margin: 0px 0px 10px 0px;
}
}
@media all {
#brqslm-bu {
text-align: left;
font-family:"Oxygen", sans-serif;
font-weight: 200;
margin: 80px 0px 30px 0px;
color: rgb(20, 65, 123);
font-size: 35px;
line-height: 50px;
}
}
@media (max-width: 480px) {
#brqslm-bu {
margin: 80px 0px 30px 0px;
}
}
@media (max-width: 767px) {
#brqslm-bu {
margin: 80px 0px 30px 0px;
}
}
@media all {
#brqslm-m {
text-align: left;
font-family:"Clash Display", sans-serif;
font-weight: 400;
margin: 80px 0px 30px 0px !important
color: #0088cc;
font-size: 35px;
line-height: 50px;
}
}
@media (max-width: 480px) {
#brqslm-m {
margin: 80px 0px 30px 0px;
}
}
@media (min-width: 768px) and (max-width: 979px) {
#brqslm-m {
margin: 80px 0px 30px 0px;
}
}
@media all {
#brqslm-l {
margin: 80px 0px 51px 0px;
}
}
@media (max-width: 480px) {
#brqslm-l {
margin: 80px 0px 51px 0px;
}
}
@media (max-width: 767px) {
#brqslm-l {
width: 800px;
margin: 40px -20px 80px -20px;
padding: 0px 0px 0px 20px;
}
}
@media (min-width: 1200px) {
#brqslm-l {
width: 1000px;
margin: 80px 0px 80px 0px;
}
}
@media all {
#brqslm-k {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
margin: 0px 0px 60px 0px;
}
}
@media (max-width: 767px) {
#brqslm-k {
margin: 0px 20px 81px 20px;
}
}
@media all {
#brqslm-ab {
margin: 0px 0px 60px 0px;
}
}
@media all {
#brqslm-at {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
margin: 0px 0px 60px 0px;
}
}
@media (max-width: 767px) {
#brqslm-at {
margin: 0px 20px 81px 20px;
}
}
@media all {
#brqslm-fn a {
font-family:"Roboto Mono", sans-serif;
font-weight: 400;
font-size: 16px;
}
}
@media all {
#brqslm-fn {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
margin: 40px 0px 40px 0px;
color: rgb(53, 53, 53);
background-color: rgb(253, 253, 255);
padding: 10px 10px 10px 10px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
}
}
@media (max-width: 767px) {
#brqslm-fn {
margin: 0px 20px 81px 20px;
}
}
@media all {
#brqslm-fq a {
font-family:"Roboto Mono", sans-serif;
font-weight: 400;
font-size: 16px;
}
}
@media all {
#brqslm-fq {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
margin: 40px 0px 40px 0px;
color: rgb(53, 53, 53);
background-color: rgb(253, 253, 255);
padding: 10px 10px 10px 10px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
}
}
@media (max-width: 767px) {
#brqslm-fq {
margin: 0px 20px 81px 20px;
}
}
@media all {
#brqslm-fl a {
font-family:"Roboto Mono", sans-serif;
font-weight: 400;
font-size: 16px;
}
}
@media all {
#brqslm-fl {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
margin: 40px 0px 40px 0px;
color: rgb(53, 53, 53);
background-color: rgb(253, 253, 255);
padding: 10px 10px 10px 10px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
}
}
@media (max-width: 767px) {
#brqslm-fl {
margin: 0px 20px 81px 20px;
}
}
@media all {
#brqslm-fo a {
font-family:"Roboto Mono", sans-serif;
font-weight: 400;
font-size: 16px;
}
}
@media all {
#brqslm-fo {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
margin: 40px 0px 40px 0px;
color: rgb(53, 53, 53);
background-color: rgb(253, 253, 255);
padding: 10px 10px 10px 10px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
}
}
@media (max-width: 767px) {
#brqslm-fo {
margin: 0px 20px 81px 20px;
}
}
@media all {
#brqslm-q {
text-align: left;
font-family:"Oxygen", sans-serif;
font-weight: 200;
margin: 80px 0px 30px 0px;
color: rgb(83, 151, 190);
font-size: 35px;
line-height: 50px;
}
}
@media (max-width: 480px) {
#brqslm-q {
margin: 54px 0px 30px 0px;
}
}
@media (max-width: 767px) {
#brqslm-q {
margin: 80px 0px 30px 0px;
}
}
@media all {
#brqslm-o {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
margin: 0px 0px 80px 0px;
text-align: center;
color: rgb(65, 156, 226);
line-height: 20px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
padding: 10px 0px 10px 0px;
}
}
@media (max-width: 767px) {
#brqslm-o {
margin: 0px 20px 10px 0px;
width: 200px;
}
}
@media (min-width: 1200px) {
#brqslm-o {
font-size: 18px;
line-height: 30px;
margin: 18px 0px 10px 0px;
}
}
@media all {
#brqslm-s {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
margin: 0px 0px 80px 0px;
text-align: center;
color: rgb(65, 156, 226);
line-height: 20px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
padding: 10px 0px 10px 0px;
}
}
@media (max-width: 480px) {
#brqslm-s {
margin: 0px 0px 10px 0px;
}
}
@media (max-width: 767px) {
#brqslm-s {
margin: 0px 0px 10px 0px;
width: 200px;
}
}
@media (min-width: 1200px) {
#brqslm-s {
font-size: 18px;
line-height: 30px;
margin: 18px 0px 10px 0px;
}
}
@media all {
#brqslm-bw {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
margin: 0px 0px 70px 0px;
text-align: center;
color: rgb(65, 156, 226);
line-height: 20px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226) rgb(65, 156, 226);
padding: 10px 0px 10px 0px;
}
}
@media (max-width: 480px) {
#brqslm-bw {
margin: 0px 0px 10px 0px;
}
}
@media (max-width: 767px) {
#brqslm-bw {
margin: 0px 0px 10px 0px;
width: 200px;
}
}
@media (min-width: 1200px) {
#brqslm-bw {
font-size: 18px;
line-height: 30px;
margin: 12px 0px 40px 0px;
}
}
@media (max-width: 480px) {
#brqslm-p {
margin: 20px -20px 0px -20px;
padding: 0px 20px 0px 20px;
}
}
@media (max-width: 767px) {
#brqslm-p {
margin: 20px -20px 0px -20px;
padding: 0px 20px 0px 20px;
}
}
@media all {
#brqslm-r {
margin: 80px 0px 51px 0px;
}
}
@media (max-width: 480px) {
#brqslm-r {
margin: 58px 0px 0px 0px;
}
}
@media (max-width: 767px) {
#brqslm-r {
margin: 40px 0px 80px 0px;
}
}
@media (min-width: 1200px) {
#brqslm-r {
width: 1000px;
margin: 80px 0px 80px 0px;
}
}
@media all {
#brqslm-bt {
margin: 80px 0px 50px 0px;
}
}
@media (max-width: 480px) {
#brqslm-bt {
padding: 0px 0px 0px 0px;
}
}
@media (min-width: 480px) and (max-width: 767px) {
#brqslm-bt {
margin: 40px 0px 80px 0px;
}
}
@media (min-width: 767px) and (max-width: 1200px) {
#brqslm-bt {
width: 1000px;
margin: 80px 0px 80px 0px;
}
}
@media (min-width: 1200px) {
#brqslm-bt {
width: 1000px;
margin: 80px 0px 80px 0px;
}
}
@media all {
#brqslm-a {
margin: 80px 0px 80px 0px;
}
}
@media all {
#brqslm-u {
background-color: rgba(168, 169, 183, 0.13);
margin: -0px 0px 0px 0px;
background-image: url("none");
background-position: 0% 0%;
background-size: auto auto;
background-repeat: repeat;
background-attachment: scroll;
background-clip: border-box;
}
}
@media (max-width: 480px) {
#brqslm-u {
margin: 20px -20px 0px -20px;
padding: 0px 20px 0px 20px;
}
}
@media (max-width: 767px) {
#brqslm-u {
margin: 0px -20px 0px -20px;
padding: 0px 20px 0px 20px;
}
}
@media all {
#brqslm-ci a {
font-family:"Roboto Mono", sans-serif;
font-weight: 400;
font-size: 16px;
}
}
@media all {
#brqslm-ci {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
margin: 40px 0px 0px 0px;
color: rgb(53, 53, 53);
background-color: rgba(168, 169, 183, 0.13);
padding: 10px 10px 10px 10px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
}
}
@media (max-width: 767px) {
#brqslm-ci {
margin: 0px 20px 40px 0px;
}
}
@media all {
#brqslm-ff a {
font-family:"Roboto Mono", sans-serif;
font-weight: 400;
font-size: 16px;
}
}
@media all {
#brqslm-ff {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
margin: 20px 0px 0px 0px;
color: rgb(53, 53, 53);
background-color: rgba(168, 169, 183, 0.13);
padding: 10px 10px 10px 10px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
}
}
@media (max-width: 767px) {
#brqslm-ff {
margin: 0px 20px 40px 20px;
}
}
@media all {
#brqslm-fj a {
font-family:"Roboto Mono", sans-serif;
font-weight: 400;
font-size: 16px;
}
}
@media all {
#brqslm-fj {
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
margin: 20px 0px 60px 0px;
color: rgb(53, 53, 53);
background-color: rgba(168, 169, 183, 0.13);
padding: 10px 10px 10px 10px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208) rgb(208, 208, 208);
}
}
@media (max-width: 767px) {
#brqslm-fj {
margin: 0px 20px 81px 20px;
}
}
@media all {
#brqslm-ce {
margin: 0px 0px 0px 0px;
border-width: 1px 0 0 0;
border-style: solid none none none;
border-color: rgb(208, 208, 208) transparent transparent transparent;
}
}
@media (max-width: 480px) {
#brqslm-ce {
margin: -42px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
}
@media (max-width: 767px) {
#brqslm-ce {
margin: 20px -20px 0px 0px;
padding: 0px 0px 0px 0px;
}
}
@media all {
#brqslm-n {
margin: 0px 0px 40px 0px;
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
}
}
@media all {
#brqslm-t {
margin: 0px 0px 40px 0px;
font-family:"Roboto Mono", sans-serif;
text-align: left;
font-size: 16px;
line-height: 24px;
}
}
@media (max-width: 480px) {
#brqslm-t {
margin: 0px 0px 20px 0px;
}
}
@media (max-width: 767px) {
#brqslm-t {
margin: 0px 0px 40px 0px;
}
}
@media all {
#brqslm-bv {
margin: 0px 0px 40px 0px;
font-family:"Roboto Mono", sans-serif;
font-size: 16px;
line-height: 24px;
}
}
@media (max-width: 480px) {
#brqslm-bv {
margin: 0px 0px 20px 0px;
}
}
@media (max-width: 767px) {
#brqslm-bv {
margin: 0px 0px 40px 0px;
}
}

/* User Thumbnail Component */
.user-thumbnail-container {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 8px;
  margin-bottom: 10px;
}

.user-thumbnail-img {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.user-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.user-name {
  font-family: "Roboto Mono", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: rgb(35, 35, 35);
  margin: 0;
  line-height: 1.4;
}

.user-role {
  font-family: "Roboto Mono", sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: rgb(100, 100, 100);
  margin: 0;
  line-height: 1.4;
}

/* User Thumbnail Grid (3x2) */
.user-thumbnail-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 40px 0;
}

@media (max-width: 767px) {
  .user-thumbnail-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}

@media (max-width: 480px) {
  .user-thumbnail-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}