@charset "utf-8";
/* CSS Document */
body{margin:0px; font-family: 'Open Sans', sans-serif;}
.full-wrapper{width:100%;  margin:0px auto; max-width:1400px;}
.wrapper{ width:1100px; margin:0px auto;}
.wrapper2{ width:860px; *margin:0px auto;}

p{ float:left; width:100%; color:#000; font-size:15px; text-align:justify; line-height: 24px;}

header{ float:left; width:100%; max-width:1400px; *position:fixed; transition:all 1000ms ease; position:relative;}
header2{ float:left; *width:100%; max-width:1400px; position:fixed; display:none; transition:all 1000ms ease; z-index:99;}


.banner-section{ float:left; width:100%; background: linear-gradient(to right, rgba(182,78,4,1) 0%,rgba(183,77,4,1) 0%,rgba(197,105,10,1) 28%,rgba(197,105,10,1) 71%,rgba(183,77,4,1) 100%,rgba(183,77,4,1) 100%);}
.banner-section .top{ float:right; margin-top:40px; margin-bottom:10px;}
.banner-section .top li{ color:#fff; font-size:15px; list-style:none; display:inline; margin-left:20px;}
.banner-section .top .phone{ background:url(../images/phone.png) no-repeat left; padding-left:25px;}
.banner-section .top .email{ background:url(../images/email.png) no-repeat left; padding-left:25px;}
.banner-section .top li a{ color:#fff; text-decoration:none; color:#fff; font-size:15px;}
.banner-section .top li a:hover{ text-decoration:underline;}
.nav-bar{ float:left; width:97%; background:#fff; padding:5px 18px; border-bottom:7px solid #f8f3ee; border-top:7px solid #f8f3ee;}
.logo{ float:left; width:20%; margin-top:6px;}
.logo img{ float:left; width:100%;}
.logo2{ float:left; width:15%; margin-top:6px;}
.logo2 img{ float:left; width:100%;}

.social{ float:right;  margin-right: 18px; width: 25%;}
.social ul{ float:left; margin:0px; padding:0px;}
.social li{ display:inline; font-size:14px; color:#8b78b7; list-style:none; }
.social .flw{float:left; margin-top:10px; margin-right:15px;}
.nav-main{ float:right; *width: 60%; display:block;}
.nav-main nav ul{ float:left;  margin-bottom:0px;}
.nav-main nav ul li{ float:left; list-style:none; display:inline; margin: 0px 25px;}
.nav-main nav ul li a{ color:#8c78b7; text-transform:uppercase; font-size:15px; text-decoration:none; font-weight:bold; transition:all 1000ms ease; position:relative; padding:10px 0px;}
.nav-main nav ul li:hover a{ transition:all 1000ms ease; color:#f6821f;}
.active{ color:#f6821f !important;}

.drop{ float:left; position:relative;}
.drop2{ display:none; position:absolute; width:220px; left:0px; top:27px; margin:0px; padding:0px; z-index:999;}
.drop2 li{ width:100%; margin:0px !important;}
.drop2 li a{ padding:8px 30px !important; background:#fff; color:#fff; float:left; width:85%; border-bottom:1px solid #8b77b7; font-size:13px !important; text-transform:capitalize !important;}
.drop2 li a:hover{ background:#8b77b7 !important; color:#fff !important;}
.drop:hover .drop2{ display:block;}


.banner{ float:left; *width:100%; margin-top:20px;}
.banner img{ float:left; width:100%;}
.product-lists{ float:right; width:20%; padding:10px; background:#8b78b7; margin-top:-36%;}
.product-lists .head1{ float:left; width:100%; margin-top:0px; text-transform:uppercase; font-size:23px; font-weight:bold; color:#fff; border-bottom:1px solid #4e4467; padding-bottom:5px; margin-bottom:15px;}
.product-lists ul{ float:left; margin:0px; padding:0px;}
.product-lists ul li{ list-style:none; line-height: 26px;  padding:4px 0px;border-bottom:1px dashed #a293c5; float:left; width:100%; background:url(../images/arw.png) no-repeat right;}
.product-lists ul li a{ color:#fff; font-size:13px; text-decoration:none; width:100%; }
.product-lists ul li a:hover{ color:#f5821f;}
.product-lists ul .lst{ border:none !important;}


/***** panel1 ******/
.panel1{ float:left; width:100%; background:#fff;}
.panel1 .col-1{ float:left; width:25%; overflow:hidden; min-height:434px;}
.panel1 .col-1 .col-img{ float:left; overflow:hidden;}
.panel1 .col-1 img{ float:left; width:100%; transition:all 1000ms ease;  overflow:hidden; min-height:318px;}
.panel1 .cl-btm{ background:#8b77b7; float:left; width:95%; padding: 17px 15px; overflow:hidden;}
.panel1 .cl-btm2{ background:#f5821f; float:left; width:95%; padding: 17px 15px;}
.panel1 .cl-btm3{ background:#e36d72; float:left; width:95%; padding: 17px 15px;}
.panel1 .head1{ float:left; width:100%; font-size:20px; text-transform:uppercase; font-weight:bold; color:#fff; margin-top:10px;}
.panel1 .head2{ float:left; width:100%; font-size:15px; text-transform:uppercase; color:#fff;}
.panel1 .read-more a{ float:left; color:#fff; text-transform:uppercase; font-size:13px; border:1px solid #fff; padding:7px 15px; margin-top:10px; text-decoration:none; transition:all 1000ms ease}
.panel1 .read-more a:hover{ border-radius:20px; transition:all 1000ms ease; }
.panel1 .col-1:hover  img{ transition:all 1000ms ease; transform:scale(1.3,1.3);}
.panel1 .col-2{ float:left; width:22%; padding: 15.9px 15.9px 20px; background:#dbdbdb;}
.panel1 .col-2 .head{ float:left; width:100%; text-align:center; color:#f5821e; text-transform:uppercase; font-size:25px; font-weight:bold; border-bottom:1px solid #afafaf; padding-bottom:10px; margin-top: 0px;}
.panel1 .col-2 .input{ float:left; width:95%; padding:10px 5px; background:#fff; border:1px solid #ccc; margin-top:12px;}
.panel1 .col-2 .inputa{ float:left; width:95%; padding:10px 5px; background:#fff; border:1px solid #ccc; margin-top:6px; height:80px;}
.panel1 .col-2 .submit{ float:left; width:100%; text-align:center; margin-top:6px; text-transform:uppercase; font-size:20px; background:#8b77b7; border:1px solid #8b77b7; padding:8px 0px; cursor:pointer; color:#fff;}
.panel1 .col-2 .submit:hover{ color:#8b77b7; background:#fff;}



/****** panel2 *********/
.panel2{ float:left; width:100%;  background:#fff; padding: 0 0 40px; background:url(../images/bdr-btm.png) no-repeat bottom;}
.panel2 .cl-1full{ float:left; width:100%;}
.panel2 .cl-1full .head{ float:left; width:100%; font-size:45px; color:#f5821f; font-weight:bold; text-transform:uppercase; margin-bottom:20px;}
.panel2 .cl-1{ float:left; width:24%; margin-top: 38px; display:block;}
.panel2 .cl-1 img{ float:left; width:100%;}
.panel2 .cl-2{ float:right; width:71%; margin-left:10px;}
.panel2 .cl-2 p{ float:left; width:100%; text-align:justify; color:#000; font-size:14px;}
.panel2 .cl-2 .read-more a{ float:left; background:#fff; padding:8px 15px; color:#000; text-transform:uppercase; text-decoration:none; font-size:15px; border:1px solid #ccc; transition:all 1000ms ease;}
.panel2 .cl-2 .read-more a:hover{ background:#8b77b7; color:#fff; transition:all 1000ms ease; border-radius:20px;}

.panel2 .cl-3{ float:right; width:25%; border-left: 1px dashed; padding-left:30px;}
.panel2 .cl-3 .world{ float:left; width:100%; text-align:center; margin-top:20px;}


/****** footter *********/
footter{ float:left; width:100%; padding:10px 0px;}
footter .col-full{ float:left; width:100%;}
footter .col-full .cl-1{ float:left; width:35%;}
footter .col-full .cl-1 img{ float:left; width:80%;}
footter .col-full .cl-1 .logo2{ float:left; width:50%;}
footter .col-full .cl-1 .copy{ color:#000; font-size:14px; margin-top:5px; float:left; width:100%;}
footter .col-full .cl-2{ width:54%; text-align:center; float:left; margin-top: 15px;}
footter .col-full .cl-2 li{ display:inline; color:#000; list-style:none; margin-left:5px;}
footter .col-full .cl-2 .folw{ color:#000; font-size:14px; text-transform:capitalize; margin-bottom: 10px; float:left; width:100%;}
footter .col-full .cl-3{ float:right; color:#000; font-size:14px; text-transform:capitalize; margin-top:40px;}
footter .col-full .cl-3 a{ color:#000; text-decoration:none; margin-left:3px; text-transform:capitalize;}
footter .col-full .cl-3 a:hover{ color:#8b77b7;}





/************** inner-page ************/

.inner-panel{ float:left; width:100%; background:#fff;padding:20px 0px; background: rgba(0, 0, 0, 0) url("../images/bdr-btm.png") no-repeat scroll center bottom;}
.inner-panel .head{ float:left; width:100%; text-transform:uppercase; font-size:30px; color:#f4811e; background:url(../images/bdr.png) no-repeat bottom left; padding-bottom:10px;}
.inner-panel .col-full{ float:left; width:100%;}
.inner-panel .col-right{ float:right; width:25%;}

.inner-panel .col-right1{float:right; width:25%;}
.inner-panel .col-left1{ float:left; width:70%;}

.inner-panel .col-right1 img{ float:left; width:95%; border:3px solid #ccc; border-radius:20px;}
.inner-panel .col-right ul{ margin:0px; padding:0px; float:left;}
.inner-panel .col-right ul li{ float:left; width:79%; padding:10px 25px; color:#fff; text-transform:capitalize; text-decoration:none; background:#8b78b7; margin-top:2px; border:2px solid #8b78b7; transition:all 1000ms ease;list-style:none; cursor:pointer;}
.inner-panel .col-right ul li a{ float:left; width:79%; padding:10px 25px; color:#fff; text-transform:capitalize; text-decoration:none; background:#8b78b7; margin-top:2px; border:2px solid #8b78b7; transition:all 1000ms ease; }
.inner-panel .col-right ul li a:hover{ color:#8b78b7; background:#fff;}
.inner-panel .col-left{ float:left; width:100%;}
.inner-panel .col-left .head2{ float:left; width:100%; font-size:25px; margin-top:10px; color:#e16c70;}
.inner-panel .col-left p{}
ul.tabs li.current {color:#8b78b7; background:#fff;}
.list{ float:left; width:100%;}
.list li{ float:left; width:100%; line-height:27px; font-size:15px; background:url(../images/list.png) no-repeat left center; padding-left:45px; list-style:none; margin-top:8px;}
.list2{ float:left; width:100%;}
.list2 ul{ *float:left; margin:0px; padding:0px;}

.list2 li{  background: #e1e1e1 none repeat scroll 0 0;display: inline;float: left;list-style: outside none none;margin: 5px;
padding: 59px 0;position: relative; width: 23%;}
.list2 li .head1{ position:absolute; color:#000; top:50px; left:0px; font-size:16px; text-transform:capitalize; width:100%; float:left; text-align:center; transition:all 1000ms ease;}
.list2 li:hover .head1{transition:all 1000ms ease; top:80px; text-transform:uppercase; color:#fff; }
.list2 li:hover{background: linear-gradient(to bottom, rgba(0,0,0,0.67) 0%,rgba(0,0,0,0.56) 100%); }
.inner-panel .adress{ float:left; width:30%;}
.inner-panel .adress .head1{ float:left; width:100%; font-size:25px; margin-top:10px; color:#e16c70;}
.inner-panel .adress .phone1{ float:left; width:100%; margin-top:10px; color:#000; font-size:15px; background:url(../images/phone2.png) no-repeat left center; padding-left:40px;}
.inner-panel .adress .email2{ float:left; width:100%; margin-top:10px; color:#000; font-size:15px; background:url(../images/email2.png) no-repeat left center; padding-left:40px; padding-bottom:20px; padding-top:20px;}
.inner-panel .adress a{ color:#e16c70; font-size:15px; text-decoration:none;}
.inner-panel .adress p span{ color:#8b77b7; font-size:15px; font-weight: bold;}
.inner-panel .adress a:hover{ color:#8b77b7; text-decoration:underline;}
.inner-panel .map{ float:right; width:100%; border:2px solid #ccc; border-radius:10px; margin-top:20px;}
.inner-panel .col-product{ float:left; width:100%; margin-top:20px;}
.inner-panel .col-product .col-1{ float:left; width:23%; margin:8px;}
.inner-panel .col-product .col-1:hover img{ transition:all 1000ms ease; transform:scale(1.1,1.1); background:#ccc; opacity:0.5;}
.inner-panel .col-product .col-1 img{ float:left; width:100%; border:1px solid #ccc; transition:all 1000ms ease; overflow:hidden; min-height:275px; background:#ccc;}
.inner-panel .col-product .col-1 .head1{ float:left; width:100%; text-transform:capitalize; text-align:center; padding:15px 0px; border:1px solid #ccc; font-size:14px; background:#e36d72; color:#fff;}
.col-1new .head-testi{ float:left; width:100%; text-transform:capitalize; text-align:center; padding:15px 0px; border:1px solid #ccc; font-size:14px; background:#e36d72; color:#fff;}
.inner-panel .form{ float:left; width:50%; margin-top:20px;}
.inner-panel .form .input2{ float:left; width:98%; padding:10px 8px; background:#fff; border:1px solid #e36d72; border-radius:10px; margin-top:10px;}
.inner-panel .form .input2a{float:left; width:98%; padding:10px 8px; background:#fff; border:1px solid #e36d72; height:80px; border-radius:10px; margin-top:10px;}
.inner-panel .form .submit{ float:left; margin-top:10px; background:#8b77b7; padding:6px 25px; border:1px solid #8b77b7; border-radius:10px; color:#fff; text-transform:uppercase; font-size:17px; cursor:pointer; transition:all 1000ms ease;}
.inner-panel .form .submit:hover{ background:#fff; color:#8b77b7; transition:all 1000ms ease;}
.inner-panel .enquiry-img{ float:right; width:35%; margin-top:10px;}


.inner-panel .feed-back{ float:right; width:50%; margin-top:20px;}
.inner-panel .feed-back .input2{ float:left; width:98%; padding:10px 8px; background:#fff; border:1px solid #e36d72; border-radius:10px; margin-top:10px;}
.inner-panel .feed-back .input2a{float:left; width:98%; padding:10px 8px; background:#fff; border:1px solid #e36d72; height:80px; border-radius:10px; margin-top:10px;}
.inner-panel .feed-back .submit{ float:left; margin-top:10px; background:#8b77b7; padding:6px 25px; border:1px solid #8b77b7; border-radius:10px; color:#fff; text-transform:uppercase; font-size:17px; cursor:pointer; transition:all 1000ms ease;}
.inner-panel .feed-back .submit:hover{ background:#fff; color:#8b77b7; transition:all 1000ms ease;}

.phone2{ float:left; background:url(../images/phone3.png) no-repeat left center; padding-left:35px; *font-weight:normal !important; *color:#000 !important; width:100%; margin-top:8px;}
.phone2 b{ color:#000 !important; font-weight:normal !important;}

.phone3{ float:left; background:url(../images/phone3.png) no-repeat left center; padding-left:35px; *font-weight:normal !important; *color:#000 !important; margin-top:10px;}
.phone3 b{ color:#000 !important; font-weight:normal !important;}


.mbile-menu{ display:none;}










/************Responsive **************/

@media all and (min-width:320px) and (max-width:767px){
.wrapper{ width:90%;}
.wrapper2{ width:90%;}

p{ font-size:14px;}


.mbile-menu{ display:block; margin-top: 17px; float:right;}
.mobile-nav{ display:none; position:absolute; *width:200px; padding:10px; background:#e26c70; float:left; right: 15px; top:98px; z-index:999;}
.mobile-nav li{ float:left; width:100%; margin:0px !important;}
.mobile-nav li a{ float:left; width:100%; border:1px solid #ccc; background:#fff; padding:8px 0px; text-align:center; font-size:14px; color:#8b77b6;}
.mobile-nav li a:hover{ background:#8b77b6; color:#fff !important;}


header2{ position:relative;}	
.social{ display:none;}
.banner-section .top{ margin-top:10px; float:left;}	
.banner-section .top li{ font-size:13px;}
.banner-section .top li a{ font-size:13px;}
.nav-bar{ width:auto; background:none; border:none;}
.logo{ width:50%; padding:6px; background:#fff;}
.banner{ width:100%; margin-top:10px;}
.banner img{ float:left; width:100%;}
.panel1 .col-1{ min-height:0px; width:50%;}
.panel1 .col-1 img{ min-height:0px;}
.panel1 .head1{ font-size:11px;}
.panel1 .col-2{ width:41%; padding:12px;}
.panel1 .col-2 .head{ font-size:13px; margin-top:0px;}
.panel1 .col-2 .input{ margin-top:3px; padding:5px 5px; font-size:10px;}
.panel1 .col-2 .inputa{ height:33px; margin-top:6px; padding:5px;  font-size:10px;}
.panel1 .col-2 .submit{ font-size:13px; margin-top:6px; padding:0px;}
.panel2 .cl-1{ display:none;}	
.panel2 .cl-1full .head{ font-size:25px; margin-top:20px; margin-bottom:0px;}
.panel2 .cl-2{ width:100%; margin-left:0px;}
.panel2 .cl-2 .read-more a{ font-size:13px;}
footter .col-full .cl-1{ width:100%;}
footter .col-full .cl-2{ width:100%; text-align:left;}
footter .col-full .cl-3{ float:left;}
.inner-panel .head{ font-size:20px;}
.inner-panel .col-left1{ width:100%;}
.inner-panel .col-right1{ width:100%;}
.inner-panel .col-left .head2{ font-size:18px;}
.list ul{ margin-left:10px; padding:0px;}
.list li { background: rgba(0, 0, 0, 0) url("../images/list.png") no-repeat scroll left top; font-size: 14px; padding-left: 27px;
width: 93%; background-position:0px 5px;}
.inner-panel .col-product .col-1{ width:94%;}
.inner-panel .adress{ width:100%;}
.phone2{ width:92%;}
.inner-panel .feed-back{ float:left; width:94%;}
.inner-panel .form{ width:95%;}
.inner-panel .enquiry-img{ float:left;}
	
}


@media all and (min-width:768px) and (max-width:1024px){
.wrapper{ width:90%;}
.wrapper2{ width:90%;}


}


