@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
.gridContainer img, .gridContainer object, .gridContainer embed, .gridContainer video {
	max-width: 100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width: 100%;
}
/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		4;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	14;
	dw-gutter-percentage:	15;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/* Mobile Layout: 480px and below. */

.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 90%;
	padding-left: 5%;
	padding-right: 5%;
}
.clearbox {
	display: none;
}
.noclearbox {
	display: block;
}
.video {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#toplogo {
	clear: both;
	float: left;
	margin: 5% 0px 0px 0px;
	width: 100%;
	display: block;
}
#header {
	clear: both;
	float: left;
	margin: 5% 0 5% 0;
	width: 100%;
	display: block;
}
#leftlogo {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: none;
}
#p-01, #p-01ex, #p-02, #p-03, #p-04, #p-05, #p-06, #p-07, #p-08, #p-09, #p-10, #p-11, #p-12, #p-13, #p-14, #p-15, #p-16, #p-17, #p-18, #p-19, #p-20, #p-21, #p-22, #p-23, #p-24, #p-25, #p-26, #p-27, #p-28, #p-29, #p-30, #p-31, #p-32, #p-33, #p-34, #p-35, #p-36,
#copyimage, #copytext, #prodvid {
	margin-bottom: 5%;
}
#p-01, #p-01ex, #p-02, #p-03, #p-04, #p-05, #p-06, #p-07, #p-08, #p-09, #p-10, #p-11, #p-12, #p-13, #p-14, #p-15, #p-16, #p-17, #p-18, #p-19, #p-20, #p-21, #p-22, #p-23, #p-24, #p-25, #p-26, #p-27, #p-28, #p-29, #p-30, #p-31, #p-32, #p-33, #p-34, #p-35, #p-36 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#copyimage {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: none;
}
#copyimage2 {
	display: none;
}
#copytext {
	clear: both;
	float: left;
	margin-left:0;
	width: 100%;
	display: block;
}
#prodvid {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#prodtext {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#prodtext2 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#prodtext3 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#prodtext4 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#lowerline {
	clear: both;
	float: left;
	margin: 5% 0 0 0;
	width: 100%;
	display: block;
}
#footer {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	margin: 5% 0% 5% 0%;
}
#footer-content {
	clear: none;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	border-top: solid 1px #CCC;
}
#homeslider {
	clear: none;
	float: left;
	margin-left: 3.3707%;
	width: 100%;
	display: block;
}
#copyheader {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#copytext1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#copytext2 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#copytext3 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#copytext4 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#newrow {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#indextext,#indextext2,#indextext3,#indextext4 {
	clear: both;
	float: left;
	position:relative;
	display: none;
}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {
.gridContainer {
	width: 98.3695%;
	padding-left: 0.8152%;
	padding-right: 0.8152%;
}
.clearbox {
	display: none;
}
.noclearbox {
	display: block;
}
.video {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#toplogo {
	clear: both;
	float: left;
	margin: 0;
	width: 45.1712%;
	display: block;
	padding: 2%;
}
#header {
	clear: none;
	float: left;
	margin: 0;
	margin-left: 1.6574%;
	width: 45.1712%;
	display: block;
	padding: 2%;
}
#leftlogo {
	clear: both;
	float: left;
	margin-left: 0;
	width: 11.0497%;
	display: none;
}
#p-01, #p-01ex, #p-02, #p-03, #p-04, #p-05, #p-06, #p-07, #p-08, #p-09, #p-10, #p-11, #p-12, #p-13, #p-14, #p-15, #p-16, #p-17, #p-18, #p-19, #p-20, #p-21, #p-22, #p-23, #p-24, #p-25, #p-26, #p-27, #p-28, #p-29, #p-30, #p-31, #p-32, #p-33, #p-34, #p-35, #p-36,
#copyimage, #copyimage2, #copyheader, #prodtext, #copytext, #copytext1, #copytext2, #copytext3, #copytext4,
#prodvid, #homeslider {
	margin: 0;
	padding: 2%;
}
#prodvid {
	clear: both;
	float: left;
	margin-left: 0;
	width: 96%;
	display: block;
}
#p-01, #p-01ex, #p-03, #p-05, #p-07, #p-09, #p-11, #p-13, #p-15, #p-17, #p-19, #p-21, #p-22, #p-23, #p-24, #p-25, #p-26, #p-27, #p-29, #p-31, #p-33, #p-35 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 45.1712%;
	display: block;
}
#p-02, #p-04, #p-06, #p-08, #p-10, #p-12, #p-14, #p-16, #p-18, #p-20, #p-22, #p-24, #p-26, #p-28, #p-30, #p-32, #p-34, #p-36 {
	clear: none;
	float: left;
	margin-left: 1.6574%;
	width: 45.1712%;
	display: block;
}
#p-01ex {
	width: 96%;
}
#copyimage {
	clear: both;
	float: left;
	margin-left: 0;
	width: 19.7569%;
	display: none;
}
#copyimage2 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 19.7569%;
	display: block;
}
#copytext {
	clear: both;
	float: left;
	margin-left: 0;
	width: 96%;
	display: block;
}
#prodtext {
	clear: both;
	float: left;
	margin-left: 0%;
	width: 96%;
	display: block;
}
#prodtext2 {
	clear: none;
	float: left;
	margin-left: 1.6574%;
	width: 100%;
	display: block;
}
#prodtext3 {
	clear: none;
	float: left;
	margin-left: 2%;
	width: 45.1712%;
	display: block;
}
#prodtext4 {
	clear: none;
	float: left;
	margin-left: 5.3148%;
	width: 45.1712%;;
	display: block;
}
#lowerline {
	clear: both;
	float: left;
	margin-left: 1.6574%;
	width: 45.1712%;
	display: block;
	margin-top: 1.8808%;
}
#footer {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	margin: 1.7616% 0% 1.8808% 0%;
}
#footer-content {
	clear: none;
	float: left;
	margin-left: 1.6574%;
	width: 96.3426%;
	display: block;
	border-top: solid 1px #CCC;
}
#homeslider {
	clear: both;
	float: left;
	margin-left: 0;
	width: 96%;
	display: block;
}
#copyheader {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#copytext1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 96%;
	display: block;
}
#copytext2 {
	clear: none;
	float: left;
	margin-left: 1.6574%;
	width: 45.1712%;
	display: block;
}
#copytext3 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 45.1712%;
	display: block;
}
#copytext4 {
	clear: none;
	float: left;
	margin-left: 1.6574%;
	width: 45.1712%;
	display: block;
}
#newrow {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#indextext,#indextext2,#indextext3,#indextext4 {
	margin-right: 2%;
	width: 33%;
	display: block;
}
#indextext {
	margin-top: 35%;
	margin-left: 65%;
}
#indextext2 {
	margin-top: 55%;
	margin-left: 65%;
}
#indextext3 {
	left: 50%;
	margin-left: -150px;
	margin-top: 100px;
	width: 300px;
}
#indextext4 {
	display: none;
}
.logo{
	font-size:1.8em;
}
}

