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

body 
{
		font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
		margin: 0;
		padding: 0;
		color: #000;
		background:#f2f0f0;
		background:#FFF;
		
		
			
}

/************************* BROWSER RESET ********************/
html, body, div, span, applet, object, iframe, blockquote, pre, h1, h2, h3, h4, h5, h6, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike,  sub, sup, tt, var, b, u, i, center, table, caption, tbody, tfoot, thead, tr, th, 
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video 
{
	margin: 0;
	padding: 0;
	border: 0;

}


/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section 
{
	display: block;
}

form input, form textarea
{
		max-width:100%;
}


img
{
		border:0;
		max-width:100%;
		height:auto;
}



/********************** IMAGE CLASSESSS ******************************/
.float_left
{
		float:left;
		margin:10px;
		border:1px solid #f6f5f5;
		border-radius:8px;

}


/******************************** CONTAINER ***************************/
#container 
{
		width:98%;
		max-width: 1366px;
		margin: 0 auto;
		
}

/*************************MAIN CONTENT ***************************/
#main-content
{
		float:left;
		width:98%;
		margin:0 0 20px 10px;
		
			
}


/********************* HEADER CONTAINER *************************/
#header-container
{
		float:left;			
		width:100%;
		height:auto;
		margin:0;
		padding:0;
		background:#FFF;
		
	
}

#header-container p
{
		margin:0;
		padding:0;
}

#header-container #logo img
{
		width:100%;
		height:auto;
}

/***************** HEADER WRAPPER **********************/
#header-wrapper
{
		width:98%;
		max-width:1366px;
		margin: 0 auto;
}


/***************** LOGO *************************/
#logo
{
		float:left;
		width:40%;
		margin:15px 0 10px 50px;	
}



/***************** SOCIAL MEDIA *************************/
#social-media
{
		float:right;
		width:30%;
		margin:90px 1% 1.5% 50px;
		
		
}



.social-boxes
{
		float:left;
		width:13%;
		margin:10px 0 0 10px;

}



/********************* TOP NAVIGATION ****************************/
#top-nav
{
		float:left;
		width:100%;
		margin:10px 0 0 0;
		padding:8px 0 5px 0;
		background:#cf1a0c;
		
		
		
	
}

/*************** NAV WRAPPER ***************************/
#nav-wrapper
{
		width:98%;
		max-width:1366px;
		margin: 0 auto;
}


/**************************** BANNER CONTAINER **********/
#banner-container
{
		
		width:100%;
		float:left;
		height:auto;
		margin:20px 0 10px 0;
		padding:0;
}


/*********************** LEFT PANEL******* **********/
#left-panel
{		
		width:67%;
		float:left;
		height:auto;
		margin:1% 0 0 0;
		
		
}

#main-content #left-panel h1
{
		margin:0;
		padding:0;
		color:#F03;
		
}

#left-panel p
{
		text-align:justify;
		line-height:190%;
		padding:0 1% 0 1%;
}

#main-content #left-panel ul
{
		text-align:justify;
		line-height:190%;
		list-style-image:url(../images/146.gif);
		
}

/*********************** CONTENT ******* **********/
#content
{		
		width:98%;
		float:left;
		height:auto;
		margin:15px 0 15px 10px;
	
		
		
		
}

#main-content #content h1
{
		margin:0;
		padding:0 0 0 10px;
		color:#F03;
		
}


#main-content #content h2
{
		margin:0;
		padding:10px 0 0 10px;
		color: #999;
		
}

#content p
{
		text-align:justify;
		line-height:190%;
		padding:0 1% 0 1%;
}

#content ul
{
		text-align:justify;
		line-height:190%;
		list-style-type:circle;
	
}

/**************** STATIC BANNER ********************/
#static-banner
{
		width:98%;
		float:left;
		height:auto;
		margin:15px 0 15px 10px;
	
		
}

#static-banner p
{
		margin:0;
		padding:0;
}
		

