/*Main Sizing and Settings*/

	body, h1, h2, h3, h4, h5 {
		/*font-family: 'Myriad Pro', sans-serif;*/
		color: inherit;
    
	}

	body {
		font-size: 1.15em;
	}

	@media (max-width: 899px){
		body {
		font-size: 1em;
	}

	} 

	h1 {
		font-size: 160%;
		font-weight: 700;
	}

	h2 {
		font-size: 135%;
    
	}
	h3 {
		font-size: 112%;
	}

    h4 {
		font-size: 105%;
	}

	.row {
	margin: 0; 
	padding: 0;
	}


  hr { 
  display: block;
  border-width: 2px;
  border-color:#3Bc4E6;
}

/**************Custom for Breakpoint adjustment for specific content (used on services.htm for collage images)*******/
	.largescreen{
	display: block;
	}

	@media(max-width: 1024px){
		.largescreen{
	display: none;
	}
	}

	.smallscreen{
	display: center-block;

	}

	@media(min-width: 1025px){
		.smallscreen{
	display: none;
	}
	}


/*Base Link Settings*/

	a {
		color: #2D6A9E;/*#428bca*/
		font-weight: 600;
		/*border-bottom: 2px dotted;*/
		/*text-decoration: #428bca underline;*/
		background-color: transparent;
	}

	.nodot a {
		border-bottom: none;
		text-decoration: none;
	}

/*Main Panel and Accordion Settings*/
	.panel-default > .panel-heading {
		background-color: #213E7F;
		color: #fff;
		text-decoration: none;
		font-weight: 600;
		font-size: 105%;
	}

	.panel-default > .panel-heading a{
		font-size: 105%;
		color: #fff;
		text-decoration: underline;
	}


/*Colors and font settings for dividing pages into sections*/

	.style2 {
		background-color:  #213E7F;
		color: #fff;
		padding: 5px;
		/*text-align: center;*/
		margin: 1em 0;
		width: 100%;
		border-top: 20px double #F2C50B;
    
	}

    .style2b {
		background-color:  #213E7F;
		color: #fff;
		padding: 5px;
		/*text-align: center;*/
		margin: 1em 0 2em;
		width: 100%;
		border-bottom: 20px double #F2C50B;
    
	}

	.style2 h3 a, .style2b h3 a{

		color: #F2C50B;
		font-size: 1.15em;
		font-size: 110%;
		margin: 0.25em 0 0;
 
		text-align: center;

	}

	.style3 {
		border-top: 10px double #52A3d4;
		margin: 10px 0 20px;
		background-color:  #f9f9f9;
		border-bottom: 5px solid #F2C50B;
		padding-bottom: 10px;
		padding-top: 20px;
    
    
	}

	.style4 {
		border-top: 20px double #F2C50B;

		background-color:  #f5f5f5;
		/*border-bottom: 5px solid #F2C50B;*/
		padding-bottom: 50px;
		padding-top: 20px;
		margin-bottom: -25px;
    
    
	}
    
    .style5 {
		border-top: 5px solid #3Bc4E6;
		/*background-color:  #f5f5f5;*/
		/*border-bottom: 5px solid #F2C50B;*/
		padding-bottom: 50px;
		padding-top: 20px;
		margin-bottom: -25px;
	}
       
    .style6 {
		background-color: #E0F3FF;
		color: #000;
		padding: 25px;
		margin: 1em 0em 2em 2em;
		width: 95%;
		border-bottom: 5px single #F2C50B;
	}



