﻿/* Common */
#s4-workspace {overflow-x: hidden;}
.overlay-link { position:absolute;left:0;top:0;width:100%;height:100%}
a:link, a:hover {text-decoration: none;}

/* Header */
.header { background:#204782}
.header .separator { position:relative}
.header .separator::before {
	content:"";
	position:absolute;left:calc(50% - 2px);top:calc((100% - 50px) / 2);width:2px;height:50px;background :rgb(255 255 255 / 60%) 
}
.gov-logo img {width:50%;object-fit: contain;}
.social-links { max-width:125px}
.social-links-item {width:40px;height:35px;position: relative;display: flex;justify-content: center;}
.social-links-item img {width:40px;height:40px}

.weather-wrapper { width:165px;height:60px;background:url(../images/weather.svg) no-repeat; background-size: cover}

.Top-nav { background:#43B0E2}

/* Slider */
.slider-item { position:relative}
.slider-details { position:absolute;bottom:0;left:0; width:100%;
display: flex;
    flex-direction: column;padding: 80px 50px 30px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+11,1+94 */
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 11%, rgba(0,0,0,1) 94%, rgba(0,0,0,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 11%,rgba(0,0,0,1) 94%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 11%,rgba(0,0,0,1) 94%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); /* IE6-9 */

}
.slider-details-title {font-weight: 600;font-size: 1.3rem;color: #fff;padding-bottom: 5px;}
.slider-details-subtitle {font-weight: 500;font-size: 1rem;color: #fff;}

/* Search-w */
.search-W {height: 115px; background: url(../images/search_bg.svg) repeat-x #979797 0 0px;padding: 27px 0;background-size: contain;}

    border-radius: 60px;
    padding: 0 0 0 30px;
    box-sizing: border-box;
    margin: 0;
    box-shadow:0 5px 8px 4px rgb(0 0 0 / 12%);
    overflow: hidden;
    border:none;outline:none
}
#SearchBox .ms-srch-sbLargeFocused {
	border:none;outline:none
}
#SearchBox .ms-srch-sbLarge input {
    height: 60px;
    width: calc(100% - 160px);    border: none;background: transparent;font-size: 18px;
}
#SearchBox .ms-srch-sbLarge input:focus {outline: none;}
.ms-srch-sb-searchLink img { display:none}
.ms-srch-sb-searchLink {
    margin-left: 0px;
    height: 60px !important;
    width: 154px !important;
    position: relative;
    border: none;
}
.ms-srch-sb-searchLink::before {
    content: "Search";
    position: absolute;
    display: inline-block;
    color: #fff;
    font-size: 18px;
    line-height: 60px;
    box-sizing: border-box;
    cursor: pointer;
    top: 0;
    padding: 0 50px;
    right: 0;
    background: #FF3C00;
}
/* common */
.sec-header {}
.sec-header-title { font-size: 2rem; font-weight: 600;}
.card a {color: #212529;}
.card-img-full { height: 265px; width: 100%;}
.card-img-full img {object-fit: cover;width: 100%;height: 100%;;}
.card-info { font-size:15px}
.card-tag {width:auto;padding: 5px 20px; border-radius: 18px; background: #FFC107;font-weight: 500;color: #333;/*text-shadow: 1px 1px #e6b521;*/}

.seeall-btn {padding: 6px 30px;
    background: #E44141;
    box-shadow: 1px 1px 7px rgb(0 0 0 / 30%);
    color: #fff;
    border-radius: 25px;    font-size: 18px;;}
/* QL-w */
.QL-w {}
.QL-item-title.icon {width: 40px; height: 40px;}
.QL-item-title.txt { padding-left: 22px;font-size: 20px;    font-weight: 600;display: flex;align-items: center;}
.QL-item-desc {text-align: left;    font-size: 15px;}

/* Latest Stories */
.card.no-border {border: none;}
.LS-W .card { background:transparent;padding: 20px !important;}
.LS-W .card-img-full img {border-radius: 10px;box-shadow: 1px 3px 5px #0000001f;border: 1px solid #00000021;}
.card-social-share .social-icon { width:20px;height:20px;background-size: 20px !important;
    margin-right: 6px;
    padding: 14px !important;
    border-radius: 5px;
    box-shadow: 1px 1px 3px rgb(0 0 0 / 12%);}
.social-icon.facebook { background:url('../images/LN_facebook.svg') #E1E4EF no-repeat;background-position: 50%;}
.social-icon.twitter { background:url('../images/LN_twitter.svg') #E1E4EF no-repeat;background-position: 50%;}
.social-icon.linkedin { background:url('../images/LN_linkedin.svg') #E1E4EF no-repeat;background-position: 50%;}

/* Media center */
.MC-W .card { background:transparent;padding: 20px !important;}
.MC-W .card-img-full img {border-radius: 10px;}

.ratings {width: 20px;height: 20px;position: relative; margin-right: 5px;}
.ratings::before {content: "";width: 20px;height: 20px;background: url(../images/Star.png) no-repeat 50%;background-size: cover;position: absolute;top: 0;left: 0;}
.ratings.got::before {background: url(../images/Star-Colored.png) no-repeat 50%}

/* Footer */
.Foo-W {background: #204782;}
.Foo-body-links {
    flex-direction: column;
    flex-wrap: wrap;
    height: 470px;
}
.foo-item-header {margin-top: 20px; font-size: 1rem;font-weight: 700; color: #fff}
.foo-item {
}
.foo-item-body span {font-size: 0.9rem; color: rgb(255 255 255 / 90%);-webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.foo-item-body span:hover {color: #fff; text-shadow: 1px 1px 3px #272727;}

#header-contactus .item-icon,
#foo-contactus .item-icon { width: 45px;height: 45px;background-size: contain; }


/* =================== Responsiveness ====================== */


/* Desktops */

@media (min-width: 1281px) {
  
    /* CSS */
    
  }
  
  /* Laptops, Desktops */
  
  @media (min-width: 1025px) and (max-width: 1280px) {
    
    /* CSS */
    
  }
  
  /* Tablets, Ipads (portrait) */
  
  @media (min-width: 768px) and (max-width: 1024px) {
    
  
  }
  
  /* Tablets, Ipads (landscape) */
  
  @media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    
    
  }
  
  /* Low Resolution Tablets, Mobiles (Landscape) */
  
  @media (min-width: 481px) and (max-width: 767px) {
    
    /* CSS */
    
  }
  
  /* Most of the Smartphones Mobiles (Portrait) */
  
@media (min-width: 320px) and (max-width: 480px) {

.mob-hide{ display: none !important;}

/* begin::Header */
.header-follow-links { justify-content: center !important;background: #ffffff3b;}
.header-follow-links .social-links {max-width: none;flex-direction: row !important;}
.header-follow-links .social-links span {display: flex; align-items: center;padding: 0 !important;}
#header-contactus .item-icon, #foo-contactus .item-icon {width: 32px;height: 32px;}
#header-contactus .item-icon {background-position-y: 2px;}
  /* Footer */
  .Foo-W .container {padding-left: 0;padding-right: 0;}
  .Foo-body-links {
    height: auto;
}
  
}
  
  @media (min-width: 320px) and (max-width: 376px) {
  /* Header */
  
  
  }
  