body { 
background:#1a2867; background-image: url('../bkg.jpg'); background-repeat: repeat;
margin:0px auto; 
padding-top:10px; text-align:center;
} 
 



#wrapper {  
width:1100px; 
margin:0px auto; 
background: #fff;
border:1px solid #000; 
padding:0px;  
background:#c2d0e0; background-image: url('../textbkg.jpg'); background-repeat: repeat;
-khtml-border-radius: 20px;  
border-radius: 20px;	
-moz-border-radius: 20px; 	-webkit-border-radius: 20px;
}

  
  
/* menu */
   
 

 
/* Clearfix */
.catmenu:before,
.catmenu:after {
    content: " ";
    display: table;
}
.catmenu:after {
    clear: both;
}
.catmenu {
    *zoom: 1; 
}


nav {
   
	background: #11417a;
	position: relative;  border-top: 1px solid #fff;
}


nav ul {  max-width:790px;
   height:23px; 
  text-align:center; 
  list-style:none;  
  margin:0px auto; padding:5px 0px 2px 0px; 
  background:transparent; width:100%;  
}


nav li { 
	float: left; display:inline-block;
  margin:0px; padding:0px; 
  text-align:center;   
}


nav a {
	color: #fff;  float:left;
	display: inline-block; 
	text-decoration: none;
	 
}

 *:first-child+html nav li { float:left; } * html nav li { float:left;} 


nav li a {
	  display:inline-block; 
   /* let's work in round numbers */ 
  margin:0px;
  padding:0px 3px 0px 3px; /* pad top to center text in button */
  color: #fff;   
  font:bold 12px  verdana, arial,sans-serif; /* can now use different, but similar fonts */
  background:transparent;  
  text-decoration:none; border-right:1px solid #fff;
}


nav li:last-child a {
	border-right: 0;
}
 

nav a#pull {
	display: none;  font:bold 12px  "arial", "gillsans",  "gill sans mt",san-serif;  
	padding:0px 0px 3px 1px; margin:2px 0px 0px 0px;
}


  

/* fiddle with widths to look nicer */
nav li.m1 a {
  width:220px;  
  border: 0; display:block;
}
 
nav li.m2 a {
  width:100px;  
  border: 0;  display:block; 
}

nav li.m3 a  {
  width:150px;  
  border: 0;  display:block;  
}
 
nav li.m4 a  {
  width:130px;  
  border: 0;  display:block; 
}

nav li.m5 a  {
  width:160px;  
  border: 0;  display:block;  
}

nav li.m6 a {
  width:90px;   
  border: 0;  display:block; 
}

 
nav li.m7 a {
  width:170px;  
   border: 0;  display:block;  
}
 
nav li.m8 a  {
  width:140px;   
  border: 0;  display:block; 
}
 
nav li.m9 a  {
  width:120px;   
  border: 0;  display:block; 
}
 
nav li.m10 a  {
  width:90px;   
  border: 0;  display:block; 
}
 
nav li.m11 a  {
  width:70px;   
  border: 0;  display:block; 
}
 

    
 /* finish hover and active styling */
nav li a:hover,
nav li a:visited:hover,
nav li a#current:hover,
nav li a#current:visited:hover {
  background:transparent;
  color:#ffef37;  text-decoration:underline; 
}
nav li a#current,
nav li a#current:visited { 
  color:#ffef37;  background:transparent; 
 text-decoration:none;  
}  
 
 
    


#logobox {  text-align: center;
  margin:  10px; padding: 0px; height:118px;
  max-width:100%;  background:transparent  ; 
    
} 

#logo {  float:left; text-align:left;  
  margin: 5px; padding: 0px 0px 2px 5px;
 background:transparent  ; 
  max-width:100%; border:none;border:0px;
}
  
 #socialmedia { float:right;
margin: 0px  0px  0px  0px; 
padding: 0px;border: 0px solid #000;   max-width:100%;
}