/*Custom Headers*/

	h2.highlight {
    
		padding: 0.15em;
		position: relative;
		top: -0.5em;
		font-weight:700;
		text-align: left;
    
    
	}

    h2.highlight2 {
        color: #213E7F;
		margin: 0.75em 0 0.15em 0;
		padding: 0.2em;
		position: relative;
		top: -0.5em;
		font-weight:700;
		border-bottom: 2px double #213E7F;
	}

	h3.highlight {
		color: #213E7F;
		/*background-color: #D6D5B8#efefef;*/
			/*letter-spacing: -0.025em;*/
		margin: 0.75em 0 0.15em 0;
		padding: 0.2em;
		position: relative;
		top: -0.5em;
		font-weight:700;
		border-bottom: 2px double #213E7F;
   
    
	}

	h3.highlight2 {
		color: #065C69;
		/*background-color: #D6D5B8/*#efefef*/
		font-size: 130%/*1.25em*/;
		/*letter-spacing: -0.025em;*/
		margin: 0.75em 0 0.15em 0;
		padding: 0.2em;
		position: relative;
		top: -0.5em;
		font-weight:800;
		border-bottom: 1px solid #065C69;
    
	}


	@media (max-width: 1180px) {
		h3.highlight {
		color: #065C69;

		margin: 0.75em 0 0.15em 0;
		padding: 0.2em;
		position: relative;
		top: -0.5em;
		font-weight:800;
		border-bottom: 2px double #065C69;
		border-radius: 2px;
		}

		h3.highlight2 {
		color: #065C69;
		/*background-color: #D6D5B8/*#efefef*/
		font-size: 125%/*1.25em*/;
		/*letter-spacing: -0.025em;*/
		margin: 2em 0 0.15em 0;
		padding: 0.2em;
		position: relative;
		top: -0.5em;
		font-weight:800;
		border-bottom: 2px double #065C69;
		border-radius: 2px;      
		}
	}


/*FOOTER*/

	.footer {
		background-color: #213E7F;
		border-top: 10px solid #3Bc4E6;
				/*background-image: url("images/bg02.png"), url("images/bg03.png"), url("images/bg01.png");
				background-position: top left,						bottom left,					top left;
				background-size: 100% 6em,						100% 6em,						auto;
				background-repeat: no-repeat,						no-repeat,						repeat;*/
				color: #fff;
				padding: 7px 1px;
				/*text-align: center;*/
				margin-top: 1em;  
	}

	@media (max-width: 899px){
		.footer{      
		font-size: 80%; 
	}
		}



	.footer a, .footer a:visited {
	color:#F7D550;
	/*text-decoration: underline dotted;*/
	background: none;
	border: none;
	padding: 2px;
	transition: none;
	border-radius: 2px;
	}

	.footer a:hover {
	color:#213E7F;
	text-decoration: none;
	background-color: #fff;
	padding: 2px;
	border: none;
	transition: none;
	border-radius: 2px;
	}

    .imgfooter a:hover {
    background: none;
	}


	.footer2 { /*Quick Links section*/
		background-color: #fff;
		color: #213E7F;
		padding: 4px 2px;
          
	}


	.footer3 { /*Copyright section*/
		background-color: #213E7F;
		color: #fff;
		padding: 7px 1px;
		margin-top: 0.5em;
          
	}


/*****EXTERNAL and APP LINK ICONS**********/

/* Add Icon to external links - make sure to use relative for DARS content */
a[href^="http://"]:before,
a[href^="https://"]:before,
a[href$='.aspx']:before{
  content: url('../images/icons/global_sm.png');
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  padding-left: 5px;
  vertical-align: middle;
  
}

/*Removes external link from in front of app links of pdf, word, excel, ppt ---- focuses on type of file instead
Also removes from VITA Banner
*/
a[href^="https://www.virginia.gov"]:before,
a[href$='.pdf']::before,
a[href$='.doc']::before,
a[href$='.docx']::before,
a[href$='.xls']::before,
a[href$='.xlsx']::before,
a[href$='.ppt']::before,
a[href$='.pptx']::before,
a[href$='.wmv']::before { 
  content: none;
}


/*Add PDF icon to any link that ends in .pdf*/
a[href$='.pdf']::after { 
  content: url('../images/icons/pdf.gif');
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  padding-left: 5px;
  vertical-align: top;
}


