@charset "utf-8";
img, object, embed, video {max-width: 100%;}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {width:100%;}

html {font-family: "Raleway", serif;font-size: 1em;-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; overflow-x: hidden;}

body {font-family: "Raleway", serif; margin:0;font-size:13px;width:100%;color:#666; background-color:#f4f4f4}

#content {clear:both;float:left;margin-left:0;width:100%;display:block;}
#header {clear:both;float:left;margin-left:0;width:100%;display:block; background-color:#fff}

h1 {font-size:35px;font-weight:600;text-align:center;}
h2 {font-size:30px;font-weight:600;text-align:center;}
h3 {font-size:20px;font-weight:600;text-align:center;}
p {text-align:center; font-size:14px}

a:hover {color: #F90;text-decoration: underline;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:active {text-decoration: none;}

ul {list-style-type:none}
li {list-style-type:none}
li a {color:#fff;}
p a {color:#fff;}


#menu {width:100%;height:43px;background-color:#cccccc;}
#menu ul {list-style-type: none;margin: 0;padding: 0;overflow: hidden;background-color: #000;}
#menu li {float: left;color:#ff6600; font-size:14px; font-weight:500}
#menu li a {display: inline-block;color:#ff6600;text-align: center;padding: 14px 16px;text-decoration: none;}
#menu li a:hover {background-color: #fff;}


#aboutus {clear: both;float: left;margin-left: 0;width: 100%;display: block;}
.aboutuscont {width:100%; display:block; float:none}
.aboutusinfo {float:left;min-height:200px;background-color:#fff; box-sizing:border-box; -webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px;width:80%;margin: 10px 10% 10px 10%; padding: 5px 15px;}
.aboutusinfo p {font-size:14px;}


#services {clear:both;float:left;width:100%;display:block;}
.servicecont {width:90%; display:block; margin: 0 5%; float:none}
.serviceinfo {text-align:center;float:left;width: 31%; min-height:300px;margin: 20px 1% 20px 1%;background-color:#fff; padding: 5px 30px; box-sizing:border-box; -webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px;}
.serviceinfo h3 {text-align:center}
.serviceinfo p {text-align:center}

#footer {clear:both;float:left;width:100%;display:block;background-color:#999;color:#FFF;}
#footerbottom {clear:both;float:left;margin-left:0;width:100%;display:block;background-color:#333;color:#FFF;padding-left:20px;}
#footerbottom p {font-size:13px;}
#footer h3 {font-size:20px;font-weight:400;text-decoration: underline;text-align:center}
#footer p {font-size:13px;font-weight:400}
.footercont {width:80%; display:block; margin: 0 10%; float:none}
.footerinfo {min-width:25%;max-width:22%;display: inline-block;float:left;overflow: auto; margin: 5px auto 5px auto; padding:0px 15px; text-align:center}

.information {clear: both;float: left;width: 100%;display: block;min-height: 50px;font-size: 24px;color: #FFF;background-color: #F60;text-align: center;margin: auto;padding: 20px 0px 20px 0px; box-sizing:border-box}

* {box-sizing: border-box;}
.mySlides {display: none}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
  max-width: 100%;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 30px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8); text-decoration:none}

/* Slide Title */
.slidetitle {
  color: #f2f2f2;
  font-size: 40px; font-weight:600;
  padding: 8px 12px;
  position: absolute;
  width:100%;
  height:30%;
  margin-top:5%;
  text-align:center;
}

/* Caption text */
.slidetext {
  color: #fff;
  font-size: 25px; font-weight:400;
  padding: 8px 12px;
  position: absolute;
  bottom: 10%;
  width: 60%;
  height:50%;
  margin-left:20%;
  margin-right:20%;
  text-align: center;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: run-in;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}


/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
@media only screen and (max-width: 1000px) {
.footerinfo {min-width:100%;max-width:100%;min-height:100px;padding:0px 0px;}
#footer h3 {font-size:20px;font-weight:400;text-decoration: underline;text-align:center;}
#footer p {font-size:13px;font-weight:400;}	
.slidetitle {font-size:30px;padding:0px;}
.slidetext {font-size:18px;width:80%;margin-left:10%;margin-right:10%;}
.aboutusinfo {width:90%;margin: 10px 5% 10px 5%; padding: 5px 15px;}
.serviceinfo {width:100%;margin:10px 0px;min-height:150px;}
.serviceinfo h3 {text-align:center}
.serviceinfo p {text-align:center}
}

@media only screen and (max-width: 750px) {
.slidetitle {font-size:20px;}
.slidetext {font-size:15px;}
.information {min-height:50px;font-size:18px;}
#menu li {font-size:12px;font-weight:400;}
.dot {height: 10px;width: 10px;margin: 0px;}
h1 {font-size:30px;}
h2 {font-size:27px;}
}

/* Mobile Layout: 480px and below. */
@media only screen and (max-width: 480px) {
#footer h3 {font-size:15px;}
#footer p {font-size:11px;}
#footerbottom p {font-size:10px;}
.text {font-size:12px;}
.information {min-height:50px;font-size:18px;}
.slidetitle {font-size:12px;}
.slidetext {font-size:10px;width:80%;margin:0% 10%;}
.text {font-size:11px;}
.prev, .next {font-size: 10px;}
}