/* Custom CSS */

/* .sccpdo .figure-wrap img {
    width: auto;
} */

.subhead {
    font-size: 20px;
    color: #A1A1A1;
    margin-top: -20px;
    margin-bottom: 20px;
}


.card-pdo .text-enabled:hover {
	
cursor:pointer;
}


.card-pdo .text-enabled {
  
    width: 120px;

}


/************* calendar Month and List buttons for easyDNN News **********/ 

.calendar-tabnav .nav-item {
 list-style-type: none;
}

.btn-outline-secondary, .mainbody .btn-outline-secondary {
	
	color: #1c4e69!important;
	background-color: #fff;
}




/*** CDI Calendar css copied from CDI calendar **/

.DnnModule-EasyDNNnewsCalendar .innerpage .col-content .nopad {

	padding-left: 0px;
}

.DnnModule-EasyDNNnewsCalendar .fc-content{
	color:white;
}

.DnnModule-EasyDNNnewsCalendar .fc-title {
	white-space: wrap;
}

.DnnModule-EasyDNNnewsCalendar .fc-day-header { 
	background-color: #1c4e69!important;
	color: #ffffff;
}

.DnnModule-EasyDNNnewsCalendar .fc-ltr .fc-basic-view .fc-day-top .fc-day-number {
    float: none;
    text-align: center;
    text-decoration: none;
    width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.DnnModule-EasyDNNnewsCalendar .fc-month-view > table {
    box-shadow: var(--bs-box-shadow)!important;
}

.DnnModule-EasyDNNnewsCalendar .fc-body .fc-row {
	min-height: 150px!important;
}

.DnnModule-EasyDNNnewsCalendar .page-section .shadow div h3 {
	display:none;
}

.DnnModule-EasyDNNnewsCalendar .page-section .shadow div {
	padding-bottom: 0px!important;
}

.DnnModule-EasyDNNnewsCalendar .page-section {
	padding-top: 0px;
}


/**********/

.pdo-card .card-img.no-thumbnail {
    background-image: url(../images/news-thumbnail-seal.png);
    background-size: auto;
    background-position: center center;
    background-color: #007FB0;
}

.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection .pdo-news-carousel .slide-content, 
.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection2 .pdo-news-carousel .slide-content {
    max-height: 300px;
    min-height: 200px;
    margin-top: .5rem;
    margin-bottom: .5rem;
    min-width: 25% !important;
}

.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection3 .pdo-news-carousel .slide-content {
    /** min-height: 200px; ***/
    margin-top: .5rem;
    margin-bottom: .5rem;
    /* min-width: 25% !important; */
}

.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection .pdo-news-carousel .slide-content .card, .eds_template_List_Article_List_PDOCalendar_Carousel_WithSection2 .pdo-news-carousel .slide-content .card, .eds_template_List_Article_List_PDOCalendar_Carousel_WithSection3 .pdo-news-carousel .slide-content .card {
    width: auto;
}

.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection .card-body, 
.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection2 .card-body {
    display: flex;
    flex: 1 1 auto;
    padding: var(--bs-card-spacer-y) var(--bs-card-spacer-x);
    color: var(--bs-card-color);
    box-shadow: var(--bs-box-shadow) !important;
    border: 1px solid #ccc;
}

.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection3 .card-body {
    display: flex;
    flex: 1 1 auto;
    padding: var(--bs-card-spacer-y) var(--bs-card-spacer-x);
    color: var(--bs-card-color);
    box-shadow: var(--bs-box-shadow) !important;
    border: 1px solid #ccc;
	background-color: #ffffff;
}

.pdo-card .card-body {
    text-align: left;
    padding: 1.5rem 0;
}

/** news article carousel **/
.pdo-news-carousel .card-imgbg .card-title {
    background-color: #ffffff; 
	color: #1c4e69;
	text-decoration: underline;
	text-shadow:none;
	font-size: 17px;
    font-weight: 700;
    line-height: 1.1;
	
}

/** calendar carousel **/
.calendar-carousel .card-imgbg .card-title {
    padding-left: 0px;
	min-height: auto;

}

.pdo-news-carousel .card .event-date {
    /** background-color: #008155 !important;
    border-color: #008155 !important; **/
	color: white;
  background-color: #E46425;
}

.pdo-news-carousel .event-time {
	font-size: .8rem;
}


.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection .card-body .event-date, 
.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection2 .card-body .event-date, 
.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection3 .card-body .event-date {
    width: 54px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #ffffff;
    background-color: #E46425;
    padding: .3rem .5rem;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
}

.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection .card-body .card-info, 
.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection2 .card-body .card-info,
.eds_template_List_Article_List_PDOCalendar_Carousel_WithSection3 .card-body .card-info {
    padding-left: 1rem;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.sccpdo .pdo-card {
    border-radius: 0;
    border: 0;
    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.08);
}

.pdo-slick-slider {
    display: none;
}

.pdo-slick-slider.slick-initialized {
    display: block;
}

.pdo-news-carousel .evcard-date {
	color: white;
  background-color: #E46425;
}

/** event detail page **/



.pdonewsdetail {
  border: 1px solid #ccc;
  padding: 2rem;
margin-top: 4rem;
	margin-bottom:4rem;
}

@media (min-width: 992px) {
 .pdonewsdetail {
    padding: 3rem 4rem 2rem;
  }
}

.pdonewsdetail .news-title {
  font-size: 32px;
  color: #1c4e69!important;
  margin-bottom: 0.5rem !important;
}

.pdonewsdetail .news-subtitle {
  font-size: 18px !important;
  font-weight: 400 !important;
  color: #666 !important;
  margin-bottom: 0.5rem !important;
}

.pdonewsdetail .news-publish-date {
  margin-top: 1.5rem;
  font-size: 13.5px;
  position: relative;
}

.pdonewsdetail .news-publish-date:before {
  content: "";
  display: block;
  height: 1px;
  width: 100%;
  background-color: #eee;
  position: absolute;
  top: 50%;
  z-index: 1;
}

.pdonewsdetail .news-publish-date span {
  display: inline-block;
  background: white;
  padding: 0 1rem;
  margin: 0 auto;
  z-index: 2;
  position: relative;
}

.pdonewsdetail .news-heroimg {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

.pdonewsdetail .news-heroimg img {
  width: 100%;
	max-width: 400px;
}

.pdonewsdetail .article_pager {
  font-size: 14px;
  margin-top: 3rem;
  margin-bottom: 2rem;
  padding: 1rem;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
  color: #666;
}

.pdonewsdetail .article-body {
	margin-top:1.5rem;
}

.pdonewsdetail .DetailEventDetailsDiv3 {
	
    width: 90%;
    padding-left: 5px;
}

.pdonewsdetail .DetailEventDetailsDiv3 .SubHead {
    font-weight: 700;
}

.pdonewsdetail .DetailClear {
    clear: both;
}

.pdonewsdetail .DetailContentLeft, .pdonewsdetail .DetailContentRight  {

    padding: 5px 0;

    text-align: left;
    float: left;
}

.pdonewsdetail .DetailContentLeft {
    width: 35%;
}







.eds_news_PDOCalendar .fc-today-button {display:none} /** hide the Today button ******/
.eds_news_PDOCalendar .fc-left, .eds_news_PDOCalendar .fc-right { /** make left and right sides even to center month name ******/
	width: 20%;
}
.eds_news_PDOCalendar .fc-right .fc-month-button {visibility: hidden;} /** to hide the month button ***/







/*** Calendar categories colors ***/

.EDNcategorycolor-orange { /** currently set for holidays category (can change ) ***/
    background-color: #FFA400!important;
    border-color: #FFA400!important;
}

/*** this one is for the card view that uses the category description ( <div class="card-body [EasyDNNnews:Categories:Description]">)
  inside the List_Article_List_CDICalendar_Carousel_WithSection.htm template to get the category description and use it as a class ***/
.card .countyholidays .event-date {
	background-color: #FFA400!important;
    border-color: #FFA400!important;
}


.EDNcategorycolor-blue { /** currently set for DPW category (can change ) on month view ***/
    background-color: #216bad!important;
    border-color: #216bad!important;
}

/*** DPW this one is for the card view that uses the category description ( <div class="card-body [EasyDNNnews:Categories:Description]">)
  inside the List_Article_List_CDICalendar_Carousel_WithSection.htm template to get the category description and use it as a class ***/
.card .dpw .event-date {
	background-color: #216bad!important;
    border-color: #216bad!important;
}

.EDNcategorycolor-green { /** currently set for planning category (can change ) on month view ***/
    background-color: #008155!important; /** #037047!important;**/
    border-color: #008155!important;
}

/*** PLN this one is for the card view that uses the category description ( <div class="card-body [EasyDNNnews:Categories:Description]">)
  inside the List_Article_List_CDICalendar_Carousel_WithSection.htm template to get the category description and use it as a class ***/
.card .pln .event-date {
	background-color: #008155!important;
    border-color: #008155!important;
}

.EDNcategorycolor-gray { /** currently set for upc category (can change ) on month view ***/
    background-color: #006651!important;
    border-color: #006651!important;
}

/*** UPC this one is for the card view that uses the category description ( <div class="card-body [EasyDNNnews:Categories:Description]">)
  inside the List_Article_List_CDICalendar_Carousel_WithSection.htm template to get the category description and use it as a class ***/
.card .upc .event-date {
	background-color: #006651!important;
    border-color: #006651!important;
}


.EDNcategorycolor-black { /** currently set for BOS meetings category (can change ) on month view ***/
    background-color: #1c4e69!important;
    border-color: #1c4e69!important;
}

/*** BOS meetings this one is for the card view that uses the category description ( <div class="card-body [EasyDNNnews:Categories:Description]">)
  inside the List_Article_List_CDICalendar_Carousel_WithSection.htm template to get the category description and use it as a class ***/
.card .boardmeeting .event-date {
	background-color: #1c4e69!important;
    border-color: #1c4e69!important;
}




.card-body.\<p\>watsonville\<\/p\> .evcard-date {
  background-color: #008155;
}


.card-body.\<p\>santacruz\<\/p\> .evcard-date {
  background-color: #1c4e69;
}



