/* CUSTOM DOC STYLES
NOTE: This must be checked in as a MAJOR VERSION, so that its CSS can be used site-wide. This file also needs to be CHECKED OUT to replace by dragging and dropping new file!
Updated: 3/12/2018; new additions are the image carousel for the Careers page, and the black outline and white text & shadows 
  for the "State of Wisconsin: Department of Corrections" header and the Search box shadows.
   Update 3/12 around noon:  Tristan C. requesting solid black text and new logo.
   Updated on 2/27/2020: Adding a class to over-ride some properties, like color (low contrast per WAVE Toolbar/ADA) for .panel-title
   Updated on 03/12/2020: Per Anna Neal, removing the highlight so focus is on COVID-19 banner 
   Updated on 12/20/2023: Added Google Fonts for Antonio, Montserrat and Source Sans Pro (called Source Sans 3 in GF).
   	== Adding the primary and secondary colors for the DOC Brand Guidelines
   Updated on 01/02/2024: "Apply Today" class for the upcoming Careers page.
   Updated on 04/17/2024: Broke up the button classes to be more general.
   Updated on 04/18/2024: Buttons are different sizes - they need to consistent. Largest is 233px, but needs to be responsive so trying 36% - final answer was 23%.
   Updated on 04/24/2024: Added .clsNoPDFIcon for any link to a PDF where the author does not want the PDF icon link.
   Updated on 07/19/2024: Added classes for DAI Policy page
   Updated on 07/30/2024: Added nav-pills code from Jeremiah Khang (TylerTech) so that it will match Production menus.
      - Needed to convert PX to REMs - here's one source: https://devdevout.com/px-to-rem


Updated on 08-28-2024 - BAF
  Classes to use for DIVs when simulating a TABLE. Code provided by DivTable.com 

Updated on 08-30-2024 - BAF: Added .embed-container classes for video.


Updated on 02-26-2025: Classes for a horizontal menu of links, as seen in the DCC General Information page.

 * -------------------------- */

// @import needs to be in the beginning of the <STYLE> section: 

@import url('https://fonts.googleapis.com/css2?family=Antonio');
@import url('https://fonts.googleapis.com/css2?family=Montserrat');
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3');



/* ------------------
   Human Resources
   -------------------*/

.clsHRButton
{
    background-color: #1D4F81;
    color: white;
    font-weight: bold;
    border: 1px solid #000;
}

.clsBSButtonRespond
{
    white-space: normal;
}

/* ------------------
   Side Menus 
   -------------------*/

.clsDeepBlueHeader
{
   background-color: #1D4F81 !important;
   color: #ffffff !important;
   font-weight: bold !important;
}

.clsDeepBlueHeader:focus,.clsDeepBlueHeader:active,.clsDeepBlueHeader:hover
 {
   background-color: #1D4F81 !important;
   color: #ffffff !important;
   font-weight: bold !important;
 }

/* ------------------
   Data and Research 
   -------------------*/

.clsDRAccordionHead
{
 font-family: raleway-regular; 
 font-weight: bold;
}

.clsDRAccordionHead div
{
  color: #777777;
  background-color: #f5f5f5; 
}

.clsDRAccordionHead div:hover
{
  background-color: #d3d3d3;
}


/*
 -----------------------------
  DAI Facility Address table
 -----------------------------
*/

.clsColHeader {
background-color:#b8cce4;
color: #000000;
font-weight:bold;
}

.clsColContent {
color: #000000;
}

.clsInitRow
{
   display: none;
}

@media only screen and (max-width:800px)
{
  #table-respond.clsTowerTable td
 {
   padding: 30px 0px 20px 5px;
 }
}




