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

/*---------- Basic css ---------------
--------------------------------------*/
<link href='https://fonts.googleapis.com/css?family=Indie+Flower' rel='stylesheet' type='text/css'>


@font-face {
  font-family: 'BookmanOldStyle';

  src: url('../fonts/BookmanOldStyle.eot');
  src: url('../fonts/BookmanOldStyle.eot?#iefix') format('embedded-opentype'), url('../fonts/BookmanOldStyle.woff2') format('woff2'), url('../fonts/BookmanOldStyle.woff') format('woff'), url('../fonts/BookmanOldStyle.ttf') format('truetype'), url('../fonts/BookmanOldStyle.svg#glyphicons_halflingsregular') format('svg');
}
@font-face {
  font-family: 'Bookman';

  src: url('../fonts/BookmanOldStyle-Italic.eot');
  src: url('../fonts/BookmanOldStyle-Italic.eot?#iefix') format('embedded-opentype'), url('../fonts/BookmanOldStyle-Italic.woff2') format('woff2'), url('../fonts/BookmanOldStyle-Italic.woff') format('woff'), url('../fonts/BookmanOldStyle-Italic.ttf') format('truetype'), url('../fonts/BookmanOldStyle-Italic.svg#glyphicons_halflingsregular') format('svg');
}
@font-face {
  font-family: 'Calibri';

  src: url('../fonts/Calibri.eot');
  src: url('../fonts/Calibri.eot?#iefix') format('embedded-opentype'), url('../fonts/Calibri.woff2') format('woff2'), url('../fonts/Calibri.woff') format('woff'), url('../fonts/Calibri.ttf') format('truetype'), url('../fonts/Calibri.svg#glyphicons_halflingsregular') format('svg');
}
@font-face {
  font-family: 'MyriadPro Regular';

  src: url('../fonts/MyriadPro-Regular.eot');
  src: url('../fonts/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/MyriadPro-Regular.woff2') format('woff2'), url('../fonts/MyriadPro-Regular.woff') format('woff'), url('../fonts/MyriadPro-Regular.ttf') format('truetype'), url('../fonts/MyriadPro-Regular.svg#glyphicons_halflingsregular') format('svg');
}
@font-face {
  font-family: 'RageItalic';

  src: url('../fonts/RageItalic.eot');
  src: url('../fonts/RageItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/RageItalic.woff2') format('woff2'), url('../fonts/RageItalic.woff') format('woff'), url('../fonts/RageItalic.ttf') format('truetype'), url('../fonts/RageItalic.svg#glyphicons_halflingsregular') format('svg');
}
h1, h2, h3, h4, h5, h6, p, a, li, p{
	font-family:'Bookman';
}
p, li{
	line-height:36px !important;
	font-family: 'MyriadPro Regular';
	font-size:18px;
	color: rgb(136,136,136);
}
body{
	padding:0px;
	margin:0px;
	vertical-align:central;
	overflow-x:hidden !important;
}
html, body{
	height:100% !important;
}
*{
	box-sizing:border-box !important;
	-webkit-box-sizing:border-box !important;
	-moz-box-sizing:border-box !important;
	outline:none;
}
a{
	color:white;
	outline:none !important;
}
a:hover{
	color:white;
	text-decoration:none;
}

/*------- Main css ------------------
-------------------------------------*/

/*-------------- Header style start ---------------------*/

.side-nav{
	position:fixed;
	height:100%;
	overflow:auto;
	background:white;
	box-shadow:0px 0px 5px rgba(0,0,0,0.63);
	top:0px;
	right:-370px;
	padding:38px 40px;
	z-index:9999;
	transition:all 0.9s ease;
}
.open{
	right:0px;
}

.nav-list{
	padding:0px;
	list-style:none;
	width:280px;
	min-width:100%;
	clear:both;
}
.nav-list li{
	border-bottom: 1px solid rgb(225, 225, 225);
	padding: 6px 0px;
}
.nav-list li a{
	color:#A1A1A1;
	cursor:pointer;
	font-size:24px;
}
.nav-list li a:hover{
	color:#000;
}
.close-icon{
	font-size: 24px;
	background: transparent url("../images/window-close.png") no-repeat scroll 70px 1px / 32px auto;
	padding-right: 70px;
	color:#B0B0B0;
	cursor:pointer;
	float:right;
	margin-bottom:10%;
	font-family:arial;
}
.close-icon:hover{
	color:rgb(9,107,180);
}