#logoaddress {   float:right; 
 text-align: right;
  font: normal 13px verdana, helvetica, sans-serif;
  margin:  0px 10px 10px 0px;
 padding:0px 0px 10px 0px;   color: #000;
 background: transparent; max-width:100%; line-height:16px;  
}
   
#logoaddress1 { 
 text-align: center;
   font: normal 13px verdana, helvetica, sans-serif;
  margin: 10px auto; padding:  0px;
 background:transparent;  max-width:100%;
} 

   
 
#bigtext {   
  font: bold 15px verdana, helvetica, sans-serif;
  margin: 5px auto;
 padding:0px;   color: #000;
 background: transparent; max-width:100%; line-height:18px;
}
 
 

#address {
 text-align: center;
font: bold 19px Myriad Web, Emblem, san-serif;   
 margin:0px auto; letter-spacing: 0.5px;
 padding:3px 0px 0px 0px;    color: #262567; 
 background: transparent; max-width:100%;
}
 

 #address1 { 
text-align:center; 
color: #000000;
font: normal 12px verdana, arial, helvetica, san-serif;
background: transparent; width:99%;
padding:0px 0px 10px 0px;
}
  
 
#address1 a {   color: #0a2c57; text-decoration: underline; }


#address1 a:hover {   color: #0a2c57; text-decoration: none;   }

 
 
     

#temparea {  
   text-align:center; 
  margin:0px auto; padding:0px;  
    background:#fff; 
  max-width:100%;    background:transparent;  
}
 
  
 
#content {    
text-align:center; 
 margin:0px auto; padding:10px 35px;  
  max-width:100%;    background:transparent;  
  
}  
   
   


/* coverpic */

#coverpic { float: right; background:#fff; margin:5px 15px 10px 15px; padding: 0px;background: transparent;
 max-width:100%;}
  
  
h1 {text-align:center; 
font: bold 14px verdana, arial, helvetica, san-serif;  
color: #002e62; 
padding:5px 10px 5px 10px; 
margin: 0px auto; 
background: transparent;}
 

h2 { text-align:center;
font: normal 13px verdana, arial, helvetica, san-serif; 
color: #000000; line-height: 22px;
margin:10px auto;  padding: 0px;
background:transparent;  } 


h3 { text-align:center;
font: normal 12px verdana, arial, sans-serif; 
color: #0a2c57; 
margin:0px ;  padding:5px 0px;
background:transparent;  } 
  
  
h4 { text-align:left;
font: bold 12px verdana, arial, sans-serif; 
color: #292765; 
margin:0px ;  padding:5px 0px;
background:#16304e;  } 


h5 { text-align:center;
font: normal 12px verdana, arial, sans-serif; 
color: #0a2c57; 
margin:0px auto;  padding:10px 0px 5px 0px;
background:transparent;  } 


h6 { text-align:left;
font: bold 13px verdana, arial, sans-serif; 
color: #ffffff; 
margin:15px 0px 0px 0px; padding:2px 0px 2px 5px;
background:#292765;  } 
 


#header { text-align:center;
font: bold 14px verdana, arial, sans-serif;
margin:5px 0px 3px 0px; 
padding:0px; 
color: #292765;
background:transparent;}
  
 

#content ul {  
max-width:98%
margin:0px 0px 0px 30px;  padding: 0px;} 

#content li { text-align:none;

font: normal 12px verdana, arial, sans-serif; 
color: #000000; 
margin:0px auto;  padding:5px 0px 1px 0px;
background:transparent;  } 


.spacer {
width:700px;  
margin : 10px 0px auto;
padding : 0px;
background :#ffffff;
}

  




#suppboxtworowssm { text-align:center;
  width: 130px;  
  margin:0px auto;  
 padding: 0px;    
}


#supplierboxplumb { 
  width: 50px; 
  float: left;   
  margin:5px 10px 0px 3px;  
 padding: 0px;   
}
 
 
 
#supplierboxplumb1 { 
  width: 50px; 
  float: left;   
  margin:5px 0px 0px 3px;  
 padding: 0px;   
}

 
 