/*
 -------------------------------------------
  DCC Probation and Parole table
 -------------------------------------------
*/



 #divSelectionSearch
  {
    text-align: center;
    position: relative;
    display: block;
    font-size: 1.25em;
    font-weight: bold;
    padding: 0.75%;
    width: 95%;
  }


 #idSelectPnPCounty
  {
    padding-top: 0.5%;
    padding-left: 2%;
    padding-right: 2%;
    padding-bottom: 0.5%;
    font-size: 1.25em;
    position: relative;
    display: block;
    text-align: center;
    width: 95%;
  }


.clsDCCPnPTable
{
  width: 95%;
  border-collapse: collapse;
  border: 2px solid black;
}

.clsDCCPnPTable tr
{
  border: 2px solid black;
  width: 95%;
}

.clsDCCPnPTable td
{
   background-color: rgb(255,255,255);
   border: 2px solid black;
   text-align: left;
   font-weight: normal;
   position: relative;
   display: table-cell;
   padding: 1%;
   width: 95%;
}



.clsDCCPnPTable td:hover
{
   background-color: rgb(241,241,241);
}

.clsDCCPnPTable th
{
   border: 2px solid black;
   text-align: left;
   font-weight: bold;
   background-color: rgb(241,241,241);
   font-family: "Times New Roman", Georgia, Serif;
   font-size: 1em;
}



.clsDCCPnPTable tr:not(.clsNoResults) td:nth-child(3)::first-line
{
  font-weight: bold;  
}


.clsDCCPnPTable tr:not(.clsNoResults) a
{
  display: none;
}

.clsNoResults td:nth-child(3)
{
  font-style: italic;  
}


.clsDCCPnPTable td:nth-child(1), .clsDCCPnPTable td:nth-child(2)
{
  display: none;
}

.clsDCCPnPTable th:nth-child(1), .clsDCCPnPTable th:nth-child(2)
{
  display: none;
}


/* ------------------
   DAI Policy Index
   -------------------*/

.clsDAI_PI_AccordionHead
{
 font-family: raleway-regular; 
 font-weight: bold;
}

.clsDAI_PI_AccordionHead div
{
  color: white;
  background-color: #d3d3d3; 
}


.clsDAI_PI_AccordionHead div:hover
{
  background-color: #d3d3d3;
}

/* ------------------
   Bootstrap image carousel
   -------------------*/

.carousel-control *
 {
    background-image: none;
    box-shadow: none;
 }


/* ------------------------------------
   State title and search box stylings
   -----------------------------------*/
  

.state-title, .dept-title
{
    color: black;
    font-weight: bold;
    text-shadow:
     -1px -1px 0 white,
      1px -1px 0 white,
     -1px 1px 0 white,
      1px 1px 0 white;
}


#searchQuery
{
   box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.38);
   -moz-box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.38);
   -webkit-box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.38);
}

/* -------------------------------------------
   Careers menu item highlighting (10/03/2018)
   ------------------------------------------*/

/* (03/12/2020): Per Anna Neal, removing the highlight so focus is on COVID-19 banner 
UL.navbar-nav li.dropdown a[href$="Pages/Careers/default.aspx"]
{
    color: rgba(10,68,124,1.0);
    background-color: rgba(249,194,24,0.95);
}
*/


/* -------------------------------------------
   ADA (508 Accessibility) updates (02/27/2020)
     Mostly to fix contrast errors on the panels
   ------------------------------------------*/

.panel-title
{
   color: #4A4A4A !important;
   font-weight: bold;
}


/* -------------------------------------------
   Google Fonts updates (12/20/2023)
     Adding classes for Antonio, Montserrat and Source Sans 3
     These fonts are in the DOC Brand Guidelines
   ------------------------------------------*/


.clsBGFontAntonio
{
  font-family: "Antonio", sans-serif !important;
}

.clsBGFontMontserrat
{
  font-family: "Montserrat", sans-serif !important;
}

.clsBGFontSourceSans3
{
  font-family: "Source Sans 3", sans-serif !important;
}


