/*-----------------header-------------------*/
.hero {
    width: 100%;
    height: 100%;
}
.hero {
    position: relative;
    padding: 60px 0 60px 0;
    min-height: 800px;
    background: rgb(219, 219, 219) url(../img/hero-05.jpg) no-repeat center center;
    background-size: cover;
    color: #fff;
}

.texture-overlay {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-image: url(../img/grid.png);
}

.img-responsive {
    display: block;
    max-width: 100%;
    height: 158px;}


.use-btn {
    display: inline-block;
    margin: 0 10px 10px 0;
    padding: 20px 50px;
    border-radius: 3px;
    background-color: #C18E31;
    color: #222;
    font-size: 16px;
}
.learn-btn, .download-btn {
    display: inline-block;
    padding: 18px 46px;
    border: 2px solid #C18E31;
    border-radius: 3px;
    color: #000;
    font-size: 16px;}

//*---------------
.texture-overlay {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-image: url(../img/bman.jpg);
}

header {
    position: relative;
    padding: 60px 0 60px 0;
    min-height: 800px;
    background: rgb(219, 219, 219) url(../img/hero-05.jpg) no-repeat center center;
    background-size: cover;
    color: #fff;}

header .container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;}
.row {
    margin-left: -15px;
    margin-right: -15px;}
.navicon {
    position: relative;
    height: 26px;
}

 header h2{
font-size: 17px;
    color: black;
    float: right;
    margin-right: 13px;
    text-align: center;
 margin-top: 22px;}---*//
/*----------------------*/

.navicon {
    position: relative;
    height: 26px;}

.nav-toggle {
    position: absolute;
    top: 0px;
    right: 15px;
    z-index: 999999;
    cursor: pointer;
    padding: 10px 35px 16px 0px;
}


/* menu appearance*/

ul {
  margin: 0;
  padding: 0;
    position: relative;
    display: inline-block;
    margin: 0 auto;
    padding: 0;
    list-style: none;
}
li a {
  padding: 5px;
  color: #888;
  text-decoration: none;
  transition: all .2s;
}
li a:hover,
li a:focus {
  
  color: #fff;
}
.hero h1 {
       margin: 171px 0px 79px;
    font-weight: 400;
    font-size: 45px;
    color: #000;
    text-align: left;

    
}

.text-left a img{
    display: block;
    margin: auto;}
.text-left a{
color: #337ab7;
    text-decoration: none;
}
.hero h1 span {
    display: inline-block;
    color: #C18E31;}

.hero .be{
    display: inline-block;
    margin: 0 10px 10px 0;
    padding: 20px 50px;
    border-radius: 3px;
    background-color: #C18E31;
    color: #222;
    font-size: 16px;
}
.hero .be:hover{
background-color: #C18E31;
    color: #fff;
    text-decoration: none;}
.hero .bee{
   display: inline-block;
    padding: 18px 46px;
    border: 2px solid #C18E31;
    border-radius: 3px;
    color: #000;
    font-size: 16px;}

.hero .bee:hover{
    sborder-color: #C18E31;
    color: #C18E31;
    text-decoration: none;}
/*-----------------------------------------------------------*/
#companies {
    width: 100%;
    height: 500px;
    margin-top: 97px;}
.feature{
display: inline-block;
    margin-left: 0;
    width: 65%;
    text-align: center;}

#companies img {
    border-width: 0px;
    border-style: initial;
    border-color: initial;
    border-image: initial;
    margin: 9px 0 29px -18px;
    padding: 5px 0 15px 0;}

#companies img:hover{
transform: scale(1.1);}


.feature h1{

color: rgb(36, 55, 75);
    font-size: 20px;
    margin: 0px 0px 10px;
    padding: 0px;}
    
.feature p{
margin-bottom: 20px;
    color: #778899;
}

.navicon p {
    font-size: 18px;
    line-height: 25px;
    color: 000000;}
    
.more {
    display: inline-block;
    color: #C68C30;
    text-transform: uppercase;
    font-weight: 400;}
    
    .more:hover {color: #666;
    text-decoration: none;}

.wrapper {
    margin-top: 18px;}



.wrapper .fa:hover{
    color: #fff;
    
}
.icon {
    display: inline-block;
    position: relative;
    color: #bdbdbd;
    width: 40px;
    height: 40px;
    text-align: center;
    font-size: 1.2em;
    line-height: 2.3em;
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0px 3px 0px #bdbdbd, 0px 3px 10px #bababa;
    transition: background-color 250ms ease 0s;}
    
.wrapper .fa{
    padding: 11px;}
    
.icon:hover{
color: #fff;
    box-shadow: 0px 3px 0px #686868, 0px 3px 10px #7e7e7e;
}
.facebook:hover{
color: #fff;
    box-shadow: 0px 3px 0px #686868, 0px 3px 10px #7e7e7e;
    background-color: #2a6496;}
.twitter:hover{
color: #fff;
    box-shadow: 0px 3px 0px #686868, 0px 3px 10px #7e7e7e;
    background-color: #4cb6e8;}

.envelope:hover{
color: #fff;
    box-shadow: 0px 3px 0px #686868, 0px 3px 10px #7e7e7e;
    background-color: #C68C30;}

.main-footer {
    position: absolute;
    width: 100%;
    left: 0px;
    background-image: url(../img/tile-grid-png.png);
}


footer {
    background-color: #EDEDED;

}
h1 {
    margin: 0.67em 0;
    font-size: 2em;
}
footer img{
vertical-align: middle;}

footer img:hover {
    
    transform: scale(1.1);}
a:hover, a:focus {
    color: #666;
    text-decoration: none;}
footer a{color: #C68C30;
margin-left: 62px;}

footer li {
    float: left;
    list-style: none;
    text-transform: uppercase;
    font-weight: 400;}
footer .nev {
    margin-top: 30px;
    position: relative;
    display: inline-block;
    margin: 0 auto;
    padding: 0;
    list-style: none;
width: 100%;
    margin-top: 35px;}

footer li a:hover {
    padding: 5px;
    color: #888;
    text-decoration: none;
    transition: all .2s;
}

.sidenav ul li {
    display: block;
    float: left;
    margin-right: 20px;
}
.sidenav ul li a {
    display: block;
    padding: 50px 0;
    min-width: 190px;
    border: 2px solid #111;
    border-radius: 3px;
    background-color: #444;
    color: #fff;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 15px;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}
.sidenav ul li a:hover{
    border-color: #C68C30;
    color: #C68C30;

}
.sidenav ul li i {
    display: block;
    margin-bottom: 10px;
    font-size: 40px;
}
.sidenav {
background: rgba(0, 0, 0, 0.75);}