.header p {
  margin: 0px;
}

.card { border: none; }

.horizontal_menu li {
display:inline;
list-style-type:none;
float:left;
text-decoration:none !important;  
}

.gpsgmainmenu {
  width: auto;
  height: auto;
}

/* Banner Image */
.gpsgbanner {
  width: 100%;
}

.gpsghome {
  width: 25%;
  height: auto;
}

.gpsgproducts {
  width: 25%;
  height: auto;
}

.gpsgabout {
  width: 25%;
  height: auto;
}

.gpsgabout2 {
  width: 38%;
  height: auto;
}

.gpsgcontact {
  width: 25%;
  height: auto;
}

.gpsgflags {
  width: 35%;
  height: auto;
}

.google-maps {
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}

.google-maps iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

/* CLASSIC BANNER */
.container-banner .banner-overlay {
    height: max(300px, 50vh); /* by default is 50vh in Cassiopeia */
}
@media (min-width: 768px) {
    .container-banner .banner-overlay {
        height: max(300px, 45vh);
    }
}
@media (min-width: 992px) {
    .container-banner .banner-overlay {
        height: max(300px, 40vh);
    }
}
@media (min-width: 1200px) {
    .container-banner .banner-overlay {
        height: max(300px, 35vh);
    }
}

@media (min-width: 500px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 0px;
  font-size: 16px;
  }
.services-row {
  display: flex;
  font-size: 16px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 10px;
}
.aboutus {
  display: flex;
  font-size: 16px;
}
.gpsgfooter1 {
  width: 450px;
  font-size: 10px;
  }
.gpsgfooter2 {
  width: 450px;
  font-size: 8px;
  }
} 

@media (min-width: 550px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 0px;
  font-size: 16px;
  }
.services-row {
  display: flex;
  font-size: 16px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 10px;
}
.aboutus {
  display: flex;
  font-size: 14px;
}
.gpsgfooter1 {
  width: 475px;
  font-size: 10px;
  }
.gpsgfooter2 {
  width: 475px;
  font-size: 8px;
  }
}

@media (min-width: 600px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 0px;
  font-size: 20px;
  }
.services-row {
  display: flex;
  font-size: 20px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 12px;
}
.aboutus {
  display: flex;
  font-size: 14px;
}
.gpsgfooter1 {
  width: 500px;
  font-size: 10px;
  }
.gpsgfooter2 {
  width: 500px;
  font-size: 8px;
  }
}

@media (min-width: 700px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 0px;
  font-size: 22px;
  }
.services-row {
  display: flex;
  font-size: 22px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 12px;
}
.aboutus {
  display: flex;
  font-size: 16px;
}
.gpsgfooter1 {
  width: 550px;
  font-size: 12px;
  }
.gpsgfooter2 {
  width: 550px;
  font-size: 10px;
  }
}

@media (min-width: 750px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 0px;
  font-size: 24px;
  }
.services-row {
  display: flex;
  font-size: 24px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 14px;
}
.aboutus {
  display: flex;
  font-size: 16px;
}
.gpsgfooter1 {
  width: 600px;
  font-size: 12px;
  }
.gpsgfooter2 {
  width: 600px;
  font-size: 10px;
  }
}

@media (min-width: 800px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 24px;
  }
.services-row {
  display: flex;
  font-size: 24px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 14px;
}
.aboutus {
  display: flex;
  font-size: 16px;
}
.gpsgfooter1 {
  width: 650px;
  font-size: 14px;
  }
.gpsgfooter2 {
  width: 650px;
  font-size: 10px;
  }
}

@media (min-width: 850px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 24px;
  }
.services-row {
  display: flex;
  font-size: 24px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 16px;
}
.aboutus {
  display: flex;
  font-size: 17px;
}
.gpsgfooter1 {
  width: 750px;
  font-size: 17px;
  }
.gpsgfooter2 {
  width: 750px;
  font-size: 10px;
  }
}

@media (min-width: 950px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 26px;
  }
.services-row {
  display: flex;
  font-size: 26px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 18px;
}
.aboutus {
  display: flex;
  font-size: 18px;
}
.gpsgfooter1 {
  width: 850px;
  font-size: 20px;
  }
.gpsgfooter2 {
  width: 850px;
  font-size: 12px;
  }
}

@media (min-width: 1000px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 26px;
  }
.services-row {
  display: flex;
  font-size: 26px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 18px;
}
.aboutus {
  display: flex;
  font-size: 21px;
}
.gpsgfooter1 {
  width: 900px;
  font-size: 20px;
  }
.gpsgfooter2 {
  width: 900px;
  font-size: 12px;
  }
}  

@media (min-width: 1050px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 26px;
  }
.services-row {
  display: flex;
  font-size: 26px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 18px;
}
.aboutus {
  display: flex;
  font-size: 21px;
}
.gpsgfooter1 {
  width: 900px;
  font-size: 20px;
  }
.gpsgfooter2 {
  width: 900px;
  font-size: 12px;
  }
}  

