/*

(C) 2020 Swing Oil Brewing Conmpant, LLC - All Rights Reserved

Primary Slate black   #394259
Primary Slate    #9da8c7  
Primary Blue    #5879d6  
Secondary Slate #dce3f5
Text            #555555
Link / Hover    #9da8c7 

*/





.login-form-background {
    background-image: url("/assets/img/dbl_rainbow.jpg") }

.projects-5 {
  padding-top: 0px !important; 
  padding-bottom: 0px !important;  }

.category {
  text-transform: none !important; }

/*.page-header:before {
    background-color: rgba(0, 0, 0, .1) !important; }
*/


/* ======================================== */
/*  PRIMARY TAGS                            */
/* ======================================== */

.__Primary_Tags {}

html body {
  font-family: 'Roboto', sans-serif;  }


h1, h2, h3, h4 {
  font-weight: 200;
  color: #555555;
  margin-top: 35px;
  text-align: center; }

h4.description       { color: #555555 !important; }
.description         { color: #555555 !important; }
.tab-pane p          { color: #555555 !important; }
.arousel-item h3     { color: #555555 !important; }
.text_default_color  { color: #555555 !important;}
.card-body p         { color: #555555 !important;}
.card-body ul li     { color: #555555 !important;}
.text_color_000000   { color: #000000 !important;}

 hr {    
  background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  border: 0; 
  height: 1px; 
  margin: 15px auto 15px auto !important;  }


 

/* ======================================== */
/*  NAVIGATION                              */
/* ======================================== */
 
.__Navigation {}

.navbar .navbar-brand {                                                         /* override now-ui-kit */
  font-size: 1.5em;
  width: 150px !important;
  font-weight: bolder;
  text-transform: none; }                                                       /* Remove Capitalization */

.nav-link  {                                                                    /* Navigation Menus */
  margin-top: 5px;
  font-weight: bolder;
  font-size: 1.5em;
  text-transform: none;  }

.nav-link-login-button {                                                        /* Navigation Login Button */
  font-size: 0.8em !important;
  font-weight: 500;
  color: #ffffff !important;  }

.dropdown-menu {                                                                /* Mobile Dropdown Minimize Padding */
  padding-bottom: 0px !important;
  margin-bottom: 0px !important;  }

.burger-menu .section-navbars .navbar-collapse {
  display: none !important;  }

.bg-white {                                                                     /* override now-ui-kit, Mobile achored top nav down page */
  background-color: #f0f3fa !important; }                                       /* Light Blue Tint */

@media screen and (max-width: 991px) {
  .section-navbars .navbar-collapse,
  .header-1 .navbar-collapse,
  .header-2 .navbar-collapse,
  .header-3 .navbar-collapse {
    display: none !important;
  }
}

@media screen and (max-width: 991px) {                                          /* override now-ui-kit */
  .navbar-collapse:before {                                                     /* Mobile Menu Background */
  background: #5879d6;                                                          /* Primary Blue */
  /* For browsers that do not support gradients */
  /* For Safari 5.1 to 6.0 */
  /* For Opera 11.1 to 12.0 */
  /* For Firefox 3.6 to 15 */
  background: linear-gradient(#5879d6 0%, #000 80%);                            /* Primary Blue */
  /* Standard syntax (must be last) */ }
  .navbar.bg-white:not(.navbar-transparent) .navbar-toggler-bar {
  background: #888888; }
}



/* ======================================== */
/*  PAGE BANNER IMAGE & SOCIAL              */
/* ======================================== */

.__Social_Media {}
 
.banner_title {                                                                 /* Title on the Page Banner Image */
    font-size: 3em !important;
    color: #eeeeee;
    font-weight: bolder;}       

.top_div {
    margin-top: -40px; }                                                        /* Whitespace reduction below Social Media buttons */

.swing .button-container {                                                 /* Social Media Buttons */
  text-align: center;
  margin-top: -112px;
  position: relative;
  z-index: 100; }
 
 


/* ======================================== */
/*  SECTION Primary                         */
/* ======================================== */

.__Section {}

.section-body {
  padding: 10px 0; }

.section-body p,
.section-body ul li,
.section-body ol,li { 
  color: #999999 !important;
  font-size: 18px;
  font-weight: 200; }

.section-body ul {
  list-style-type: circle; }




/* ======================================== */
/*  CAROUSEL - Testimonials                 */
/* ======================================== */

.__Carousel {}
 
.carousel .carousel-inner {
  box-shadow: none !important;
  border-radius: 0.1875rem; }

.carousel h3 {
  padding: 40px 120px 20px 120px; }

.carousel p {
  padding: 0px 120px 40px 0px;
  font-style: italic;  }

.carousel-control-prev-icon,
.carousel-control-next-icon {
  height: 100px;
  width: 100px;
  background-image: none;  }

.carousel-control-next-icon:after  {
  font-family: "Font Awesome 5 Pro";
  content: "\f101";                                                             /* UTF-8 character code */
  color: #999999;
  font-weight: 400;
  font-size: 40px;
  opacity: 0.75;  }

.carousel-control-prev-icon:after {
  font-family: "Font Awesome 5 Pro";
  content: "\f100";                                                             /* UTF-8 character code */
  color: #999999;
  font-weight: 400;
  font-size: 40px;
  opacity: 0.75;  }
 
 


/* ======================================== */
/*  TABLES                                  */
/* ======================================== */

.__Tables{}

.swing_thead  {
  background-color: #f0f3fa !important;   }                                     /* Primary blue Tint */

.swing_thead th {
  font-weight: 500 !important;
  color: #5879d6 !important;   }                                                /* Primary blue*/

.swing_table_total  {
  background-color: #f0f3fa !important;   }                                     /* Primary blue Tint */
.swing_table_total td {
  font-weight: 500 !important;
  font-size: 1.1em;
  color: #5879d6 !important;   }                                                /* Primary blue */




/* ======================================== */
/*  BLOCKQUOTE                              */
/* ======================================== */

.__Blockquote{}

.blockquote { 
  font-style: italic;
  border: 1px dashed rgba(88,121,214,0.7);
  border-radius: 0px 20px 0px 20px;
  text-align: center;
  font-size: 1.5em;
  margin: 40px;
  padding: 50px;
  line-height: 1.3em;
  font-weight: 200;
  color: #999999 !important;  }

.blockquote .quote_mark {
  color: #9da8c7;  }                                                            /* Primary Slate */




/* ======================================== */
/*  FORMS                                   */
/* ======================================== */

.__Forms {}

.form-control:focus {
  border-color: #9da8c7;  }                                                     /* Primary Slate */

.btn-primary {                                                                  /* override now-ui-kit, top nav button */
  background-color: #9da8c7;                                                    /* Primary Slate  */
  color: #FFFFFF; }

.btn-primary:hover, 
.btn-primary:focus {
  background-color: #9da8c7;                                                    /* Primary Slate */
  color: #5879d6;  }                                                            /* Primary Blue */

.btn-primary:active {                                                           /* btn-primay On Click */
    background-color: #9da8c7 !important;                                       /* Primary Slate */
    border-color: #9da8c7  !important; }                                        /* Primary Slate */

.btn.btn-snapchat {
  background-color: #9da8c7 !important;
  color: #fff; }
  .btn.btn-snapchat:hover, .btn.btn-snapchat:focus, .btn.btn-snapchat:not(:disabled):not(.disabled):active, .btn.btn-snapchat:not(:disabled):not(.disabled).active, .btn.btn-snapchat:not(:disabled):not(.disabled):active:focus, .btn.btn-snapchat:not(:disabled):not(.disabled).active:focus, .btn.btn-snapchat:active:hover, .btn.btn-snapchat.active:hover,
  .show > .btn.btn-snapchat.dropdown-toggle,
  .show > .btn.btn-snapchat.dropdown-toggle:focus,
  .show > .btn.btn-snapchat.dropdown-toggle:hover {
    background-color: #ffe033 !important;
    color: #fff; }



/* ======================================== */
/*  CONTACT FORM                            */
/* ======================================== */

.__Form-Contact {}

.contact-content .info {
    padding: 20px 0px;   }                                                      /* Right Side Section Padding */




/* ======================================== */
/*  CARDS                                   */
/* ======================================== */

.__Cards {}

.swing h4.info-title {
  text-align: center;
  font-weight: 800;}
.info-title-left {
  text-align: left !important;  }
.description_white_link p {
  color: #ffffff !important;
  font-weight: 700;}
.icon-width {
  width: 40px !important;
  text-align: center;  }



/* ======================================== */
/*  SECTION TABS                            */
/* ======================================== */

.__Tabs {}

.section-tabs {
  /*background: url(/assets/background/green_cup.png) no-repeat center fixed; 
  background-size: cover;*/
  background-image: url(/assets/background/hop_up.jpg);
  background-repeat: repeat;
}
.section-tabs .category {
  color: #ffffff;  }




/* ======================================== */
/*  HYPERLINKS                              */
/* ======================================== */

.__Hyperlinks {}

/* P, H4, .blockquote */
/* ------------------ */

p > a,
h2 > a,
h4 > a,
h5 > a,
blockquote > a {
  color: #5879d6 !important;     /* Primary Blue */
  font-weight: 300;
  position: relative;
  text-decoration: none;}

p > a:hover,
h2 > a:hover,
h4 > a:hover,
h5 > a:hover,
blockquote > a:hover {
  color: #9da8c7 !important;    /* Primary Slate */
  text-decoration: none;
  transition: all 1.0s ease;
  -webkit-transition: all 1.0s ease;   }  /* for Safari & Chrome */ 

p > a:before,
h2 > a:before,
h4 > a:before,
h5 > a:before,
blockquote > a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px !important;
  bottom: 0;
  left: 0;
  background-color: #9da8c7;   /* Primary Slate */
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s; }

p > a:hover:before,
h2 > a:hover:before,
h4 > a:hover:before,
h5 > a:hover:before,
blockquote > a:hover:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);  }




/* .description_white_link */
/* .description_blue_link */
/* .login_link             */
/* ----------------------- */

.description_white_link a,
.login_link a  {
  color: #ffffff !important;
  font-weight: 700;
  position: relative;
  text-decoration: none;}

.description_blue_link a  {
  color: #5879d6 !important;   /* Primary Blue */
  font-weight: 300;
  position: relative;
  text-decoration: none;}

.description_white_link a:hover,
.description_blue_link a:hover,
.login_link a:hover {
  color: #424e6e !important;            /* Secondary Slate */
  text-decoration: none;
  transition: all 1.0s ease;
  -webkit-transition: all 1.0s ease;   }  /* for Safari & Chrome */ 

.description_white_link a:before,
.description_blue_link a:before,
.login_link a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px !important;
  bottom: 0;
  left: 0;
  background-color: #9da8c7;   /* Primary Slate */
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s; }

.description_white_link a:hover:before,
.description_blue_link a:hover:before,
.login_link a:hover:before  {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);  }


/* .animated_link */
/* -------------- */

.animated_link {
  color: #5879d6 !important;     /* Primary Blue */
  font-weight: 300;
  position: relative;
  text-decoration: none;}

.animated_link :hover {
  color: #5879d6;    /* Primary Blue */
  text-decoration: none;
  transition: all 1.0s ease;
  -webkit-transition: all 1.0s ease;   }  /* for Safari & Chrome */ 

.animated_link :before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px !important;
  bottom: 0;
  left: 0;
  background-color: #9da8c7;   /* Primary Slate/
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s; }

.animated_link :hover:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);  }




/* ======================================== */
/*   FOOTER                                 */
/* ======================================== */

.__Footer {}

.footer {
  font-size: 0.95em;
  line-height: 3.5;    
  color: #dddddd;  }

.footer_background {
  /* Blended Blue */
  background: rgb(88, 121, 214);
  /* Primary Blue +1 0 +1 */
  background: -moz-linear-gradient(90deg, rgba(58,90,181,1) 0%, rgba(88,121,214,1) 50%, rgba(58,90,181,1) 100%);
  background: -webkit-linear-gradient(90deg, rgba(58,90,181,1) 0%, rgba(88,121,214,1) 50%, rgba(58,90,181,1) 100%);
  background: linear-gradient(90deg, rgba(58,90,181,1) 0%, rgba(88,121,214,1) 50%, rgba(58,90,181,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3a5ab5",endColorstr="#3a5ab5",GradientType=1);
  background-image: linear-gradient(-90deg, #3a5ab5, #5879d6, #3a5ab5);     }

.footer .copyright {
  font-size: 0.95em;
  line-height: 3.5; }
  
.footer_li {
  font-size: 1em;
  line-height: 3.5;
  color: #ffffff;  
  text-transform: none;
  text-decoration: none; }

.footer_li > a {
  padding: 0 0 0 0 !important;
  margin-right: 25px !important;
  color: #ffffff !important;     /* White */
  font-weight: 300;
  position: relative;
  text-decoration: none; }

.footer_li > a:hover {
  color: #9da8c7 !important;    /* Primary Slate */
  text-decoration: none;
  transition: all 1.0s ease;
  -webkit-transition: all 1.0s ease;   }  /* for Safari & Chrome */ 

.footer_li > a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: 0;
  left: 0;
  background-color: #9da8c7;   /* Primary Slate */
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s; }

.footer_li > a:hover:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);  }




/* ======================================== */
/*   BACK TO TOP BUTTON                     */
/* ======================================== */

.__Back-to-Top {}

div.btn_top_wrapper {
  /* The height needs to be set to a fixed value for the effect to work.
   * 100vh is the full height of the viewport. */
  height: auto;  }
  
#btn_top {
  display: none; /* Default Hidden */
  position: fixed; /* Position: Fixed - Sticky */
  bottom: 15px; /* Place the button at the bottom of the page */
  right: 20px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #5879d6; /* Set a background color */                       /* Primary BLue */
  cursor: pointer; /* Add a hand pointer on hover */
  padding: 4px 10px 4px 10px; /* Some padding */
  border-radius: 20px; /* Rounded corners */
  color: #ffffff;                                                               /* White */
  font-size: 1.2em;
  font-weight: bold;  }

#btn_top:hover {
  background-color: #9da8c7; /* background on hover */                          /* Primary Slate */
  text-decoration: none;
  transition: all 1.0s ease;
  -webkit-transition: all 1.0s ease;/* for Safari & Chrome */ }