/*Add Word icon to any link that ends in .doc, .docx*/
a[href$='.doc']::after,
a[href$='.docx']::after { 
  content: url('../images/icons/doc.gif');
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  padding-left: 5px;
  vertical-align: middle;
}

/*Add Excel icon to any link that ends in .xls, .xlsx*/
a[href$='.xls']::after,
a[href$='.xlsx']::after { 
  content: url('../images/icons/xls.gif');
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  padding-left: 5px;
  vertical-align: middle;
}

/*Add PPT icon to any link that ends in .ppt, .pptx, .pps*/
a[href$='.ppt']::after,
a[href$='.pptx']::after,
a[href$='.pps']::after { 
  content: url('../images/icons/ppt.gif');
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  padding-left: 5px;
  vertical-align: middle;
}



/* Add Icon to email links */
a[href^=mailto]::before {
    content: url('../images/icons/mail_sm.png');
    font-weight: normal;
    font-style: normal;
    display: inline-block;
    text-decoration: inherit;
    padding-right: 1px;
    padding-bottom: 5px;
    vertical-align:middle;

}

/* Add class to remove external link icon - Footer and also for DARS sites that are different URLs - such as VDA*/
.noext a[href^="http://"]:before,
.noext a[href^="https://"]:before{
    content: none;
}

/* Add class to remove PDF icon - currently used for footer*/
.noPDF a[href$='.pdf']::after { 
    content: none;
}

/* Add class to external links in menu. items need class="menuexit" added in the nav.htm include ONLY on text <li> that leave site NOT on images*/
.menuexit a[href^="http://"]:after,
.menuexit a[href^="https://"]:after {
  content: url('../images/icons/right-arrow15.png');
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  padding-left: 5px;
  vertical-align: middle;
}



/*FANCY NAV/Header*/

	/* Wrapper for page content to push down footer */
	#wrap {
	  min-height: 100%;
	  height: auto !important;
	  height: 100%;
      margin-top: -30px; /*fixed extra white space*/
	}

    @media (max-width: 991px){
	#wrap {
	
      margin-top: 0px; /*fixed extra white space*/
	}

    }


	/* Set the fixed height of the footer here */
	#footer {
	  background-color: #eeecec;
	  margin-top:10px;
	  padding-top:20px;
	  padding-bottom:20px;
	  color: #000;
  
	}


/*Images Customization*/

	.imgleft {/*Used for images and icons where float is not enough for margin/padding*/
		float: left;
		margin-bottom: 0.5%;
		margin-right: 10px;
	}


	.imgright {/*Used for images and icons where float is not enough for margin/padding*/
		float: right;
		margin-bottom: 0.5%;
		margin-left: 10px;
	}




/**********BREADCRUMB EDITS**********/

.breadcrumb { /*change breadcrumb background color*/
     background-color: rgb(250, 250, 250);
     border-radius: 0;
     -moz-border-radius: 0;
     -webkit-border-radius: 0;
     -o-border-radius: 0;
     padding: 2px 30px;
}
    .breadcrumb li {
        font-size: 1em;
    }


.breadcrumb a { /*change breadcrumb links color*/
     color: #666;
     border-radius: 5px;
     font-size: 1em;
     padding: 1px;
}

.breadcrumb a:hover {
     text-decoration: none;
     background-color: #2D6A9E/*#428bca*/;
     color: #fff;
     padding: 1px;
}

.breadcrumb > .active {
/*change active color*/
     color: #2D6A9E;/*#428bca*/
     font-weight:600;
     font-size: 1em;
     padding: 1px;


}

.breadcrumb-item+.breadcrumb-item::before {
 
    content: "•";
 
 
}
 
/*********CAROUSEL FORMATTING************/


