@charset "UTF-8";
/* CSS Document */

.head-image { align-content:center; margin-top:60px; }
/* === Main styles for page ==*/
body {
	color: #696969;
	font-size: 22px;
	font-weight: 300;
	line-height: 1.5;
}
.fluid { background-repeat:no-repeat; background-size:cover; max-width:100%; height: auto; margin-top:50px; } 
/* COLORS */
.grey-well {
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 30px;
  color: #E0E0E0;
  background-color: #696969;
}
.grey-well h1,
.grey-well.h1 {
  color: inherit;
}
.grey-well h2 {
  margin-bottom: 15px;
  font-size: 75%;
  font-weight: 500;
  font-stretch:expanded;
  line-height:1.5;
  text-align:center;
}
.grey-well a:link {
	color:#E0E0E0;
}
.grey-well a:visited {
	color:#800000;
}
.grey-well a:hover {
	color:#800000;
}
.grey-well > hr {
  border-top-color: #d5d5d5;
}
.container .grey-well,
.container-fluid .grey-well {
  padding-right: 15px;
  padding-left: 15px;
  border-radius: 6px;
}
.grey-well .container {
  max-width: 100%;
}
@media screen and (min-width: 650px) {
	.grey-well h2,
  	.grey-well .h2 {
   	font-size: 150%;
	line-height:1.5; 
	}
}
@media screen and (min-width: 1024px) {
	.grey-well h2,
	.grey-well .h2 {
		font-size:200%;
	}
}
.service { 
	margin: 40px 0;
} 
.service img { width:50px; height:auto; }
.service h3 {
	font-variant:small-caps;
	font-size: 80%;
	color:#800000;
	margin:-40px 0 40px 60px;
}
.service p {
	font-size: 80%;
	margin-top:-10px;
}
@media screen and (min-width: 1024px) {
	.service img {
		width:75px;
		height:auto;
	}
	.service h3 {
		margin:20px 0 40px -10px;
	}
	.service p {
		margin:-30px 0 0 -10px;
	}
}
.service-box img{ 
	border: 7px solid #FAFAFA;
	display:block;
	margin: 10px auto;
	width:310px;
}
@media screen and (min-width: 1200px) {
	.service-box img {
		width:430px;
	}
}
/* ============== service.html page ================- */
.display-box {
	border:1px solid #E0E0E0;
	height:550px;
	position:relative;
	margin-bottom:20px;
}
.display-box h2 {
	background-color:#696969;
	font-size:80%;
	text-align:center;
	line-height:50px;
	color:#FFFFFF;
	text-shadow: 0px 1px 0px rgba(255,255,255,.3), 0px -1px 0px rgba(0,0,0,.7);
}
.display-box img {
	width:300px;
	padding:10px;
}
.display-box p {
	font-size:70%;
	color:#696969;
	text-align:justify;
	padding-top:10px;
}
.display-car h2 {
	font-size:100%;
}
.display-car li {
	font-size:80%;
}
.display-car img {
	width:250px;
}
/*=========================contact us page============*/

#wrapper {
  padding-left: 300px;
  transition: all 0.4s ease 0s;
}

#sidebar-wrapper {
  margin-left: -250px;
  left: 300px;
  width: 250px;
  border-right:1px solid #696969;
  position: absolute;
  height: 50%;
  overflow-y: auto;
  z-index: 1000;
  transition: all 0.4s ease 0s;
}

#page-content-wrapper {
  width: 100%;
}

.sidebar-nav {
  position: absolute;
  top: 0;
  width: 250px;
  list-style: none;
  margin: 0;
  padding: 0;
}
/*@media (min-width:768px) {
	.contact-form-container {
		width:700px;
		margin-bottom:20px;
	}
}
*/
@media (min-width:767px) {
  #wrapper {
    padding-left: 0;
  }
  #sidebar-wrapper {
    left: 0;
  }
  #wrapper.active {
    position: relative;
    left: 250px;
  }
  #wrapper.active #sidebar-wrapper {
    left: 250px;
    width: 250px;
    transition: all 0.4s ease 0s;
  }
}
/* FOOTER */
footer { 
	color:#E0E0E0; 
	background-color: #696969; 
	font-size: 80%;
	font-weight: 400;
	line-height: 14px;
	padding:20px 0;
	}
.footer-right-border { 
	border-right: 1px solid #ebebeb;
	height:auto;
}
.footer-bottom {
	background-color:#252525;
	color:#E0E0E0;
	font-size: 75%;
	font-weight: 400;
	line-height: 14px;
	bottom:0;
	height:60px;
	padding:5px 0;
	margin-bottom:-20px;
}
@media screen and (min-width:768px) {
	.footer-bottom {
	padding:0 10px;
	line-height:30px;
	height:40px;
	}
}
