/* CSS Document */

html,body{
	margin:0;
	padding:0;
	height:100%;
	width:100%;
}	
*{
	padding:0;
	margin:0;
}
img {
	border:none;
	display:block;
	max-width:100%;
	height:auto;
	width:auto;
	padding:0;
	margin:0;
	}
a {
	text-decoration:none;
	color:#0981CB;
	font-weight:bold;
}
a:hover {
	text-decoration:none;
	color:#fff;
}	
.underline {
	text-decoration:underline;
}
.underline:hover {
	text-decoration:none;
}
	
h1, h2, h3, h4, h5, h6, p, div, span, html, ol, ul, li, form,label {
	margin:0;
	padding:0;
}
ul{
	list-style-type:none;
	}
.spacer{
	clear:both;
	font-size:0;
	line-height:0;
	}
.flotleft{
	float:left;
	width:auto;
	}
.flotright{
	float:right;
	width:auto;
	}
	.clear
{
    clear: both;
}
form{
	margin:0;
	padding:0;
}
p  {
	text-align:justify;
	font-weight:normal;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
	display: block;
}

nav ul {
    list-style: none;
}


/**** Start Header ****/
.wrapper {
	width: 98%;	
max-width: 1120px;
	margin: auto;
}
#hader_main {
	width:100%;

	background:#ffffff;
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	z-index:10;

}
/*** Sticky Menu Bar ***/

.sticky {
  position: fixed;
z-index:999;
	opacity:1;
	visibility:visible;

	animation-name: fadeInDown;
	-ms-animation-duration: 500ms;
	-moz-animation-duration: 500ms;
	-op-animation-duration: 500ms;
	-webkit-animation-duration: 500ms;
	animation-duration: 500ms;
	-ms-animation-timing-function: linear;
	-moz-animation-timing-function: linear;
	-op-animation-timing-function: linear;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-ms-animation-iteration-count: 1;
	-moz-animation-iteration-count: 1;
	-op-animation-iteration-count: 1;
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
}

.sticky + .bann_one_blank {
  padding-top: 60px;
}
 
  /*** Sticky Menu Bar ***/
.hader_content {
	width:100%;
	background:#fed724;
	float:left;
	padding:5px 0 5px 0;
}
.top_header_section {
	width:28%;
	float:right;
}

.top_header_section h5 {
	float:left;
	width:45%;
font-family: 'Work Sans', sans-serif;
	font-size:13px;
	color:#FFFFFF;
	padding:0 0 0 0;
}

.header_main_content {
	float:left;
	width:100%;
	padding:3px 0 3px 0; 
}	
.logo {
width:24%;
float:left;

}
.logo img {
	float:left;
	padding:0 0 0 0;
}
.download_catelog {
	width:13%;
	padding:0 0 0 0;
	float:left;
}
.download_catelog img {
float:left;
	padding:0 0 0 0;
}
.download_catelog img a {
}
	

.soical_content {
	float:left;
	width:52%;
}
.soical_content h4 {
	float:left;
	width:55%;
font-family: 'Lexend', sans-serif;
	font-size:14px;
	color:#ffffff;
	padding:1% 0 1% 0;
	font-weight:300;
}
.soical_content_one {
	float:left;
	width:12%;
}	
.soical_content_one a {
color:#FFFFFF;
font-size:20px;
padding:0 0 0 0;
} 


.soical_content_two {
	float:left;
	width:16%;
}	
.soical_content_two a {
color:#FFFFFF;
font-size:20px;
padding:0 0 0 0;
} 


.soical_content_three {
	float:left;
	width:12%;
}	
.soical_content_three a {
color:#FFFFFF;
font-size:20px;
padding:0 0 0 0;
} 


.banner_main_content {
	width:100%;
	float:left;
}	


/**** Announcement  ***/
.announcement_content {
	float:left;
	width:100%;
	padding:5px 0 3% 0;
}
.announcement_content_one {
	float:left;
	width:100%;
	padding:0 0 0 0;
}
.announcement_content_one h3 {
	float:left;
	width:100%;
font-family: "Libre Baskerville", serif;
font-weight:700;
	font-size:20px;
	color:#63362a;
}
 marquee {
            box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
            border: 1px solid rgba(0, 0, 0, .15);
            background-color: #ffffff;
            padding: 10px;
			font-family: "Libre Baskerville", serif;
        }	

/**** About Us ***/
.about_content {
	float:left;
	width:100%;
	padding:7% 0 7% 0;
}
.about_content_sharifa {
	float:left;
	width:100%;
	background:url(../images/about-us-section-bg.jpg) no-repeat center top;
	padding:2% 0 2% 0;

}	