.carousel-caption {
  position: absolute;
  right: ((100% - $carousel-caption-width) / 2);
  bottom: 20px;
  left: ((100% - $carousel-caption-width) / 2);
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: $carousel-caption-color;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.7);
  padding-left: 15px;
  padding-right: 15px;

}

@media (max-width: 1279px){
	.carousel-caption {
  position: absolute;
  right: 5%;
  bottom: 20px;
  left: 5%;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: $carousel-caption-color;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.6);
  padding-left: 8px;
  padding-right: 8px;
  font-size: 87%;

}
}

.carousel-caption a{
	color: #F2C50B;
	text-decoration: underline;
}

.carousel-caption h3{
	font-size: 120%;
}

.carousel-indicators li {
  width: 10px;
  height: 10px;
  border-radius: 100%;
}


.carousel-control-prev-icon {
    background-image: url(../images/sign-left.png);

}

.carousel-control-next-icon {
    background-image: url(../images/sign-right.png)
}



.carousel-control-next, .carousel-control-prev{
    width: 7%;
    opacity: 1;
}


/* Icons for within*/
.carousel-control-prev-icon,
.carousel-control-next-icon {

  width: 35px;
  height: 35px;

}

@media (max-width: 800px){
.carousel-control-prev-icon,
.carousel-control-next-icon {

  width: 20px;
  height: 20px;

}
}




/*************OLD VERSION****************/
/*.carousel-indicators { 
    bottom:-40px;
	left:0;
	width:100%;
	background: #213E7F;
	padding: 6px 0px;
	margin-left:0;
	border-top:2px solid #fff;
}
.carousel-indicators li {
	width:12px;
	height:12px;	
	background:#fff;
	border-color:#fff;
 
}
.carousel-indicators .active {
	width:14px;
	height:14px;
	background:#2D6A9E;
	border-color:#2D6A9E;
}



.carousel-control-next, .carousel-control-prev{
    width: 7%;
    opacity: 1;
}


.carousel-control-prev-icon {
 background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#213E7F' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#213E7F' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}
.carousel-item{
    width: 90%;
	margin-left: 5%;
	min-height: 250px;
}
@media (max-width: 1024px){
	.carousel-item{
    width: 90%;
	margin-left: 5%;
	min-height: 275px;
}

}*/



/************News Release Tabs********************/
.tabs {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 20px;
  
}
#tab-button {
  display: table;
  table-layout: fixed;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
#tab-button li {
  display: table-cell;
  width: 20%;
}
#tab-button li a {
  display: block;
  padding: .5em;
  background-color: #eee;
  border: 1px solid #ddd;
  text-align: center;
  color:#213E7F;
  text-decoration: none;
}
#tab-button li:not(:first-child) a {
  border-left: none;

}
#tab-button li a:hover {
  border-bottom-color: transparent;
  background-color: #213E7F;
  color: #fff;
  font-weight: 700;
}

#tab-button .is-active a {
  border-bottom-color: transparent;
  background: #2D6A9E;
  color: #FFF;
  font-weight: 700;
}

.tab-contents {
  padding: .5em 2em 1em;
  border: 1px solid #ddd;
}

.tab-button-outer {
  display: none;
}
.tab-contents {
  margin-top: 20px;
}
@media screen and (min-width: 768px) {
  .tab-button-outer {
    position: relative;
    z-index: 2;
    display: block;
  }
  .tab-select-outer {
    display: none;
  }
  .tab-contents {
    position: relative;
    top: -1px;
    margin-top: 0;
  }
}


/******Homepage Services Buttons*******/

.btn-custom {
	color: #000;
	background-color: #e9e9e9;
    border: 2px solid #52A3d4;
	border-radius: 7px;
	white-space: normal;
}

.btn-custom:hover {
	background-color:  #213E7F;
    color: #fff;
}


.btn-custom.focus, .btn-custom:focus {
	
	box-shadow: none;
}

.card {
	font-size: 110%;
}

.btn-custom h3{
	font-size: 120%;
}

