/*

 * http://www.GreenRiceStraw.com

 * Copyright 2020, Green Rice Straw Ltd

*/





/* Uniform coloring for this project

**

** light green for back ground  D8F6E5

** dark green for text     			134D0D

** hoover menu dark green 			08088A

**

** dark blue : 000080



** FOR ATA PROJECT

** Replace : 

** Dark Blue : 000080 (134D0D)

** Sky blue  : 87CEFA ( )

** Hoover Very Light Blue : 08088A (08088A)

**

*/





a.white-btn {

	border: 1px solid #fff;

	border-radius: 3px;

	color: #fff;

	display: block;

	font-size: 0.85em;

	margin-top: 1.25em;

	padding: 0.625em 1.25em;

	transition: all 0.20s linear 0s;

	-o-transition: all 0.20s linear 0s;

	-ms-transition: all 0.20s linear 0s;

	-moz-transition: all 0.20s linear 0s;

	-webkit-transition: all 0.20s linear 0s;

}

a.white-btn:hover {

	background: none repeat scroll 0 0 rgba(255, 255, 255, 0.1);

	color: #FFFFFF;

	font-size: 0.9em;

}

a.color-btn, form.customform button.color-btn {

	background: none;

	border: 1px solid #2A2A2A;

	border-radius: 3px;

	color: #2A2A2A;

	display: block;

	font-size: 0.85em;

	padding: 0.625em 1.25em;

	transition: all 0.20s linear 0s;

	-o-transition: all 0.20s linear 0s;

	-ms-transition: all 0.20s linear 0s;

	-moz-transition: all 0.20s linear 0s;

	-webkit-transition: all 0.20s linear 0s;

}





a.color-btn:hover, form.customform button.color-btn:hover {

	border: 1px solid #08088A;

	color: #08088A;





}



/*

** was 2A2A2A = black

** now D8F6E5 = light green

** dark green  = 134D0D



*/



#topbar {

	background: none repeat scroll 0 0 #ADD8E6; /*D8F6E5;*/

	border-bottom: 1px solid #ADD8E6; /*#D8F6E5;*/

	padding: 0.3125em 0;

}



/*

** topbar text was white FFFFFF

** dark green  = 134D0D

*/

#topbar p {

	color: #08088A /**/;

	font-size: 0.75em;

	opacity: 0.5;

	position: relative;

	top: 2px;

}

#topbar p strong {

	font-weight: 600;

}

#topbar i {

	color: #ffffff;

	font-size: 1.1em;

	opacity: 0.5;

	transition: all 0.20s linear 0s;

	-o-transition: all 0.20s linear 0s;

	-ms-transition: all 0.20s linear 0s;

	-moz-transition: all 0.20s linear 0s;

	-webkit-transition: all 0.20s linear 0s;

}

#topbar i:hover {

	color: #08088A /**/; /* dark green FFFFFF */

	cursor: pointer;

	opacity: 1;

}

nav {

	background: none repeat scroll 0 0 #FFFFFF;

}

header {

	border-bottom: 4px solid rgba(0, 40, 58, 0.53);

	position: fixed;

	width: 100%;

	z-index: 10;

}

p.logo {

	color: #08088A;

	font-size: 1.7em;

	font-weight: 300;

	position: relative;

	text-transform: uppercase;

	top: 0.12em;

}

p.logo strong {

	font-weight: 700;

}

.top-nav li a {

	border-top: 2px solid #08088A /**/;/* TOP-MENU AC68C3 - purple */

	color: #08088A;

	font-size: 1em;

	font-weight: 600;

	padding: 2.1em 1.2em 2.1em;

	text-transform: uppercase;

	transition: all 0.20s linear 0s;

	-o-transition: all 0.20s linear 0s;

	-ms-transition: all 0.20s linear 0s;

	-moz-transition: all 0.20s linear 0s;

	-webkit-transition: all 0.20s linear 0s;

}