#suppboxtworows { text-align:center;
  width: 250px;  
  margin:0px auto;  
 padding: 0px;    
}
  
#supplierboxbed { 
  width: 110px; 
  float: left;   
  margin:5px 10px 0px 3px;  
 padding: 0px;   
}
 
 
 
#supplierboxbed1 { 
  width: 120px; 
  float: left;   
  margin:5px 0px 0px 3px;  
 padding: 0px;        
}
 
#suppbox { text-align:center;
  width: 452px;  
  margin:0px auto;  
 padding: 0px;    
}
 

#supplierbox1 { 
  width: 130px; 
  float: left;   
  margin:5px 20px 0px 3px;  
 padding: 0px; 
}
 
 
#supplierbox2 { 
  width: 130px;  
  float: left;   
  margin:5px 20px 0px 3px;  
  padding: 0px;   
}


#supplierbox3 { 
  width: 120px;  
  float: left;   
  margin:5px  0px 0px 3px;  
  padding: 0px;   
}
  

 
/* Suppliers Links Area */
 
 


#suppboxlink { text-align:center;
  max-width: 705px;  
  margin:0px auto;  
 padding: 0px;      width:100%;   
}
 
 
.supplierboxlink1 h1 { text-align:center;
font: bold 12px verdana, arial, sans-serif; 
color: #fff; 
margin:0px ;  padding:5px;
background:#16304e;  }  



#supplierboxlink1 { 
  width:100%; max-width: 260px;  
  float: left;   
  margin:5px 20px 0px 20px;  
 padding: 10px;   
}
  
  

  
 #imageleft { float:left;
margin:5px 10px 10px 0px; 
padding: 0px; 
background: transparent;  max-width:100%;
}

 #imageright { float:right;
margin:10px 10px 10px 20px; 
padding: 0px;border: 0px solid #000;   max-width:100%;
}
 
  #imagecenter { text-align:center;
margin:5px 0px 10px 0px; 
padding: 0px;
background: transparent;  max-width:100%;
}

 .imageleft { float:left;
margin:5px 10px 10px 0px; 
padding: 0px;
background: transparent;  max-width:100%;
}




#imagerightshow { float:right;
margin:5px 0px 10px 10px; 
padding: 0px; 
}
 
  

 
.imagearea { text-align:center; 
  padding: 10px 0px; margin: 0px auto; 
}


.tabtextbold {  text-align:left; font: bold 11px verdana, arial, sans-serif; 
margin: 0px; padding:3px 0px 3px 5px;  color: #000000; background:transparent;  }

.tabtext {  text-align:left; font:normal 11px verdana, arial, sans-serif; 
margin: 0px; padding:3px 15px 3px 5px;  color: #000000; background:transparent; }

.tabtextblbkg {  text-align:left; font: bold 11px verdana, arial, sans-serif; 
margin: 0px; padding:3px 0px 3px 5px;  color: #fff; background:#292765;  }
 

.tabtextlgtbkg {  text-align:left; font: bold 11px verdana, arial, sans-serif; 
margin: 0px; padding:3px 0px 3px 5px;  color: #000; background:#e3e2fc;  }
  
  
 
.center { text-align:center; 
padding:0px; 
margin: 0px auto; }


#center { text-align:center; 
padding:0px; 
margin: 0px auto; }


#return { clear:both;  text-align:center; font: normal 10px verdana, arial, helvetica, san-serif;  color: #000000; padding: 10px 0px 10px 0px;   cursor: pointer; background: transparent;}

#return a {
color: #000000;
text-decoration: underline;
}
 
#return a:hover {
color: #0a2c57;
text-decoration: none;
}

 

#navbottom {  
text-align:center; 
border-top: 1px solid #262e71; 
border-bottom: 1px solid #262e71; 
color: #000000;
font: normal 11px verdana, arial, helvetica, san-serif; 
text-decoration: none;
cursor: pointer;
background: transparent;
margin: 10px auto 10px auto; padding: 10px 0px 10px 0px;
max-width:100%;  
}

