﻿/* =============================================================
GENERAL STYLES
============================================================ */
.spage {
  overflow: hidden;
  display: grid;
  grid-template-rows: auto max-content;
  min-height: 100vh;

}

html {
    font-family: sans-serif;
  }

  article,
  aside,
  details,
  figcaption,
  figure,
  footer,
  header,
  hgroup,
  main,
  menu,
  nav,
  section,
  summary {
    display: block;
  }
  
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  .h1,
  .h2,
  .h3,
  .h4,
  .h5,
  .h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
  }
  h1 small,
  h2 small,
  h3 small,
  h4 small,
  h5 small,
  h6 small,
  .h1 small,
  .h2 small,
  .h3 small,
  .h4 small,
  .h5 small,
  .h6 small,
  h1 .small,
  h2 .small,
  h3 .small,
  h4 .small,
  h5 .small,
  h6 .small,
  .h1 .small,
  .h2 .small,
  .h3 .small,
  .h4 .small,
  .h5 .small,
  .h6 .small {
    font-weight: normal;
    line-height: 1;
    color: #777;
  }
  h1,
  .h1,
  h2,
  .h2,
  h3,
  .h3 {
    margin-top: 20px;
    
  }
  h1 small,
  .h1 small,
  h2 small,
  .h2 small,
  h3 small,
  .h3 small,
  h1 .small,
  .h1 .small,
  h2 .small,
  .h2 .small,
  h3 .small,
  .h3 .small {
    font-size: 65%;
  }
  h4,
  .h4,
  h5,
  .h5,
  h6,
  .h6 {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  h4 small,
  .h4 small,
  h5 small,
  .h5 small,
  h6 small,
  .h6 small,
  h4 .small,
  .h4 .small,
  h5 .small,
  .h5 .small,
  h6 .small,
  .h6 .small {
    font-size: 75%;
  }
  h1,
  .h1 {
    font-size: 36px;
  }
  h2,
  .h2 {
    font-size: 30px;
  }
  h3,
  .h3 {
    font-size: 24px;
  }
  h4,
  .h4 {
    font-size: 18px;
  }
  h5,
  .h5 {
    font-size: 14px;
  }
  h6,
  .h6 {
    font-size: 12px;
  }
  p {
    margin: 0 0 10px;
  }
  
@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/ubuntu-v19-latin-ext_latin_cyrillic-ext_cyrillic-regular.woff2") format('woff2'); 
    font-display: swap;
 }
 .loader {
  position: fixed;

  box-shadow: inset 0px 1px 20px 8px #573aca;
  top: 0;
  left: 0;
  background: #010101;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 100;
}
.disppear{
  animation: vanish 1s forwards;
}
@keyframes vanish {
  100%{
    opacity: 0;
    visibility: hidden;
  }
}
body{
  Background-Color:#3b3b3d;
  background:url("../img/body.jpg"); 
  background-attachment: fixed;
  font-family: 'Ubuntu' , sans-serif;
  color: #fafafa;

}
header {
    font-family: 'Ubuntu', sans-serif;
    background-color: #3b3b3d;
    background-image:url("../img/heder.jpg"); 
    background-size: cover;
}
a{
    text-decoration: none;
}
h3{
    margin-top: 12px;
    
}

img {
    vertical-align: middle;
  }
hr {
 border: 0;   
width: 100%;
border-top: 4px solid #fc5008;
background-color:#00000000;
box-shadow: 0px 0px 14px 0px #000000e8;
opacity: 1;

}
hr:not([size]) {
    height: 0px;
}

::-webkit-scrollbar{
    width: 10px;
}
::-webkit-scrollbar-track{
    background-color: #3b3b3d;
}
::-webkit-scrollbar-thumb{
   background-color: #fc5008;
   border-left: 3px solid #3b3b3d;
   border-right: 3px solid #3b3b3d;
}

/* =============================================================
CUSTOM BUTTON STYLES
============================================================ */
.button-custom {
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
border-radius: 0px;
margin: 25px 5px 5px 0px;
margin: 5px;
}

.btn-custom-one {
background-color: transparent;
color: #fff;
border: 2px solid rgb(228, 79, 79);
}

.btn-custom-one:hover {
background-color: rgb(228, 79, 79);
text-decoration: none;
color: #fff;
}

.btn-custom-two {
color: #fff;
background-color: rgb(228, 79, 79);
border: 2px solid rgb(228, 79, 79);
}

.btn-custom-two:hover {
border: 2px solid rgb(228, 79, 79);
text-decoration: none;
color: #fff;
background-color: transparent;
}