.top-nav li a:hover, .top-nav li.active-item a {

	background: none repeat scroll 0 0 #08088A /**/;/* TOP-MENU AC68C3 - purple */

	border-top: 2px solid #08088A /**/;/* TOP-MENU AC68C3 - purple */

	color: #FFFFFF;

	position: relative;

}

#carousel .text {

	position: absolute;

	top: 40%;

	z-index: 10;

}

.item {

	overflow: hidden;

	width: 100%;

}

.prev-arrow, .next-arrow {

	background: none repeat scroll 0 0 #808080; /* = hex color code 888888 is grey */

	cursor: pointer;

	float: left;

	height: 30px;

	line-height: 30px;

	margin-right: 1px;

	text-align: center;

	width: 30px;

}



/* 

** This section set color and tone for sliding text 

**

*/



#carousel .text h2 {

/*		background: none repeat scroll 0 0 rgba(216,246,229,0.48); */



	background: none repeat scroll 0 0 rgba(173,216,250,0.48); 

	/* rgba(153,0,204,0.48) = hex color code 9900CC is purple 

	** 19,77,13 = 08088A 

	** D8F6E5 (216,246,229) - ligh green

	** 134D0D dark green text

 */

	color: #08088A /**/;

	display: inline-block;

	font-size: 1.5em; /* was 2.3 */

	font-weight: 300;

	margin: 1px 0;

	max-width: 600px;

	padding: 15px 25px;

	width: 100%;

	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;

}

#carousel .text p {

	/* Original #808080 This is grey color */

	/* This is the color for the bottom  part the sliding show 

	** D8F6E5 is light green as the first part except there is NO transparancing 

	** F0EDB0 - for light yellow

	** f4f3d8 - even lighter yellow

	** f6f6e0 -more lighter

	** background: none repeat scroll 0 0 #f2f2e5 ; 

	*/ 

	/* background: none repeat scroll 0 0 rgba(244,243,216,0.80) ; */

	background: none repeat scroll 0 0 rgba(173,216,250,0.80) ; 



	/* fff original which is white  

	** f = black

	** 3cf = blue green

	** 134D0D dark green text

	*/

	color: #08088A /**/;

	max-width: 600px;

	padding: 10px 20px;

	width: 100%;

}

#carousel .owl-theme .owl-controls {

	background: none repeat scroll 0 0 rgba(136,136,136,1.00); /* = hex color code 888888 is grey */

	bottom: 0;

	margin: 0;

	

	/*

	** Original 0.625em 0

	*/

	padding: 0.625em 0;

	position: absolute;

	width: 100%;

}

/*

** circle control at the bottom

*/

.owl-theme .owl-controls .owl-page span {

	background: none repeat scroll 0 0 rgba(0, 0, 0, 0);



	/*

	** Original rgba(216,246,229,0.58)

	** rgba(153,0,204,0.58) = hex color code 9900CC is purple 

	** D8F6E5 (216,246,229) - ligh green

	** 134D0D -dark green = 19,77,13

	*/

	border: 3px solid rgba(19,77,13,0.58);  



	height: 18px;

	margin: 0 0.3125em;

	opacity: 1;

	width: 18px;

}

.owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span {

	/*

	** Original AAAAAA = light grey

	** Change to light green D8F6E5

	*/

	background: none repeat scroll 0 0 #ADD8E6; /*D8F6E5;*/

}

#first-block {

	background: none repeat scroll 0 0 #CCCCCC;

	padding-top: 3em;

	padding-right: 3em;

	padding-left: 3em;

	padding-bottom: 3em;

	text-align: center;

}



/*

** Descriptions

** Text for "Our Vision ..."

*/



#first-block h1 {

	/* 

	** 08088A is dark green

	*/

	color: #08088A;

	font-size: 2em;

	font-weight: 300;

	margin-top: 0;

}





/*

** New Added for 

** "Why choose Green Rice Straw"

*/

	/* 

	** 08088A is dark green

	** 134D0D even darker green 

	*/

/*

	color: #08088A;

	font-size: 2em;

	font-weight: 300;

	margin-top: 0;

*/