#navbottom a { color: #000000; text-decoration: none; background:transparent; 
}
 
#navbottom a:hover { color: #0a2c57; text-decoration: underline; background:transparent; 
}
 
   
 
#byline { clear:left; text-align:center; font: normal 10px verdana, arial, helvetica, san-serif;  color: #0000a8; background: transparent; 
padding: 10px 0px 10px 0px; margin: 0px auto;}



#byline a { color: #0000a8; background: transparent;  }


#byline a:hover { color: #021730; background: transparent; text-decoration: underline;  }
  
 
#stats { clear:left;
text-align:center; 
font: normal 10px verdana, arial, helvetica, san-serif; 
color: #021730;
padding: 10px 0px 10px 0px; margin: 0px auto;
background: transparent;}

  
#tags { width: 900px;
text-align:center;
color: #fff;
font: normal 9px verdana, arial, helvetica, sans-serif;
background-color: transparent;
padding: 920px 0px 0px 0px;
margin:0px auto;}
 

#tags a {
color: #fff;

}

#tags a:hover {
color: #fff;

}
   
  
 table { 
  width: 99%;  margin:0px auto; text-align:center;
  padding:0px;
  border-collapse: collapse; 
}
  

form input[type=text], input[type=url], input[type=email], input[type=password], input[type=tel] { max-width:90%;min-width:90%; 
  display: block;
  margin: 0px; padding:2px;
  width: 100%; height: 15px;
  line-height: 10px;  
border:3px solid #bbb;
}
   

   

form input[type=submit], input[type=reset] { margin: 1px 2px;  
  max-width: 92%;width: 87px; float:left;  }
 
  



/* Responsive iFrame */
 
.responsive-iframe-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0px;
    height: 0; max-width:96%;
     text-align:center; 
     margin:10px auto 20px auto;
}
 
.responsive-iframe-container iframe,  
.vresponsive-iframe-container object, 
.vresponsive-iframe-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

    
 
#callus { 	display: none;   padding:0px; margin:0px;
}
  
 




/* =Responsive (Mobile) Design
-------------------------------------------------------------- */
@media screen and (max-width: 3880px)  and  (min-width: 420px)

{
 
#callus { 	display: none;  padding:0px; margin:0px;
} 
 } 

  

  

 
/* =Responsive (Mobile) Design
-------------------------------------------------------------- */
@media screen and (max-width: 420px) {
  
    
#callus { display: block; width:100%;
 text-align: center;  color: #bfcbe3;
 font: bold 11px verdana, arial, helvetica, sans-serif;
 margin:6px auto; 
 padding:5px;  
 background: #0a2c57;   -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;max-width:95%; 
min-width:95%;
}

#callus a { 
 padding:0px; margin:0px;  color: #fff; text-decoration:none;
 background: transparent;
}
  
 
 #callus a:hover { 
 padding:0px; margin:0px;  color: #fff; text-decoration:none;
 background: transparent; text-decoration: underline;
}
 
 
 
}

  
   
 


/* =Responsive (Mobile) Design
-------------------------------------------------------------- */
@media screen and (max-width: 5880px)  and  (min-width: 780px)

{ 
#logoaddress1 { display: none;  padding:0px; margin:0px;
}  
  
 #socialmediabottom { display: none;  padding:0px; margin:0px;
}  
 } 




 
/* =Responsive (Mobile) Design
-------------------------------------------------------------- */
@media screen and (max-width: 780px) {
  
    


#logobox {  text-align: center;
  margin:  15px 0px 40px 0px; padding: 10px;  
  max-width:100%;  background:transparent;  
} 