/**************** SERVICES CONTAINER *****************/
#services-container
{
		float:left;
		width:100%;
		margin:10px 0 20px 0;
		background:#FC0;
		padding-top:10px;
		background: -webkit-linear-gradient(#f9ca0e, #b33550); /* For Safari 5.1 to 6.0 */
		background: -o-linear-gradient(#f9ca0e, #b33550); /* For Opera 11.1 to 12.0 */
		background: -moz-linear-gradient(#f9ca0e, #b33550); /* For Firefox 3.6 to 15 */
		background: linear-gradient(#f9ca0e, #b33550); /* Standard syntax */
		
		
}

/***************** SERVICES WRAPPER **********************/
#services-wrapper
{
		width:98%;
		max-width:1366px;
		margin: 0 auto;
}

/********************** SERVICES **************************/
.services
{
		float:left;
		width:23%;
		height:auto;
		margin:10px  10px 0 0;
	


		
}

.services img
{
		width:100%;
		height:auto;
		max-width:100%;
}

#services-container .services h2
{
		
		
		text-align:center;
		text-transform:uppercase;
		font-size:20px;
		margin-top:20px;
		color:#252424;
	
}

.services p
{
		font-size:13px;
		padding-left:10px;
		padding-right:10px;
		text-align:left;
		line-height:190%;
}


.services ul
{
		
		line-height:30px;
		list-style-type:circle;
}


p.readmore
{
		padding-left:25px;
}



/*************************** RIGHT CONTENT ***************************/
#right-content
{
		float:right;
		width:30%;
		height:auto;
		padding-bottom: 10px;
		margin:20px 0 2% 1%;
		
		
}

#right-content p
{
	margin-left:10px;
}

#right-content h2
{
		color:#000;
}

		
/**************** NEWS CONTENT **********************/
#news-content
{
		float:left;
		width:98%;
		margin:1% 1% 1.5% 1%;
		border:3px solid #6a6969;
		border-radius:8px;
	   background:url(../images/newsbg.jpg);
	   	
}

#right-content #news-content h2
{
	text-align:center;
	padding-top:10px;
}

/************** label class********************/
#request-quote .quote
{
		width:90%;
		height:14px;
		float:left;
		margin:0px 0 0 10px;
		padding:9px 0 9px 0;
		font-family: Arial;
		font-size:18px;
		color:#000;
		text-align:center;
		
}

#request-quote textarea
{
		width:90%;
		height:100px;
		margin:0px 0 0 10px;
}

	
/******************* INPUT CLAASSS**************/
#request-quote .quoteinput
{
		width:90%;
		height:23px;
		float:left;
		margin:0px 0 0 10px;
		padding:0px;
		font-family: Arial;
		
		
}
	

#request-quote .button input
{
		margin:20px 0 20px 20px;
		float:left;
		width:40%;
		background: #000;
		font-size:16px;
		color:#FFF;
		font-weight:bold;
		border-radius:8px;
		height:30px;
}

/***************** PRODUCTS PAGE ***********************/
#products-left
{		
		width:40%;
		float:left;
		height:auto;
		margin:10px 10px 0 0;
	
		
		
}

#products-right
{		
		width:50%;
		float:left;
		height:auto;
		margin:10px 0 0 30px;
		
		
		
}


td.pro-text
{
		padding-left:50px;
}


/********************* CONTACT PAGE*******************/
#contact-address
{
		float:left;
		width:47%;
		height:auto;
		margin:10px 0 10px 10px;
	
		
}

#contact-address p.con-address
{
		background-image: url(../contact/images/address.png); 
		background-repeat:no-repeat;
		background-position:left;
		height:68px;
		padding-left:70px;
		
}

#contact-address p.con-email
{
		background-image: url(../contact/images/email.png); 
		background-repeat:no-repeat;
		background-position:left;
		height:64px;
		padding-left:70px;
		
}

#contact-address p.con-mobile
{
		background-image: url(../contact/images/mobile.png); 
		background-repeat:no-repeat;
		background-position:left;
		height:60px;
		padding-left:70px;
		
}

/*************** CONTACT FORM**********************/
#contact-form
{
		float:left;
		width:50%;
		height:auto;
		margin:10px 0 10px 10px;
		border-radius:8px;
		padding-top:10px;
		background:#FC0;
		background: -webkit-linear-gradient(#f9ca0e, #b33550); /* For Safari 5.1 to 6.0 */
		background: -o-linear-gradient(#f9ca0e, #b33550); /* For Opera 11.1 to 12.0 */
		background: -moz-linear-gradient(#f9ca0e, #b33550); /* For Firefox 3.6 to 15 */
		background: linear-gradient(#f9ca0e, #b33550); /* Standard syntax */
		
}


#contact-form label.con-label
{
		display:block;
		width:35%;
		float:left;
		font-size:16px;
		color: #000;
		font-weight:bold;
		margin-left:20px;
				
}

#contact-form input.con-input
{		width:55%;
		float:left;
		height:30px;
		border-radius:8px;
		background:#FFF;
		margin:0 0 10px 0;
		
}

#contact-form textarea
{		width:55%;
		height:100px;
		border-radius:8px;
		margin-top:10px;
		
}


#contact-form .button input
{
		background: #FC0;
		font-size:16px;
		color: #000;
		font-weight:bold;
		border-radius:8px;
		height:30px;
		width:20%;
		margin-bottom:20px;
		margin-left:250px;
		cursor:pointer;
		
		
}

#contact-form .button input:hover
{
		color:#FFF;
		background: #F00;
}


/********************************* FOOTER *****************************/
#footer-content
{
		float:left;
		padding:0;
		width:100%;
		margin:0;
		background:#cf1a0c;
		border-top:1px solid #666;
	  	
		
}

#footer-wrapper
{
		width:98%;
		max-width:1366px;
		margin: 0 auto;
}

#footer-content h3
{
		color: #000;
		padding-left:2%;
		font-size:20px;
}


#footer-content p
{
		
		color:#FFF;
		font-weight:bold;
		margin:0 0 10px 0;
}


#footer-content a
{
			color:#FFF;
			text-decoration:none;
}


#footer-content a:hover
{
		color: #FC0;
		text-decoration:underline;
}


/****************** CONTACT INFO *********************/
#contact-info
{
		float:left;
		width:50%;
		margin:20px 1% 1.5% 1%;
				
}


p.address
{
		background-image:url(../images/add.png);
		background-repeat:no-repeat;
		background-position:left;
		height:50px;
		padding-left:60px;
		
}


p.email
{
		background-image:url(../images/email-icon.png);
		background-repeat:no-repeat;
		background-position:left;
		height:51px;
		padding-left:60px;
		
}

p.mobile
{
		background-image:url(../images/mob-icon.png);
		background-repeat:no-repeat;
		background-position:left;
		height:50px;
		padding-left:60px;
}

/****************** CONTACT NUMBERS *********************/
#contact-numbers
{
		float:left;
		width:45%;
		margin:20px 1% 1.5% 1%;
				
}

#contact-numbers p
{
		font-size:20px;
		
}



/******************** FOOTER LINKS *****************/
#footer-links
{
		float:left;
		width:100%;
		margin:0;
	
				
			
}

#footer-content #footer-links p
{
		
		color:#FFF;
		font-size:10px;
		padding-left:10px;
		padding-top:10px;
}


/********* MEDIA QUERIES  768px.*********************/
@media only screen and (max-width: 768px) 
{

#phone-number p
{
		font-size:18px;
		font-weight:bold;
		margin:0 0 10px 0;
}

/********************** SERVICES **************************/
.services
{
		float:left;
		width:30%;
		height:auto;
		margin:10px  0 1.5% 10px;


		
}

#services-container .services h2
{
		font-size:18px;
	
}



}