.fjalla-one-regular {
  font-family: "Fjalla One", sans-serif;
  font-weight: 400;
  font-style: normal;
}



.dancing-script {
  font-family: "Dancing Script", cursive;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}


body {
    font-family: 'Arial', sans-serif;
    line-height: 1.6;
    color: #333;
    background-color: #f4f4f4;
    margin:0 5rem;
}
main{
    width:100%;
    margin: 0 auto;
    background-color: #ebeaea;
    height:100%;
}
header{
    width: 100%;
    margin:0 auto;
    display:inline-block;
    
}

nav {
    font-family:"fjalla One";
    text-decoration: none;
    background-color: rgb(100, 100, 182);
    width:100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    /*Need to write report on use of flex.*/
   
}
nav h1{
    color:white;
    font-size:24pt;
}
nav ul{
    width:100vw;
    margin:0 auto;
    
}
nav li{
    display:inline-block;
    vertical-align: center;
    margin:1rem;
}

nav .linkOrange{
    background-color:rgb(235, 151, 72);
    border-radius:1rem;
    text-decoration: none;
    padding:.75rem;
    color:white;
}

.link{
    padding:.75rem;
    margin:.25rem;
    text-decoration: none;
    background-color:rgb(141, 141, 192);
    border-radius:.75rem;
    color:white;
    
}
.link:hover {
    background-color:rgb(162, 162, 189);
    border-radius:1rem;
    color:white;

}

footer{
    margin-top:2rem;
    padding:1rem;
    text-align: center;
    background-color: rgb(100, 100, 182);
    color:white;
}
footer p{
    color:white;
}
 
#logo{
    margin: .75rem;
    padding-left: 2rem;
    display:inline-block;
    height:80px;
    width:140px;
}

h1{
    color:rgb(61, 50, 91);
    font-family:"Fjalla One";
    text-align: center;
}
 h2, h3{
    color:rgb(247, 147, 54);
    font-family:"Fjalla One";
    text-align: center;
}
p{
    text-align: center;
    color:rgb(84, 84, 89);

}
img{
    width:100%;
}
table{
    width:100%;
    border-collapse: collapse;
    margin: 2rem auto;

}

th, td{
    padding: 8px;
    text-align: center;
}
td img{
    width:100%;
    max-height:600px;
    max-width: 500px;
    
}
td{
    box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
}


.image-section2 {
    margin:0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    gap:1.5rem;
   
}
.image-section2 img{
    width:100%;
    max-width:300px;
}
.week{
    background-color:rgb(214, 221, 255);
    border-radius:1rem;
    padding:2rem;
    color:white;
}
p{
    font-family: "optima-regular", sans-serif;
    margin: 0 2rem;
    padding:1rem;
}
td a{
    text-decoration: none;
    background-color:rgb(141, 141, 192);
    border-radius:.75rem;
    color:white;
    padding:.75rem;
}
td a:hover{
    text-decoration: none;
    background-color:rgb(219, 165, 129);
    border-radius:.75rem;
    color:white;
    padding:.75rem;
}
tr:nth-child(even) {
    background-color: rgb(239, 210, 182);
}
tr:nth-child(even) {
    background-color: rgb(255, 255, 255);
}
.intro a{
    text-decoration: none;
    background-color:rgb(141, 141, 192);
    border-radius:.75rem;
    color:white;
    padding:.75rem;
    margin:0 auto;
}
.intro a:hover{
    text-decoration: none;
    background-color:rgb(219, 165, 129);
    border-radius:.75rem;
    color:white;
    padding:.75rem;
}
.intro{
    padding-bottom: 2rem;
    margin:0 auto;
    text-align: center;
}
.imageGallery{
    display: flex;
    justify-content: center;
    align-items: center;
    gap:1.5rem;
    margin: 2rem;
 
}
.imageGallery img{
    width:50%;
    border-radius: 2rem;
    box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
    max-height:600px;
    max-width: 500px;
}
.imageGallery p{
    background-color:rgb(141, 141, 192);
    border-radius:1rem;
    color:white;
    padding:1rem;
    font-weight: bold;
}


#adopt{
    display :inline-block;
    width:100%;
    text-align: center;
    box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
    padding: 2rem 0;
    background-color:rgb(179, 161, 199);
    border:10px rgb(255, 217, 170) solid;
    border-radius: 30rem;

}
label{
    font-family: "fjalla One", sans-serif;
    font-size: 1.25rem;
    color:rgb(84, 84, 89);
}
input[type="text"], input[type="email"] , input[type="tel"] {
    width: 30%;
    padding: 0.5rem;
    margin: 0.5rem 0;
    border: 1px solid #ccc;
    border-radius: 0.25rem;
    text-align: center;
    background-color:rgb(245, 240, 228) ;
}
input[type="submit"] {
    padding:.75rem;
    background-color:rgb(141, 141, 192);
    border: 2px rgb(241, 211, 177) solid;
    border-radius:.75rem;
    color:white;
    margin:2rem;
    font-family: "fjalla One", sans-serif;
    font-size: 1.25rem;
   
}
.rehome{
    margin:2rem 0;
    background-color:rgb(224, 226, 238);
    text-align: center;
    border-radius:1rem;
    padding:2rem;
    color:white;
}
.rehome a{
    text-decoration: none;
    background-color:rgb(221, 151, 104);
    border-radius:2rem;
    color:white;
    padding:1rem;
    margin:1rem auto;
    font-family: "fjalla One", sans-serif;
    letter-spacing: 1px;
}