#logo { float:none; 
 text-align: center;
  margin: 0px auto; padding: 0px 0px 2px 5px;
 background:transparent  ; 
  max-width:590px;  
}
  
 #logoaddress { display: none;  padding:0px; margin:0px;
}
   
  
#socialmediabottom { float:center;
margin: 0px auto; 
padding: 0px; max-width:100%;background:transparent; 
} 
 
}

  

 
/* =Responsive (Mobile) Design
-------------------------------------------------------------- */
@media screen and (max-width: 625px) {
  
     

#logoaddress1 { 
 text-align: center;
   font: normal 12px verdana, helvetica, sans-serif;
  margin: 10px auto 1px auto; padding:  0px;
 background:transparent;  max-width:100%;
}
 
#logobox {  text-align: center;
  margin:  15px 0px 30px 0px; padding: 10px;  
  max-width:100%;  background:transparent;  
} 
}

   
/* =Responsive (Mobile) Design
-------------------------------------------------------------- */
@media screen and (max-width: 575px) {
  
     
 
#logobox {  text-align: center;
  margin:  15px 0px 28px 0px; padding: 10px;  
  max-width:100%;  background:transparent;  
} 
}

 
/* =Responsive (Mobile) Design
-------------------------------------------------------------- */
@media screen and (max-width: 475px) {
  
     
 
#logobox {  text-align: center;
  margin:  15px 0px 20px 0px; padding: 10px;  
  max-width:100%;  background:transparent;  
} 
}

 
  
    
/* =Responsive (Mobile) Design
-------------------------------------------------------------- */
@media screen and (max-width: 400px) {
  
     
 
#logobox {  text-align: center;
  margin:  15px 0px 28px 0px; padding: 10px;  
  max-width:100%;  background:transparent;  
} 
}

 
/* =Responsive (Mobile) Design
-------------------------------------------------------------- */
@media screen and (max-width: 401px) {
  
    


#logobox {  text-align: center;
  margin:  10px 0px 15px 0px; padding: 0px;  
  max-width:100%;  background:transparent;  
} 
 
 
 
}


 
/* =Responsive (Mobile) Design
-------------------------------------------------------------- */
@media screen and (max-width: 458px) {
  
    

#suppbox { text-align:center;
  width: 100%;  
  margin:0px auto;  
 padding: 0px;    
}
 

#supplierbox1 { 
  width: 100%;  
  float: left;   
  margin:5px 20px 0px 3px;  
 padding: 0px; 
}
 
 
#supplierbox2 { 
   width: 100%;  
  float: left;   
  margin:5px 20px 0px 3px;  
  padding: 0px;   
}


#supplierbox3 { 
 width: 100%;   
  float: left;   
  margin:5px  0px 0px 3px;  
  padding: 0px;   
}
   
}

  

/*Media QUeries styles for screen 880px and lower*/
@media screen and (max-width: 1100px) 

{    

nav ul {  max-width:740px;
   height:23px; 
  text-align:center; 
  list-style:none;  
  margin:0px auto; padding:5px 0px 2px 0px; 
  background:transparent; width:100%;  
}


nav li a {
	  display:inline-block; 
   /* let's work in round numbers */ 
  margin:0px;
  padding:0px 1px 0px 1px; /* pad top to center text in button */
  color: #fff;   
  font:bold 12px  verdana, arial,sans-serif; /* can now use different, but similar fonts */
  background:transparent;  
  text-decoration:none; border-right:1px solid #fff;
}



}

   


/*Media QUeries styles for screen 880px and lower*/
@media screen and (max-width: 1100px) 

{    

 
  
#wrapper {   
  max-width:99%;  
   }
 
   
    
	   
#tags {  display: none;
}
 
 

#stats  { display: none; }

}
 
  
/*Media QUeries styles for screen 810px and lower*/
@media screen and (max-width: 780px) 

