/*body styles*/
* {
    margin: 0; 
    padding: 0; 
    outline: 0;
 }
 
 body {
    font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; 
    color: #000; 
    background: #fff;
 }

 .wrapper {
    width: 90%;
    height: auto;
    min-height: 100%;
    overflow: hidden;
    margin: 0 auto;
    background-color: #e8eae7;
 }

 a:link {
   text-decoration: none;
}

 /*header styles*/
 .header {
    height: 333px;
    background-image: url(images/sunset.jpg);
    background-repeat: no-repeat;
    background-position: center;
 }

 .header h1 {
    font-size: 3.4rem;
    color: #000;
    padding: 20px 0px 0px 220px;
    text-align: left;
 }

 .header p {
    font-size: 1.2rem;
    padding: 0px 220px;
 }

 .header h2 {
    font-size: 1.4rem;
    text-align: left;
    padding: 80px 0px 0px 750px;
 }

#home {
    background-color: #ffc877;
    padding: 8px 12px;
    text-align: center;
    display: inline-block;
    text-decoration: none;
    font-size: 16px;
    border-radius: 5px;
    margin-top: 20px;
    margin-left: 815px;
}

 /*navbar styles*/
 .nav ul {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 45px;
    list-style-type: none;
    font-size: 1.4rem;
    height: 150px;
    width: 900px;
    margin: 0 auto;
    background-color: #fff;
}

/*time zone finder link section styles*/
.my-zone {
    background-image: url(images/clocks.jpg);
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    width: 900px;
    height: 260px;
    padding-top: 40px;
}

.my-zone h2 {
   padding: 0px 0px 0px 585px;
   font-weight: bold; 
   font-size: 1.5rem;
}

.my-zone h3 {
   padding: 160px 0px 0px 430px;
   font-size: 1.1rem;
}

/*gallery slideshow styles*/
.gallery-container {
    text-align: center;
    height: 300px;
    width: 900px;
    margin: 0 auto;
    background-color: #fff;
    padding-top: 50px;
}

.gallery {
    border: 1px solid black;
    width: 400px;
    height: 250px;
    margin: 0 auto;
    text-align: center;  
}

/*time zone banner styles*/
.banner {
    display: block;
    width: 900px;
    height: 300px;
    margin: 0 auto;
}

.banner h1 {
   text-align: center;
   padding-top: 25px;
}

.banner ul {
   text-align: center;
   list-style-type: none;
   background-color: #fff;
   width: 325px;
   margin:0 auto;
   padding: 15px;
   border-radius: 3px;
}

.pacific {
   background-image: url(images/pacific.jpg);
}

.mountain {
   background-image: url(images/mountain.jpg);
}

.central {
   background-image: url(images/central.jpg);
}

.eastern {
   background-image: url(images/eastern.jpg);
}

#message {
   padding: 25px 0px 25px 220px;
   
}

/*weather section styles*/
.search-bar {
   text-align: center;
   padding: 25px 0px;
}

.search-bar label {
   font-size: 20px;
}

#search {
   width: 15rem;
   height: 2rem;
   font-size: larger;
}

.weather {
   width: 900px;
   border: 1px solid black;
   margin: 0 auto;
   padding: 25px 0px;
}

.city-name h1 {
   text-align: center;
   font-size: 2.7rem;
}

.city-stats {
   text-align: center;
}

/*news section styles*/
.news {
   text-align: center;
   padding: 50px 0px;
}

/*footer styles*/
 .footer {
    text-align: center;
    background-image: url(images/ski-hill.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-color: #465665;
    height: 200px;
    width: 900px;
    margin: 0 auto;
    color:#fff;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 90px;
    padding-top: 20px;
 }

 .footer ul {
   list-style-type: none;
   text-decoration: none;
 }

 .footer-nav a {
   color: #fff;
 }

 .social-media a {
   color: #fff;
 }

 .support a {
   color: #fff;
 }

 .copyright p {
   text-align: center;
   background-color: #000;
   color: #fff;
   width: 900px;
   margin: 0 auto;
   padding: 15px 0px;
 }