.head-main{
	padding:0.7% 5% 0px;
	/*background:white;
	box-shadow:0px 0px 5px rgba(0,0,0,0.63);*/
	position:fixed;
	width:100%;
	z-index:999;
}
.logo{
	max-width: 100%;
	width: 100px;
}
.menu{
	position: relative;
	padding-right: 32px;
	text-align:right; 
	margin-top:33px;
	cursor:pointer;
	display:inline-block;
	color:rgb(9,107,180);
	font-family:arial;
}
.menu span{
	position: absolute;
	right: 0px;
	top: 0px;
	width: 25px;
	height: 3px;
	content: "";
	background: rgb(9,107,180);
	margin-top:3px;
}
.menu span:nth-child(2){
	top:7px;
}
.menu span:last-child{
	top:14px;
}

/*----------- animation style start --------------*/

.green-leaf, .flower{
	margin-top: 12%;
}
.green-leaf ul{
	list-style:none;
	margin:0;
	padding:0;
	margin-top: 3%;
	text-align:center
}
.flower ul{
	list-style:none;
	margin:0;
	padding:0;
	margin-top: 3%;
	text-align:center
}
.leaf{
	position:absolute;
}
.leaf img{
	opacity:0;
}
.animate .leaf{
	width:96%;
}
.animate .leaf img{
	opacity:1;
	max-width:100%;
}
.leaf1{
	position:absolute;
}
.leaf1 img{
	opacity:0;
}
.animate .leaf1{
	width:96%;
}
.animate .leaf1 img{
	opacity:1;
	max-width:100%;
}
.animate .leaf-1 img{
	transition: all .5s ease-in-out;
}
.animate .leaf-2 img{
	transition: all .5s 1s ease-in-out;
}
.animate .leaf-3 img{
	transition: all .5s 1.5s ease-in-out;
}
.animate .leaf-4 img{
	transition: all .5s 2s ease-in-out;
}
.animate .leaf-5 img{
	transition: all .5s 2.5s ease-in-out;
}
.animate .leaf-6 img{
	transition: all .5s 3s ease-in-out;
}
.animate .leaf-7 img{
	transition: all .5s 3.5s ease-in-out;
}
.animate .leaf-8 img{
	transition: all .5s 4.0s ease-in-out;
}
.os-phrases h2{
	font-family: 'BookmanOldStyle';
	font-style:italic;
	font-weight:bold;
}

/*------------ animation style end --------------*/

/*------------ main css start ---------*/

.head-box{
	padding:7% 15px;
}
.head-con{
	padding-left:15%;
}
.head-con h2{
	display:block;
}
.head-con ul{
	list-style:none;
	padding:0px;
	margin-top:30px;
	margin-bottom:30px;
}
.head-con ul h4{
	color:rgb(136,136,136);
	margin-bottom:15px;
	font-family: 'MyriadPro Regular';
	font-weight:bold;
}
.head-con ul li:first-child{
	padding-left:0px;
}
.head-con ul li:first-child::before{
	background:none;
}

.head-con ul li::before {
    content: "";
    position: absolute;
    width: 32px;
    height: 32px;
    background: url(../images/page-1/bullet.png) no-repeat;
    top: 0px;
    left: 0px;
    background-position: center;
    background-size: 24px;
}
.head-con ul li{
	color:rgb(136,136,136);
	padding-left: 35px;
	position:relative;
	margin-bottom:5px;
}
.head-con h3{
	color:rgb(9,107,180);
	
	font-size: 25px;
text-align: center;
}
.head-btn a, .head-btn input[type="submit"]{
	background:rgb(9,107,180);
	border-color:rgba(5,90,154,1.00);
	margin-top:3%;
	min-width:160px;
	font-size:22px;
	font-weight:normal;
	transition:all 0.4s ease;
	font-family: 'Calibri';
}
.head-btn a:hover, .head-btn input[type="submit"]:hover{
	background:rgba(28,130,205,1.00);
	border-color:rgba(5,90,154,1.00);
}

/*------- lettering animate css ----------*/
.os-phrases h2{
	margin-top:-20px;
	color:rgb(245,165,106);
}
.char1 span, .char2 span, .char3 span, .char4 span, .char5 span{
	position:relative;
	opacity:0;
	left:0px;
	transition:all 1.5s ease;
}
.char2 span{
	left:-30px;
}
.char3 span{
	left:-60px;
}
.char4 span{
	left:-90px;
}
.char5 span{
	left:-120px;
}

.animat .char1 span, .animat .char2 span, .animat .char3 span, .animat .char4 span, .animat .char5 span{
	left:0px;
	opacity:1;
}

/*-------- about us start --------*/