input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: searchfield-cancel-button;
}


/* BUILDING TRADES TABLES */
.building-trades-tables, .building-trades-tables th, .building-trades-tables td {
	border: 2px solid rgba(0, 0, 0, .1);
	border-collapse: collapse;
}
.building-trades-tables {
	margin: 10px 0px 20px 0px;
}
#construction-laborer, #construction-related {
	font-size: 24.84px;
	font-weight: 600;
}
@media screen and (max-width: 899px) {
	#construction-laborer, #construction-related {
		font-size: 21.6px;
		font-weight: 600;
}
}

/* BUILDINGS TRADES PAGE OTHER STYLES */
.train-prog-description {
	margin: 20px 0px 0px 0px;
}
.building-trades-row {
	padding-top: 30px;
}


/* VOCATIONAL SKILLS RECORD BUTTON DESING TEST */	
/* .vsr {
	text-align: center;
}
.voc-skills-rec {
	width: fit-content;
	background-color: #B8DAFF;
	border: 0px;
	border-radius: 25px;
	padding: 5px 20px 5px 20px;
}
.voc-skills-rec a { 
	color: #ffffff;
} */


/* BEGINNING TWO COLUMN LAYOUT */
/* .photo-building-trades-01 {
	width: 100%;
	float: left;
	margin: 0px 0px 20px 0px;
	background-color: rgba(0, 0, 0, 0.05);
}
@media screen and (max-width: 768px) {
	.photo-building-trades-01 {
		width: 100%;
		margin: 0px 0px 20px 0px;

}
} */

/* BEGINNING ONE COLUMN LAYOUT -START */
.photo-building-trades-01 {
	width: 50%;
	float: left;
	margin: 0px 30px 8px 0px;
	background-color: rgba(0, 0, 0, 0.05);
}
@media screen and (max-width: 768px) {
	.photo-building-trades-01 {
		width: 100%;
		margin: 0px 0px 8px 0px;
}
}
@media screen and (min-width: 769px) {
	.construction-list {
		columns: 1;
		-webkit-columns: 1;
        -moz-columns: 1;
}
}
/* BEGINNING ONE COLUMN LAYOUT - END */


/* CANVAS AND CLOSINGS/DELAYS/EVENTS CLANEDAR BAR AT TOP OF HOMEPAGE PAGE default.htm - START */
.welcome-header-group {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	flex-wrap: wrap;
	column-gap: 25px;
	row-gap: 7px;
	position: relative;
	width: 100%;
	border-top: 2px solid rgba(0, 0, 0, .05);
	border-bottom: 2px solid rgba(0, 0, 0, .05);
	padding: 10px 30px 10px 30px;
	margin-bottom: 25px;
	background-color: rgb(245, 245, 245);
}
.welcome-heading {
	display: block;
	position: relative;
}
.canvas a {
	display: flex;
	justify-content: flex-start;
	color: rgb(255, 0, 0);
	font-size: 16px;
	font-weight: 700;
}
.canvas img {
	width: 25px;
	height: 25px;
	margin-right: 7px;
}
.canvas p {
	margin-bottom: 0px;
}
.special-announcements a {
	display: flex;
	justify-content: flex-start;
	color: rgb(255, 0, 0);
	font-size: 16px;
	font-weight: 700;
}
.special-announcements img {
	width: 25px;
	height: 25px;
	margin-right: 7px;
}
.special-announcements p {
	margin-bottom: 0px;
}
.breadcrumb-homepage {
	margin-bottom: 0px !important;
}

@media screen and (max-width: 450px) {
	.welcome-header-group {
		justify-content: flex-start;
	}
}

@media screen and (max-width: 992px) {
	.container-fluid-welcome {
		margin-top: 0px !important;
	}
}
/* CANVAS AND CLOSINGS/DELAYS/EVENTS CLANEDAR BAR AT TOP OF HOMEPAGE PAGE default.htm - END */