@charset "utf-8";41
/* CSS Document */
	@font-face {
        font-family:"AvantGarde";
        src: url('../fonts/AvantGarde.eot');
        src: url('../fonts/AvantGarde.eot?#iefix') format('embedded-opentype'),
        url('../fonts/AvantGarde.svg') format('svg'),
        url('../fonts/AvantGarde.woff') format('woff'),
        url('../fonts/AvantGarde.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }


body{font-family:Play; background-color:#012269; color:#000000;font-size:1.25rem; font-weight:normal;}

.container{background-color:transparent;padding: 0px 0px 0px 0px;}
.container-fluid{background-color:transparent;padding: 0px 0px 0px 0px;}

.hr {
    margin-top:20px;
    margin-bottom:20px;
    border-top:20px solid #3f8000;
}

.blockquote_style 
    {background-color:transparent; line-height:normal; padding:10px 10px;margin:0 0 10px;border-left:25px solid #fff;}



/*BEGIN NEW VIDEO BACKGROUND */

.video {
  position:fixed;
  top: 50%;
  left: 50%;
  z-index: -100;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  margin-top:0px;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

/*END NEW VIDEO BACKGROUND */

.fav-nav-upper /* Top BKGD where the <h1> goes */
    {min-height:0px; background:transparent; color:Black; float: right; width:100%;}
.h1_homepage /* Used in header.inc to format the H1 tag at top right corner of the site */
    {background-color:transparent; color:#fff; padding: 2px 10px 0px 0px; margin: 0px 0px 0px 0px; text-align: right; float: right; font-size: 12px;}

/*BEGIN HEADER*/
.header{margin:2px 2px 2px 2px;padding:2px 2px 2px 2px; background-color:transparent;}

.logo{display:block; text-align:center; padding:5px;}
.logo img{ width:100%; height:auto; max-width:250px;}
.bizname{ min-height:10px; padding-right:10px; padding-top:5px;text-align:left; font-family: 'Play', sans-serif;color:#012269; font-size:2rem; font-weight:normal; line-height:normal;font-variant:small-caps;}
.tagline{padding-left:0px; min-height:10px; padding-right:10px; text-align:left; font-family: 'Play', sans-serif; font-size:1rem; font-weight:normal;  line-height:normal;color:#012269;font-style:italic;}
.tagline img{ width:100%; height:auto; max-width:100%;}
.callus{margin:2px 2px 2px 2px; color:#000000; min-height:10px; margin-top:10px;font-size:150%; font-weight:normal; text-align:right;padding-right:10px;}

/*END HEADER*/

/*NAVIGATION*/

.justify-content-center
    {justify-content: center!important;}
    
.navbar-brand
    {margin:0px;padding:0px;}    

.navbar>.container,.navbar>.container-fluid
    /*menu bar background color -- MENU text font-size*/
    {background-color:transparent;font-size:1.3rem;font-variant:none;}

.navbar-nav .nav-link{
    padding-right:0;
    padding-left:0;
}

.navbar-light .navbar-nav .nav-link /*Changes main menu link background and text color*/
    {color:#8b8f90;background-color:transparent;margin-right:0px;border-left:solid 1px #bdc0c1;border-right:solid 1px #bdc0c1;}
    
.navbar-light .navbar-nav .nav-link:focus,.navbar-light .navbar-nav .nav-link:hover
    /*Changes menu mouseover text color*/
    {color:#fff;background-color:#012269;}

.navbar-light .navbar-nav .active>.nav-link,.navbar-light .navbar-nav .nav-link.active,.navbar-light .navbar-nav .nav-link.show,.navbar-light .navbar-nav .show>.nav-link
    /*Changes menu mouseover ACTIVE text color - when on the menu page*/
    {color:#012269;background-color:#bdc0c1;font-style: italic;}
    
.dropdown-menu {
    display: none;
}  

.navbar-toggler
    /*Changes Responsive Hamburger Menu Colors*/
    {padding:.25rem .75rem;font-size:1.25rem;line-height:1;background-color:#bdc0c1;border:1px solid transparent;border-radius:.25rem}
.navbar-toggler:focus,.navbar-toggler:hover{text-decoration:none}  

/*END NAVIGATION*/



/*BEGIN MOUSEOVER COLORS*/

a {color:#012269; text-decoration: none; background-color: transparent}
a:focus,a:hover {color:#8b8f90; text-decoration: underline}
a:focus {outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px}

/*END MOUSEOVER COLORS*/


/*BEGIN HOMEPAGE PRODUCT CAROUSEL MARQUEE TEAM LAYOUT*/

/* Use with col-md-4 - for three photos wide & productcarousel_3col.js
.carousel-inner.onebyone-carosel { margin: auto; width: 90%; }
.onebyone-carosel .active.left { left: -33.33%; }
.onebyone-carosel .active.right { left: 33.33%; }
.onebyone-carosel .next { left: 33.33%; }
.onebyone-carosel .prev { left: -33.33%; }
*/

.carousel-inner.onebyone-carosel { margin: auto; width: 90%; }
.onebyone-carosel .active.left { left: -25%; }
.onebyone-carosel .active.right { left: 25%; }
.onebyone-carosel .next { left: 25%; }
.onebyone-carosel .prev { left: -25%; }
.product_intro {text-align:center;font-family: 'Play', sans-serif; font-weight:bold; text-align:center; vertical-align: top;}
    
.product_intro h2
    {font-size:2rem; color: #000000;}

/*END HOMEPAGE PRODUCT CAROUSEL MARQUEE  TEAM LAYOUT*/

/*BEGIN PAGE LAYOUTS*/
#background_text 
/* Used in header.inc to layout background for content on pages */
    {/*background-color: Orange;*/ position:relative; z-index:1; height: auto; min-height: 10px;overflow: visible; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}

.intro_h 
/* intro in the layout for the title/intro of each page */
    {background-color:transparent; padding: 2px 2px 2px 2px; margin: 0px 0px 0px 0px; font-family: 'Play', sans-serif; font-weight:bold; text-align:center; font-variant: small-caps;}

.intro_h h2
    {font-size:2rem; color:#012269; margin-bottom:0px;}
    
.intro_h p
    {margin-bottom:0px; padding:10px;}    

/*END PAGE LAYOUTS*/

/*BEGIN ASIDE LAYOUTS*/
.side-panel
    {background-color:transparent; margin:5px 5px 5px 5px; min-height:52px; padding:5px 5px; line-height:1.5rem;font-family: 'Play', sans-serif; font-size:1rem !important; color:#000; border-left:solid 1px #000;}
.side-panel ul li
    {list-style-image:url(../images/arrow.jpg); line-height:1.5rem;}
.side-panel ul li a
    {color:#012269; font-weight:bold;}


/*END ASIDE LAYOUTS*/

/*BEGIN ONLINE STORE LAYOUTS*/
.cartlogin 
/*Used in header.inc to layout the sign-in now button */
    {background-color: #959595; text-align:center; border: 0px solid red; margin-bottom:10px; /*font-variant: small-caps; font-weight: bold;*/}

    .cartlogin a:link { color:#FFD700; text-decoration: none; }
    .cartlogin a:visited { color:white; text-decoration: none; }
    .cartlogin a:hover { color:#FFD700; text-decoration: none; }
    .cartlogin a:active { color:#FFD700; text-decoration: underline; }

/*END ONLINE STORE LAYOUTS*/

/*BEGIN FOOTER*/
.label {margin-bottom:0px;}

.footer
    {font-size:1rem; background-color:#012269;text-align:center;margin-top:10px;}
    
/*Footer Menu*/    
.footernav > li > a
    {background-color:lime; padding-top:0px; padding-bottom:0px;}
.footernav>li>a
    {text-decoration:none; color: #000000;}
.footernav>li>a:focus,
.footernav>li>a:hover 
    {text-decoration: underline; color:red;}    

/*Review Footer*/
.footer-review
    { background-color:transparent;color:#ffffff;font-size:.75rem;}
    
/*Social Media Footer*/ 
.socialmediasection  
    {margin:5px 5px 5px 5px; padding:5px 5px 5px 5px;} 
.socialmedia    
    {background-color:transparent;padding:5px 5px 5px 5px;color:#000000; text-align: center;}

.reviewtool
    {background-color:transparent; padding:5px 5px 5px 5px; color:#000000; text-align: center; font-weight:bold; }
.reviewtool .img
    {padding-right:3px; width:27px; height:27px; border: 0;}

/*Metadata Footer Description*/
.footerdescription
    { background-color:transparent;font-size:.75rem;}

/*Footer Bottom*/
.footer-bottom
    {color:#ffffff; background-color:#000000;}

.copyright{float:left;text-align:left;font-size:.75rem;}

.builtby{float:right;text-align:right;font-size:.75rem;}

/*END FOOTER*/

@media (min-width:576px){.modal-dialog{max-width:750px;margin:1.75rem auto}

/*June added to control contact form input layouts*/
input[type=text], input[type=url], input[type=email], input[type=password], input[type=tel], textarea{
  -webkit-appearance: none; -moz-appearance: none;
  display: block;
  margin: 0;
  width: 100%; height: 2rem;
  line-height:1.5rem; font-size: 1rem;
  border: 1px solid #bbb;
}
input[type=checkbox] {
 width: 10px; height: 10px;
 -webkit-border-radius: 22px; -moz-border-radius: 22px; border-radius: 22px;
 border: 1px solid #bbb;
}

input[type=radio] {
 width: 20px; height: 20px;
 vertical-align:top;
 margin-left:10px;
 margin-right:10px;
 -webkit-border-radius: 22px; -moz-border-radius: 22px; border-radius: 22px;
 border: 1px solid #bbb;
}

button[type=submit] {
 -webkit-appearance: none; -moz-appearance: none;
 display: block;
 margin: 1.5em 0;
 font-size: 1em; line-height: 2.5em;
 color: #333;
 font-weight: normal;
 height: 2.5em; width: 100%;
 background: #fdfdfd; background: -moz-linear-gradient(top, #fdfdfd 0%, #bebebe 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fdfdfd), color-stop(100%,#bebebe)); background: -webkit-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); background: -o-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); background: -ms-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); background: linear-gradient(to bottom, #fdfdfd 0%,#bebebe 100%);
 border: 1px solid #bbb;
 -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
}

input[type=submit] {
 -webkit-appearance: none; -moz-appearance: none;
 background-color:#959595;
 display: block;
 color: #fff;
 font-weight: normal;
 padding-top:10px;
 padding-bottom:10px;
 padding-left:50px;
 padding-right:50px;
 font-size:22px;
 border: 0px solid #bbb; 
 -webkit-border-radius: 5px; 
 -moz-border-radius: 5px; 
 border-radius: 5px; 
 width: 100%;

 /* TO MAKE THE BUTTON FULL WIDTH & GRADIENT IN COLOR
 height: 2.5em; width: 100%;
 background: #fdfdfd; 
 background: -moz-linear-gradient(top, #fdfdfd 0%, #bebebe 100%); 
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fdfdfd), color-stop(100%,#bebebe)); 
 background: -webkit-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); 
 background: -o-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); 
 background: -ms-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); 
 background: linear-gradient(to bottom, #fdfdfd 0%,#bebebe 100%);*/
}

input[type=submit]:link {color:#ffffff;text-decoration:none;}
input[type=submit]:visited {color:#ffffff;text-decoration:none;}
input[type=submit]:hover {color:#ffffff;text-decoration:underline;}

input[type=range] {
 width: 100%;
}
input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 44px; height: 44px;
  background: #fdfdfd; background: -moz-linear-gradient(top, #fdfdfd 0%, #bebebe 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fdfdfd), color-stop(100%,#bebebe)); background: -webkit-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); background: -o-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); background: -ms-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); background: linear-gradient(to bottom, #fdfdfd 0%,#bebebe 100%);
  border: 1px solid #bbb;
  -webkit-border-radius: 22px; -moz-border-radius: 22px; border-radius: 22px;
}

/* BEGIN HERO SLIDER CAROUSEL */
.carousel-caption{
    position:absolute;
    right:5%;
    bottom:10px;
    left:5%;
    z-index:10;
    padding-top:20px;
    padding-bottom:0px;
    color:#fff;
    text-align:center;
    font-size:2.5rem;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 1);
}
/* END HERO SLIDER CAROUSEL */

/*BEGIN HOMEPAGE BRANDS and SERVICES SECTIONS*/
.portfolio-box {
  position: relative;
  display: block;
  max-width: 650px;
  margin: 0 auto;
  padding:20px;
  text-align:center;
}

.portfolio-box .portfolio-box-caption {
  position: absolute;
  bottom: 0;
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  opacity: 0;
  color: #fff;
  background: rgba(1, 33, 105, 0.8);
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
  margin-left:-20px;
  border-radius:10px;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content {
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
  text-align: center;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category,
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
  padding: 0 15px;
  font-family: 'Play', sans-serif;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {
  font-size: 20px;
  font-weight: 400;
  text-transform: uppercase;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
  font-size: 16px;
}

.portfolio-box:hover .portfolio-box-caption {
  opacity: 1;
}

.portfolio-box:focus {
  outline: none;
}

@media (min-width: 768px) {
  .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {
    font-size: 22px;
  }
  .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
    font-size: 16px;
  }
}

/*END HOMEPAGE BRANDS and SERVICES SECTIONS*/

/*BEGIN SERVICESGALLERY SECTION */
#masonry {
  column-count: 2;
  column-gap: 1em;
}

@media(min-width: 30em) {
  #masonry {
    column-count: 3;
    column-gap: 1em;
  }
}
@media(max-width: 60em) {
  .mob-right {
      float: none;
      width: 95%;
  }
  .mob-left {
      float: left;
      width: 95%;
  }
}

.fright {
    float: right;
}

.fleft {
    float: left;
}

@media(min-width: 40em) {
  #masonry {
    column-count: 4;
    column-gap: 1em;
  }
}

@media(min-width: 60em) {
  #masonry {
    column-count: 5;
    column-gap: 1em;
  }
}

@media(min-width: 75em) {
  #masonry {
    column-count: 6;
    column-gap: 1em;
  }
}

.itemgallery {
  background-color: none;
  display: inline-block;
  margin: 0 0 1em 0;
  width: 100%;
  cursor: pointer;
}

.itemgallery img {
  max-width: 100%;
  height: auto;
  width: 100%;
  margin-bottom: -4px;
  
  /*idk why but this fix stuff*/
}

.itemgallery.active {
  animation-name: active-in;
  animation-duration: 0.7s;
  animation-fill-mode: forwards;
  animation-direction: alternate;
}

.itemgallery.active:before {
  content: "+";
  transform: rotate(45deg);
  font-size: 48px;
  color: white;
  position: absolute;
  top: 20px;
  right: 20px;
  background-color:rgba(0,0,0,0.85);
  border-radius: 50%;
  width:48px;
  height:48px;
  text-align:center;
  line-height:48px;
  z-index:12;
}

.itemgallery.active img {
  animation-name: active-in-img;
  animation-duration: 0.7s;
  animation-fill-mode: forwards;
  animation-direction: alternate;
}


@keyframes active-in {
  0% {
    opacity:1;
    background-color:white;
  }
  
  50% {
    opacity:0;
    background-color:rgba(0,0,0,0.90);
  }
  
  100% {
    opacity: 1;
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,0.90);
  }
}

@keyframes active-in-img {
  0% {
    opacity:1;
    transform:translate(0%, 0%);
    top: 0;
    left: 0;
    max-width: 100%;
  }
  49% {
    opacity:0;
    transform: translate(0%, -50%);
  }
  50% {
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -100%);
  }
  100% {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 90%;
  width: auto;
  max-height: 95vh;
  opacity:1;
  }
}

/* END SERVICES GALLERY SECTION */

/*BEGIN HOMEPAGE NEWS AND PORTFOLIO SECTION*/

.panel-default{
    text-align:center;
    cursor:pointer;
    font-family: 'Play', sans-serif;
}
.panel-default > .panel-footer {
    color: #000000;
    background-color:black;
    border-radius:25px;
    width:50%;
    margin-left:auto;
    margin-right:auto;    
    padding-left:25px;
    padding-right:25px;
    /*display:none;*/
    /*text-shadow: 1px 1px 1px rgba(150, 150, 150, 1);*/
}
.panel-default i{
    font-size: 5em;
}
.img-fluid-portfolio{max-width:325px;width:95%;height:auto;}

/*END HOMEPAGE NEWS AND PORTFOLIO SECTION*/

/*BEGIN HOMEPAGE SWAG TEXT CENTER BKGD IMAGE*/

.swag { background: url('../template/Background_swag.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-attachment: fixed; padding: 50px 0; }
.swag h1 { color: #ffffff; font-size: 30px; /*text-transform: uppercase;*/ letter-spacing: 5px; }
.swag h1 span { display: block; font-size: 25px; margin-top: 20px; }
.down-arrow-btn { width: 40px; height: 40px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%; background: rgba(61, 201, 179, 0.8); display: inline-block; margin: 10px auto 20px; color: #fff; font-size: 16px; line-height: 40px; text-align: center; }
.swag h2 { color: #ffffff; font-size:2rem;}
.swag p { color: #ffffff; font-size: 22px;}
.swag div { color: #ffffff; font-size: 22px;}

.down-arrow-btn:hover, .down-arrow-btn:focus { color: #fff; background: rgba(61, 201, 179, 1); }

/*END HOMEPAGE SWAG TEXT CENTER BKGD IMAGE*/

/*BEGIN OUR TEAM / TEAM LAYOUTS*/
.ourteam_person 
    {border: solid 1px #000000; text-align: left; margin: 10px;}

.ourteam_photo 
    {min-height: 10px; width: 150px; margin-right: 10px; float: left; border: solid 1px #000000;}

.ourteam_photo_full 
    { min-height: 10px; width:250px; margin-left: 10px; text-align: right; border: solid 0px #ec1e1f; padding:5px;}

/*team.asp*/
.ourteam_person_detail
    {padding-top:100px;border:solid 0px #000000;text-align:center;color:Black;font-size:2rem;}

.ourteam_person_detail_contact
    {padding-top:80px;border:solid 0px #000000;text-align:left;color:Black;font-size:1.5rem;}

.ourteam_person_detail_contact a
    {color:Black}
    
.ourteam_photo
    {min-height:10px;width:50px;margin-right:10px;text-align:left;border:solid 1px #ec1e1f}
    
.ourteam_photo_full
    {min-height:10px;width:100%;height:auto;max-width:300px;margin-left:10px;float:right;border:solid 0px #ec1e1f;padding:5px}

    
/*END OUR TEAM / TEAM LAYOUTS*/


/*BEGIN FAQ LAYOUTS*/
.faq_block /* Used in faq.asp to block the questions and answers displayed on the website page  */
{
    background-color:transparent;
    overflow: visible;
    max-width:1000px;
    margin: 0px 10px 0px 10px;
    padding: 0px 10px 0px 10px;
        border: 0px solid;   
}
/*END FAQ LAYOUTS*/


/*BEGIN PORTFOLIO LAYOUTS*/
.programImage /*studio.asp - background for each category thumbnail */
{
    background-color: transparent;
    margin: 0px 0px 0px 0px;
    padding: 3px 3px 3px 3px;
}

.programImage img /*studio.asp - image size for category thumbnail */
{
    max-width: 225px;
    max-height: 225px;
    width:100%; height:auto; max-width:238px;
    
}
/*END PORTFOLIO LAYOUTS*/

/*BEGIN Program/MEDIA Detail Page Layout */

.program_left {

    font-size:.75rem;
    line-height:1rem;
    border-right: 1px solid silver;
    border-radius: 20px;
    -webkit-border-radius:0px; 
}
.program_right {
    font-size:1rem;
    border-right: 1px solid silver;
    border-radius: 20px;
    -webkit-border-radius:0px; 
}

.catTitle 
{
	background-color:transparent;
	text-align: center;
	color: #000000;
	line-height: 125%;
	font-size:1.5rem;
	font-weight:normal;
}

.catTitleMain 
{
	background-color:transparent;
	text-align: center;
	color: #464646;
	line-height: 150%;
	font-size:1.75rem;
	font-weight:bold;
}

#services_detail_link
{
    background-color: aqua;
    margin: 0px 5px 10px 0px;
    padding: 10px 0px 10px 0px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
        border: 0px solid red;
    border-radius: 0px;
    -webkit-radius: 5px;
}

#services_detail_link_link
{
    background-color: silver;
    font-size:.85rem;
    text-align: center;
    line-height:normal;
    font-weight:normal;
    border-radius: 15px;
    -webkit-radius: 15px;   
    margin: 5px 5px 0px 0px;
    padding: 10px 0px 10px 0px;
}

/*END Program/MEDIA Detail Page Layout */

/*BEGIN IINSET BOX LAYOUT*/
.insetbox {
    margin-left:25px;
    margin-right:25px;
    padding:10px 10px 10px 10px;
    border-radius:15px;
    background-color: #8b8f90;
    text-align: center;
    color:White;

/*END IINSET BOX LAYOUT*/

/*BEGIN UPCOMING EVENTS ASIDE LAYOUT (for bWyse site)*/
.upcoming_events
    {background-color:#fccd01; width:100%; margin: 0px 5px 0px 0px; padding: 10px 10px 10px 10px; border-radius:5px;}

/*.upcoming_events a:link { color:#ffffff; text-decoration: none; }
.upcoming_events a:visited { color:black; text-decoration: none; }
.upcoming_events a:hover { color:#ffffff; text-decoration: none; }
.upcoming_events a:active { color:#ffffff; text-decoration: underline; }*/

/*END ASIDE LAYOUTS (for bWyse site)*/