.about{
	padding:0% 15px 6%;
	/*background:red;*/
	min-height:100%;
	position:relative;
}
.dots{
	position: absolute;
	top: 0px;
	right: 0px;
	background: white none repeat scroll 0% 0%;
	width: 340px;
	bottom: 0px;
	height: 100%;
	transition: all 1s ease-in-out 1s;
}
.animate.dots{
	height:0px;
}
.about-leaf{
	position: absolute;
	bottom: 0px;
	left: 0px;
	width:100%;
	z-index: -1;
	/*pointer-events: none;*/
}
.box::after {
    content: "";
    width: 100%;
    height: 100%;
    background: white;
    position: absolute;
    top: 0px;
    transition: all 1s ease-in-out 2s;
    z-index: 1;
}
.box{
	position: absolute;
	max-width: 230px;
	right: 5%;
	bottom: 38%;
	z-index:1;
}

.animate.box:after{
	height:0px;
}
.about-leaf img:first-child{
	position: relative;
	z-index:99;	
}
.box img{
	position:absolute;
	z-index:1 !important;
}

.box2::after {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    content: "";
	background: -webkit-linear-gradient(right, rgba(255,255,255,0), rgba(255,255,255,1) 15%);
	background: -o-linear-gradient(right, rgba(255,255,255,0), rgba(255,255,255,1) 15%);
    background: -moz-linear-gradient(right, rgba(255,255,255,0), rgb(255, 255, 255) 15%);
	background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1) 15%); 
	background-color:white;
    z-index: 99;
	transition:all 1s ease-in-out;
}
.animate.box2:after{
	width:0%;
	left:100%;
	background-color: rgba(255,255,255,0);
}
.about h1{
	margin-bottom:30px;
}
.about-head-bg{
	margin-right:8%;
	max-width:230px;
}


/*-------- about us end --------*/

/*-------- directors us start --------*/

.directors{
	position:relative;
	padding:3% 15px 7%;
	/*background:red;
	min-height:100%;*/
}
.box3{
	width: 230px;
	position: absolute;
	top: 0px;
	right: 10%;
}
.box3::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0px;
    height: 100%;
    width: 100%;
	background: -webkit-linear-gradient(left, rgba(255,255,255,0), rgba(255,255,255,1) 99%);
	background: -o-linear-gradient(left, rgba(255,255,255,0), rgba(255,255,255,1) 99%);
    background: -moz-linear-gradient(left, rgba(255,255,255,0), rgb(255, 255, 255) 99%);
	background: linear-gradient(to left, rgba(255,255,255,0), rgba(255,255,255,1) 99%); 
    background-color: white;
    transition: all 1s ease-in-out;
}
.animate.box3::after{
	width:0px;
	background-color: rgba(255,255,255,0);
}
.directors-list{
	margin-bottom:40px;
}
.directors-list img{
	margin-right: 20px;
	display: inline-block;
	max-width: 120px;
}
.directors-list .list-box{
	display:inline-block;
	vertical-align:middle;
}
.directors-list .list-box h1, .directors-list .list-box p{
	color:#888888;
}
.directors-list .list-box h1{
	font-size:26px;
}
.directors-list .list-box p{
	font-size:20px;
}

/*-------- directors us end --------*/

/*-- vision & mission start --*/

.vision-main{
	position:relative;
	padding:3% 15px 7%;
	/*background:red;
	min-height:100%;*/
}
.vision-bg{
	position:absolute;
	top:-70px;
	left:0px;
	width:100%;
	z-index:-1;
}
.vision-bg img{
	width:950px;
}
.tile2 img, .tile3 img{
	position: absolute;
	top: 0px;
	left:0px;
}
.tile1::after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 44%;
    max-width: 418px;
    height: 100%;
    background: -webkit-linear-gradient(left bottom, rgba(255,255,255,0), rgba(255,255,255,1) 500%);
	background: -o-linear-gradient(left bottom, rgba(255,255,255,0), rgba(255,255,255,1) 500%);
    background: -moz-linear-gradient(left bottom, rgba(255,255,255,0), rgb(255, 255, 255) 500%);
	background: linear-gradient(to left bottom, rgba(255,255,255,0), rgba(255,255,255,1) 500%); 
    background-color: white;
    transition: all 1s ease 0.75s;
}
.animate.tile1::after{
	top:100%;
	height:0%;
	right:100%;
	max-width:0px;
	background-color: rgba(255,255,255,0);
}
.tile3::after {
    content: "";
    position: absolute;
    top: 0px;
    right: 18%;
    width: 44%;
    max-width: 424px;
    height: 65%;
    background: -webkit-linear-gradient(right top, rgba(255,255,255,0), rgba(255,255,255,1) 500%);
	background: -o-linear-gradient(right top, rgba(255,255,255,0), rgba(255,255,255,1) 500%);
    background: -moz-linear-gradient(right top, rgba(255,255,255,0), rgb(255, 255, 255) 500%);
	background: linear-gradient(to right top, rgba(255,255,255,0), rgba(255,255,255,1) 500%); 
    background-color: white;
    transition: all 1s ease 1.5s;
}
.animate.tile3::after{
	height:0%;
	max-width:0px;
	background-color: rgba(255,255,255,0);
}
.tile2 img{
	opacity:0;
	transition:all 2s ease;
}
.animate.tile2 img{
	opacity:1;
}