#first-block h2 {



	color: #08088A;

	font-size: 2em;

	font-weight: 600;

	margin: 1.25em 0;

	text-transform: uppercase;

	text-align: center; /* */



}







#first-block p {

	color: #000000;

	font-size: 1.2em;

}

#features {

	background: none repeat scroll 0 0 #fff;

	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);

	padding: 6em 2em;

	position: relative;

	text-align: left; /*center */

	z-index: 2;

	

		

}

#features i {

	border-radius: 100px;

	box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3) inset;

	color: #fff;

	display: inline-block;

	font-size: 2em;

	height: 80px;

	line-height: 80px;

	text-align: center; /*  */

	width: 80px;

	background-attachment: scroll;

	background-color: #08088A;/* TOP-MENU AC68C3 - purple */

	background-image: none;

	background-repeat: repeat;

	background-position: 0 0;

}



/*

** added for text below the icons

** not used atm

*/

#features h1 {

	color: #08088A;

	font-size: 1em;

	font-weight: 600;

	margin: 1.25em 0;

	text-transform: uppercase;

}



#features h2 {

	color: #08088A;

	font-size: 1em;

	font-weight: 600;

	margin: 1.25em 0;

	text-transform: uppercase;

	text-align: center; /* */

}



#features p {

	color: #000000;

	font-size: 1em;

	line-height: 1.5em;

}





.features-text {

	display: table;

	position: relative;

}



/*

** About us - Original value grey back ground with AAAAAA

** D8F6E5 (216,246,229) - ligh green

** Give background color of "CERTIFICATION"

*/

#about-us {

	background: none repeat scroll 0 0 #ADD8E6; /*D8F6E5;*/

	clear: both;

}



#about-us p {

	color: #000000;

	font-size: 1.5em;

/*	line-height: 1.5em; */

}





#about-us:after {

	clear: both;

	content: ".";

	display: block;

	height: 0;

	line-height: 0;

	visibility: hidden;

}

/*

#about-us h1 {

	font-size: 1.5em;

	}

*/



#about-us p {

	font-size: 1.5em;

	}



#about-us article {

	padding: 4em;

}

article h2 {

/*	color: #134D0D; no effect ? 

** reducing font size from 4em

*/

	font-size: 2.5em;

	font-weight: 900;

	letter-spacing: -2px;

	line-height: 0.9;

	margin: 0 0 0.625em 0

}

/*

article h1 {

	font-size: 1.5em;

}

*/

article h1, article h2, article h3, article h4, article h5, article h6 {

	color: #08088A;

}

.media-container {

  overflow: hidden;

}



/*

** 100% -> 50%

*/



.media-container video, .media-container img {

  display: block; /* block, inline-block,none */

  height: 50%;

  max-width: 50% ; /* none */

  min-width: 50%;

  width: 50%; /* auto */

}

article p, article li {

	color: #000000;

	font-size: 1.23em;

	opacity: 0.7;

}

article ul {

	padding: 1.25em 0;

}

article ul li {

	list-style-type: none;

	margin: 0.625em 0;

	padding: 0 0 0 1em;

}

article ul li:before {

	background: #00283a none repeat scroll 0 0;

	color: #fff;

	content: "\f006";

	display: inline-block;

	font-family: "mfg";

	font-size: 0.8em;

	height: 20px;

	line-height: 20px;

	margin-left: -1em;

	margin-right: 0.625em;

	text-align: center;

	width: 20px;

}



/*

** color ? not used ?

*/

.about-us-icons i {

	/*

	** Original FBFBFB is light grey

	** D8F6E5 - light green

	*/

	border: 2px solid #ADD8E6; /*D8F6E5;*/

	border-radius: 100px;

	/*

	** Original FFFFFF is WHITE

	*/

	color: #ADD8E6; /*D8F6E5;*/

	display: block;

	float: left;

	font-size: 1.6em;

	height: 60px;

	line-height: 60px;

	margin-right: 0.625em;

	text-align: center;

	width: 60px;

}