/* Primary and secondary colors in the DOC Brand Guidelines, as classes:


.clsBGPrimary01_BG
{
  background-color: #34586E !important; /* San Juan: Blue with shades of grey; RGB(52,88,110) */
}

.clsBGPrimary01_FG
{
  color: #34586E !important; /* San Juan: Blue with shades of grey; RGB(52,88,110) */
}

.clsBGPrimary02_BG
{
  background-color: #FFD300 !important; /* Gold; RGB(255,211,0) */
}

.clsBGPrimary02_FG
{
  color: #FFD300 !important; /* Gold; RGB(255,211,0) */
}

.clsBGPrimary03_BG
{
  background-color: #4A8DB5 !important; /* Steel Blue; RGB(71,141,181) */
}

.clsBGPrimary03_FG
{
  color: #4A8DB5 !important; /* Steel Blue; RGB(71,141,181) */
}


.clsBGPrimary04_BG
{
  background-color: #4A4A4A !important; /* Charcoal; RGB(74,74,74) */
}

.clsBGPrimary04_FG
{
  color: #4A4A4A !important; /* Charcoal; RGB(74,74,74) */
}


/* *** SECONDARY PALETTE ***
 Secondary colors support the primary colors and should only be used as accents of subtle design elements like calls to action.
*/

.clsBGSecondary01_BG
{
  background-color: #334F60 !important; /* Pickled Bluewood; RGB(51,79,96) */
}

.clsBGSecondary01_FG
{
  color: #334F60 !important; /* Pickled Bluewood; RGB(51,79,96) */
}


.clsBGSecondary02_BG
{
  background-color: #8CBFD2 !important; /* Cyan Azure; RGB(140,191,210) */
}

.clsBGSecondary02_FG
{
  color: #8CBFD2 !important; /* Cyan Azure; RGB(140,191,210) */
}


.clsBGSecondary03_BG
{
  background-color: #447491 !important; /* Wedgewood (Blue with shades of green); RGB(68,116,145) */
}

.clsBGSecondary03_FG
{
  color: #447491 !important; /* Wedgewood (Blue with shades of green); RGB(68,116,145) */
}

.clsBGSecondary04_BG
{
  background-color: #EFB426 !important; /* Fuel Yellow/Bright Sun; RGB (239,180,38) */
}

.clsBGSecondary04_FG
{
  color: #EFB426 !important; /* Fuel Yellow/Bright Sun; RGB (239,180,38) */
}

.clsBGSecondary05_BG
{
  background-color: #E9E9E9 !important; /* White Smoke; RGB(233,233,233) */
}

.clsBGSecondary05_FG
{
  color: #E9E9E9 !important; /* White Smoke; RGB(233,233,233) */
}

.clsBGSecondary06_BG
{
  background-color: #A6A6A6 !important; /* Silver Chalice; RGB(166,166,166); */
}

.clsBGSecondary06_FG
{
  color: #A6A6A6 !important; /* Silver Chalice; RGB(166,166,166); */
}


.clsCareersApplyButton
{
  background-color: #FFD300;
  border: none;
  border-radius: 12px;
  user-select: none;
  color: #34586E !important;
  padding: 2%;
  padding-left: 3%;
  padding-right: 3%;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.50rem;
  font-weight: 700; // was: bold;
  margin: 4px 2px;
  cursor: pointer;
}

.clsCareersSideMenu
{
    font-family: "Source Sans 3", sans-serif !important;
}

.clsCareersSideMenu UL LI A
{
   font-weight: normal;
}

.clsCareersSideMenu UL LI A:hover
{
    color: #ffffff !important;
    background-color: #044AAD !important;
    font-weight: bold !important;
}

.clsCareersBaseButton
{
  border: none;
  border-radius: 12px;
  user-select: none;
  padding: 2%;
  padding-left: 3%;
  padding-right: 3%;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.50rem;
  font-weight: 700;
  margin: 4px 2px;
  cursor: pointer;
  width: 23%;
}