/*-- vision & mission end --*/

/*-- Quality Policy start --*/

.Policy-box{
	position:relative;
	padding:3% 15px 7%;
	/*background:red;
	min-height:100%;*/
}
.Policy-box h1{
	margin-bottom:10%;
}
.Policy-box h3{
	margin-bottom:2%;
	color:rgb(9,107,180);
	font-family:RageItalic;
	font-size:28px;
}
.Policy-box p{
	margin-bottom:10%;
}

/*-- Quality Policy end --*/

/*----product start -----*/

.product-main{
	position:relative;
	padding:3% 15px 7%;
	/*background:rgba(255,239,239,1.00);*/
	min-height:100%;
}
.product-img, .product-img1{
	 margin:3em 0;
}
.product-img img{
	border-radius:130px 10px 130px 10px;
}
.product-img1 img{
	border-radius:10px 130px 10px 130px;
}
/*------- product end -------*/

/*---------- award start ----------*/
.award-img1 img{
	width:85% !important;
}
.award-img2 img{
	width:80% !important;
}
.award-img3 img{
	width:75% !important;
}
.award-img4 img{
	width:70% !important;
}
.award-img5 img{
	width:65% !important;
}
.award-img6 img{
	width:60% !important;
}
.award-list h3, .award-list p{
	text-align:right;
}
.award-list1 img{
	float:right;
}
.award-list, .award-list1{
	margin:2em 0;
}
.award-list img, .award-list1 img{
	width:90%;
	height:90%;
}
.award-list img{
	border-radius:110px 10px 110px 10px;
}
.award-list1 img{
	border-radius:10px 60px 10px 110px;
}
.award-main{
	position:relative;
	padding:3% 15px 7%;
}
.award-main ul{
	list-style:none;
}
.award-main ul h3{
	color:rgb(100,100,100);
	font-size:28px;
	font-family: 'MyriadPro Regular';
	font-style:italic;
}
.award-main ul p{
	font-style:italic;
	margin-bottom:0px;
}
.award-main h1{
	margin-bottom:1.5%;
}
.award-bg{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	z-index:-1;
}
.award-leaf img{
	position:absolute;
	top:calc(100% - 89%);
	right:0px;
	max-width:500px;
	width:60%;
	opacity:0;
	transition:all 0.9s ease;
}
.award-leaf img:nth-child(2){
	right:0.08%;
	transition:all 2s ease-in-out 0.5s;
}
.animate.award-leaf img{
	opacity:1;
}

/*---------- award end ----------*/

/*-------- contact us start ---------*/

.contact-main{
	position:relative;
	padding:1% 15px 7%;
	/*background:red;*/
	/*min-height:100%;*/
}
.contact-main h3{
	font-family: 'MyriadPro Regular';
}
textarea {
    resize: none;
	min-height:120px;
}
.contact-bg{
	position:absolute;
	bottom:-2px;
	left:0px;
	z-index:-1;
	width:100%;
}
.tree{
	position:absolute;
	bottom:0px;
	left:calc(100% - 63%);
	width:60%;
	max-width:500px;
	transition:all 0.9s ease-in-out;
}
.tree img{
	left:0px !important;
	width:100% !important;
}
.tree::after {
    content: "";
    position: absolute;
    bottom: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background: white;
	min-height:180px;
	transition:all 1.2s ease;
}
.animate .tree::after{
	min-height:0px;
	bottom:180px;
}
.contact-bg img{
	position:absolute;
	bottom:0px;
	left:calc(100% - 63%);
	width:60%;
	max-width:500px;
	opacity:0;
	transition:all 0.9s ease-in-out;
}
.contact-bg img:nth-child(2){
	transition-delay:0.9s;
}
.contact-bg img:nth-child(3){
	transition-delay:1.8s;
}
.animate.contact-bg img{
	opacity:1;
}
.error{
	height:28px;
	color:red;
}
.success{
	color:rgb(0, 150, 0);
}

