/*color scheme and css code Copyright 2025 Paunchy Penguin Consulting, llc
Last Edited -- 04-18-2025*/
/* Color Variables */
:root {
  --background-color:#000000;
  --text-color:#1E90FF;
  --link-color:#C0C0C0;
  --link-hover-color:#F5F5F5;
}
body {
    /*Basic Body Colors*/
    background-color: var(--background-color);
    color: var(--text-color);
    width: 100%;
    text-align: center;
    font-family: Monaco, Helvetica;
}

footer {
    text-align:center;
}

a {
  color: var(--link-color);
}

a:hover {
  color: var(--link-hover-color);
}

.logo-img {
  width: 300px;
  height: auto;
}

.email-link {
  height: 100px;
  width: 100px;
  display: block;
  background-image: url("../svg/email.svg");
  background-size: cover;
  background-position: center;
  margin-right: 100px;
}

.email-link:hover {
  height: 100px;
  width: 100px;
  display: block;
  background-image: url("../svg/email-inv.svg");
  background-size: cover;
  background-position: center;
  margin-right: 100px;
}

.phone-link {
  height: 100px;
  width: 100px;
  display: block;
  background-image: url("../svg/phone.svg");
  background-size: cover;
  background-position: center;
  margin-right: 100px;
}

.phone-link:hover {
  height: 100px;
  width: 100px;
  display: block;
  background-image: url("../svg/phone-inv.svg");
  background-size: cover;
  background-position: center;
  margin-right: 100px;
}

@media screen and (min-width: 768px) {
    .content {
    width: 70%; /* Set the width to 70% of the window */
    margin: auto;
    }
}
/*Responsive Styles*/
@media all and (max-width : 767px) {
    /* Fix format for mobile */
    body {
        --text-color:#1E90FF;
        font-size: 14px;
    }
    
    h1 {
        font-size: 28px;
    }
    
    h2 {
        font-size: 24px;
    }
    
    h3 {
        font-size: 20px;
    }
    
    h4 {
        font-size: 18px;
    }
    .email-link, .phone-link {
    display: inline-block;
    /*margin-bottom: 50px;  Add spacing between the links */
    }
    .content {
    width: 100%; /* Set the width to 100% for mobile */
    margin: auto;
}
}