.about-us-icons {

	display: block;

	margin-top: 2em;

}



/*

** DEDEDE is dark grey

*/

h2.section-title:after {

	background: #dedede none repeat scroll 0 0;

	content: "";

	display: block;

	height: 1px;

	margin: 0.31225em auto 0;

	position: relative;

	width: 100px;

}



/*

** Original value : 888888 = DARKER grey

** Change to 134D0D = dark green

** Affect the text : 	ABOUT OUR COMPANY

** 

*/

h2.section-title {

	color: #08088A;

	font-size: 2em;  /* GRS_FONT_SIZE - certification */

	font-weight: 700;

	letter-spacing: -1px;

	margin: 0 0 1.25em;

	text-align: center;

	text-transform: uppercase;

}

#our-work {

	/* font-size: 2.5em; added new */



	background: none repeat scroll 0 0 #fff;

	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);

	padding: 6em 2em; 

	position: relative;

	z-index: 2;

}



#our-work p {

	font-size: 1.1em;

}



/*

** Original value : FFF = black tab background

** D8F6E5 - light green

** Change to 134D0D = dark green

** Affect the text : 	ABOUT OUR COMPANY

** 

*/

.tab-item {

	background: #fff none repeat scroll 0 0;

	margin-top: 1.25em;

	padding: 1.25em 0;

}

.our-work-container {

	display: block;

	height: 100%;

	position: relative;

}



/*

** Original value : 888888 = DARKER grey

** Change to 134D0D = dark green

** Affect the text : 	ABOUT OUR COMPANY

** 

*/



.our-work-text {

	background: #2A2A2A none repeat scroll 0 0;

	bottom: 0;

	display: block;

	left: 0;

	opacity: 0;

	padding: 1.25em;

	position: absolute;

	right: 0;

	text-align: center;

	transition: opacity 0.20s linear 0s;

	-o-transition: opacityd 0.20s linear 0s;

	-ms-transition: opacity 0.20s linear 0s;

	-moz-transition: opacity 0.20s linear 0s;

	-webkit-transition: opacity 0.20s linear 0s;

	width: 100%;

}

.our-work-container:hover > .our-work-text {

	opacity: 1;

}

/*

.our-work-text h2 {

	color: #fff;

	font-size: 2.5em;

	font-weight: 600;

}

*/



.our-work-text h4 {

	color: #fff;

	font-size: 1em;

	font-weight: 600;

}



.our-work-text p {

	color: #fff;

	font-size: 0.8em; 

	opacity: 0.7;

}

.tab-nav {

	display: table;

}



/*

** Original value 2A2A2A = black

** Change to light green = D8F6E5

** Change to light yellow = F0EDB0

** 808080 = grey

*/



a.tab-label, a.tab-label:link, a.tab-label:visited {

	background: #808080 none repeat scroll 0 0;

	color: #fff;

	display: block;

	font-size: 1em;

	padding: 0.625em 1.25em;

	transition: all 0.20s linear 0s;

	-o-transition: all 0.20s linear 0s;

	-ms-transition: all 0.20s linear 0s;

	-moz-transition: all 0.20s linear 0s;

	-webkit-transition: all 0.20s linear 0s;

}

a.tab-label:hover, a.tab-label.active-btn {

	background: #08088A;

	color: #fff;

}

#services {

	background: #CCCCCC none repeat scroll 0 0;

	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);

	padding: 6em 2em;

}





/*

** our inititive

*/



#services h2 {

	color: #08088A;

	margin: 0 0 1.25em;

}

#services h2.section-title:after {

	background: #fff none repeat scroll 0 0;

}

#services i {

	background: none repeat scroll 0 0 #fff;

	border-radius: 80px;

	color: #08088A;

	display: block;

	float: left;

	font-size: 1.8em;

	height: 80px;

	line-height: 80px;

	margin-right: 0.625em;

	text-align: center;

	width: 80px;

}

.service-text {

	display: table;

	position: relative;

}

#services h3 {

	color: #08088A;

	font-size: 1em;

	font-weight: 700;

	text-transform: uppercase;

}

