 
/********************************** GLOBAL ************************************/
@font-face {
  font-family: "MontanArtsCouncil";
  src: url("https://art.mt.gov/fonts/MontanArtsCouncil.woff2");
  font-kerning: normal;
}
@font-face {
  font-family: "OpenFace";
  src: url("OpenSans-VariableFont_wdth_wght.ttf");
}
@font-face {
  font-family: "Supreme";
  src: url("https://art.mt.gov/fonts/Supreme-Regular.woff");
}
 body {
}
 h1 {
	 text-align: center;
	 font-family: MontanArtsCouncil;
	 letter-spacing: 0.05rem;
}
 h2 {
	 text-align: left;
	 font-family: MontanArtsCouncil;
	 letter-spacing: 0.05rem;
}
 h3 {
	 text-align: left;
	 font-family: MontanArtsCouncil;
	 letter-spacing: 0.05rem;
	 font-size: large;
}
 p {
	 text-align: left;
	 font-family: Helvetica;
}
 a {
}
 a:hover {
}
 fieldset, form, table {
	 margin: 0;
}
 figure{
	 margin: 15px 15px 15px 15px;
	 padding: 15px 15px 15px 15px;
	 border: 1px solid #ccc;
	 border-radius: 16px;
	 background-color: #ffffff;
	 box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
	 text-align: left;
}
 figure img{
	 display: block;
	 border-radius: 12px;
	 margin:0 auto;
	 border: 1px solid #ccc;
}
 figure>figcaption {
	 font-size: 14px;
	 text-align: center;
	 margin-top: 10px;
	 margin-bottom: 10px;
	 font-style: italic;
}
 blockquote {
     background: #f9f9f9;
     border-left: 10px solid #ccc;
	 padding: 30px;
	 margin: 0 0 20px;
	 border: 2px solid #e8eaed;
}
 blockquote:before {
	 content: "\f10d";
	 font-family: "Font Awesome 5 Free";
	 width: 50px;
	 height: 50px;
	 line-height: 70px;
	 text-align: center;
	 border-radius: 50%;
	 color: #3E5B5D;
	 font-size: 30px;
	 background: #fff;
	 border: 2px solid #e8eaed;
	 float: left;
	 margin-right: 10px;
	 font-weight:900;
}
blockquote .blockquote-footer {
	 color: #ffffff;
}
 iframe{
	 border:0;
}
a:link {color: #1209ad;
    
}
hr { 
  display: block;
  width: 100%;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: auto;
  margin-right: auto;
  border-style: inset;
  border-width: 1px;
} 
/*******************ROUNDED CORNERS FOR FIGURES********************************/
#div1 {
  border-radius: 25px;
  background-color: #04AA6D;
  padding: 20px; 
  width: 200px;
  height: 150px;  
}

#div2 {
  border-radius: 5px;
  border: 2px solid #04AA6D;
  padding: 20px; 
  width: 200px;
  height: 150px;  
}
/*********************************** TOOLS ************************************/
 .sticky-top {
	 top: 4em;
}
 .side.sticky-top{
	 top: 135px;
}
 .container {
	 max-width: 93%;
}
 .hide{
	 display:none;
}
 .anchor{
	 display: block;
	 height: 120px;
	 margin-top: -120px;
	 visibility: hidden;
}
 .no-border{
	 border: 0;
}
 .row.bg-light{
	 margin-bottom:30px;
	 padding:30px;
	 background:#323a45 !important;
	 color:#fff;
	 font-size: 130%;
}
 .row.bg-light h3 {
	 font-size: 35px;
	 margin-bottom: 30px;
}
 .row.bg-light a, .row.bg-light a:hover {
	 color:#fff;
}
/********************************** TEMPLATE.MT.GOV ***************************/
/*Amber Alert*/
body.amber-alert .sticky-top{
	top: 112px;
}
body.amber-alert header .logo.tiny {
	top: 50px;
}

/* #template-layout-push {
	 height: 64px;
}
 */
/********************************** HEADER ************************************/
 header {
	 position: relative;
}
 header .logo {
	 display: block;
	 position: absolute;
	 top: -100px;
	 left: 50%;
	 transform: translate(-50%, 0);
	 width: 200px;
}
 header .logo.tiny {
	 position: fixed;
	 top: 2px;
	 width: 60px;
	 transition: all 0.4s ease-in-out 0s;
	 z-index: 999;
}
 .heading {
	 padding: 100px 30px 15px 30px;
	 background: rgba(138,193,64,1);
	 border: 0px solid rgb(255,255,255);
	 border-bottom: 0;
	 font-family: MontanArtsCouncil, sans-serif;
	  color: #ffc074;
	 font-size: 20px;
}
 .heading .display-5 {
	 color: #fff;
	 font-size: 2.5rem;
	 font-weight: 300;
	 text-shadow: 0px 0px 0px rgba(0,0,0,0.4);
}
 .heading .lead {
	 font-size: 3rem;
	 font-style: italic;
	 font-family: MontanArtsCouncil, sans-serif;
}
/*********************************** NAV **************************************/
 .navbar {
	 background-color: #ffffff;
	 padding-top:0;
	 padding-bottom:0;
	 color: #F56F31 #newColor !important;

}

