/*****************************************/
/********** MAIN ELEMENTS ***********/
/*****************************************/
body 
{ 
	background-color: #333333;
	color: #333333;
	font-family: 'latino-urw,serif';
	font-size: 16px;	
}

hr {display: block; position: relative; padding: 0; margin: 8px auto; height: 0; width: 50%; max-height: 0; font-size: 1px; line-height: 0; clear: both; border: none; border-top: 2px solid #ffffff; border-bottom: 2px solid #000000;}
hr.two {display: block; position: relative; padding: 0; margin: 8px auto; height: 0; width: 100%; max-height: 0; font-size: 1px; line-height: 0; clear: both; border: none; border-top: 2px solid #159cd4; border-bottom: 2px solid #159cd4;}

.latino{font-family: 'latino-urw',serif;
font-weight: 400;
font-style: normal;}

.latino-bold{
font-family: 'latino-urw',serif;
font-weight: 700;
font-style: normal;
}
/*****************************************/
/********** Spacing  *********************/
/*****************************************/
@media (min-width: 320px) {.topspacing{padding-top: 140px;}}
@media (min-width: 568px) {.topspacing{padding-top: 150px;}}
@media (min-width: 1200px) {.topspacing{padding-top: 180px;}}
.no-padding {padding: 0;}
.no-padding img{width: 100%;}
.portfolioTopSpacing{padding-top: 100px;}

/*****************************************/
/********** Section Colors ***************/
/*****************************************/
.white{background-color: #FFFFFF; color: #000000;}	
.grayLight{ background-color: #dddddd; color: #333333;}
.blueDark{ background-color: #011689; color: #dddddd;}
.creekGrey{ background-color: #6e7074; color: #333333;}
.creekDark{ background-color: #004663; color: #FFF;}
.creekLight{ background-color: #007DBA; color: #000;}

/*****************************************/
/********** TEXT *************************/
/*****************************************/
h1{color: #ffffff; font-family: 'latino-urw',serif}
h2{color: #000000;}
h3{color: #011689; font-weight: bolder}
h4{color: #000000;}
h5{color: #000000;}

.whiteText{color: #FFFFFF;}
.creekDarkText{color: #004663;}
.LightText{color: #007DBA;}
.grayLightText{color: #dddddd;}
.grayDarkText{color: #333333;}
.shadowDark{text-shadow: 1px 1px #333333;}
.shadowLight{text-shadow: 1px 1px #dddddd;}

.boldUnderItal{
    font-weight: bold;
    text-decoration: underline;
    font-style: italic;
}

.header-text {position: absolute;}
@media (min-width: 320px) {
.header-text {top: 2%;
left: 5%;
}
.header-text h1 {font-size: 25px;}
.header-text h3 {font-size: 16px;font-family: Arial}
}
@media (min-width: 576px) {
.header-text {top: 15%;
        left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%)
}
.header-text h1 {font-size: 50px;}
.header-text h3 {font-size: 25px;font-family: Arial}
}
@media (min-width: 768px) {
.header-text {top: 8%;
        left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%)
}
.header-text h1 {font-size: 30px;}
.header-text h3 {font-size: 15px;font-family: Arial}
}

@media (min-width: 992px) {
.header-text {top: 8%;
        left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%)
}
.header-text h1 {font-size: 50px;}
.header-text h3 {font-size: 25px;font-family: Arial}
}

@media (min-width: 1200px) {
.header-text {top: 8%;
        left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%)
}
.header-text h1 {font-size: 65px; text-shadow: 3px 3px #011689}
.header-text h3 {font-size: 30px; text-shadow: 2px 2px #011689; font-family: Arial}
}
.headerTextColor{color: #ffffff;text-shadow: 2px 2px #011689;}
.portfolioText{font-style:italic;}

/*****************************************/
/********** LINKS ************************/
/*****************************************/
a.a1:link{   color: #dddddd; font-size: 16px; text-decoration: underline;}
a.a1:visited{color: #dddddd; font-size: 16px; text-decoration: underline;}
a.a1:hover{  color: #ff9933; font-size: 16px; text-decoration: underline;}

a.a2:link{   color: #000000; font-size: 18px; text-decoration: none;}
a.a2:visited{color: #000000; font-size: 18px; text-decoration: none;}
a.a2:hover{  color: #FF3333; font-size: 18px; text-decoration: none;}

a.a3:link{   color: #dddddd; font-size: 16px; text-decoration: underline;}
a.a3:visited{color: #dddddd; font-size: 16px; text-decoration: underline;}
a.a3:hover{  color: #999999; font-size: 16px; text-decoration: underline;}

a.a4:link{   color: #011689; font-size: 18px; text-decoration: none;}
a.a4:visited{color: #011689; font-size: 18px; text-decoration: none;}
a.a4:hover{  color: #a49ad1; font-size: 18px; text-decoration: none;}

/*Jared This is where you should look for styles on links
to make your facebook logo dark blue rather than the link color of the rest make a new set of 'a' styles
by following the examples above and below so say you wanted it dark blue but on hover it changed to light blue you'd 
make the 3 options link visited and hover and edit the colors: 
a.a6:link{   color: #EDIT font-size: 18px; text-decoration: underline;}
a.a6:visited{color: #EDIT; font-size: 18px; text-decoration: underline;}
a.a6:hover{  color: #EDIT TO HOVER COLOR; font-size: 18px; text-decoration: underline;}
. link and visited should always be the same unless you specifically want your user
to know they already clicked on something. After you're done editing add the new class to the 'a' tag on your link I added a4 to your facebook link so you could see what I mean*/

a.a5:link{   color: #FFF; font-size: 18px; text-decoration: underline;}
a.a5:visited{color: #FFF; font-size: 18px; text-decoration: underline;}
a.a5:hover{  color: #007DBA; font-size: 18px; text-decoration: underline;}

/*****************************************/
/********** BACKGROUND PICS***************/
/*****************************************/


/*****************************************/
/********** BUTTONS **********************/
/*****************************************/
/***********************
  ROUND BUTTONS
************************/
.round {  border-radius: 24px;}

/***********************
  CUSTON BTN VALUES
***********************/
.btn-nav {
    padding: 10px 10px;
    border: 0 none;
    font-weight: 400;
    letter-spacing: 1px;
    font-size: 12px;
    text-transform: uppercase;
    text-align: center;

}
@media (min-width: 992px) {
.topnav{
        margin-top: 5px;
}
}
@media (min-width: 1200px){
  .topnav{
        margin-top: 5px;
}  
}
.btn-nav:focus, .btn:active:focus, .btn.active:focus {
    outline: 0 none;
}

.btn-success{color:#fff;background-color:#011689;border-color:#a49ad1}

.btn-success:hover{color:#fff;background-color:#a49ad1;border-color:#004663}
.btn-success:focus,.btn-success.focus{box-shadow:0 0 0 .2rem rgba(0,90,90,0.5)}
.btn-success.disabled,.btn-success:disabled{color:#fff;background-color:white;border-color:#005a5a}
.btn-success:not(:disabled):not(.disabled):active,.btn-success:not(:disabled):not(.disabled).active,.show>.btn-success.dropdown-toggle{color:#011689;background-color:#ffffff;border-color:#000}
.btn-success:not(:disabled):not(.disabled):active:focus,.btn-success:not(:disabled):not(.disabled).active:focus,.show>.btn-success.dropdown-toggle:focus{box-shadow:0 0 0 .2rem rgba(0,90,90,0.5)}

.btn-outline-success{color:white;background-color:transparent;background-image:none;border-color:white}.btn-outline-success:hover{color:#222;background-color:#009a9a;border-color:white}
.btn-outline-success:focus,.btn-outline-success.focus{box-shadow:0 0 0 .2rem rgba(0,128,128,0.5)}
.btn-outline-success.disabled,.btn-outline-success:disabled{color:white;background-color:transparent}
.btn-outline-success:not(:disabled):not(.disabled):active,.btn-outline-success:not(:disabled):not(.disabled).active,.show>.btn-outline-success.dropdown-toggle{color:#fff;background-color:#009a9a;border-color:white}
.btn-outline-success:not(:disabled):not(.disabled):active:focus,.btn-outline-success:not(:disabled):not(.disabled).active:focus,.show>.btn-outline-success.dropdown-toggle:focus{box-shadow:0 0 0 .2rem rgba(0,128,128,0.5)}

/*****************************************/
/********** NAVIGATION BAR ***************/
/*****************************************/
.navbar-custom {
    background-color: #fff;
}
.navbar-custom .navbar-nav .nav-link {
    font-size: 18px;
    font-family: 'latino-urw,serif';
    color: rgba(0, 71, 171, 1);
}
.navbar-custom .navbar .navbar-nav>li>a:hover,
.navbar-custom .navbar .navbar-nav>li>a:focus {
    color: rgba(0, 153, 204, 1);
}
#navbar{overflow: hidden;background-color: #FFFFFF;padding: 10px 10px;transition: 0.4s;position: fixed;width: 100%;top: 0;z-index: 99;}
#navbar a.nav-link {float: left;color: #011689;text-align: center;text-decoration: none;padding: 12px;font-size: 20px; font-family: 'latino-urw',serif font-weight: 700;}
#navbar a.nav-fa {float: left;color: #00000;text-align: center;text-decoration: none;padding: 5px;font-size: 40px;}
#navbar a.nav-main {float: left;color: white;text-align: center;text-decoration: none;padding: 12px 20px;font-size: 20px;background-color: #333333; font-family: Tahoma, sans-serif;}
#navbar a:hover {color: #a49ad1;}
#navbar .navbar-brand{padding: 0px;}
#navbar #logo {transition: 0.4s;}
@media screen and (max-width: 580px) {
  #navbar {padding: 10px 10px !important;}
  #navbar a {float: none;display: block;text-align: left;  }
  #navbar-right {float: none;}
}

.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 70, 99, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.custom-toggler.navbar-toggler {
  border-color: rgb(0, 70, 99);
} 
/*****************************************/
/********** YOUTUBE VIDEO SIZING *********/
/*****************************************/
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


.staticpicture{
    
    /* The image used */

    background-image: url("images/powder-coating-of-kalispell-montana-hero.jpg");

    /* Set a specific height */
    width: 100%;
    min-height: 640px; 

    /* Create the parallax scrolling effect */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/*****************************************/
/********** SPONSOR IMAGE STYLING OVERLAY*/
/*****************************************/
.image {opacity: 1;display: block;transition: .5s ease;backface-visibility: hidden;}
.container-img:hover .image {opacity: 0.3;}
/*****************************************/
/**********HOVER OPTIONS *****************/
/*****************************************/
.container-hover{position: relative;width: 100%;}
.image-hover {opacity: 1;display: block;width: 100%;height: auto;transition: .5s ease;backface-visibility: hidden;}
.middle {transition: .5s ease;opacity: 1;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);text-align: center;}
.container-hover:hover .image-hover{opacity: 0.3;}
.container-hover:hover .middle{opacity: 1;}
.padding-0{padding-right:0;padding-left:0;}
/*****************************************/
/**********LightBox Don't Touch **********/
/*****************************************/

.no-padding{padding:0}
.no-gutter>[class*=col-]{padding-right:0;padding-left:0}
img::selection{color:#fff;background:0 0}img::-moz-selection{color:#fff;background:0 0}

.section-heading{margin-top:0}.service-box{max-width:400px;margin:50px auto 0}
@media (min-width:992px){.service-box{margin:20px auto 0}}.service-box p{margin-bottom:0}
.portfolio-box{position:relative;display:block;max-width:650px;margin:0 auto}
.portfolio-box .portfolio-box-caption{color:#000;opacity:0;display:block;background:rgba(164, 154, 209,.6);position:absolute;bottom:0;text-align:center;width:100%;height:100%;transition:all .35s}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content{width:100%;text-align:center;position:absolute;top:50%;transform:translateY(-50%)}
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category,.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name{font-family:'Open Sans','Helvetica Neue',Arial,sans-serif;padding:0 15px}
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category{text-transform:uppercase;font-weight:600;font-size:14px}
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name{font-size:18px}
.portfolio-box:hover .portfolio-box-caption{opacity:1}.portfolio-box:focus{outline:0}
@media (min-width:768px){.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category{font-size:16px}
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name{font-size:22px}}
.call-to-action h2{margin:0 auto 20px}
/**********************/
/* Magnific Popup CSS */
/**********************/
.mfp-bg {top: 0;left: 0;width: 100%;height: 100%;z-index: 1042;overflow: hidden;position: fixed;background: #0b0b0b;opacity: 0.8; }
.mfp-wrap {top: 0;left: 0;width: 100%;height: 100%;z-index: 1043;position: fixed;outline: none !important;-webkit-backface-visibility: hidden;}
.mfp-container {text-align: center;position: absolute;width: 100%;height: 100%;left: 0;top: 0;padding: 0 8px;box-sizing: border-box;}
.mfp-container:before {content: '';display: inline-block;height: 100%;vertical-align: middle;}
.mfp-align-top .mfp-container:before {display: none; }
.mfp-content {position: relative;display: inline-block;vertical-align: middle;margin: 0 auto;text-align: left;z-index: 1045;}
.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {width: 100%;cursor: auto;}
.mfp-ajax-cur {cursor: progress;}
.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {cursor: -moz-zoom-out;cursor: -webkit-zoom-out;cursor: zoom-out;}
.mfp-zoom {cursor: pointer;cursor: -webkit-zoom-in;cursor: -moz-zoom-in;cursor: zoom-in;}
.mfp-auto-cursor .mfp-content {cursor: auto;}
.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {-webkit-user-select: none;-moz-user-select: none;user-select: none;}
.mfp-loading.mfp-figure {display: none;}
.mfp-hide {display: none !important;}
.mfp-preloader {color: #CCC;position: absolute;top: 50%;width: auto;text-align: center;margin-top: -0.8em;left: 8px;right: 8px;z-index: 1044;}
.mfp-preloader a {color: #CCC; }.mfp-preloader a:hover {color: #FFF;}
.mfp-s-ready .mfp-preloader {display: none;}
.mfp-s-error .mfp-content {display: none;}

button.mfp-close,
button.mfp-arrow {overflow: visible;cursor: pointer;background: transparent;border: 0;-webkit-appearance: none;display: block;outline: none;padding: 0;z-index: 1046;box-shadow: none;touch-action: manipulation;}
button::-moz-focus-inner {padding: 0;border: 0;}
.mfp-close {width: 44px;height: 44px;line-height: 44px;position: absolute;right: 0;top: 0;text-decoration: none;text-align: center;opacity: 0.65;padding: 0 0 18px 10px;color: #FFF;font-style: normal;font-size: 28px;font-family: Arial, Baskerville, monospace; }
.mfp-close:hover,
.mfp-close:focus {opacity: 1;}
.mfp-close:active {top: 1px;}
.mfp-close-btn-in .mfp-close {color: #333;}
.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {color: #FFF;right: -6px;text-align: right;padding-right: 6px;width: 100%;}
.mfp-counter {position: absolute;top: 0;right: 0;color: #CCC;font-size: 12px;line-height: 18px;white-space: nowrap; }
.mfp-arrow {position: absolute;opacity: 0.65;margin: 0;top: 50%;margin-top: -55px;padding: 0;width: 90px;height: 110px;-webkit-tap-highlight-color: transparent;}
.mfp-arrow:active {margin-top: -54px;}
.mfp-arrow:hover,
.mfp-arrow:focus {opacity: 1;}
.mfp-arrow:before,
.mfp-arrow:after {content: '';display: block;width: 0;height: 0;position: absolute;left: 0;top: 0;margin-top: 35px;margin-left: 35px;border: medium inset transparent;}
.mfp-arrow:after {border-top-width: 13px;border-bottom-width: 13px;top: 8px;}
.mfp-arrow:before {border-top-width: 21px;border-bottom-width: 21px;opacity: 0.7;}
.mfp-arrow-left {left: 0;}
.mfp-arrow-left:after {border-right: 17px solid #FFF;margin-left: 31px;}
.mfp-arrow-left:before {margin-left: 25px;border-right: 27px solid #3F3F3F;}
.mfp-arrow-right {right: 0;}
.mfp-arrow-right:after {border-left: 17px solid #FFF;margin-left: 39px;}
.mfp-arrow-right:before {border-left: 27px solid #3F3F3F;}
.mfp-iframe-holder {padding-top: 40px;padding-bottom: 40px;}
.mfp-iframe-holder .mfp-content {line-height: 0;width: 100%;max-width: 900px;}
.mfp-iframe-holder .mfp-close {top: -40px;}
.mfp-iframe-scaler {width: 100%;height: 0;overflow: hidden;padding-top: 56.25%;}
.mfp-iframe-scaler iframe {position: absolute;display: block;top: 0;left: 0;width: 100%;height: 100%;box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);background: #000;}
/* Main image in popup */
img.mfp-img {width: auto;max-width: 100%;height: auto;display: block;line-height: 0;box-sizing: border-box;padding: 40px 0 40px;margin: 0 auto;}
/* The shadow behind the image */
.mfp-figure {line-height: 0;}
.mfp-figure:after {content: '';position: absolute;left: 0;top: 40px;bottom: 40px;display: block;right: 0;width: auto;height: auto;z-index: -1;box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);background: #444;}
.mfp-figure small {color: #BDBDBD;display: block;font-size: 12px;line-height: 14px;}
.mfp-figure figure {margin: 0;}
.mfp-bottom-bar {margin-top: -36px;position: absolute;top: 100%;left: 0;width: 100%;cursor: auto;}
.mfp-title {text-align: left;line-height: 18px;color: #F3F3F3;word-wrap: break-word;padding-right: 36px;}
.mfp-image-holder .mfp-content {max-width: 100%;}
.mfp-gallery .mfp-image-holder .mfp-figure {cursor: pointer;}

/*Remove all paddings around the image on small screen*/
@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
.mfp-img-mobile .mfp-image-holder {padding-left: 0;padding-right: 0;}
.mfp-img-mobile img.mfp-img {padding: 0;}
.mfp-img-mobile .mfp-figure:after {top: 0;bottom: 0;}
.mfp-img-mobile .mfp-figure small {display: inline;margin-left: 5px;}
.mfp-img-mobile .mfp-bottom-bar {background: rgba(0, 0, 0, 0.6);bottom: 0;margin: 0;top: auto;padding: 3px 5px;position: fixed;box-sizing: border-box;}
.mfp-img-mobile .mfp-bottom-bar:empty {padding: 0;}
.mfp-img-mobile .mfp-counter {right: 5px;top: 3px;}
.mfp-img-mobile .mfp-close {top: 0;right: 0;width: 35px;height: 35px;line-height: 35px;background: rgba(0, 0, 0, 0.6);position: fixed;text-align: center;padding: 0;} 
}

@media all and (max-width: 900px) {
.mfp-arrow {-webkit-transform: scale(0.75);transform: scale(0.75); }.mfp-arrow-left {-webkit-transform-origin: 0;transform-origin: 0; }.mfp-arrow-right {-webkit-transform-origin: 100%;transform-origin: 100%;}
.mfp-container {padding-left: 6px;padding-right: 6px;} 
}