/* =============================================================
MENU SECTION STYLES
============================================================ */

.navbar-nav{
    margin-top: 5px;
}
.nav:before{
    display: table;
    content: " ";
}
.navbar-inverse .navbar-brand, .navbar-inverse .navbar-brand:hover {
    font-size: 16px;
    color: #fff;
    letter-spacing: 2px;
    font-weight: 900;
    font-family: 'Ubuntu' , sans-serif;
    background-color: #00000000;
   
}
.navbar-inverse .navbar-nav{

    margin-top: 5px;

}
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
background-color: #1d1b1ba1;
border-bottom: 2.5px solid #fc5008;
}
.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
    background-color: #1d1b1ba1;
    color: #fff;
    border-bottom: 2.0px solid #fc5008;
   }

.navbar-inverse .navbar-nav > li > a {
background-color: #3b3b3d;
font-size: 15px;
font-weight: 800;
padding: 5px 13px;
letter-spacing: 2px;

margin: 5px 5px 5px 5px;
color: #FFF;
}

.navbar-fixed-top{
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.856);
}





.neon-button {
  display: inline-block;
  cursor: pointer;
  text-decoration: none;
  color: #573aca;
  border: #101010 0.125em solid;
  padding: 0.25em 1em;
  border-radius: 0.25em;
  position: relative;
}
.neon-button:hover {
  background-color: #573aca;
}

.neon-button::before {
  pointer-events: none;
  content: "";
  position: absolute;
  background: #fc5008;
  top: -70%;
  left: 0;
  width: 100%;
  height: 100%;
  transform: perspective(1.4em) rotateX(-40deg) scale(1, 0.35);
  filter: blur(1em);
  opacity: 0.4;
  transition: opacity 200ms linear;
}
.neon-button::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  box-shadow: 0 0 2em 0.5em #573aca;
  opacity: 0;
  background-color: #573aca;
  z-index: -1;
  transition: opacity 200ms linear;
}
.neon-button:hover,
.neon-button:focus {
  text-shadow: none;
}

.neon-button:hover::before,
.neon-button:focus::before {
  opacity: 1;
}
.neon-button:hover::after,
.neon-button:focus::after {
  opacity: 1;
}



/* =============================================================
HOME SECTION STYLES
============================================================ */
.contain{
  text-align: center;
  margin-top: 50px;
    max-width: 98%;
    margin-left: auto;
    margin-right: auto;
}
.team {
    margin-left: 3%;
    margin-right: 3%;
}
.contain-background {
    margin-left: auto;
    margin-right: auto;
    background-color: #0000006b;
    box-shadow: 0px 0px 14px 0px #000000e8;
    height: 100%;
}
#home {
    text-align: left;
    padding-top: 50px;
}
#home .social {
    height: 500;
    display: block;
    block-size: 500;
    margin: 50px 20px;
}
#home .contain{
  margin-top: 0px;
}

/*///////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////*/

.carousel-caption, h3, .h3{
    font-size: 13px;
}
.carousel-caption{
    left: 10%;
    right: 10%;
    border-radius: 15px;
    background-color: #161616b7;
    padding-bottom : 0px;
    padding-top: 0px;
    padding-left: 5px;
    padding-right: 5px;
}
.carousel-caption, h5, .h5{
    margin-top: 8px;
}
.carousel-caption, p, .p{
    margin-bottom: 5px;
    font-size: 10px;
}
.carousel-caption, h5, .h5{
    font-size: 12px;
    margin-bottom: 3px;
}
.carousel-control-prev, .carousel-control-next {
    opacity: 1;
    color: #272727;
}
.carousel-control-next-icon {
    background-image: url("../img/svg/next-svgrepo-com2.svg");
}
.carousel-control-prev-icon {
    background-image: url("../img/svg//previous-svgrepo-com2.svg");
}
.carousel-control-prev-icon, .carousel-control-next-icon {
    width: 1.5rem;
    height: 1.5rem;
}
.carousel-indicators [data-bs-target]{
  
  border-top: 0px solid transparent; 
  border-bottom: 0px solid transparent;
    margin-top: 5px;
}
/*///////////////////////////////////////////////////*/


h3, .h3{
    margin-bottom: 5px;
}
 .d-none{
    display:block !important;
}