#services p {

	color: #000000;

	font-size: 1em;

}

#latest-news {

	background: #f3f3f3 none repeat scroll 0 0;

	box-shadow: 0px -10px 9px -11px rgba(0, 0, 0, 0.5);

	padding: 6em 2em;

	position: relative;

	z-index: 3;

}



#latest-news p {

	font-size: 1em;

}



.news-date {

	background: #CCCCCC none repeat scroll 0 0;

	clear: both;

/*	color: #53006F; dark purple */

	color: #08088A; /* dark green */

	display: block;

	float: none;

	height: 125px;

	padding: 0.625em 0;

	text-align: center;

	width: 100%;

}

.day {

	font-size: 2.5em;

	font-weight: 700;

}

.month, .year {

	font-size: 0.85em;

}

.news-text {

	background: #fff none repeat scroll 0 0;

/* 	border-bottom: 1px solid #e0e0e0; light purple

*	border-right: 1px solid #e0e0e0;

*	border-top: 1px solid #e0e0e0;

*/

	border-bottom: 1px solid #C1EDB6; /* light green */

	border-right: 1px solid #C1EDB6;

	border-top: 1px solid #C1EDB6;



	height: 125px;

	padding: 0.625em 1.25em;

}

.news-text p {

	color: #000000;

	font-size: 0.95em;

}

#contact {

	background: none repeat scroll 0 0 #fff;

	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);

	padding: 6em 2em;

	position: relative;

	z-index: 2;

}

#contact input, #contact textarea {

	background: none repeat scroll 0 0 rgba(0, 0, 0, 0);

	border-radius: 3px;

}







form.customform button.color-btn {

	height: auto;

	margin-top: 0;

}

#contact h2 {

	margin: 0 0 1.25em;

}

#contact h3 {

	color: #08088A;

	font-size: 1em;

	font-weight: 700;

	margin: 0 0 0.625em;

	text-transform: uppercase;

}

#contact p {

	font-size: 0.85em;

	font-style: normal;

	line-height: 2em;

}

#contact p strong {

	font-weight: 700;

}

#contact i {

/*	background: #e0e0e0 none repeat scroll 0 0; light purple */

	background: #C1EDB6 none repeat scroll 0 0; /* light green */

	

	border-radius: 30px;

	color: #fff;

	display: inline-block;

	line-height: 26px;

	margin: 0.625em;

	text-align: center;

	width: 26px;

}

#map-block {

  filter: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="g"><feColorMatrix type="matrix" values="0.3 0.3 0.3 0 0 0.3 0.3 0.3 0 0 0.3 0.3 0.3 0 0 0 0 0 1 0"/></filter></svg>#g');

  -webkit-filter: grayscale(100%);

  filter: grayscale(100%);    

  filter: progid:DXImageTransform.Microsoft.BasicImage(grayScale=1);

}

/*

** background 2A2A2A = near black -> now D8F6E5 = light green

** text       BBBBBB = light grey -> dark green  = 134D0D

** 

** 



**

*/

footer {

	background: none repeat scroll 0 0 #ADD8E6; /*D8F6E5;*/

	padding: 3.5em 0;

}

footer p, footer a:visited, footer a, footer a:hover {

	color: #08088A;

	font-size: 0.8em;

}

@media screen and (max-width: 768px) {

  header {

  	position: relative;

  }

  .top-nav li a {

  	background: #888888 none repeat scroll 0 0;

  }

  #carousel .text {

  	font-size: 0.8em;

  	top: 20%;

  }

  .owl-controls.clickable {

  	display: none!important;

  }

  .right {

  	float: none;

  }

  .social.right {

  	float: right;

  }

  #about-us article {

  	padding: 4em 2.5em;

  }

}





@media screen and (max-width: 480px) {

  #topbar {

  	line-height: 1.625em;

  	text-align: center;

  }

  .social.right {

  	float: none;

  }

  p.logo, p.nav-text {

  	text-align: center;

  }

}