/*---------- contact us end -----------*/


/*---------- footer start ----------*/

.footer{
	position:relative;
	padding:2% 15px;
	background:rgb(246,164,108);
}
.footer ul{
	padding: 0px;
	list-style: outside none none;
}
.footer ul li{
	display:inline-block;
	font-size:13px;
	margin-right:5px;
}
.footer ul li a{
	font-family: 'MyriadPro Regular';
}
.footer ul li:last-child{
	margin-right:0px;
}
.footer ul li::after {
    content: "|";
    font-size: 16px;
    color: white;
}
.footer ul li:last-child::after {
	content: "";
}
.footer p{
	color:white;
	font-size:13px;
	text-align:right;
}
.social-icon{
	position: absolute; 
	left: 0px; 
	z-index: -1; 
	width: 100%; 
	bottom: 0px; 
	padding-bottom: 20px; 
	padding-left: 25%;
	z-index:99;
}
.social-icon img{
	max-width:60px;
	margin-right:5px;
	display:inline-block;
	cursor:pointer;
}

/*---------- footer end ----------*/


.onediv2img img{
	float:none;
	margin-top: -13%;
}
.onediv2h3{
	margin-top:10%;
}


/*-------- media 768 start ----------*/
@media screen and (max-width:1400px){
.vision-lft{
	padding-bottom: 3% !important;
}
.vision-main, .product-main{
	padding: 0 15px 7% !important;
}
.product-main h1{
	margin-top: 10px;
}
}

@media screen and (max-width:1200px){
.vision-lft{
	padding-bottom: 11% !important;
}
.vision-main, .product-main{
	padding: 3% 15px 7% !important;
}
.product-main h1{
	margin-top: 20px;
}
}

@media (max-width:768px){
	.onediv2h3{
		margin-top:0;
	}

	.product-img{
		margin:1em 0;
	}
	.product-img img, .product-img1 img{
		margin-left:auto;
		margin-right:auto;
		display:block;
	}
	.contact-main .col-md-3, .contact-main .col-md-4, .contact-main h1, .contact-main p{
		float:none !important;
		text-align:left;
	}
	.box{
		width:30%;
	}
	.logo{
		width:60px;
	}
	.side-nav{
		padding:30px 15px;
	}
	.close-icon{
		padding-right:35px;
	}
	.social-icon img{
		max-width:40px;
	}
}

/*-------- media 768 end ----------*/

/*-------- media 991 start ----------*/

@media (max-width:991px){
	.logo{
		width:80px;
	}
	.menu{
		margin-top:28px;
	}
	.head-main{
		background:white;
		box-shadow:0px 0px 5px rgba(0,0,0,0.63);
	}
	.footer ul{
		text-align:center;
	}
	.Policy-box .row{
		display: flex;
		flex-flow: column-reverse nowrap;
	}
	.head-box .row{
		display: flex;
		flex-flow: column-reverse nowrap;
	}
	.green-leaf, .flower{
		margin-top:0px;
		margin-bottom:3%;
	}
	.head-con{
		padding:0px 2%;
	}
	.head-con h2{
		display:block;
		font-size:22px;
	}
	.head-con h3{
		text-align:center;
	}
	.about-leaf img{
		opacity:0.4;
	}
	p, li{
		color:#454645 !important;
	}
	.head-con ul h4{
		color:#313131;
	}
	.about-head-bg{
		width:30%;
		max-width:180px;
	}
	.dir-img{
		max-width:230px;
		width:40%;
		opacity:0.5;
	}
	.directors-list .list-box{
		display:block;
	}
	.directors .col-sm-6{
		text-align:center;
	}
	.vision-bg{
		opacity:0.5;
		top:calc(100% - 86%);
	}
	.award-bg{
		opacity:0.5;
	}
	.award-main ul{
		padding:0px;
	}
	.award-main h1{
		text-align:left;
	}
	.directors h1{
		font-size:32px;
	}
	.animate .leaf1 img{
		width:220px;
	}
	.animate .leaf img{
		width:280px;
	}
	.flower{
		min-height:300px;
	}
	
}

/*-------- media 991 end ----------*/

/*-------- media 1200 start ----------*/

@media (max-width:1199px){
	.directors-list .list-box h1{
		font-size:24px;
	}
	.award-bg img{
		max-width:400px;
	}
}

/*-------- media 1200 end ----------*/

@media (max-width:640px){
	.nav-list li a{
		font-size:20px;
	}
	.social-icon img{
		max-width:30px;
	}
	.social-icon{
		padding-left:10%;
		padding-bottom:10px;
	}
}