.text-top{
    font-size: 12px;
    font-weight: 900;
    word-spacing:5px;
    text-shadow: 0px 3px 20px black;
    background-image: url("../img/background.jpg");
    width: 100%;  
    margin: 0%;
    background-position:center;
    background-size:contain;
 
    padding-top: 1.8em;
    padding-bottom:  1.5em;
    margin-bottom:  1em;
     
    box-shadow: 0px 10px 20px 0px rgb(0 0 0 / 86%);
}
.author {
  max-width: 60%;
  float: left;
  padding: 2% 0px 0px 3% ; 
  text-align: center;
  line-height:90%;
}
.author-body {
  background-color: #14141485;  
  float:left;

  padding: 10px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;  
  box-shadow: 0px 0px 8px 0px #000000e8;  
}
.author-body img{
  float: right; 

  margin-bottom: 10px;
  background-color: #fff;
  width: 25%;
}
.bottom-img {
  margin: 0px 0%;
  position: relative;
}
.footer-icon{
  float: right;
  width: 7.0%; 
  height: 10%;


margin-right: 10px;

}
.footer-icon img {
  width: 100%; 


  border-radius: 50%; 
  border: solid 1px #00000000;
  background-color: #fafafa; 
}

/*///////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////*/


@media (min-width: 360px) {
    .navbar-inverse .navbar-brand, .navbar-inverse .navbar-brand:hover {
        font-size: 16px;
    }
    .text-top{
        font-size: 12px;
    }
    .carousel-caption, h3, .h3{
        font-size: 12px;
    }
    .carousel-caption, p, .p{
        font-size: 10px;
    }
    .carousel-caption, h5, .h5{
        font-size: 11px;
    }
}

@media (min-width: 430px) {
    .navbar-inverse .navbar-brand, .navbar-inverse .navbar-brand:hover {
        font-size: 20px;
    }
    .text-top{
        font-size: 14px;
    }
    .carousel-caption, h3, .h3{
        font-size: 16px;
    }
    .carousel-caption, p, .p{
        font-size: 12px;
    }
    .carousel-caption, h5, .h5{
        font-size: 14px;
    }
    .carousel-control-prev-icon, .carousel-control-next-icon {
        width: 2.5rem;
        height: 2.5rem;
    }
    .author{
      line-height:110%;
    }
}  
@media (min-width: 500px) {
    .carousel-caption, h3, .h3{
        font-size: 20px;
    }
    .carousel-caption, p, .p{
        font-size: 14px;
    }
    .text-top{
        font-size: 15px;
     }
     .author {
      max-width: 60%;
      line-height:140%;
    }
    .footer-icon{
      width: 5.5%; 
    }


}  


@media (min-width: 600px) {
    .text-top{
       font-size: 17px;
    }
    h3, .h3{
        margin-bottom: 10px;
    }
    .carousel-caption, h5, .h5{
     font-size: 15px;
    }
    .carousel-control-prev-icon, .carousel-control-next-icon {
        width: 3rem;
        height: 3rem;
    }
    .contain p, .p{
        font-size: 16px;
    }
    #content2 p, .p{
        font-size: 12px;
    }
    .author {
      max-width: 65%;
    }
    .footer-icon{
   
      width: 5.5%; 
      height: 15%;
    }
    .author-body img{
      width: 25%;

    }

}
@media (min-width: 700px) {
    #content2 p, .p{
        font-size: 14px;
    }
    .footer-icon{
   
      width: 4.5%; 
      height: 10%;
    }
}
    @media (min-width: 992px) {
        .text-top{
            font-size: 20px;
        }
        .carousel-caption, h5, .h5{
            font-size: 18px;
        }
  
        .contain p, .p{
            font-size: 18px;
        }
        #content2 p, .p{
            font-size: 14px;
        }
        .author {    
          line-height:160%;
          max-width: 80%;
        }
        .footer-icon{
          width: 3.5%;
        }
        .author-body img{
          width: 18%;
    
        }
  
    }
    @media (min-width: 1200px) {
      .author {    
        line-height:180%;
      }
      .author-body img{
        width: 16%;

      }
    }
    @media (min-width: 1400px) {
      .footer-icon{
        width: 3.0%; 
      }
      .author-body img{
        width: 14%;
      }
    }


/*============================
footer  
==============================*/
#footer {
    text-align:left;
    color:#fafafa;
margin-top: auto;
    box-shadow: 0px -10px 20px 0px rgb(0 0 0 / 86%);
   
}
/*============================
2 Page 
==============================*/
#about-the-factory{
    padding-bottom: 40px;
}
#about-the-factory h3, .h3{
   
    font-size: 20px;
    
}

