*{margin:0;padding:0;}
body {
  background: #ebebeb none repeat scroll 0 0;
  color: #3e3f3f;
  
}
h1, h2, h3, h4, h5, h6, p {
  margin:0;
}
a {
  color: #3e3f3f;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
a:focus {
  color: inherit;
  outline: none;
  text-decoration: none;
}
a, a:hover {
  text-decoration: none;
}
ul {
  list-style: none;
}
img {
  max-width:100%;
}
/*----------------------
	2. Common Classes
------------------------*/
.fix{overflow:hidden;}
.float-left{float:left;}
.float-right{float:right;}
.clear {
  clear: both;
}
.section {
  padding: 80px 0;
}
.page {
  padding: 80px 0 0;
}
.section-title {
  text-align: center;
  margin-bottom: 50px;
}
.section-title h2 {
  color: #e09e25;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
  text-transform: uppercase;
}
.underline {
  background: #e09e25 none repeat scroll 0 0;
  height: 2px;
  margin: 0 auto;
  width: 100px;
}
.overlay {
  background: rgba(224,158,37,0.8);
}
.owl-dots {
  text-align: center;
  margin-bottom: 30px;
}
.owl-dot {
  border: 1px solid #e09e25;
  display: inline-block;
  height: 10px;
  margin: 0 3px;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 30px;
}
.owl-dot.active {
  background: #e09e25;
}
.owl-nav {
  margin-right: -5px;
  margin-top: -50px;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
}
.owl-nav > div {
  border: 2px solid #e09e25;
  color: #e09e25;
  display: inline-block;
  font-size: 22px;
  height: 36px;
  line-height: 32px;
  margin: 0 5px;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 36px;
}
.owl-nav > div:hover {
  background: #e09e25;
  color: #fff;
}
.owl-nav > div i{}
.owl-nav .owl-prev{}
.owl-nav .owl-next{}



/*----- 3.3 Header Area -----*/
.header-area {
  background: white none repeat scroll 0 0;
  padding: 0px 0;
  /*border:3px solid orange;*/
  font-family:"Calisto MT";
}
.log-link p {
  font-size: 12px;
  font-weight: 400;
  line-height: 30px;
}
.log-link h5 {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 1px;
}
.log-link h5 a {
  color: #e09e25;
  text-decoration: none;
}
.logo a {
  display: inline-block;
  text-decoration: none;
  text-align: center;
}
.logo a img{}
.logo a h2 {
  font-size: 36px;
  }
.logo a h4 {
  color: #414141;
  font-size: 18px;
  font-weight: 400;
  margin-top:10px;
}
.sticky{
	position:fixed;
	top:0;
	width:100%;
	z-index:999;
}
@media(max-width:360px){
	.logo h1 {
		font-size:14px !important;
	}
	.logo h4{
		font-size:10px !important;
	}
	.himage2 img{
		height:50px !important;
		width:35px;
	}
	.himage2 p{
		display:none;
	}
	.himage1 img{
		margin-top:25px;
	}
	.sticky{
	position:fixed;
	top:0;
	width:100%;
	z-index:999 !important;
	
        }
		.mobile-menu{
			
			position:fixed;
	margin-top:-1px;
	width:100%;
	z-index:999 !important;
		}
		.menu-area {
    z-index:-999 !important;
  margin-top:100px !important;
}

.himage2 img{
	width:60px;	
}
.banner{ margin-top:185px !important;}
}
@media(max-width:768px){
.logo h1 {
		font-size:20px;
	}
	.logo h4{
		font-size:14px !important;
	}
	.himage2 img{
		height:70px !important;
		width:55px;
	}
	
	.himage1 img{
		margin-top:10px;
		
	}
	.sticky{
	position:fixed;
	top:0;
	width:100%;
	z-index:999 !important;
	
        }
		.mobile-menu{
			
			position:fixed;
	margin-top:-3px !important;
	width:100%;
	z-index:999 !important;
		}
		.menu-area {
    z-index:-999 !important;
  margin-top:140px !important;
}

	
   .notice img{
				 
				text-align: center; margin-top:48px; margin-left:60px; margin-right:0px;
                				
			 }
	
}




.cart-info {
  padding-bottom: 10px;
  position: relative;
}
.cart-info > a {
  display: inline-block;
}
.cart-info > a h5 {
  float: left;
  font-size: 13px;
  font-weight: 600;
  line-height: 30px;
  margin-right: 7px;
}
.cart-info > a span {
  font-size: 15px;
}
.cart-info > a i {
  font-size: 30px;
}

.header-cart-pro {
  list-style: none;
}
.header-cart-pro li {
  display: block;
  margin-bottom: 15px;
  overflow: hidden;
  position: relative;
  border-bottom: 1px solid #ddd;
  padding-bottom: 15px;
}
.header-cart-pro .image {
  float: left;
  margin-right: 10px;
  width: 90px;
  border: 1px solid #ddd;
}
.header-cart-pro .image a {
  display: block;
}
.header-cart-pro .image a img{}
.header-cart-pro .content {
  text-align: left;
}
.header-cart-pro .content a {
  color: #3e3f3f;
  display: block;
  font-size: 14px;
  font-weight: 600;
  margin: 5px 0;
  text-transform: uppercase;
}
.header-cart-pro .content a:hover {
  color: #E09E25;
}
.header-cart-pro .content span {
  display: block;
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 2px;
  text-align: left;
  width: 100%;
}
.header-cart-pro .delete {
  cursor: pointer;
  position: absolute;
  right: 0;
  top: 20px;
  color: #666;
}
.header-cart-pro .delete:hover {
  color: #E09E25;
}
.header-button-price{}
.header-button-price a {
  border: 1px solid #e09e25;
  color: #e09e25;
  display: block;
  float: left;
  font-size: 13px;
  padding: 7px 15px;
  text-transform: uppercase;
  font-weight: 600;
}
.header-button-price a:hover {
  background: #E09E25;
  color: #fff;
}
.header-button-price a i {
  margin-right: 5px;
}
.header-button-price .total-price {
  float: right;
}
.header-button-price .total-price h3 {
  font-size: 15px;
  margin-top: 8px;
}
.header-button-price .total-price h3 span{}

/*----- 3.4 Main Menu -----*/
.menu-area {
  background:#254463;
  margin-top:145px;
  position:fixed !important;
  z-index:999 !important;
  width:100%;
}
.main-menu {
  text-align: center;
}
.main-menu > nav{}
.main-menu > nav > ul {
  display: inline-block;
  margin: 0;
}
.main-menu > nav > ul > li {
  display: inline-block;
  margin: 0;
  padding: 20px 2px;
  position: relative;
}
.main-menu > nav > ul > li > a {
  font-size: 14px;
  font-weight: 700;
  padding: 15px 15px;
  text-decoration: none;
  text-transform: uppercase;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  color:#CCC;
}
.main-menu > nav > ul > li > a:hover, .main-menu > nav > ul > li > a:focus {
  color:#e09e25;
}
.sub-menu, .mega-menu {
  background: #fff none repeat scroll 0 0;
  border: 1px solid #ddd;
  left: 0;
  list-style: outside none none;
  opacity: 0;
  padding: 10px 15px;
  position: absolute;
  text-align: left;
  top: 100%;
  transform: scaleY(0);
  transform-origin: center top 0;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 220px;
  z-index: -99;
}
.main-menu > nav > ul > li:hover .sub-menu, .main-menu > nav > ul > li:hover .mega-menu {
  opacity: 1;
  transform: scaleY(1);
  z-index: 999;
}
.sub-menu > li{}
.sub-menu > li > a {
  display: block;
  font-size: 13px;
  font-weight: 600;
  padding: 5px 0;
  text-transform: uppercase;
}
.sub-menu > li > a:hover, .sub-menu > li > a:focus  {
  color:#e09e25;
  padding-left: 5px;
}
.mega-menu {
  padding: 15px 0;
  width: 800px;
}
.mega-menu .column {
  padding: 15px;
  width: 25%;
  float: left;
  display: block;
}
.mega-menu .column ul {
  list-style: outside none none;
}
.mega-menu .column ul li{}
.mega-menu .column ul li:first-child {
  border-bottom: 1px solid #ddd;
  margin-bottom: 15px;
}
.mega-menu.mega-menu-page .column ul li:first-child {
  border-bottom: none;
  margin-bottom: 0;
}
.mega-menu .column ul li a {
  display: block;
  font-size: 13px;
  font-weight: 500;
  padding-bottom: 10px;
  text-transform: capitalize;
}
.mega-menu.mega-menu-page .column ul li a {
  text-transform: uppercase;
}
.mega-menu.mega-menu-page .column ul li:first-child a {
  font-size: 13px;
  font-weight: 500;
  text-transform: uppercase;
}
.mega-menu .column ul li:first-child a {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
}
.mega-menu .column ul li a:hover, .mega-menu .column ul li a:focus  {
  color:#e09e25;
  padding-left: 5px;
}
.mega-menu .column > a {
  display: block;
  overflow: hidden;
  position: relative;
}
.mega-menu .column > a::before {
  background-color: rgba(0, 0, 0, 0.15);
  content: "";
  height: 0;
  left: 0;
  margin: auto;
  position: absolute;
  top: 0;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 0;
  z-index: 1;
}
.mega-menu .column > a::after {
  background-color: rgba(0, 0, 0, 0.15);
  bottom: 0;
  content: "";
  height: 0;
  position: absolute;
  right: 0;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 0;
}
.mega-menu .column > a:hover::before, .mega-menu .column > a:hover::after {
  height: 100%;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  width: 100%;
}
.mega-menu .column > a img {
  width: 100%;
}

.mean-bar::after {
  color: #fff;
  content: "MENU";
  display: block;
  font-family: raleway;
  font-size: 18px;
  font-weight: bold;
  left: 20px;
  position: absolute;
  text-transform: uppercase;
  top: 14px;
}
.main-menu-2-pre {
  padding-right: 0;
}
.main-menu-2 {
  background: #e09e25 none repeat scroll 0 0;
  padding: 9px 0;
}
.main-menu-2 > nav {}
.main-menu-2 > nav > ul {
  list-style: outside none none;
  margin: 0;
}
.main-menu-2 > nav > ul > li {
  display: block;
  position: relative;
}
.main-menu-2 > nav > ul > li > a {
  color: #fff;
  display: block;
  font-size: 14px;
  font-weight: 700;
  padding: 17px 20px;
  text-decoration: none;
  text-transform: uppercase;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.main-menu-2 > nav > ul > li > a:hover, .main-menu-2 > nav > ul > li > a:focus {
  padding-left: 30px;
  background: #fff;
  color: #E09E25;
}
.sub-menu-2, .mega-menu-2 {
  left: 100%;
  top: 0;
}
.main-menu-2 > nav > ul > li:hover .sub-menu-2, .main-menu-2 > nav > ul > li:hover .mega-menu-2 {
  opacity: 1;
  transform: scaleY(1);
  z-index: 99999;
}
.mega-menu-2 {
  width: 400px;
}
.mega-menu-2 .column {
  width: 50%;
}

.mean-container .mean-bar {
  margin-bottom: 15px;
}
.mean-container .mean-bar, .mean-container .mean-nav, .mean-container .mean-nav ul li a.mean-expand:hover {
  background: #e09e25 none repeat scroll 0 0;
}
/*----- 3.5 Slider Area -----*/
.banner{ margin-top:200px;}

.slider-wrap {
  position: relative;
}
.slider-image{}
.nivo-caption{
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
	opacity:1;
}
.slide-text {
  display: table;
  float: left;
  height: 100%;
  margin-left: 150px;
}
.slide2-text.slide-text {
  float: right;
  margin-right: 50px;
}
.middle-text {
  display: table-cell;
  vertical-align: middle;
}
.cap-title {
  margin-bottom: 20px;
}
.cap-title h1 {
  background: rgba(224, 158, 37, 0.6) none repeat scroll 0 0;
  color: #ebebeb;
  display: inline-block;
  font-size: 50px;
  font-weight: 500;
  margin-left: 0;
  padding: 10px 15px;
  text-transform: uppercase;
}
.cap-dec{
	margin-bottom: 30px;
}
.cap-dec h2 {
  background: rgba(255, 255, 255, 0.6) none repeat scroll 0 0;
  color: #e09e25;
  display: inline-block;
  font-size: 45px;
  font-weight: 500;
  padding: 10px 20px;
  text-transform: uppercase;
}
.cap-readmore {
  display: inline-flex;
  overflow: hidden;
}
.cap-readmore a {
  background: #e09e25 none repeat scroll 0 0;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  padding: 10px 20px;
  text-transform: uppercase;
}
.cap-readmore a:hover {
  opacity: 0.8;
}
.nivo-controlNav {
  bottom: 30px;
  position: absolute;
  text-align: center;
  width: 100%;
  z-index: 999;
}
.nivo-control {
  background: #fff none repeat scroll 0 0;
  display: inline-block;
  height: 10px;
  margin: 0 5px;
  text-indent: -99999px;
  width: 30px;
}
.nivo-control.active {
  background: #e09e25;
}
.slider-progress{
	position:absolute;
	top:0;
	left:0;
	background-color: #e09e25;
	height:5px;
	-webkit-animation: timebar 5000ms ease-in-out;
	-moz-animation: timebar 5000ms ease-in-out;
	-ms-animation: timebar 5000ms ease-in-out;
	animation: timebar 5000ms ease-in-out;
	opacity:0.8;
}
@-webkit-keyframes timebar {
	from {width: 0;}
	to {width: 100%;}
 }
 @keyframes timebar {
	from {width: 0;}
	to {width: 100%;}
 }
 .slider-progress.pos_hover{
	-webkit-animation-play-state: paused;
	animation-play-state: paused;
 }	
/*---------- Home 3 Slider -----------*/
.home-3-slider {}
.home-3-slider .slide-text {
  margin-left: 50px;
}
.home-3-slider .cap-title h1 {
  font-size: 40px;
}
.home-3-slider .cap-dec h2 {
  font-size: 28px;
}
.home-3-slider .cap-readmore {
  margin-top: 0;
}
.home-3-slider .cap-readmore a {
  font-size: 14px;
}

.home-3-slider .nivo-controlNav {
  bottom: 0;
}
/*----- 3.16 Footer Area -----*/
.footer-area {
  background: #eee;
  padding: 25px 0;
}
.copy-right p {
  color: #252525;
  font-size: 14px;
  font-weight: 500;
  margin-top: 7px;
}
.copy-right p a {
  color: #252525;
}
.copy-right p a:hover {
  color: #e09e25;
}
.payment {
  text-align: right;
}
.payment ul {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
.payment ul li {
  display: inline-block;
  margin: 0 0 0 5px;
  padding: 0;
}
.payment ul li a {
  display: block;
  padding: 0;
  text-decoration: none;
}
.payment ul li a img {
  width: 50px;
}
/*-----------------------
	7. About Us
-------------------------*/
.about-page {}
.about-title h2, .about-text h2 {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 10px;
}
.about-title span, .about-text span {
  color: #e09e25;
}
.about-title h3 {
  font-size: 24px;
  font-weight: 300;
}
.about-text {
  margin-top: 30px;
}
.about-text p {
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 15px;
}
.about-text p span{color:#e09e25;}
.about-text blockquote {
  background: #fff none repeat scroll 0 0;
  border-color: #e09e25;
}
.about-text blockquote p {
  font-size: inherit;
}
.about-img {
  margin-top: 30px;
}
.about-margin {
  margin-top: 25px;
}
.about-img img {
  max-width: 100%;
}
.carousel-inner img {
    width: 100%;
    height: 100%;
  }
         /* Style the left and right columns */
        .leftcolumn {
            float: left;
            
        }
        /* Right column */
        
        .rightcolumn {
            /*width: 450px;
			height:450px;*/
          
			/*padding:50px 10px 50px 50px;*/
          
        }
        
        .card {
            
			text-align:center;
            padding: 20px;
			
        }
        /* Clear floats after the columns */
        
        .row:after {
            content: "";
            display: table;
            clear: both;
        }
		
		/*scroll bar in notice board*/
		.marquee {
			box-sizing: border-box;
			box-sizing:center;
             color: black;
             height: 192px !important;
	         width: -webkit-fill-available;
			 text-align: center; margin-top:46px; margin-left:40px; margin-right:60px;
		}
		
		@media(max-width:360px){
			 .marquee {
			 box-sizing: border-box;
			 box-sizing:center;
             color: black;
             height: 140px !important;
	         width: -webkit-fill-available;
			 text-align: center; margin-top:28px; margin-left:20px; margin-right:20px;
			 }	
			 
			 .notice img{
				 width: 100px;
				text-align: center; margin-top:28px; margin-left:20px; margin-right:20px;
                				
			 }
		}


:host([direction="up"]), :host([direction="down"]) {
    overflow: center;
    overflow-y: hidden;
    white-space: center-left;
}
:host {
    display: inline-block;
    text-align: center;
    
}
		 /* Style the forms */
		.input-container {
  display: -ms-flexbox; /* IE10 */
  display: flex;
  width: 100%;
  margin-bottom: 15px;
}

.icon {
  padding: 10px;
  background: #254463;
  color: white;
  min-width: 50px;
  text-align: center;
}

.input-field {
  width: 300px;
  padding: 10px;
  outline: none;
}

.input-field:focus {
  border: 2px solid #254463;
}

/* Set a style for the submit button */
.btn {
  background-color: #254463;
  color: white;
  padding: 15px 20px;
  border: none;
  cursor: pointer;
  width: 100px;
  opacity: 0.9;
}

.btn:hover {
  opacity: 1;
}
.head{
	
	width: 100%;
  height: auto;
}

 /* Style the img center */
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
}
.responsive {
	background-image:url(../images/system.png);
	background-repeat:no-repeat;
    height: 352px !important;
	margin-left:70px !important;
	
	
}

  @media(max-width:768px){
            .responsive  {
                float: none;
				width:500px !important; background-size:contain; margin-left:100px;
            }
        }
		

	@media(max-width:360px){
	.responsive{width:300px !important; background-size:contain; margin-left:0 !important}
	}