.about_content_sharifa_one {
	float:left;
	width:100%;
}
.about_content_sharifa_one h1 {
	float:left;
	width:100%;
  font-family:Birds-of-Paradise;
font-weight:700;
	font-size:50px;
	color:#0f0f0f;
	padding:3% 0 2% 0;
	text-align:center;
	letter-spacing:3px;

}
.about_content_sharifa_one p {
	float:left;
	width:100%;
font-family: "Libre Baskerville", serif;
	font-size:14px;
	color:#737373;
	padding:2% 0 1% 0;
	line-height:25px;
	font-weight:400;
	text-align:center;
}

/**** how it work ***/
.How_it_work_one {
width:100%;
float:left;
background:#f4f2f9;
}
.How_it_work_one_main {
	float:left;
	width:100%;
	padding:3% 0 3% 0;
}
.How_it_work_one_main h1 {
	float:left;
	width:100%;
font-family: "Libre Baskerville", serif;
font-weight:700;
	font-size:30px;
	color:#63362a;
	padding:3% 0 2% 0;
	text-align:center;
}
.How_it_work_hygin {
	float:left;
	width:20%;
	padding:1% 0 1% 0;
}
.How_it_work_hygin img {
	float:left;
	padding:0 0 0 20%;
}	
.How_it_work_hygin h3 {
	float:left;
	width:100%;
font-family: "Libre Baskerville", serif;
font-weight:700;
	font-size:20px;
	color:#63362a;
	padding:5% 0 1% 0;
	text-align:center;
}
.How_it_work_round {
width:20%;
float:left;
padding:7% 0 0 0;
}
.How_it_work_round img {
padding:0 0 0 0;
float:left;
}
	

/**** how it work ***/	




/**** product ***/
.product_main_content {
	float:left;
	width:100%;
	padding:2% 0 2% 0;
}
.product_main_content_one {
	float:left;
	width:100%;
}
.product_main_content_one h1 {
	float:left;
	width:100%;
font-family: "Libre Baskerville", serif;
font-weight:700;
	font-size:30px;
	color:#1a1919;
	padding:3% 0 3% 0;
	text-align:center;
}
.product_main_content_two {
	float:left;
	width:45%;
	background:#f4f4f4;
	padding:2% 2% 1% 2%;
	margin-right:2%;
}
.product_main_content_two img {
	float:left;
	padding:0 0 0 0;
}	
.product_main_content_two h2 {
	float:left;
	width:100%;
font-family: "Libre Baskerville", serif;
font-weight:700;
	font-size:25px;
	color:#1a1919;
	padding:1% 0 1% 0;
	text-align:center;
}

.rasins_blank {
	float:left;
	width:100%;
}	

.rasins_line {
	float:left;
	width:40px;
	height:3px;
	background:#f3a24f;
	margin-top:2px;
	margin-bottom:5px;
	margin-left:46%;
}	
.rasin_product_content_two {
	float:left;
	width:33%;
	padding:2% 0 2% 0;
}
.rasin_product_content_two img {
	float:left;
	padding:0 0 0 0;
}
.rasin_product_content_two h3 {
	float:left;
	width:96%;
font-family: 'Open Sans', sans-serif;
font-weight:700;
	font-size:16px;
	color:#63362a;
	padding:1% 0 1% 0;
	text-align:left;
}

/**** product ***/
.commety_con_teo {
	float:left;
	width:100%;
	padding:3% 0 3% 0;
}	

.com_content_five {
	float:left;
	width:100%;
	padding:0 0 0 0;
	background:url(../images/center-oil-bg.jpg) no-repeat center top;
	  background-attachment: fixed;
  background-position: center;
}
.com_content_three {
float:left;
	width:100%;
padding:4% 0 3% 0;
}	
.com_content_three h1 {
	float:left;
	width:100%;
  font-family: "Libre Baskerville", serif;
font-weight:700;
	font-size:40px;
	color:#ffffff;
	padding:12% 0 12% 0;
	text-align:center;
}	



.fivr_blank {
	width:100%;
	height:20px;
	float:left;
}	










	



/*** Responsive ***/