#content2 .services-wrapper{
cursor: pointer;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
height: 95%;
margin-top: 15px;
border-radius: 5px;
background-color: #3a3a3a;
box-shadow: 0px 0px 14px 0px #000000e8;
}
#content2 .services-wrapper:hover {
    background-color: #303030
}
#content2 h3 {
    padding-left: 20px;
    padding-right: 20px;
    font-family: 'Oswald', sans-serif;
    margin-bottom: 5px;
}
#content2 p{
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 5px;
}

#content2 .services-wrapper i {
    padding: 5px;
    color: rgb(228, 79, 79);
    font-size: 60px;
}
#content2 img{
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: 0px 3px 20px 0px rgb(0 0 0 / 86%);
}
#content2 {
   margin-bottom: 25px;
}
/*============================
3 Page 
==============================*/

.resources {
  padding-left: 15px;
  padding-right: 15px;
}
.resources  a {
  color: #fc5000;

}
.resources  a:hover {
  text-shadow: 0 0 10px #fc5008, 0 0 20px #fc5008, 0 0 30px #fc5008, 0 0 40px #fc5008;
  color: #fd8c5c;

}
.brand, h3 {
margin-top: 16px;
}
.brand {
  letter-spacing: 2px;
font-weight: 900;
  color: #fafafa;

}
.brand, a:hover {
  color: #fafafa;
}
.footer-icon img:hover {
  box-shadow: 0 0 10px #fafafa;
}






  
  

  /*////////////////////////////////*/
  /* Menu///////////////////////////*/
  /*////////////////////////////////*/
  .container {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
  }
  
  
  .collapse.in {
    display: block;
    visibility: visible;
  } 

  .dropdown {
    position: relative;
  }
  .dropdown-toggle:focus {
    outline: 0;
  }
  .dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;     
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
            box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  }
  .dropdown-menu.pull-right {
    right: 0;
    left: auto;
  }
  .dropdown-menu .divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #e5e5e5;
  }
  .dropdown-menu > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
  }
  .dropdown-menu > li > a:hover,
  .dropdown-menu > li > a:focus {
    color: #262626;
    text-decoration: none;
    background-color: #f5f5f5;
  }
  .dropdown-menu > .active > a,
  .dropdown-menu > .active > a:hover,
  .dropdown-menu > .active > a:focus {
    color: #fff;
    text-decoration: none;
    background-color: #337ab7;
    outline: 0;
  }
  .dropdown-menu > .disabled > a,
  .dropdown-menu > .disabled > a:hover,
  .dropdown-menu > .disabled > a:focus {
    color: #777;
  }
  .dropdown-menu > .disabled > a:hover,
  .dropdown-menu > .disabled > a:focus {
    text-decoration: none;
    cursor: not-allowed;
    background-color: transparent;
    background-image: none;
  }
  .open > .dropdown-menu {
    display: block;
  }
  .open > a {
    outline: 0;
  }
  .dropdown-menu-right {
    right: 0;
    left: auto;
  }
  .dropdown-menu-left {
    right: auto;
    left: 0;
  }
  .dropdown-header {
    display: block;
    padding: 3px 20px;
    font-size: 12px;
    line-height: 1.42857143;
    color: #777;
    white-space: nowrap;
  }
  .dropdown-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 990;
  }
  .pull-right > .dropdown-menu {
    right: 0;
    left: auto;
  }
  
   .dropdown-menu,
  .navbar-fixed-bottom .dropdown .dropdown-menu {
    top: auto;
    bottom: 100%;
    margin-bottom: 2px;
  }
  @media (min-width: 710px) {
    .navbar-right .dropdown-menu {
      right: 0;
      left: auto;
    }
    .navbar-right .dropdown-menu-left {
      right: auto;
      left: 0;
    }
  }
  
  
  .nav {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
  }
  .nav > li {
    position: relative;
    display: block;
  }
  .nav > li > a {
    position: relative;
    display: block;
    padding: 10px 15px;
  }
  .nav > li > a:hover,
  .nav > li > a:focus {
    text-decoration: none;
    background-color: #eee;
  }
  .nav > li.disabled > a {
    color: #777;
  }
  .nav > li.disabled > a:hover,
  .nav > li.disabled > a:focus {
    color: #777;
    text-decoration: none;
    cursor: not-allowed;
    background-color: transparent;
  }
  .nav .open > a,
  .nav .open > a:hover,
  .nav .open > a:focus {
    background-color: #eee;
    border-color: #337ab7;
  }
  .nav .nav-divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #e5e5e5;
  }
  .nav > li > a > img {
    max-width: none;
  }
  .nav-tabs {
    border-bottom: 1px solid #ddd;
  }
  .nav-tabs > li {
    float: left;
    margin-bottom: -1px;
  }
  .nav-tabs > li > a {
    margin-right: 2px;
    line-height: 1.42857143;
    border: 1px solid transparent;
    border-radius: 4px 4px 0 0;
  }
  .nav-tabs > li > a:hover {
    border-color: #eee #eee #ddd;
  }
  .nav-tabs > li.active > a,
  .nav-tabs > li.active > a:hover,
  .nav-tabs > li.active > a:focus {
    color: #555;
    cursor: default;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
  }
  .nav-tabs.nav-justified {
    width: 100%;
    border-bottom: 0;
  }
  .nav-tabs.nav-justified > li {
    float: none;
  }
  .nav-tabs.nav-justified > li > a {
    margin-bottom: 5px;
    text-align: center;
  }
  .nav-tabs.nav-justified > .dropdown .dropdown-menu {
    top: auto;
    left: auto;
  }
  @media (min-width: 710px) {
    .nav-tabs.nav-justified > li {
      display: table-cell;
      width: 1%;
    }
    .nav-tabs.nav-justified > li > a {
      margin-bottom: 0;
    }
  }
  .nav-tabs.nav-justified > li > a {
    margin-right: 0;
    border-radius: 4px;
  }
  .nav-tabs.nav-justified > .active > a,
  .nav-tabs.nav-justified > .active > a:hover,
  .nav-tabs.nav-justified > .active > a:focus {
    border: 1px solid #ddd;
  }
  @media (min-width: 710px) {
    .nav-tabs.nav-justified > li > a {
      border-bottom: 1px solid #ddd;
      border-radius: 4px 4px 0 0;
    }
    .nav-tabs.nav-justified > .active > a,
    .nav-tabs.nav-justified > .active > a:hover,
    .nav-tabs.nav-justified > .active > a:focus {
      border-bottom-color: #fff;
    }
  }
  .nav-pills > li {
    float: left;
  }
  .nav-pills > li > a {
    border-radius: 4px;
  }
  .nav-pills > li + li {
    margin-left: 2px;
  }
  .nav-pills > li.active > a,
  .nav-pills > li.active > a:hover,
  .nav-pills > li.active > a:focus {
    color: #fff;
    background-color: #337ab7;
  }
  .nav-stacked > li {
    float: none;
  }
  .nav-stacked > li + li {
    margin-top: 2px;
    margin-left: 0;
  }
  .nav-justified {
    width: 100%;
  }
  .nav-justified > li {
    float: none;
  }
  .nav-justified > li > a {
    margin-bottom: 5px;
    text-align: center;
  }
  .nav-justified > .dropdown .dropdown-menu {
    top: auto;
    left: auto;
  }
  @media (min-width: 710px) {
    .nav-justified > li {
      display: table-cell;
      width: 1%;
    }
    .nav-justified > li > a {
      margin-bottom: 0;
    }
  }
  .nav-tabs-justified {
    border-bottom: 0;
  }
  .nav-tabs-justified > li > a {
    margin-right: 0;
    border-radius: 4px;
  }
  .nav-tabs-justified > .active > a,
  .nav-tabs-justified > .active > a:hover,
  .nav-tabs-justified > .active > a:focus {
    border: 1px solid #ddd;
  }
  @media (min-width: 710px) {
    .nav-tabs-justified > li > a {
      border-bottom: 1px solid #ddd;
      border-radius: 4px 4px 0 0;
    }
    .nav-tabs-justified > .active > a,
    .nav-tabs-justified > .active > a:hover,
    .nav-tabs-justified > .active > a:focus {
      border-bottom-color: #fff;
    }
  }
  .tab-content > .tab-pane {
    display: none;
    visibility: hidden;
  }
  .tab-content > .active {
    display: block;
    visibility: visible;
  }
  .nav-tabs .dropdown-menu {
    margin-top: -1px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  .navbar {
    position: relative;
    min-height: 50px;
    margin-bottom: 20px;
    border: 1px solid transparent;
  }
  @media (min-width: 710px) {
    .navbar {
      border-radius: 4px;
    }
  }
  @media (min-width: 710px) {
    .navbar-header {
      float: left;
    }
  }
  .navbar-collapse {
    padding-right: 15px;
    padding-left: 15px;
    overflow-x: visible;
    border-top: 1px solid transparent;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
  }
  .navbar-collapse.in {
    overflow-y: auto;
  }
  @media (min-width: 710px) {
    .navbar-collapse {
      width: auto;
      border-top: 0;
      -webkit-box-shadow: none;
              box-shadow: none;
    }
    .navbar-collapse.collapse {
      display: block !important;
      height: auto !important;
      padding-bottom: 0;
      overflow: visible !important;
      visibility: visible !important;
    }
    .navbar-collapse.in {
      overflow-y: visible;
    }
    .navbar-fixed-top .navbar-collapse,
    .navbar-static-top .navbar-collapse,
    .navbar-fixed-bottom .navbar-collapse {
      padding-right: 0;
      padding-left: 0;
    }
  }
  .navbar-fixed-top .navbar-collapse,
  .navbar-fixed-bottom .navbar-collapse {
    max-height: 340px;
  }
  @media (max-device-width: 480px) and (orientation: landscape) {
    .navbar-fixed-top .navbar-collapse,
    .navbar-fixed-bottom .navbar-collapse {
      max-height: 200px;
    }
  }
  .container > .navbar-header,
  .container-fluid > .navbar-header,
  .container > .navbar-collapse,
  .container-fluid > .navbar-collapse {
    margin-right: -15px;
    margin-left: -15px;
  }
  @media (min-width: 710px) {
    .container > .navbar-header,
    .container-fluid > .navbar-header,
    .container > .navbar-collapse,
    .container-fluid > .navbar-collapse {
      margin-right: 0;
      margin-left: 0;
      background-attachment: fixed;
      background-size: cover;
    }
  }
  .navbar-static-top {
    z-index: 1000;
    border-width: 0 0 1px;
  }
  @media (min-width: 710px) {
    .navbar-static-top {
      border-radius: 0;
    }
  }
  .navbar-fixed-top,
  .navbar-fixed-bottom {
    position: fixed;
    right: 0;
    left: 0;
    z-index: 90;
  }
  @media (min-width: 710px) {
    .navbar-fixed-top,
    .navbar-fixed-bottom {
      border-radius: 0;
    }
  }
  .navbar-fixed-top {
    top: 0;
    border-width: 0 0 1px;
  }
  .navbar-fixed-bottom {
    bottom: 0;
    margin-bottom: 0;
    border-width: 1px 0 0;
  }
  .navbar-brand {
  
    float: left;
    height: 50px;
    padding: 15px 15px;
    font-size: 22px;
    line-height: 20px;
  }
  .navbar-brand:hover,
  .navbar-brand:focus {
    text-decoration: none;
  }
  .navbar-brand > img {
    display: block;
  }
  @media (min-width: 710px) {
    .navbar > .container .navbar-brand,
    .navbar > .container-fluid .navbar-brand {
      margin-left: -15px;
    }
  }
  .navbar-toggle {
    position: relative;
    float: right;
    padding: 9px 10px;
    margin-top: 8px;
    margin-right: 15px;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
  }
  .navbar-toggle:focus {
    outline: 0;
  }
  .navbar-toggle .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px;
  }
  .navbar-toggle .icon-bar + .icon-bar {
    margin-top: 4px;
  }
  @media (min-width: 710px) {
    .navbar-toggle {
      display: none;
    }
  }
  .navbar-nav {
    margin: 7.5px -15px;
  }
  .navbar-nav > li > a {
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 20px;
  }
  @media (max-width: 767px) {
    .navbar-nav .open .dropdown-menu {
      position: static;
      float: none;
      width: auto;
      margin-top: 0;
      background-color: transparent;
      
      border: 0;
      -webkit-box-shadow: none;
              box-shadow: none;
    }
    .navbar-nav .open .dropdown-menu > li > a,
    .navbar-nav .open .dropdown-menu .dropdown-header {
      padding: 5px 15px 5px 25px;
    }
    .navbar-nav .open .dropdown-menu > li > a {
      line-height: 20px;
    }
    .navbar-nav .open .dropdown-menu > li > a:hover,
    .navbar-nav .open .dropdown-menu > li > a:focus {
      background-image: none;
    }
  }
  @media (min-width: 710px) {
    .navbar-nav {
      float: left;
      margin: 0;
    }
    .navbar-nav > li {
      float: left;
    }
    .navbar-nav > li > a {
      padding-top: 15px;
      padding-bottom: 15px;
    }
  }
  .navbar-form {
    padding: 10px 15px;
    margin-top: 8px;
    margin-right: -15px;
    margin-bottom: 8px;
    margin-left: -15px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    -webkit-box-shadow: inset 0 1px 0 #ffffff1a, 0 1px 0 #ffffff1a;
            box-shadow: inset 0 1px 0 #ffffff1a, 0 1px 0 #ffffff1a;
  }
  @media (min-width: 710px) {
    .navbar-form .form-group {
      display: inline-block;
      margin-bottom: 0;
      vertical-align: middle;
    }
    .navbar-form .form-control {
      
      display: inline-block;
      width: auto;
      vertical-align: middle;
    }
    .navbar-form .form-control-static {
      display: inline-block;
    }
    .navbar-form .input-group {
      display: inline-table;
      vertical-align: middle;
    }
    .navbar-form .input-group .input-group-addon,
    .navbar-form .input-group .input-group-btn,
    .navbar-form .input-group .form-control {
      width: auto;
    }
    .navbar-form .input-group > .form-control {
      width: 100%;
    }
    .navbar-form .control-label {
      margin-bottom: 0;
      vertical-align: middle;
    }
    .navbar-form .radio,
    .navbar-form .checkbox {
      display: inline-block;
      margin-top: 0;
      margin-bottom: 0;
      vertical-align: middle;
    }
    .navbar-form .radio label,
    .navbar-form .checkbox label {
      padding-left: 0;
    }
    .navbar-form .radio input[type="radio"],
    .navbar-form .checkbox input[type="checkbox"] {
      position: relative;
      margin-left: 0;
    }
    .navbar-form .has-feedback .form-control-feedback {
      top: 0;
    }
  }
  @media (max-width: 767px) {
    .navbar-form .form-group {
      margin-bottom: 5px;
    }
    .navbar-form .form-group:last-child {
      margin-bottom: 0;
    }
  }
  @media (min-width: 710px) {
    .navbar-form {
      width: auto;
      padding-top: 0;
      padding-bottom: 0;
      margin-right: 0;
      margin-left: 0;
      border: 0;
      -webkit-box-shadow: none;
              box-shadow: none;
    }
  }
  .navbar-nav > li > .dropdown-menu {
    margin-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  .navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
    margin-bottom: 0;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }
  .navbar-btn {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .navbar-btn.btn-sm {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .navbar-btn.btn-xs {
    margin-top: 14px;
    margin-bottom: 14px;
  }
  .navbar-text {
    margin-top: 15px;
    margin-bottom: 15px;
  }
  @media (min-width: 710px) {
    .navbar-text {
      float: left;
      margin-right: 15px;
      margin-left: 15px;
    }
  }
  @media (min-width: 710px) {
    .navbar-left {
      float: left !important;
    }
    .navbar-right {
      float: right !important;
      margin-right: -15px;
    }
    .navbar-right ~ .navbar-right {
      margin-right: 0;
    }
  }
  .navbar-default {
    background-color: #f8f8f8;
    border-color: #e7e7e7;
  }
  .navbar-default .navbar-brand {
    color: #777;
  }
  .navbar-default .navbar-brand:hover,
  .navbar-default .navbar-brand:focus {
    color: #5e5e5e;
  }
  .navbar-default .navbar-text {
    color: #777;
  }
  .navbar-default .navbar-nav > li > a {
    color: #777;
  }
  .navbar-default .navbar-nav > li > a:hover,
  .navbar-default .navbar-nav > li > a:focus {
    color: #333;
    background-color:rgba(0, 0, 0, 0);
  }
  .navbar-default .navbar-nav > .active > a,
  .navbar-default .navbar-nav > .active > a:hover,
  .navbar-default .navbar-nav > .active > a:focus {
    color: #555;
    background-color: #e7e7e7;
  }
  .navbar-default .navbar-nav > .disabled > a,
  .navbar-default .navbar-nav > .disabled > a:hover,
  .navbar-default .navbar-nav > .disabled > a:focus {
    color: #ccc;
    background-color: transparent;
  }
  .navbar-default .navbar-toggle {
    border-color: #ddd;
  }
  .navbar-default .navbar-toggle:hover,
  .navbar-default .navbar-toggle:focus {
    background-color: #ddd;
  }
  .navbar-default .navbar-toggle .icon-bar {
    background-color: #888;
  }
  .navbar-default .navbar-collapse,
  .navbar-default .navbar-form {
    border-color: #e7e7e7;
  }
  .navbar-default .navbar-nav > .open > a,
  .navbar-default .navbar-nav > .open > a:hover,
  .navbar-default .navbar-nav > .open > a:focus {
    color: #555;
    background-color: #c91010;
  }
  @media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
      color: #777;
    }
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
      color: #333;
      background-color: transparent;
    }
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
      color: #555;
      background-color: #e7e7e7;
    }
    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
      color: #ccc;
      background-color: transparent;
    }
  }
  .navbar-default .navbar-link {
    color: #777;
  }
  .navbar-default .navbar-link:hover {
    color: #333;
  }
  .navbar-default .btn-link {
    color: #777;
  }
  .navbar-default .btn-link:hover,
  .navbar-default .btn-link:focus {
    color: #333;
  }
  .navbar-default .btn-link[disabled]:hover,
  fieldset[disabled] .navbar-default .btn-link:hover,
  .navbar-default .btn-link[disabled]:focus,
  fieldset[disabled] .navbar-default .btn-link:focus {
    color: #ccc;
  }
  .navbar-inverse {
    background-color:rgba(0, 0, 0, 0);
    border-color: #080808;
  }

  .navbar-inverse .navbar-brand:focus {
      
    color: #fff;
  }
  .navbar-inverse .navbar-text {
    color: #9d9d9d;
  }

  .navbar-inverse .navbar-nav > li > a:hover,
  .navbar-inverse .navbar-nav > li > a:focus {
    color: #fff;
    background-color: transparent;
  }
  .navbar-inverse .navbar-nav > .active > a,
  .navbar-inverse .navbar-nav > .active > a:hover,
  .navbar-inverse .navbar-nav > .active > a:focus {
    color: #fff;
  }
  .navbar-inverse .navbar-nav > .disabled > a,
  .navbar-inverse .navbar-nav > .disabled > a:hover,
  .navbar-inverse .navbar-nav > .disabled > a:focus {
    color: #444;
    background-color: transparent;
  }
  .navbar-inverse .navbar-toggle {
    background-color: #fc5000;
  }
  .navbar-inverse .navbar-toggle:hover,
  .navbar-inverse .navbar-toggle:focus {
    background-color: #fc5000;
  }
  .navbar-inverse .navbar-toggle .icon-bar {
    background-color: #fff;
  }
  .navbar-inverse .navbar-collapse,
  .navbar-inverse .navbar-form {
    border-color: #101010;
  }
  .navbar-inverse .navbar-nav > .open > a,
  .navbar-inverse .navbar-nav > .open > a:hover,
  .navbar-inverse .navbar-nav > .open > a:focus {
    color: #fff;
    background-color: #080808;
  }
  @media (max-width: 767px) {
    .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
      border-color: #080808;
    }
    .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
      background-color: #080808;
    }
    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
      color: #9d9d9d;
    }
    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
      color: #fff;
      background-color: transparent;
    }
    .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
      color: #fff;
      background-color: #080808;
    }
    .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
      color: #444;
      background-color: transparent;
    }
  }
  .navbar-inverse .navbar-link {
    color: #9d9d9d;
  }
  .navbar-inverse .navbar-link:hover {
    color: #fff;
  }
  .navbar-inverse .btn-link {
    color: #9d9d9d;
  }
  .navbar-inverse .btn-link:hover,
  .navbar-inverse .btn-link:focus {
    color: #fff;
  }
  .navbar-inverse .btn-link[disabled]:hover,
  fieldset[disabled] .navbar-inverse .btn-link:hover,
  .navbar-inverse .btn-link[disabled]:focus,
  fieldset[disabled] .navbar-inverse .btn-link:focus {
    color: #444;
  }
  
  
  
  
  .clearfix:before,
  .clearfix:after,
  .dl-horizontal dd:before,
  .dl-horizontal dd:after,
  .container:before,
  .container:after,
  .container-fluid:before,
  .container-fluid:after,
  .row:before,
  .row:after,
  .form-horizontal .form-group:before,
  .form-horizontal .form-group:after,
  .btn-toolbar:before,
  .btn-toolbar:after,
  .btn-group-vertical > .btn-group:before,
  .btn-group-vertical > .btn-group:after,
  .nav:before,
  .nav:after,
  .navbar:before,
  .navbar:after,
  .navbar-header:before,
  .navbar-header:after,
  .navbar-collapse:before,
  .navbar-collapse:after,
  .pager:before,
  .pager:after,
  .panel-body:before,
  .panel-body:after,
  .modal-footer:before,
  .modal-footer:after {
    display: table;
    content: " ";
  }
  .clearfix:after,
  .dl-horizontal dd:after,
  .container:after,
  .container-fluid:after,
  .row:after,
  .form-horizontal .form-group:after,
  .btn-toolbar:after,
  .btn-group-vertical > .btn-group:after,
  .nav:after,
  .navbar:after,
  .navbar-header:after,
  .navbar-collapse:after,
  .pager:after,
  .panel-body:after,
  .modal-footer:after {
    clear: both;
  }