.header-date {
font-size: 27px;
justify-self: center;
line-height: 34px;
text-transform: capitalize;
}
.today-weather-widget {
border-radius: 5px;
background: #fff; display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 100%;
background: #fff;
border-radius: 5px;
position: relative; background-color: rgba(152, 1, 46, 0.1);
align-items: center;
padding: 62px 32px 32px 32px;
}
.today-weather-widget-subsection {
text-align: center;
width: 50%;
padding: 2px 0px;
}
.today-weather-widget-subsection-1 {
color: #880029;
}
.today-weather-widget-max-temp {
color: #404040;
font-family: sans-serif;
font-size: 32px;
line-height: 40px;
}
.today-weather-widget-min-temp {
line-height: 19px;
color: #6e6e6e;
font-size: 26px;
}
.today-weather-widget-label {
position: absolute;
top: 20px;
z-index: 12;
left: 9px;
pointer-events: none;
font-weight: 600;
font-size: 17px;
background-color: #98012e;
color: #ffffff;
padding: 0 10px;
margin: 0 0 0 8px;
display: inline-block;
max-height: 29px;
border-radius: 2px;
}
.today-weather-widget-label:after {
content: "";
position: absolute;
top: 50%;
right: -25px;
transform: translateY(-50%);
width: 0;
height: 0;
border: 13px solid #d9222200;
border-left-color: #98012e;
}
.today-weather-widget-value {
font-size: 19px;
font-weight: 600;
}
.today-weather-widget-temp {
font-size: 40px;
font-weight: 600;
line-height: 34px;
}
.today-weather-widget-condition {
font-size: 32px;
font-weight: 300;
line-height: 43px;
}
.today-weather-widget-cta-btn-ct {
text-align: center;
width: -webkit-fill-available;
}
.today-weather-widget-cta-btn-ct .cta-btn{
display: inline-block;
}
.carousel-nav-left {
position: absolute;
top: 50%;
transform: translateY(-50%);
color: #fff;
border: none;
padding: 10px;
cursor: pointer;
z-index: 10;
border-radius: 5px;
}
.carousel-nav-left.widget-control.widget-control-left {
left: 10px;
}
.carousel-nav-right {
position: absolute;
top: 50%;
transform: translateY(-50%);
color: #fff;
border: none;
padding: 10px;
cursor: pointer;
z-index: 10;
border-radius: 5px;
}
.carousel-nav-right.widget-control.widget-control-right {
right: 10px;
}
.today-weather-hours {
font-size: 23px;
font-weight: 600;
}
.forecast-table-container {
overflow-x: auto;
margin-top: 20px;
overflow-y: hidden;
} .forecast-table-container {
overflow-x: auto;
margin-top: 20px;
padding: 10px;
}
.metric-container {
display: inline-block;
text-align: left; }
.metric-item {
display: flex;
align-items: center; margin: 5px 0; }
.metric-icon {
width: 30px;
height: 30px;
margin-right: 8px; }
.metric-value {
font-size: 16px; } .daily-forecast-table {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
text-align: center;
border: 1px solid #ededf2;
border-radius: 5px;
overflow: hidden;
}
.daily-forecast-table tr {
border-bottom: 1px solid #98012e; }
.daily-forecast-table tr:last-child {
border-bottom: none; }
.daily-forecast-table th {
background-color: rgba(152, 1, 46, 0.1);
font-weight: bold;
position: sticky;
top: 0;
z-index: 2;
padding: 8px;
}
.daily-forecast-table th:first-child {
text-align: left;
background-color: #fff;
position: sticky;
left: 0;
z-index: 3;
}
.daily-forecast-table thead th:first-child {
min-width: 200px;
}
.daily-forecast-table td {
height: 66px;
font-size: 16px;
color: #3f4851;
position: relative;
padding: 8px;
vertical-align: middle;
}
.daily-forecast-table td:last-child {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
min-width: 100px;
}
.daily-forecast-table td img {
vertical-align: middle;
margin-bottom: 5px;
}
.daily-forecast-table-link {
font-size: 22px;
}
.daily-forecast-table-date {
text-align: left;
}
.daily-forecast-table-max-temp {
color: #404040;
font-family: sans-serif;
font-size: 21px;
line-height: 23px;
}
.daily-forecast-table-min-temp {
color: #6e6e6e;
font-size: 16px;
} .hourly-forecast-table {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
text-align: center;
border: 1px solid #ededf2;
border-radius: 5px;
overflow: hidden;
}
.hourly-forecast-table td {
position: relative;
padding: 8px;
text-align: center;
vertical-align: middle;
}
.hourly-forecast-table td:hover:before {
content: "";
position: absolute;
left: 0;
right: 0;
top: -9999px;
bottom: -9999px;
background-color: rgba(152, 1, 46, 0.1);
z-index: -1;
}
.hourly-forecast-table tr:last-child {
border-bottom: none;
}
.hourly-forecast-table tr {
border-bottom: 1px solid #ededf2;
}
.hourly-forecast-table th  {
min-width: 100px;
background-color: rgba(152, 1, 46, 0.1);
font-weight: bold;
padding: 29px 8px 29px 8px;
}
.hourly-forecast-table th:first-child  {
background-color: #fff;
font-weight: bold;
padding: 29px 8px 29px 8px;
}
.hourly-forecast-table thead th:first-child {
min-width: 200px;
} .daily-forecast-table tr:hover {
background-color: rgba(152, 1, 46, 0.1);
transition: all 0.3s;
}
.related-links {
padding-top: 12px;
}
.related-links .cta-btn {
float: left;
margin: 5px;
padding: 2px 11px 2px 11px;
font-size: 18px;
}
.weather-attractions-section-description {
font-size: 20px;
margin-bottom: 18px;
text-align: center;
}
.forecast-gallery {
display: flex;
overflow: hidden; position: relative;
margin: 14px 10px 14px 10px;
}
.forecast-gallery-overview {
display: flex;
overflow: hidden; position: relative;
margin: 14px 10px 14px 10px;
}
.forecast-gallery p {
color: #404040;
font-family: sans-serif;
font-size: 17px;
line-height: 23px;
text-transform: capitalize;
}
.forecast-gallery-overview p {
color: #404040;
font-family: sans-serif;
font-size: 17px;
line-height: 23px;
}
.forecast-gallery-weather-box:hover, .forecast-gallery-weather-box:active {
background-color: rgba(152, 1, 46, 0.1);
}
.forecast-gallery-weather-box-overview {
cursor: pointer;
border-radius: 5px;
background: #fff; margin-right: 5px;
text-align: center;
padding: 17px;
transition: all 0.3s;
}
.forecast-gallery-weather-box-overview:hover, .forecast-gallery-weather-box-overview:active {
background-color: rgba(152, 1, 46, 0.1);
}
.forecast-gallery-weather-box-selected {
font-weight: 600;
pointer-events: none;
display: block;
background-color: rgba(152, 1, 46, 0.1);
position:relative;
}
.forecast-gallery-date {
font-size: 17px;
line-height: 19px;
}
.forecast-gallery-max {
font-size: 18px;}
.forecast-gallery-min {
color: #6e6e6e;
font-size: 14px;
}
.forecast-gallery-label {
color: rgb(152, 1, 46) !important;
font-weight: 600;
padding-top: 9px;
}
.forecast-gallery {
position: relative;
overflow: hidden;
margin: 14px 29px;
}
.forecast-gallery-inner {
display: flex;
transition: transform 1s ease;
width: 100%;
box-sizing: border-box; }
.forecast-gallery-weather-box {
box-sizing: border-box;
padding: 17px;
text-align: center;
transition: all 0.3s;
background: #fff;
border-radius: 5px; flex: 0 0 13.9%;
margin-right: 5px;
}
.forecast-gallery-weather-box:hover,
.forecast-gallery-weather-box:active {
background-color: rgba(152, 1, 46, 0.1);
}
.forecast-gallery-weather-box-selected {
font-weight: 600;
pointer-events: none;
background-color: rgba(152, 1, 46, 0.1);
}
.forecast-gallery-wrapper {
position: relative; }
.forecast-gallery {
overflow: hidden; } .carousel-nav-left, .carousel-nav-right {
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 10; } .carousel-nav-left {
left: -12px; }
.carousel-nav-right {
right: -12px; }
.forecast-gallery .widget-control {
top: auto;
}
.carousel-nav-left,
.carousel-nav-right {
position: absolute;
top: 50% !important; transform: translateY(-50%);
z-index: 10; }
.carousel-nav-left {
left: 10px; }
.carousel-nav-right {
right: 10px; } @media (max-width: 600px) {
.forecast-gallery-weather-box {
flex: 0 0 50%;
margin-right: 0; }
} @media (min-width: 601px) and (max-width: 1024px) {
.forecast-gallery-weather-box {
flex: 0 0 25%;
}
} .weather-widget-days-ct {
display: flex;
flex-wrap: wrap;
gap: 8px 0px;
justify-content: space-between; margin-top: 20px;
} .weather-widget-days-box {
box-sizing: border-box;
padding: 17px;
text-align: center;
transition: all 0.3s;
background: #fff;
border-radius: 5px;
border: 1px solid #ddd;
text-decoration: none; color: inherit;  flex: 0 0 16%;
justify-content: center;
}
.weather-widget-days-box-14-days p {
color: #98012e; 
}
.weather-widget-days-box-14-days {
display: flex
;
}
.forecast-plus-container {
display: flex
;
align-items: center;
font-weight: bold;
margin-bottom: 5px;
font-size: 1.1em;
flex-direction: column;
justify-content: center;
}
.forecast-plus-icon {
fill: #98012e;
width: 32px;
height: 32px;
vertical-align: middle; margin-bottom: 13px;
} .weather-widget-days-box:hover {
background-color: rgba(152, 1, 46, 0.1);
} .forecast-day-of-week {
font-weight: bold;
margin-bottom: 5px;
font-size: 1.1em;
color: #404040;
}
.forecast-day-month {
margin-bottom: 10px;
font-size: 1em;
color: #555;
}
.forecast-icon {
width: 64px;
height: 64px;
margin-bottom: 10px;
}
.forecast-temp {
font-size: 1em;
color: #333;
}
.weather-widget-days-min {
font-size: 0.9em;
color: #777;
}  @media (max-width: 1200px) {
.weather-widget-days-box {
flex: 0 0 31%; }
} @media (max-width: 768px) {
.weather-widget-days-box {
flex: 0 0 48%; }
} @media (max-width: 480px) {
.weather-widget-days-box {
flex: 0 0 49%; }
}