.clsCareersApplyNow
{
  background-color: #FFD300 !important;
  color: #34586E !important;
}

.clsCareersLB
{
  background-color: #004aad !important;
  color: #ffffff !important;
  padding: 16.25px 24.3892px !important;
}

.clsCareersRB
{
  background-color: #ffd500 !important; 
  color: #004aad !important;
  padding: 16.25px 24.3892px !important;
}


.clsNoPDFIcon[href$=".pdf"]::before
{
  content: "" !important;
  display: none !important;
}

.clsNoPDFIcon[href$=".PDF"]::before
{
  content:"" !important;
  display:none !important;
}


/* -------------------------------------------
   DAI Policies page (07/19/2024)
   ------------------------------------------*/


  .clsRowLink {;}
  .clsRowLink:hover {background-color: aqua !important; color: black !important; cursor:pointer !important;}
  .clsPolicyFormat {font-weight: bold !important;}
  .clsHiddenLink {display: none !important;}
  .clsDAI_PI_AccordionHead {text-align: center !important;}

  .clsHDI {
       position: relative !important;
       float: right !important;
       text-align: right !important;
       align: right !important;
       left: 75% !important;
        }
 
   TD.clsPolicyNumberCOL
   {
        display: table-cell !important;
        width: 17% !important;
        height: auto !important;
   }

   TD.clsPolicyTitleCOL
   {
       display: table-cell !important;
       width: 60% !important;
       height: auto !important;
   }

   TD.clsPolicyAudienceCOL
   {
       display: table-cell !important;
       width: 13% !important;
       height: auto !important;
   }

   TD.clsPolicyEffDateCOL
   {
       display: table-cell !important;
       width: 10% !important;
       height: auto !important;
   }


/******************************************** CUSTOM SIDEBAR NAVIGATION */ 

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { 
color: #ffffff; 
background-color: #114c86; 
padding-left:5px; 
border-radius:1px; 
font-weight:bold;
margin-top: 10px !important;
margin-bottom: 10px !important;
} 
.nav-pills > li > a { 
color: #0066cc; 
padding: 8px 15px !important; 
}

/* (08-28-2024) - BAF
  Classes to use for DIVs when simulating a TABLE. 
  Code provided by DivTable.com 
*/

.divTable
{
  display: table;
  width: 100%;
}

.divTableRow 
{
  display: table-row;
}

.divTableHeading 
{
  background-color: #EEE;
  display: table-header-group;
}

.divTableCell, .divTableHead 
{
  border: 1px solid #999999;
  display: table-cell;
  padding: 3px 10px;
}

.divTableHeading 
{
  background-color: #EEE;
  display: table-header-group;
  font-weight: bold;
}

.divTableFoot 
{
  background-color: #EEE;
  display: table-footer-group;
  font-weight: bold;
}

.divTableBody 
{
  display: table-row-group;
}

.embed-container 
{ 
  position: relative; 
  padding-bottom: 56.25%; 
  height: 0;
  overflow: hidden;
  max-width: 100%;
} 

.embed-container iframe, .embed-container object, .embed-container embed
{ 
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* 02-26-2025: Classes for a horizontal menu of links, as seen in the DCC General Information page. */

.clsHorizontalListMenu
{
	display:inline-block;
	list-style:none;
	margin:0;
	padding:0;
	text-align:center;
}

.clsHorizontalListMenu LI
{ 
	background-color: white; 
	border: 1px solid blue;
	border-radius: 5px; 
	color: black;
	float:left;
	font-weight: bolder; 
	padding: 0.5%;
}

.clsHorizontalListMenu LI:focus
{ 
	background-color: black; 
}

.clsHorizontalListMenu LI:hover
{ 
	background-color: black; 
}

.clsHorizontalListMenu LI:hover A
{ 
	color: white;
}

.clsHorizontalListMenu LI:hover A
{ 
	color: white; 
}