﻿/*

  Section: Global Styles
  Purpose: To provide styling to entire website

  Author: Robert De La Vega
  Last updated: January 31st, 2022

*/
:root {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  box-sizing: border-box; }

*, ::after, ::before {
  box-sizing: inherit; }

.text-shadow-none {
  text-shadow: none; }

@media screen and (min-width: 320px) {
  #podium-bubble {
    bottom: 55px !important; }
  #podium-prompt {
    bottom: 125px !important; }
  .desktop-view, .desktop-footer-992, .tablet-view-careers, .nonmobile-docs, .refer-friend-view {
    display: none; }
  .mobile-font {
    font-size: .45rem !important; }
  .cookie-btn {
    background-color: #000 !important;
    color: white; }
  .margin-top-5 {
    margin-top: 0; }
  .footerboxshadowcookies {
    box-shadow: 0 0 0 1px #000000 !important;
    height: 95px;
    margin-bottom: 50px; }
  .head-spacing {
    padding-top: 25% !important; }
  .mobile-view-careers, .mobileview-docs, .mobile-view {
    display: block; }
  .ma-blue {
    color: #2554a1 !important; }
  .ma-blue-bg {
    background-color: #2554a1; }
  .ma-blue-border {
    border-color: #2554a1 !important; }
  .btn-ma-blue {
    background-color: #2554a1 !important;
    border-color: #2554a1 !important;
    color: white !important; }
  .btn-ma-red {
    background-color: #ed1c24 !important;
    border-color: #ed1c24 !important;
    color: white !important; }
  .ma-red {
    color: #ed1c24; }
  .bg-ma-orange {
    background-color: #FF5000 !important;
    border-color: white !important; }
  .position-inherit {
    position: inherit !important; }
  .list-style-none {
    list-style: none; }
  .padding-l-15px {
    padding-left: 15px !important; }
  .padding-r-15px {
    padding-right: 15px !important; }
  .alarm-chat-bg {
    background-color: white;
    background-image: url(/images/alarm-chat/images/alarm-chat-intro-image.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 4% 2%;
    margin-top: 11%;
    position: inherit !important; }
  #default-selections {
    bottom: 0;
    transition: all 1s ease; }
  #default-selections.is-active {
    bottom: -6%;
    transition: all 1s ease; }
  #mobile-selections {
    bottom: -10%;
    transition: all 1s ease; }
  #mobile-selections.is-active {
    bottom: 0;
    transition: all 1s ease; }
  #servicesLinks, #productsLinks {
    background-color: black;
    padding-bottom: 5%;
    display: grid;
    grid-template-columns: auto;
    margin: 0;
    width: 100%;
    position: fixed;
    padding-top: 25px;
    bottom: 5px;
    top: 100%;
    opacity: 0;
    list-style: none;
    text-align: center;
    transition: all 1s ease; }
    #servicesLinks > li > a, #productsLinks > li > a {
      color: white;
      margin-left: -15px; }
  #servicesLinks.is-active, #productsLinks.is-active {
    top: 30%;
    opacity: .95;
    transition: all 1s ease; }
  .services-menu {
    padding-bottom: 15% !important; }
  .nav-container {
    position: fixed;
    width: 100%;
    background-color: white;
    padding-bottom: 10px; }
  .nav-menu {
    background-color: black;
    padding-bottom: 5%;
    display: grid;
    grid-template-columns: auto;
    margin: 0;
    width: 100%;
    position: fixed;
    padding-top: 25px;
    bottom: 5px;
    top: 100%;
    opacity: 0;
    list-style: none;
    text-align: center;
    transition: all 1s ease; }
    .nav-menu > li > a {
      color: white;
      margin-left: -15px; }
  #navbar-logo {
    justify-self: start;
    margin: 5px 15px; }
  .nav-menu.active {
    top: 50%;
    opacity: .95;
    transition: all 1s ease; }
  .nav-links {
    text-align: center;
    line-height: 60px;
    width: 100%;
    display: table;
    color: black;
    text-decoration: none; }
    .nav-links :hover {
      background-color: darkgray;
      color: white;
      transition: all 0.4s ease-out;
      width: 100%; }
  .nav-bar {
    width: 100%;
    display: grid;
    grid-template-columns: 0.2fr auto 1fr;
    align-items: center;
    height: 80px;
    max-width: 1720px;
    margin: 0 auto; }
  #mobile-menu {
    position: absolute;
    top: 20%;
    right: 5%;
    transform: translate(5%, 20%); }
  #mobile-links {
    display: block;
    text-align: center;
    color: white;
    font-weight: bold;
    background-color: #000; }
  .menu-toggle .bar {
    display: block;
    cursor: pointer;
    width: 5px;
    height: 5px;
    margin: 5px auto;
    transition: all 0.3s ease-in-out;
    background-color: black;
    border-radius: 50%; }
  #mobile-menu.is-active .bar:nth-child(1) {
    transform: translateY(10px) rotate(45deg);
    width: 35px;
    height: 4px;
    border-radius: 0; }
  #mobile-menu.is-active .bar:nth-child(2) {
    opacity: 0;
    border-radius: 0; }
  #mobile-menu.is-active .bar:nth-child(3) {
    transform: translateY(-10px) rotate(-45deg);
    width: 35px;
    height: 4px;
    border-radius: 0; }
  .dropdown-content {
    display: none;
    position: absolute;
    border: 1px solid black;
    text-align: center;
    width: 125px;
    margin: 0;
    background-color: white; }
  .dropdown > .dropdown-content > ul {
    padding-left: 0; }
    .dropdown > .dropdown-content > ul > li {
      list-style: none;
      height: 35px;
      padding-top: 5px; }
  .dropdown > .dropdown-content > ul > li:first-child {
    padding-bottom: 10px; }
  .dropdown-content a {
    color: #2554a1;
    text-decoration: none; }
  .dropdown-content.active {
    display: block;
    opacity: .95; }
  .hero-container {
    background-color: #343a40;
    padding: 4% 2%;
    padding-top: 25%; }
  .lead-form {
    display: flex;
    flex-flow: column nowrap;
    align-content: space-around; }
  .form-heading > h1 {
    font-size: 45px; }
  .checkbox {
    text-shadow: 1px 1px 1px black;
    margin-left: 20px;
    font-size: 0.85em; }
    .checkbox > p {
      display: flex;
      flex-flow: row nowrap; }
      .checkbox > p > input {
        width: 25px;
        height: 30px;
        margin-left: -20px;
        margin-right: 2%; }
  #hero {
    padding-top: 18%; }
  .faded-grey-bg {
    background-image: url(/images/HeroImgs/BackDrops/backdrop.png);
    background-size: cover;
    background-position: center; }
  .index-products {
    background-image: url(/images/HeroImgs/BackDrops/mountain_bg.png);
    background-size: cover;
    text-align: center;
    color: white; }
  .flexbox-row {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-around; }
  .flexbox-col {
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
    justify-content: space-between; }
  .index-products > .container > .commercial-half > a, .index-products > .container > .residential-half > a {
    color: white;
    text-decoration: none; }
  .index-awards {
    display: grid;
    grid-template-columns: repeat(2, 1fr); }
  .awards-title, .index-awards > hr, .awards-section, .awards-description {
    grid-column: 1 / 3;
    justify-self: center;
    align-items: center;
    padding-bottom: 5%; }
  .awards-left, .awards-right {
    display: grid;
    grid-template-columns: repeat(2, 1fr); }
  .awards {
    grid-column: 1 / 3;
    display: grid;
    grid-template-columns: repeat(2, 1fr); }
    .awards > .approved {
      grid-column: 1 / 3;
      justify-self: center;
      align-items: center;
      padding-bottom: 5%; }
      .awards > .approved > img {
        width: 200px; }
    .awards > .bbb {
      grid-column: 1 / 3;
      justify-self: center;
      align-items: center;
      padding-bottom: 5%; }
      .awards > .bbb > img {
        width: 125px; }
    .awards > .ma-1952 {
      grid-column: 1 / 3;
      justify-self: center;
      align-items: center;
      padding-bottom: 5%; }
      .awards > .ma-1952 > img {
        width: 100%; }
    .awards > .best {
      grid-column: 1 / 3;
      justify-self: center;
      align-items: center;
      padding-bottom: 5%; }
      .awards > .best > img {
        width: 150px; }
    .awards > .ranked {
      grid-column: 1 / 3;
      justify-self: center;
      align-items: center;
      padding-bottom: 5%; }
      .awards > .ranked > img {
        width: 175px; }
    .awards > .security {
      grid-column: 1 / 3;
      justify-self: center;
      align-items: center;
      padding-bottom: 5%; }
      .awards > .security > img {
        width: 100%; }
  .grid-col-3 {
    display: grid;
    grid-template-rows: auto;
    justify-content: center;
    gap: 25px; }
    .grid-col-3 > .top, .grid-col-3 > .bottom {
      grid-column: 1 / 3;
      display: flex;
      flex-flow: row nowrap;
      align-content: center; }
      .grid-col-3 > .top > .img, .grid-col-3 > .bottom > .img {
        width: 100%;
        height: auto;
        text-align: center; }
        .grid-col-3 > .top > .img > a, .grid-col-3 > .bottom > .img > a {
          text-decoration: none;
          color: black;
          font-size: large; }
          .grid-col-3 > .top > .img > a:hover, .grid-col-3 > .bottom > .img > a:hover {
            color: #2554a1; }
          .grid-col-3 > .top > .img > a > p, .grid-col-3 > .bottom > .img > a > p {
            text-transform: uppercase; }
  .product-title {
    text-align: center;
    font-weight: bolder; }
  .flex-cards-container {
    display: flex;
    flex-flow: column;
    justify-content: space-evenly;
    gap: 10px; }
  .flex-cards {
    align-self: center; }
  .card-body {
    height: 225px !important; }
  .careers-nav-mobile {
    border: 1px solid blue;
    background-color: white;
    color: white; }
    .careers-nav-mobile > ul {
      list-style: none;
      padding-left: 0;
      margin-bottom: 0;
      font-size: smaller; }
      .careers-nav-mobile > ul > li {
        border: 1px solid white;
        padding-right: 3%;
        padding-left: 3%;
        padding-top: 3%;
        padding-bottom: 3%;
        background: linear-gradient(90deg, #2554a1 50%, #ed1c24 100%);
        border-radius: 10px; }
        .careers-nav-mobile > ul > li.active {
          border: 3px solid #2554a1; }
  .careers-opportunities, .careers-history, .careers-benefits, .careers-brands, .careers-veterans {
    display: none; }
  .card-height {
    height: 375px; }
  footer {
    background-image: url(/images/HeroImgs/BackDrops/mountain_bg.png);
    background-size: cover;
    text-align: center;
    color: white;
    display: flex;
    flex-flow: column nowrap; }
  .footer-styles {
    display: flex;
    flex-flow: row nowrap;
    justify-content: left; }
    .footer-styles > ul {
      list-style: none;
      font-size: large;
      padding-left: 0;
      flex-grow: 1; }
      .footer-styles > ul > li > a {
        list-style: none;
        color: white;
        text-decoration: none; }
  .can-we-help > ul {
    list-style: none;
    font-size: large;
    padding-left: 0;
    flex-grow: 1; }
    .can-we-help > ul > li > a {
      list-style: none;
      color: white;
      text-decoration: none; }
  .social {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-around; }
    .social > a > i {
      font-size: 50px; }
  .desktop-footer, .desktop-footer-email {
    display: none; } }

@media screen and (min-width: 475px) {
  .hero-container {
    padding-top: 18%; }
  #hero {
    padding-top: 12%; }
  .awards {
    /*        > .approved,*/ }
    .awards > .ma-1952 {
      grid-column: 1 / 3; }
    .awards > .bbb, .awards > .best {
      grid-column: 1 / 3; }
  .career-height-img {
    height: 350px; }
  .head-spacing {
    padding-top: 15% !important; }
  .mobile-font {
    font-size: .85rem !important; } }

@media screen and (min-width: 768px) {
  .mobile-view-careers {
    display: none; }
  .tablet-view-careers, .refer-friend-view {
    display: block; }
  .hero-container {
    padding-top: 15%; }
  #hero {
    padding-top: 9%; }
  .grid-col-3 {
    grid-template-columns: repeat(3, 1fr); }
  .grid-col-3 > .top, .grid-col-3 > .bottom {
    grid-column: 1 / 4; }
  .career-height-img {
    height: 450px; }
  .card-height {
    height: 380px; }
  .desktop-footer {
    display: block; } }

