/* -- BEGIN GLOBAL STYLES */
html {
    font-size: 18px;
}
.nav-link {
    font-size:1.25rem;    
}
/* -- END GLOBAL STYLES */

/* CROUSEL & FEATURETTES TEMPLATE STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
/*  padding-top: 0rem;*/
  padding-top: 105px;
  padding-bottom: 3rem;
  color: rgb(var(--bs-tertiary-color-rgb));
}
@media (min-width: 410px) {
    body {
        padding-top: 145px;
    }
}


/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  margin-bottom: 4rem;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: 3rem;
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel-item {
/*  height: 32rem;*/
}


/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 1.5rem;
  text-align: center;
}
/* rtl:begin:ignore */
.marketing .col-lg-4 p {
  margin-right: .75rem;
  margin-left: .75rem;
}
/* rtl:end:ignore */


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 3rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
/* rtl:begin:remove */
.featurette-heading {
  letter-spacing: -.05rem;
}

/* rtl:end:remove */

/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 40em) {
  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
  }
}

@media (min-width: 62em) {
  .featurette-heading {
    margin-top: 7rem;
  }
}

/*====== BEGIN -- Crowley - CSS MODs =========== */

/*====== BEGIN -- logo resize on scroll =========== */

.small-logo, .large-logo {
  width: 200px;
}
@media (min-width: 410px) {
    #logo {
    /*  width: 315px;  Full width */
      transition: all linear .5s; /* Add a transition effect */
    }
    .large-logo {
        width: 300px; /* Full width*/
    }
    .small-logo {
        width: 200px; /* Reduced width*/
    }
}

/*====== END -- logo resize on scroll =========== */

/* BEGIN -- top level nav link underline animation */
 @media (min-width: 992px) {
     a.middle    

{
    position: relative;
}

a.middle:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 3px;
  bottom: 5px ;
  left: 0;
  background-color: #89DFBA;
  visibility: hidden;
  transform: scaleX(0);
  transition: all 0.5s ease-in-out; 
}
 
a.middle:hover:before {
  visibility: visible;
  transform: scaleX(1);
}


/* display:none for mobile mode nav underline */
@media (max-width: 992px) {
    a.middle:before  {
    display: none;
}
 }


/* END -- top level nav link underline animation */

  /*====== BEGIN -- 5.3 NAV DROPDOWN ANIMATE =========== */
@media all and (min-width: 992px) {
	.navbar .dropdown-menu-end{ right:0; left: auto;  }
	.navbar .nav-item .dropdown-menu{  display:block; opacity: 0;  visibility: hidden; transition:.5s; margin-top:0;  }
	.navbar .nav-item:hover .nav-link{ color: #333;  }
	.navbar .dropdown-menu.fade-down{ top:80%; transform: rotateX(-75deg); transform-origin: 0% 0%; }
	.navbar .dropdown-menu.fade-up{ top:180%;  }
	.navbar .nav-item:hover .dropdown-menu{ transition: .5s; opacity:1; visibility:visible; top:100%; transform: rotateX(0deg); }
}	

.dropdown-menu {
  opacity: 0;
  visibility: hidden;
  transform-origin: top;
  animation-fill-mode: forwards; 
  transform: scale(0.9, 0.7) translateY(-20px);
  display: block; 
  transition: all 80ms ease;
}
.open > .dropdown-menu {
  transform: scale(1, 1) translateY(0);  
  opacity: 1;
  visibility: visible;
}
 }
/*====== END-- 5.3 NAV DROPDOWN ANIMATE =========== */

.myline {
    height:1px;
    background-color: #777;
    margin:10px;
}
.container-fluid {
    max-width:1920px;
}

/*====== Begin IMG trans on hover =========== */
a.trans:link img {
	max-width: 100%;
	transition: all .5s ease-in-out;
	border-bottom: 0px solid #000;
}
a.trans:hover img {
	transform: scale(1.05);
	-webkit-transform: scale(1.05);
	border: 0px solid #000;
}
a.trans:visited img {
	border: 0px solid #000; 
}

a.trans2:link img {
	max-width: 100%;
	transition: all .5s ease-in-out;
	border: 1px solid #000;
}
a.trans2:hover img {
	transform: scale(1.05);
	-webkit-transform: scale(1.05);
	border: 1px solid #000;
	box-shadow: 4px 2px 2px #333;
}
a.trans2:visited img {
	border: 1px solid #000; 
}
/*====== End IMG trans on hover =========== */
/*====== Begin sliderpic & shadowbox =========== */
.sliderpic {
    height:650px;
    background-image: url(/img/13459170.jpg);
    background-image: url(/img/bak.jpg);
    background-attachment: fixed;
    background-repeat: no-repeat;    
    background-position: center top;
    background-size: cover;
}

.shadowbox {
    border: 1px solid #333;
    text-align: center;
    margin:200px auto 0 auto;
    color: white;
    text-shadow: 2px 2px 4px #000000;
    font-size: 56px;
    background: rgba(68, 68, 68, 0.5);
}

/*====== End sliderpic & shadowbox =========== */