.bg-top{background-color:#000033}
.top-pd{padding:15px 0}
.logo{text-align:left;border:none}
.call-us{width:280px;float:right;font-size:16px;color:#FFF;margin-top:30px}
.mar-top{margin-top:10px}
.pd-all{padding:8px}
a{-webkit-transition:all .50s ease;-moz-transition:all .30s ease;-ms-transition:all .30s ease;-o-transition:all .30s ease;transition:all .30s ease}
.call-us .email{background-image:url(../images/sprite.png);width:26px;height:27px;margin:0;float:left;background-repeat:no-repeat;background-position:-5px -35px;padding-left:30px}
.call-us .call{background-image:url(../images/sprite.png);width:26px;height:27px;margin:0;float:left;background-repeat:no-repeat;background-position:-5px -4px;padding-left:30px}
.main-top{height:31px;background-color:#FF0000;width:100%;clear:both;display:none}
.bs-example{padding:10px 20px;background-color:#f4f4f4;width:100%;float:left}
.bs-example h2{color:#000;margin-top:10px;font-style:italic}
.btn{background-color:#3a1012;color:#FFF;padding:12px 20px;font-size:18px;width:100%;border-radius:5px;font-weight:400;border:none;outline:none}
.btn:hover{background-color:#6e3033}
.panel-warper{width:20%;float:left;padding:0 5px}
.img-left{margin-right:20px}
.img-right{margin-left:20px}
.hr1{margin-top:10px;margin-bottom:10px;border:0;border-top:1px solid #CCC}
.social{display:block;margin-top:10px}
.media{width:455px;margin:auto}
.sm-media{background-image:url(../images/sprite.png);width:48px;height:48px;display:inline-block;margin-left:0;text-align:center}
.fa{background-position:-45px 0}
.tw{background-position:-102px 0}
.lin{background-position:-159px 0}
.google{background-position:-215px 0}
.you{background-position:-270px 0}
.fa:hover{background-position:-48px -50px}
.tw:hover{background-position:-102px -50px}
.lin:hover{background-position:-159px -52px}
.google:hover{background-position:-215px -52px}
.you:hover{background-position:-270px -52px}
.footer{color:#003333}
.footer a{color:#003333}
.copyright{background-color:#666;padding:10px 0;color:#bdbdbd}
.breadcrumb{display:inline-block;margin:0;padding:0}
.breadcrumb ul{display:inline-block;margin:0;padding:0}
.breadcrumb ul li{display:inline-block;margin:0;padding-left:10px}
.breadcrumb ul li:after{content:"|";color:#CCC}
.breadcrumb ul li a{color:#CCC;padding-right:10px}
.breadcrumb ul li a:hover{color:#FFF}
#testimonials{display:block;width:100%;margin-bottom:40px}
#testimonials h2{display:block;text-align:center;font-weight:bold;margin-bottom:3px}
#testimonials .carousel-wrap{display:block;width:400px;margin:0 auto;overflow:hidden}
#testimonials .carousel-nav{display:block;width:300px;margin:0 auto}
#testimonials .carousel-nav img{cursor:pointer}
#testimonials .carousel-nav img:active{position:relative;top:1px}
#testimonials .carousel-nav .nextbtn{float:right}
#testimonials .carousel-wrap ul{display:block;list-style:none;position:relative}
#testimonials .carousel-wrap ul li{display:block;float:left;position:relative;width:400px;margin-right:15px}
#testimonials .carousel-wrap .context{font-size:2.0em;line-height:1.45em;color:#797670;font-style:italic;margin-bottom:6px;padding-bottom:4px;border-bottom:1px solid #dcdcdc}
#clients{display:block;margin-bottom:15px}
#clients .clients-wrap{display:block;width:700px;margin:0 auto;overflow:hidden}
#clients .clients-wrap ul{display:block;list-style:none;position:relative}
#clients .clients-wrap ul li{display:block;float:left;position:relative;width:140px;height:55px;line-height:55px;text-align:center}
#clients .clients-wrap ul li img{vertical-align:middle;max-width:100%;max-height:100%;-webkit-transition:all 0.3s linear;-moz-transition:all 0.3s linear;transition:all 0.3s linear;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";filter:alpha(opacity=65);opacity:0.65}
#clients .clients-wrap ul li img:hover{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=100);opacity:1.0}

@media(max-width:3600px) and (min-width:767px){

html, body{
 width: 100%;
 hight: 100%;
 margin: 0;
 padding: 0;
 overflow-x: hidden;
}

.dropdown:hover .dropdown-menu{display:block;}
.dropdown-submenu .dropdown-menu{display:none !important;}
.dropdown-submenu:hover .dropdown-menu{display:block !important;}
}


.dropdown-submenu {
    position: relative;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}
@media screen and (-webkit-min-device-pixel-ratio:0){

html, body{
 width: 100%;
 hight: 100%;
 margin: 0;
 padding: 0;
 overflow-x: hidden;
}

  }
  @media(max-width:992px){
  }
  @media(max-width:800px){
  .top-pd{margin-top:20px}
  .main-top{display:block;position:fixed;z-index:45}
  .panel-warper{width:33.3333%}
  .hide{display:block!important}
}
@media(max-width:767px){
  .logo{text-align:center}
  .call-us{margin:auto;float:none}
  .bs-example{margin-right:0}
}
@media(max-width:600px){
  .panel-warper{width:50%}
}
@media(max-width:600px){
  .panel-warper{width:100%}
}
.container {
  position: relative;
  max-width: 100%; /* Maximum width */
  
}

.container .content {
  position: absolute; /* Position the background text */
  bottom: 0; /* At the bottom. Use top:0 to append it to the top */
  background: rgba(0, 0, 0, 0.5); /* Fallback color */
  background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
  color: #FFFFFF; /* Grey text */
  width: 100%; /* Full width */
  padding: 20px; /* Some padding */
}

{
    height: 100%;
}

/* The hero image */
.hero-image {
  /* Use "linear-gradient" to add a darken background effect to the image (photographer.jpg). This will make the text easier to read */
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("photographer.jpg");

  /* Set a specific height */
  height: 50%;
  width: 100%;

  /* Position and center the image to scale nicely on all screens */
  /*background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

/* Place text in the middle of the image */
/*.hero-text {
  text-align: center;
 position: absolute; /* Position the background text */
  bottom: 0; /* At the bottom. Use top:0 to append it to the top */
  background: rgba(0, 0, 0, 0.5); /* Fallback color */
  background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
  text color: #FFFFFF; 
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #FFFFFF;
}

/* Fixed/sticky icon bar (vertically aligned 50% from the top of the screen) */
/*.icon-bar {
  position: fixed;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

/* Style the icon bar links */
.icon-bar a {
  display: block;
  text-align: center;
  padding: 16px;
  transition: all 0.3s ease;
  color: white;
  font-size: 20px;
}

/* Style the social media icons with color, if you want */
.icon-bar a:hover {
  background-color: #000;
}

.facebook {
  background: #3B5998;
  color: white;
}