*{
    /* border: 1px solid red; */
}
#header #we{
  box-shadow: 2px 2px 4px;
}
#hero{
    background-image: url(../img/h1_hero.jpg); background-size:100% 100%;
}
#q{
    background-image:url(../img/color_bg.png); background-size:100% 100%;
    box-shadow: 2px 2px 4px;
}
#card-text a #y {
    background-color: orangered;
}
#factory #ol{
    position: absolute; top:50%; transform: scaley(0); transition:.5s;
}
#factory #ol #pl{
    position: absolute; top: 50%; background: rgb(247, 126, 12); background-size: cover; transform: translateY(-50%);
}
#factory #box:hover #ol{ transform: scaleY(1);}

@media only screen and (min-width:320px){

  #factory #box:hover #ol{
    display: none;
    }
    
}
@media only screen and (min-width:768px){

  #factory #box:hover #ol{
    display:none;
    }
    
}
@media only screen and (min-width:1024px){

  #factory #box:hover #ol{
    display:block;
    }
    
}
#ml{
    padding-top: 400px;
}
#contact #co{
    background-color: orangered;
}
#footer{
    background-color: rgb(1, 1, 51);
}
#mission #m:hover{
  transform: scale(1.3);
  z-index: 2;
  transition: 1s;
}
/* #footer ul li{
    list-style: none;
} */
#auto #y:hover{
    background-color: blue; color: white;
}
#auto #y{
    background-color: orangered; color: white;
}
#team .carousel-item:hover{
transform: scale(1.1); z-index:2; transition: 1s;
}
#david p:hover{
    color: orangered !important;
}
#david a:hover{
    color: orangered !important;
}
.box4{position:relative}
.box4:before{width:0;height:200%;background:rgba(0,0,0,.5);position:absolute;top:0;left:-250px;bottom:0;transform:skewX(-36deg);transition:all .5s ease 0s}
.box4:hover:before{width:200%;background:rgba(0,0,0,.5)}
.box4 img{width:100%;height:auto}
.box4 .box-content{width:100%;height:100%;padding-top:100%;position:absolute;top:0;left:0;transform:scale(0);transition:all .3s;background:rgba(0,0,0,.6)}
.box4 .icon,.box5 .icon{list-style:none;padding:0}
.box4:hover .box-content{transform:scale(1); text-align: center;}
.box4 .title{font-size:22px;font-weight:700;color:#fff;margin:0 0 10px}
.box4 .post{display:block;font-size:15px;font-weight:600;color:#fff;margin-bottom:20px}
.box4 .icon{margin:0}
.box4 .icon li{display:inline-block}
.box4 .icon li a{display:block;width:35px;height:35px;line-height:35px;font-size:20px;background:#fff;color:#ee4266;margin-right:10px;transition:all .3s ease 0s}
.box5 .icon,.box5 .icon li{display:inline-block}
@media only screen and (max-width:990px){.box4{margin-bottom:30px}
}
@media only screen and (max-width:767px){.box4:before{left:-400px}
.box4:hover:before{width:300%}
}
@import url(https://fonts.googleapis.com/css?family=BenchNine:700);
.snip1562 {
  background-color: blue;
  border: none;
  color: #ffffff;
  cursor: pointer;
  display: inline-block;
  font-family: 'BenchNine', Arial, sans-serif;
  font-size: 1em;
  font-size: 22px;
  line-height: 1em;
  margin: 15px 40px;
  outline: none;
  padding: 12px 40px 10px;
  position: relative;
  text-transform: uppercase;
  font-weight: 700;
}

.snip1562:before,
.snip1562:after {
  border-color: transparent;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
  border-style: solid;
  border-width: 0;
  content: "";
  height: 24px;
  position: absolute;
  width: 24px;
}

.snip1562:before {
  border-color:black;
  border-left-width: 2px;
  border-top-width: 2px;
  left: -5px;
  top: -5px;
}

.snip1562:after {
  border-bottom-width: 2px;
  border-color: black;
  border-right-width: 2px;
  bottom: -5px;
  right: -5px;
}

.snip1562:hover,
.snip1562.hover {
  background-color: orangered;
}

.snip1562:hover:before,
.snip1562.hover:before,
.snip1562:hover:after,
.snip1562.hover:after {
  height: 100%;
  width: 100%;
}
@import url(https://fonts.googleapis.com/css?family=Muli);
.snip1555 {
  font-family: 'Muli', Arial, sans-serif;
  font-size: 18px;
  letter-spacing: 1.5px;
  line-height: 1em;
  margin: 15px 40px;
  text-transform: uppercase;
}
.snip1555 li {
  display: inline-block;
  list-style: outside none none;
  position: relative;
}
.snip1555 li a {
  color: blue;
  text-decoration: none;
}
.snip1555 li:before,
.snip1555 li:after {
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  height: 2px;
  width: 35%;
  background-color: orangered !important;
  position: absolute;
  content: '';
  opacity: 0;
}
.snip1555 li:before {
  top: 0;
  left: 0;
}
.snip1555 li:after {
  bottom: 0;
  right: 0;
}
.snip1555 li:hover:before,
.snip1555 li.hover:before,
.snip1555 li:hover:after,
.snip1555 li.hover:after {
  opacity: 1;
}
.snip1555 li:hover:before,
.snip1555 li.hover:before {
  left: 55%;
}
.snip1555 li:hover:after,
.snip1555 li.hover:after {
  right: 50%;
}
