* {
    font-family: 'Balboa Light';
    src: url("/balboalight.otf");
    font-size: 20pt;
}

a {
    color: #3e8a08;
    text-decoration: none;
}

table .info, .table .info {
    color: #000;
}

a.list-group-item:hover, button.list-group-item:hover, a.list-group-item:focus, button.list-group-item:focus {
    color: #fff;
    text-decoration: none;
    background-color: #28b62c;
}

a.list-group-item.active, a.list-group-item.active:hover, a.list-group-item.active:focus {
    color: #fff;
    text-decoration: none;
    background-color: #3e8a08;
}

.alert-warning {
    color: #ffffff !important;
    background-color: gray !important;
    border-color: gray !important;
}
.btn {
    font-size: 13px;
}
.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus{
    color: #ffffff;
    background-color: gray;
    border-color: gray;
}
.btn-primary {
    color: #ffffff;
    background-color: #3e8a08;
    border-color: #3e8a08;
}
.btn-success {
    color: #ffffff;
    background-color: #3e8a08;
    border-color: #28b62c;
}
.btn-success:hover,.btn-success:focus,.btn-group.open.dropdown-toggle.btn-success{
    background-color: #3e8a08;
    border-color: #28b62c;
}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active {
    color: #ffffff;
    background-color: #3e8a08;
    border-color: #3e8a08;
}
.nav .open>a, .nav .open>a:hover, .nav .open>a:focus {
    border-color: white;
   }
a:hover,a:focus{
    color: gray;
   
   font-family: 'Balboa Light';
   src: url("/balboalight.otf");
}


.navbar-inverse .navbar-nav > li > a:focus {
    color: #3e8a08 !important;
}

.home-banner {
   display: flex;
   padding: 8vh 8vh 10vh 8vh;
   flex-direction: column;
   height: 100vh;
}
.home-container {
    display: flex;
    background-color: #dfdddd;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-items: center;
    border-radius: 5px;
    opacity: 10;
    height: 100%;
    
}
.homewrapper {
    display: flex;
    flex-direction: column;
    max-width: 45vw;
    align-items: left;
}

.homeimage {
    display: flex;
    content: url(/elderly-lady-on-couch-with-computer-and-dog.svg);
    max-width: 40vw;
    flex-shrink: 0;
}
.homebutton {
    display: flex;
    width: 100%;
    background-color: green;
    justify-content: center;
    padding: 15px;
    text-decoration: none;
    border-radius: 25px;
    border: white solid;
    color: white;
    text-align: center;
    flex-wrap: nowrap;
    align-items: center;
    font-size: 10vh;
    
}

.section2 {
    display: flex;
    background-color: green;
    padding: 10px;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    height: 100vh;
}

.section2header{
    display: flex;
    width: 75vw;
    flex-direction: column; 
    align-items: center;
    color: white;
    background-color: rgba(201, 208, 202, 0.1); 
    padding: 1vw;
}

.buttonwrapper {
    display: flex;
    justify-content: center;
    padding: 3vh;
}

.randomwrapper {
 display: flex;
    width: 70%;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: flex-start;
    flex-wrap: wrap;
    align-content: center;
    flex-grow: 1;    
}

.boxwrapper { display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    max-width: 18%;
    margin: 20px;
  }

.box {  display: flex;
    flex-grow: 1;
    justify-content: center;
}

.boxtext {text-align: center;
    padding: 10px 0px;
    color: white
}

.section3 {
    display: flex;
    background-color: #dfdddd;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    height: 100vh;
    border-radius: 5px;
    opacity: 10;
    padding: 10vw;
    }

.homepageinfo  {
    display: flex;
    flex-wrap: wrap;
    padding: 1vw;
    justify-content: space-evenly;
    
}

@media (max-width: 1250px) {
    h1 {font-size: 30pt; opacity: 1}
    p {font-size: 20pt}
    
    .homeimage {
    display: flex;
    content: url();
 
    }

    .home-banner {
        background-color: white;
        padding:2vh 2vh;
        justify-content: center;
    }
    
    .home-container {
    display: flex;
    background-color: #dfdddd;
    flex-direction: column;
    justify-content: space-between;
    align-items: ;
    border-radius: 5px;
    padding: 5px;
    opacity: 10;
    text-align: center;
    background-image: url(/elderly-lady-on-couch-with-computer-and-dog.svg);
    background-repeat: no-repeat;
    background-position-y: center;
    height: 90vh;
    } 
    
    .homewrapper {
    display: flex;
    flex-direction: column;
    align-content: space-between;
    padding: 4vw;
    max-width: 85vw;
    align-items: center;
    font-size: 16pt;  
    background: rgba(201, 208, 202, 0.1);
     
}
    .randomwrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    flex-wrap: wrap;
    
}
    .section2 {
    display: flex;
    background-color: green;
    padding: 10px;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    margin-bottom: auto;
    height: auto;
    
    
}
    .box {  display: flex;
    width: 20vw;
    height: 20vw; 
    justify-content: space-around;  
}
    .boxwrapper { display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    max-width: 18%;
    margin: 20px;
}
  .boxtext {
    text-align: center;
    padding: 10px 0px;
    color: white;
    display: flex;
    width: auto;
    }  
    
}


@font-face {
    font-family: 'Balboa Light';
    src: url("/balboalight.otf");
}

.navbar {
  min-height: 100px;
}

a:link {
   font-family: 'Balboa Light';
   src: url("/balboalight.otf");
   font-size:x-large;
}


.hearingaidcontainer{
    
    border: 0px solid green;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: space-around;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin: auto;
    background-color:#FDE5DC;
    padding: 10px

}
.hearingaid{
    background-color: white;
    border: 4px solid green;
    margin: 10px;
    padding: 5px;
    height: 250px;
    width: 350px;
    align-items: center;
    display: inline-block

}

.hearingaidheader {
    display: flex: 
}

.homepageimage {
  display: flex;
  align-items: center;
  justify-content: center;
}

.homepageimage div {
  width: 200px;
  height: 100px;
}

.arrow-right {
  width: 0; 
  height: 0; 
  border-top: 60px solid transparent;
  border-bottom: 60px solid transparent;  
  border-left: 60px solid black;
}