/* Desktop Layout: 769px to a max of 1200px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {
body {
	background-position: top;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
}
.menubg {
	background-position: top;
	background-repeat: repeat-x;
}
.clearbox {
	display: block;
}
.noclearbox {
	display: none;
}
.gridContainer {
	width: 99.0683%;
	max-width: 1200px;
	padding-left: 0.4658%;
	padding-right: 0.4658%;
	margin: auto;
}
.video {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#toplogo {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: none;
}
#header {
	clear: both;
	float: left;
	margin: 0% 0% 1.8808% 0%;
	width: 100%;
	display: block;
}
#leftlogo {
	clear: both;
	float: left;
	margin-left: 0;
	width: 13.4796%;
	min-height: 70%;
	display: block;
}
#toplogo, #header {
	padding: 0;
}
#p-01, #p-01ex, #p-02, #p-03, #p-04, #p-05, #p-06, #p-07, #p-08, #p-09, #p-10, #p-11, #p-12, #p-13, #p-14, #p-15, #p-16, #p-17, #p-18, #p-19, #p-20, #p-21, #p-22, #p-23, #p-24, #p-25, #p-26, #p-27, #p-28, #p-29, #p-30, #p-31, #p-32, #p-33, #p-34, #p-35, #p-36,
#copyimage, #copyimage2, #copyheader, #copytext, #copytext1, #copytext2, #copytext3, #copytext4,
#prodtext, #prodtext2, #prodtext3, #prodtext4, #prodvid, #homeslider {
	padding: 1%;
}
#p-01, #p-01ex, #p-02, #p-03, #p-04, #p-05, #p-06, #p-07, #p-08, #p-09, #p-10, #p-11, #p-12, #p-13, #p-14, #p-15, #p-16, #p-17, #p-18, #p-19, #p-20, #p-21, #p-22, #p-23, #p-24, #p-25, #p-26, #p-27, #p-28, #p-29, #p-30, #p-31, #p-32, #p-33, #p-34, #p-35, #p-36 {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 18.6896%;
	display: block;
}
#p-01ex {
	width: 32.25%;
}
#p-13, #p-17, #p-21, #p-25, #p-29, #p-33 {
	margin-left: 14.42%;
}
#copyimage {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 18.6896%;
	display: block;
}
#copyimage2 {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 18.6896%;
	display: block;
}
#copytext {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 83.5799%;
	display: block;
}
#prodvid {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	margin-top: 0.9404%;
	width: 40.3197%;
	display: block;
}
#prodtext {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 40.3197%;
	display: block;
}
#prodtext2 {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 40.3197%;
	display: block;
}
#prodtext3 {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 18.6896%;
	display: block;
}
#prodtext4 {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 18.6896%;
	display: block;
}
#lowerline {
	clear: both;
	float: left;
	margin-left: 14.42%;
	width: 42.3197%;
	display: block;
	margin-top: 0%;
}
#footer {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	margin: 1.7616% 0% 1.8808% 0%;
}
#footer-content {
	clear: both;
	float: left;
	margin-left: 14.42%;
	width: 85.5799%;
	display: block;
	border-top: solid 1px #CCC;
}
#homeslider {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 83.5799%;
	display: block;
	margin-top: 4.702%;
}
#copyheader {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 61.9498%;
	display: block;
}
#copytext1 {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 40.3197%;
	display: block;
}
#copytext2 {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 40.3197%;
	display: block;
}
#copytext3 {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 33.1097%;
	display: block;
}
#copytext4 {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 25.8996%;
	display: block;
}
#newrow {
	clear: none;
	float: left;
	margin-left: 0.9404%;
	width: 85.5799%;
	display: block;
}
#indextext {
	margin-left: 60%;
	margin-right: 5%;
	margin-top: 20%;
	margin-bottom: auto;
	width: 35%;
}
#indextext2 {
	margin-left: 67.5%;
	margin-right: 2.5%;
	margin-top: 32.5%;
	margin-bottom: auto;
	width: 30%;
}
#indextext3 {
	left: 50%;
	margin-left: -150px;
	margin-top: 100px;
	width: 300px;
}
#indextext4 {
	display: block;
	margin-left: 70%;
	margin-right: 5%;
	margin-top: 20%;
	margin-bottom: auto;
	width: 35%;
}
.logo{
	font-size:1.8em;
	letter-spacing: 0.45em;
}
}
@media print, screen and (max-width: 6000px) {
.rhwd {
	display:none;
}	
}

/* for all screens */
#workprog,#workicon {
	display:none;
}
#workprog {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0; 
	background-color:#333;
	z-index:1000;
	opacity: 0.85;
}
#workicon {
	width: 70px;
	height: 70px;
	position: absolute;
	left: 50%;
	top: 50%; 
	margin-left: -35px;
	margin-top: -35px;
	z-index:1001;
	background-image:url(../_images/rotate.png);
	background-size: 70px 70px;
	background-repeat:no-repeat;
}

/* only when orientation is in portrait mode */
@media all and (orientation:portrait) {
#workprog,#workicon {
	display:block;
	-webkit-transition: opacity 1s ease-in;
    -moz-transition: opacity 1s ease-in;
    -o-transition: opacity 1s ease-in;
    -ms-transition: opacity 1s ease-in;
    transition: opacity 1s ease-in;
}
}
@media all and (orientation:landscape) {
#workprog,#workicon {
	display:none;
	-webkit-transition: opacity 1s ease-in;
    -moz-transition: opacity 1s ease-in;
    -o-transition: opacity 1s ease-in;
    -ms-transition: opacity 1s ease-in;
    transition: opacity 1s ease-in;
}
}
