/*

orange color : #ed8032

*/


@keyframes bounceIn {
  0% {
    transform: scale(0.1);
    opacity: 0;
  }
  60% {
    transform: scale(1.2);
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}


.button.alt:hover {
  animation-duration: 2s;
  animation-name: bounceIn;
}

body
{
    padding-bottom:0px;
}

h1, h2, h3, h4, h5, h6 {
    color: #ed8032;
}

.navbar-inverse
{
    background: white ;
    /*opacity: 0.7;*/
}

.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover
{
    background-color: #ed8032;
	border-radius: 35px;
}

.navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-brand, .navbar-inverse .navbar-nav>li>a:hover
{
    color: #ed8032;
}

.navbar-header > a, #navbar > ul > li a
{
    text-decoration: none;
   
}


.title > h2, #banner h2
{
    color: white;
	background-color: rgba(144, 144, 144, 0.25);
}


.navbar-nav
{
    margin: 15px;
    float: right;
}

.navbar-toggle 
{
    background-color: #ed8032;
    margin-top: 18px;
}

.button.alt , .wrapper.style2 .button.alt 
{
    color: #ed8032 !important;
    background-color: White;
    border-radius: 20px;
    box-shadow: inset 0 0 0 1px rgba(144, 144, 144, 0.75);
}

.wrapper.style2 .button.alt:hover
{
    background-color: #76a9d7;
    color: White !important;
}

.button.special
{
    background-color: #ed8032;
     color: White !important;
}


header.major.left
{
    font-size: .9em;
    text-align:left;
    
}

#banner
{
    background-image: none;
}

#banner:before
{
    background-color:transparent;
}

#banner h2
{
    margin-top: 15px;
}

#banner.repares
{
    background-image: url('../images/rands.jpg');
}


#banner.contact
{
    background-image: url('../images/contact.jpg');
   /*  opacity: 0.7;*/
}


#banner.services
{
    background-image: url('../images/services.jpg');
   /*  opacity: 0.7;*/
}

#banner.other
{
    background-image: url('../images/hands-1838659_960_720.jpg');
   /*  opacity: 0.7;*/
}

#banner.about
{
    background-image: url('../images/about.JPG');
   /*  opacity: 0.7;*/
}



header p
{
  color: #555f66;  
}

a, #footer a
{
    color: #ed8032;
}

#header
{
    height: 8em;
    line-height: 8em;
}

#Header wrapper
{
   padding: 8em 0 0 0
}

#header nav > ul > li a:hover {
	color: #ed8032;
}

ul.contact
{
    padding-left: 0;
}


ul.contact li
{
    padding-bottom: 10px;
    padding-left:0px;
    list-style:none;
}

ul.alt li {
    border-top: solid 1px #ed8032;
}

ul.alt {
list-style-image: url('../images/bulletimagesmall.jpg');
}

/*
ul.alt li:hover
{
    background-color: #ccc;
}
*/

.font.special
{
       color: #ed8032;
       font-weight:bolder;
}

.wrapper
{
   padding: 2em 0 0 0
}

.wrapper.header
{
   padding: 8em 0 0 0
}

.wrapper.style2
{
	background: url(../images/pattern.jpg);
	/*background-repeat: repeat-y;*/
    /*background-color: #ed8032;*/
}

.wrapper.style3
{
    background-color: #f8f8f8;
}

#footer .icons a {
    color: #ed8032;
}

.img-responsive {
    margin-left: auto;
    margin-right: auto;
        display: block;
        max-width: 100%;
    height: auto;
    /*padding-bottom:2px;*/
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	
}


.image.fit img
{
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


#footer ul, #footer ul li
{
    padding-left: 0;
}

#footer ul.address {
        font-size: smaller;
        list-style-type: none;
}

#footer
{
    padding-bottom: 1em;
    padding-top: 1em;
}

section.sub
{
   padding-top: 3em; 
}

section.special
{
    padding-bottom: 20px;
    
}
section.special.left
{
    padding-bottom: 20px;
    text-align:left;
}


.associate
{
    padding-bottom: 20px;
}

.associate:hover .img-responsive
{
    opacity: 0.6;
}


/* Edge doesn't align this left */
hr
{
    margin: -15px 0 10px;
        border-bottom: solid 1px  #ed8032;
    width: 170px;
}


header.major
{
    margin-bottom: 1em;
	margin-top: 1em;
}


header.major h2 + hr + p {
    font-size: 1.5em;
    margin: 1em 0 2em 0;
}

.box
{
   padding: 2em 2em; 
}

.image.fit.action:hover
{
   /* margin: 0 0 1em 0;*/
    opacity: 0.8;
}

.image.fit img.circle
{
    border-radius: 100%;
    
}

.carousel
{
	margin-bottom: 0px;
}





@media only screen and (max-width: 768px) {
   .navbar-nav
{
    margin: 15px;
    float:none;
}
.navbar-inverse {
    background: white;
    /*opacity: 0.9;*/
}
.navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover
{
    color: Black;
}

.container.header
{
    width:100%!important;
}
}