@media only screen and (min-width:320px) {
.top_header_section {
	width:99%;
	float:left;
}
.top_header_section h5 {
	width:45%;
}
.logo {
width:55%;

}
.download_catelog {
	width:25%;
	margin-top:3%;
}
.about_content_one {
	width:99%;
	padding-left:1%;
}
.about_content_one p {
	width:99%;
}	
.about_content_two {
	width:98%;
	padding-left:0;
}
.rasin_product_content_two {
	width:96%;
	padding-left:3%;
}
.commiety_one {
	float:left;
	width:95%;
	padding:2% 0 2% 1%;
}
.commiety_one p {
	padding:1% 0 2% 0;
}
.commiety_one img {
	padding:0 0 0 24%;
}
.commity_line {
display:none;
}
.why_choose_us_content {
	width:97%;
	margin:2% 0 2% 1%;
}	
.why_choose_us_content h2 {
	font-size:12px;
	padding:2% 0 2% 5px;
	width:99%;
}	
.rasin_product_content_one img {
	padding:0 0 0 36%;
}
.rasin_product_content_two img {
	float:left;
	padding:0 0 0 0;
}
.How_it_work_hygin {
	width:98%;
}
.How_it_work_hygin img {
	padding:0 0 0 30%;
}
.How_it_work_round {
display:none;

}
.product_main_content_two {
	width:98%;
	margin:1% 1% 1% 1%;
}	

}


@media only screen and (min-width:360px) {
.commiety_one img {
	padding:0 0 0 26%;
}
}



@media only screen and (min-width:400px) {
.top_header_section {
	width:80%;
	float:right;
}
.logo {
width:50%;
}
.rasin_product_content_two {
	width:90%;
	padding-left:10%;
}

.commiety_one img {
	padding:0 0 0 28%;
}
.How_it_work_hygin img {
	padding:0 0 0 35%;
}
.product_main_content_two {
	width:98%;
	margin:1% 1% 1% 1%;
}

}

@media only screen and (min-width:460px) {
.top_header_section {
	width:70%;
	float:right;
}
.logo {
width:50%;
}
.rasin_product_content_two {
	width:85%;
	padding-left:13%;
}
.commiety_one img {
	padding:0 0 0 30%;
}

}

@media only screen and (min-width:500px) {
.top_header_section {
	width:60%;
}

.logo {
width:40%;
}
.rasin_product_content_two {
	width:80%;
	padding-left:18%;
}
.commiety_one img {
	padding:0 0 0 33%;
}
.why_choose_us_content h2 {
	font-size:16px;
	padding:2% 0 2% 5px;
	width:99%;
}
}



@media only screen and (min-width:600px) {
.top_header_section {
	width:60%;
}
.rasin_product_content_two {
	width:49%;
	padding-left:1%;
}
.commiety_one {
	float:left;
	width:48%;
	padding:2% 0 2% 1%;
}
.commiety_one img {
	padding:0 0 0 20%;
}
.How_it_work_hygin img {
	padding:0 0 0 40%;
}
}

@media only screen and (min-width:640px) {
.top_header_section {
	width:57%;
}

}

@media only screen and (min-width:660px) {
.top_header_section {
	width:53%;
}
}

@media only screen and (min-width:720px) {
.top_header_section {
	width:45%;
}
.commiety_one {
	float:left;
	width:32%;
	padding:2% 0 2% 1%;
}
.commiety_one img {
	padding:0 0 0 20%;
}
.why_choose_us_content {
	width:48%;
	margin:2% 0 2% 1%;
}	
.why_choose_us_content h2 {
	font-size:16px;
	padding:2% 0 2% 5px;
	width:99%;
}

}


@media only screen and (min-width:768px) {

.about_content_one {
	width:50%;
}
.about_content_two {
	width:45%;
	padding-left:2%;
	
}
.How_it_work_hygin img {
	padding:0 0 0 42%;
}
}



@media only screen and (min-width:900px) {
.top_header_section {
	width:35%;
}
.logo {
	width:24%;
}
.download_catelog {
	width:13%;
	margin:0;
}
.rasin_product_content_two {
	width:33%;
	padding-left:0;
}
.about_content_one {
	width:60%;
}
.about_content_two {
	float:left;
	width:40%;
	padding-left:0;
	
}
.commiety_one {
	float:left;
	width:23%;
	padding:2% 0 2% 1%;
}
.commiety_one img {
	float:left;
	padding:0 0 3% 16%;
}
.commity_line {
display:inline;
}
.why_choose_us_content {
	width:45%;
	padding:2% 0 2% 0;

}
.why_choose_us_content h2 {

	width:94%;

	padding:2% 0 2% 5%;

}
.rasin_product_content_one img {
	padding:0 0 0 44%;
}
.rasin_product_content_two img {
	float:left;
	padding:0 0 0 0;
}
.How_it_work_hygin {
	float:left;
	width:20%;
	padding:1% 0 1% 0;
}
.How_it_work_hygin img {
	float:left;
	padding:0 0 0 20%;
}
.How_it_work_round {
display:inline;
}
.product_main_content_two {
	width:45%;
	margin:0 0 0 0;
		margin-right:2%;
}



@media only screen and (min-width:1120px) {
.top_header_section {
	width:28%;
}

}