{  
  
	nav { 
  		height: auto;  border-top: 0px; border:none; padding:0px; margin:0px;
  	}
  	 
    
  	nav li { 
	float: left;  
  padding:12px 5px 12px 0px; margin:0px;
  color:#fff;
  		width:45%; 
  		position: relative;
		background: transparent;  
  	}
 
 
 
 nav li a { 
  padding:2px 2px 3px 0px; /* pad top to center text in button */  
}


  	
  nav ul {
		display: none;
		height: auto; border-top: 0;padding:0px; margin:0px;
	}
	
	nav a#pull {
		display: block; border-top: 1px solid #fff;
		background-color: #0a2c57;
		width: 100%;
		position: relative;  
		height: 20px;
		 font: bold 13px verdana, arial, helvetica, san-serif; 
		 padding:4px 0px 2px 1px; 
		 margin:0px;
	}
	
	nav a#pull:after {
		content:"";
		background: url('../images/nav-icon.png') no-repeat;
		width: 15px;
		height: 15px;
		display: inline-block;
		position: absolute;
		right: 15px;
		top: 5px;  
	}
	 
nav a#pull:hover { color:#ffe035; 
	  
}
  
  	nav a {
	  	text-align: left;
	  	width: 100%;
	  	text-indent: 10px;
  	}
   


   
   }
   
    
   
   
  
   

/*Styles for screen 580px and lower*/
@media only screen and (max-width: 600px) {

    
 
	nav ul {
  		border:none;
  	}
  	 

  	}
 
 
    
  

/*Styles for screen 510px and lower*/
@media only screen and (max-width: 770px) {

 
    

	#navbottom br { display: none; 
	}
 
 
}


/*Styles for screen 510px and lower*/
@media only screen and (max-width: 590px) {

  
 
#content {    
text-align:center; 
 margin:0px auto; padding:10px 12px;  
  max-width:100%;    background:transparent;  
  
}  
 
 #imageleft { float:none;
margin:0px auto;  text-align: center;  
padding: 0px;border: 1px solid #000;
background: transparent;  max-width:100%;
}

    #imageright { float:  none;
text-align:center;
margin:10px 10px 10px 10px; 
 max-width:100%;
}
 
 
  }
 

/*Styles for screen 510px and lower*/
@media only screen and (max-width: 405px) {

  
	nav li {
  		width: 100%;  max-width: 100%; 
  		float: left;
  		position: relative;
  	}
  	}
  	

/*Smartphone*/

@media only screen and (max-width : 380px) {
 
    
h1 {text-align:center;
	font: bold 13px verdana, arial, helvetica, sans-serif;
	color: #0a2c57;
	padding: 5px 0px 5px 0px; margin:0px;  
}

    
h2 {text-align:center;
	font: normal 12px verdana, arial, helvetica, sans-serif;
	color: #000000;
	padding: 5px 0px; 
    margin:0px;
}

h3 {text-align:center;
	font: normal 12px verdana, arial, helvetica, sans-serif;
	color: #006633;
	padding: 10px 0px 5px 0px;
    margin:0px;
}
  
h4 {text-align:center;
	font: normal 11px verdana, arial, helvetica, sans-serif;
	color: #000000;
	padding: 5px 0px 5px 0px;
    margin:0px;
}
  
h5 {text-align:center;
	font: normal 9px verdana, arial, helvetica, sans-serif;
	color: #000000;
	padding: 5px 0px 5px 0px;
    margin:0px; font-style: italic;
}  

h6 {text-align:left;
	font: bold 12px verdana, arial, helvetica, sans-serif;
	color: #ffffff;
	padding: 5px 0px 5px 0px; margin:0px;
} 


#address {
 margin:0px auto;  
 padding: 0px;    color: #262567; 
 background: transparent; max-width:100%;
}
 


 #address1 { 
text-align:center; 
color: #000000;
font: normal 12px verdana, arial, helvetica, san-serif;
background: transparent; width:98%;
padding:  0px;
margin:0px 0px 10px 0px;
}
   
#address1 a {   color: #0a2c57; text-decoration: underline; }


#address1 a:hover {   color: #0a2c57; text-decoration: none;   }

  
 
	#stats { display: none; 
	}
	
	#tags  { display: none; 
	}
    
    }