@media (min-width: 1100px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 28px;
  }
.services-row {
  display: flex;
  font-size: 28px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 20px;
}
.aboutus {
  display: flex;
  font-size: 23px;
}
.gpsgfooter1 {
  width: 950px;
  font-size: 20px;
  }
.gpsgfooter2 {
  width: 950px;
  font-size: 12px;
  }
}

@media (min-width: 1200px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 28px;
  }
.services-row {
  display: flex;
  font-size: 28px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 20px;
}
.aboutus {
  display: flex;
  font-size: 24px;
}
.gpsgfooter1 {
  width: 1050px;
  font-size: 22px;
  }
.gpsgfooter2 {
  width: 1050px;
  font-size: 14px;
  }
}

@media (min-width: 1300px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 28px;
  }
.services-row {
  display: flex;
  font-size: 28px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 22px;
}
.aboutus {
  display: flex;
  font-size: 27px;
}
.gpsgfooter1 {
  width: 1150px;
  font-size: 24px;
  }
.gpsgfooter2 {
  width: 1150px;
  font-size: 16px;
  }
}

@media (min-width: 1400px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 28px;
  }
.services-row {
  display: flex;
  font-size: 28px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 22px;
}
.aboutus {
  display: flex;
  font-size: 29px;
}
.gpsgfooter1 {
  width: 1250px;
  font-size: 24px;
  }
.gpsgfooter2 {
  width: 1250px;
  font-size: 16px;
  }
}

@media (min-width: 1500px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 32px;
  }
.services-row {
  display: flex;
  font-size: 32px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
}
.mytext {
  font-size: 24px;
}
.aboutus {
  display: flex;
  font-size: 31px;
}
.gpsgfooter1 {
  width: 1350px;
  font-size: 24px;
  }
.gpsgfooter2 {
  width: 1350px;
  font-size: 16px;
  }
}

@media (min-width: 1600px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 32px;
  }
.services-row {
  display: flex;
  font-size: 32px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
  text-align: start;
}
.mytext {
  font-size: 28px;
}
.aboutus {
  display: flex;
  font-size: 33px;
}
.gpsgfooter1 {
  width: 1450px;
  font-size: 24px;
  }
.gpsgfooter2 {
  width: 1450px;
  font-size: 16px;
  }
}

@media (min-width: 1700px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 32px;
  }
.services-row {
  text-align: left;
  display: flex;
  font-size: 32px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
  text-align: start;
}
.mytext {
  font-size: 32px;
}
.aboutus {
  display: flex;
  font-size: 34px;
}
.gpsgfooter1 {
  width: 1550px;
  font-size: 24px;
  }
.gpsgfooter2 {
  width: 1550px;
  font-size: 16px;
  }
}

@media (min-width: 1800px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 32px;
  }
.services-row {
  text-align: left;
  display: flex;
  font-size: 32px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
  text-align: start;
}
.mytext {
  font-size: 34px;
}
.aboutus {
  display: flex;
  font-size: 40px;
}
.gpsgfooter1 {
  width: 1650px;
  font-size: 24px;
  }
.gpsgfooter2 {
  width: 1650px;
  font-size: 16px;
  }
}

@media (min-width: 1900px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 46px;
  }
.services-row {
  text-align: left;
  display: flex;
  font-size: 46px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
  text-align: start;
}
.mytext {
  font-size: 34px;
}
.aboutus {
  display: flex;
  font-size: 40px;
}
.gpsgfooter1 {
  width: 1750px;
  font-size: 24px;
  }
.gpsgfooter2 {
  width: 1750px;
  font-size: 16px;
  }
}

@media (min-width: 2000px) {
.container-header .mod-menu a {
  justify-content: center;
  padding: 0px 10px;
  font-size: 40px;
  }
.services-row {
  text-align: left;
  display: flex;
  font-size: 40px;
}
.services-col {
  flex: 43.33%;
  padding: 3px;
  text-align: start;
}
.mytext {
  font-size: 38px;
}
.aboutus {
  display: flex;
  font-size: 40px;
}
.gpsgfooter1 {
  width: 1850px;
  font-size: 28px;
  }
.gpsgfooter2 {
  width: 1850px;
  font-size: 20px;
  }
}

/* Menu */

/* Override the background with light gray */
.container-header {
  background-color: #ebebeb;
  background-image: none;
}

/* Text should now be blue */
.container-header .mod-menu {
  color: #ed0d21;
  padding: 0;
}

/* We add padding and radius so that on hover there is a nice background */
.container-header .mod-menu a {
  -webkit-border-radius: 0 0 0px 0px;
  -moz-border-radius: 0 0 0px 0px;
  border-radius: 0 0 0px 0px; 
  color: #ed0d21;
}

/* On hover there should be a gray background*/
.container-header .mod-menu a:hover {
  background-color: #feff0f;
  font-style: italic;
}

/* We need to change the color of the Hamburger Menu because white on white is not good */
.container-header .navbar-toggler {
  color: #ed0d21;
  border: 1px solid #ed0d21;
}