.navbar-light .navbar-nav .nav-link {
color: rgba(0, 0, 0, 1);
}

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
color: rgba(237, 139, 50, 1);
}

 .nav-link {
	 padding: 1rem;
}
 li.dropdown.mega-menu-dropdown{
	 position: static;
}
 .dropdown.show{
	 background:#fff;
}
 .dropdown-menu.mega-menu {
	 margin: 0;
	 border: none;
	 border-radius:0;
}
 .dropdown-menu a:not(.btn), .footer a:not(.btn){
	 color: rgba( 0,0,0,1);
}
 .dropdown-menu a:not(.btn):hover, .footer a:not(.btn):hover{
	 color: rgba(0,0,0,1);
}
/********************************** SEARCH ************************************/
/* hide default google search box */
 form.gsc-search-box.gsc-search-box-tools {
	 display: none;
}
/* overide padding on invisible div */
 .gsc-control-cse{
	 padding:0 !important;
}
 .gsc-control-cse {
	 border: none !important;
}
/*********************************** MAIN *************************************/
 #content-wrapper {
	 padding-top: 175px;
}
 #banner{
	 margin-top: -75px;
}
 main {
	 padding: 15px;
}
 .frame {
	 width: 50%;
	 margin: 0 auto 15px auto;
	 padding: 15px 15px 0 15px;
	 border: 1px solid #ccc;
	 text-align: center;

}
 .frame .portrait {
	 display: block;
	 width: 100%;
	 border: 1px solid #ccc;
}
/***************************** WIDGETS ****************************************/
 .content-block:not(:last-child){
	 margin-bottom:30px;
}
/***************************** TILES ******************************************/
 .hovereffect {
	 width: 100%;
	 height: 100 %;
	 float: left;
	 overflow: hidden;
	 position: relative;
	 text-align: center;
	 cursor: default;
	 background: #030303;
	 border: 2px solid white;
     outline: #ffffff solid 10px;
	 border-radius: 0px 0px 0px 0px;
}
 .hovereffect .overlay {
	 width: 100%;
	 height: 100 %;
	 position: absolute;
	 overflow: hidden;
	 top: 0;
	 left: 0;
	 color: #ff6404;
	 padding: 20px 20px 20px 20px;
}
 .hovereffect img {
	 display: block;
	 position: relative;
	 object-fit: cover;
	 max-width: 100%;
	 max-height: 400px;
	 width: calc(100% + 0px);
	 -webkit-transition: opacity 2s, -webkit-transform 1s;
	 transition: opacity 2s, transform 1s;
	 -webkit-transform: translate3d(30,-20,30);
	 transform: translate3d(0,-20,0);
	 -webkit-backface-visibility: hidden;
	 backface-visibility: hidden;
	 border: 2px solid white;
     outline: #ffffff solid 10px;
	 border-radius: 0px 0px 0px 0px;
}
 .hovereffect:hover img {
	 opacity: .2;
	 filter: alpha(opacity=80);
	 -webkit-transform: translate3d(30,-20,30);
	 transform: translate3d(30,-20,30);
}
 .hovereffect h2 {
	 position: relative;
	 overflow: hidden;
     padding-right: 0px;
     padding-left: 0px;
	 background-color: rgba(0,0,0, .4);
	 font-family: MontanArtsCouncil, sans-serif;
	 text-transform: none;
	 color: #ffffff;
	 text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
	 text-align: center;
}
 .hovereffect h2:after {
	 position: absolute;
	 bottom: 0;
	 left: 0;
	 width: 100%;
	 height: 2px;
	 background: #ffffff;
	 content: '';
	 -webkit-transition: -webkit-transform 1s;
	 transition: transform 1s;
	 -webkit-transform: translate3d(-100%,0,0);
	 transform: translate3d(-100%,0,0);
}
 .hovereffect:hover h2:after {
	 -webkit-transform: translate3d(0,0,0);
	 transform: translate3d(0,0,0);
}
 .hovereffect p {
	 color: #fff;
	 opacity: 0;
	 filter: alpha(opacity=0);
	 -webkit-transition: opacity 1s, -webkit-transform 1s;
	 transition: opacity 1s, transform 1s;
	 -webkit-transform: translate3d(100%,0,0);
	 transform: translate3d(100%,0,0);
}
 .hovereffect:hover p {
	 opacity: 1;
	 filter: alpha(opacity=100);
	 padding-right: 80px;
     padding-left: 80px;
	 -webkit-transform: translate3d(0,0,0);
	 transform: translate3d(0,0,0);
}
/********************************* CAROUSEL ***********************************/
 .carousel {
	 width: 100%;
	 border-radius: 10px 10px 10px 10px;
}
/********************************** CARDS *************************************/
 .card-img-top {
	 background-size: cover;
}
 .card-horizontal {
	 display: flex;
	 flex: 1 1 auto;
}
 .card-horizontal img{
	 max-width:400px;
	 
img {
  border-radius: 20% 20% 20% 20%;
}	 
	 
}
 .cards a:hover .card {
	 background-color: #f5f5f5;
}

 .card-body:empty {
	 display: none;
}
 .card-title{
	 font-weight:bold;
	 text-align:center;
	 font-family: MontanArtsCouncil, sans-serif;
	 color: #595959;
}
/**************************** ACCORDIONS/TABS *********************************/
 .nav-tabs {
	 display:none;
}
 .tab-content{
	 padding: 30px;
}
 @media(min-width:768px) {
	 .nav-tabs {
		 display: flex;
	}
	 .tab-content .card {
		 border: none;
	}
	 .tab-content .card .card-header {
		 display:none;
	}
	 .tab-content .card .collapse{
		 display:block;
	}
}
 @media(max-width:767px){
	 .tab-content > .tab-pane {
		 display: block !important;
		 opacity: 1;
	}
}
/********************************** SIDE NAV **********************************/
 .list-group{
	 border-radius: 0;
}
 .list-group a{
	 background-color: #557677;
	 color: #fff;
}
 .list-group-item.active {
	 color: #3E5B5D;
	 background-color: #fff;
	 border-color: #3E5B5D;
}
 .list-group-item-action:active {
	 color: #212529;
	 background-color: #e9ecef;
}
 .list-group-item-action:focus, .list-group-item-action:hover {
	 color: #fff;
	 background-color: #3E5B5D;
}
/****** Simple DataTables Styles *********************/
/***** AGENCY Mobile Tables STYLE ***/
.me-auto {
    /*** Bootstrap 5 class and style needed for table pagination buttons ***/
    margin-right: auto !important;
}
 .mobileTables th, .mobileTables th button, .mobileTables table.table.dataTable>:not(caption)>*>th {
     /* These are for the table column headers */
     background: rgba(222, 109, 29, 1);
     color: #fff;
     align-content: center;
}
/*Pagination*/
/* These are for the table pagination buttons */
 .mobileTables .page-item.active .page-link {
     background-color: rgba(222, 109, 29, 1);
     border-color: rgba(222, 109, 29, 1);
     color: #fff;
}
 .mobileTables .page-link {
     color: rgba(222, 109, 29, 1);
}
.datatable-pagination a,
.datatable-pagination button {
    border: 3px solid transparent;
}
.datatable-pagination a:hover,
.datatable-pagination button:hover {
    background-color: unset;
    border: 3px solid rgb(237, 149, 54);
}
/***** end AGENCY STYLE ***/
/****** END Table - Simple DataTables Styles *********************/
/********************************** FOOTER ************************************/
 .footer {
	 padding: 30px;
	 background: #EBE9E7;
}
 .footer h4 {
	 width: 100%;
	 text-transform: uppercase;
	 border-bottom: 1px solid #eee;
}
 .footer hr {
	 border-top: 1px solid #ddd;
}
 .footer img {
	 display:block;
	 margin:0 auto;
}
 #social img{
	 display:block;
	 width:24px;
}
 #back-to-top {
	 position: fixed;
	 bottom: 79px;
	 right: 15px;
	 display: none;
	 z-index:99;
}
/******************************** RESPONSIVE **********************************/
/*Extra large devices (large desktops, 1200px and down)*/
 @media (max-width: 1200px) {
	 header .logo {
		 top: -50px;
		 width: 100px;
	}
	 .heading {
		 padding-top: 55px;
	}
}
/*Large devices (desktops, 992px and down)*/
 @media (max-width: 992px) {
	 .card-horizontal {
		 display: block;
	}
	 .card-horizontal img{
		 display:block;
		 margin:0 auto;
	}
}
/*Medium devices (tablets, 768px and down)*/
 @media (max-width: 768px) {
	 #content-wrapper {
		 padding-top: 60px;
	}
	 .sticky-top {
		 top: 0;
	}
	 .navbar-nav .nav-link {
		 text-align: center;
	}
	 .navbar .form-inline .input-group {
		 margin: 0 auto;
	}
	 #back-to-top {
		 bottom: 15px;
	}
}
/*Small devices (landscape phones, 576px and down)*/
 @media (max-width: 576px) {
   
}
 
 /******************************** IFRAME CONTAINER ***************************/
 .container {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio */
}

/* Then style the iframe to fit in the container div with full height and width */
.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}