@media screen and (min-width: 993px) {
  .mobile-view, .tablet-view-careers {
    display: none; }
  .desktop-view {
    display: block; }
  body {
    background-color: white; }
  .alarm-chat-bg {
    position: relative !important; }
  .margin-top-5 {
    margin-top: 3rem !important; }
  .navmenu {
    list-style: none;
    display: flex;
    justify-content: space-around;
    padding: 1%;
    align-items: center; }
    .navmenu > li > a {
      text-decoration: none;
      color: darkgray; }
      .navmenu > li > a :hover {
        color: #2554a1; }
  nav {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030; }
  .navmenu > li:nth-child(7) > a, .navmenu > li:nth-child(8) > a {
    color: #2554a1;
    font-weight: bolder; }
  .dropdown-content > ul > li:hover {
    background-color: #2554a1; }
    .dropdown-content > ul > li:hover a {
      color: white; }
  .dropdown:hover > .dropdown-content {
    display: block; }
  .hero-container {
    background-color: white;
    background-image: url(/images/HeroImgs/Woman-baby-front-test-new.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 4% 2%;
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    margin-top: 11%; }
  .lead-form {
    grid-column: 6 / 9;
    background-color: #595959;
    padding: 6% 5%;
    border-radius: 10px;
    box-shadow: 5px 5px 20px black; }
  .index-awards {
    grid-template-columns: repeat(12, 1fr); }
  .awards-title, .index-awards > hr {
    grid-column: 1 / 8; }
  .awards-section {
    grid-column: 1 / 13; }
  .grid-row {
    display: grid;
    grid-template-columns: repeat(12, 1fr); }
  .awards-left {
    grid-column: 1 / 7; }
  .awards-right {
    grid-column: 8 / 13; }
  .awards {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    align-items: center;
    /*> .approved {
            grid-column: 1 / 3;
            padding: 1%;

            > img {
                width: 100%;
            }
        }*/ }
    .awards > .bbb {
      grid-column: 2 / 4;
      padding: 1%; }
      .awards > .bbb > img {
        width: 100%; }
    .awards > .ma-1952 {
      grid-column: 2 / 4;
      padding: 1%; }
      .awards > .ma-1952 > img {
        width: 100%; }
    .awards > .best {
      grid-column: 5 / 7;
      padding: 1%; }
      .awards > .best > img {
        width: 100%; }
    .awards > .ranked {
      grid-column: 8 / 10;
      padding: 1%; }
      .awards > .ranked > img {
        width: 100%; }
    .awards > .security {
      grid-column: 1 / 11;
      padding: 1%; }
      .awards > .security > img {
        width: 100%; }
  .flex-cards-container {
    flex-flow: row; }
  .card-body {
    height: 375px !important; }
  .careers-nav-desktop > ul > li:hover {
    border-bottom: 2px solid #2554a1;
    cursor: pointer; }
  .career-height-img {
    height: 650px; }
  .card-height {
    height: 525px; }
  .footer-bottom {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-around;
    align-items: center; }
  .connect-with-us {
    order: -1; }
  .mobile-footer {
    display: none; }
  .desktop-footer-email {
    display: block; }
    .desktop-footer-email > a {
      text-decoration: none;
      color: white; } }

@media screen and (min-width: 1025px) {
  .hero-container {
    margin-top: 9%; }
  .card-body {
    height: 400px !important; }
  .head-spacing {
    padding-top: 12% !important; }
  .mobileview-docs {
    display: none; }
  .nonmobile-docs {
    display: block; } }

@media screen and (min-width: 1281px) {
  .hero-container {
    margin-top: 5.5%; }
  #hero {
    padding-top: 5%; }
  .card-body {
    height: 325px !important; }
  .card-height {
    height: 415px; } }

@media screen and (min-width: 1475px) {
  .lead-form {
    grid-column: 7 / 9; }
  .height-100 {
    height: 100px; }
  .height-235 {
    height: 235px; }
  .card-body {
    height: 265px !important; }
  .head-spacing {
    padding-top: 10% !important; } }
