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

body 
{
			font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
			margin: 0;
			padding: 0;
			color: #000;
			background:#FFF;
			background: url(../images/content.gif);
			
			
}

/************************* BROWSER RESET ********************/
html, body, div, span, applet, object, iframe, blockquote, pre, h1, h2, h3, h4, h5, ul, li, 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;
}

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



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



/********************** IMAGE CLASSESSS ******************************/
.float_left
{
		float:left;
		margin:10px;
		
}

.float_right
{
		float:right;
		margin:10px;
		

}


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

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

#main-content h1
{
		color:#8C001A;
}


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

#header-container a
{
		color:#FFF;
}


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


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


/****************** LOGO*****************************/
#logo
{
		float:left;
		width:33%;
		margin:2% 1% 0 1%;
			
}

/******************MGL BANNER *********************/
#mgl-banner
{
		float:left;
		width:36%;
		margin:10px 0 0 10px;
		font-size:18px;
		color:#330033;
		font-weight:bold;
			
}

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

/********************MY PHONE *********************/
#my-phone
{
		float:right;
		width:25%;
		margin:40px 0 1% 2%;
		font-size:15px;
		color:#FFF;
		font-weight:bold;
		background:#609;
		border-radius:8px;	
}


#my-phone #call
{
		margin:0 0 0 5px;
		padding:20px 0 0 60px;
		background-image:url(../images/ph-icon.png);
		background-position:left;
		background-repeat:no-repeat;
		height:52px;
}




/********************* TOP NAVIGATION ****************************/
#top-nav
{
		float:left;
		width:100%;
		margin:5px 0 0 0;
		background:#63C;
		border-bottom:5px solid #d1b4f9;
			
}


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



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

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

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

#static-banner img
{
		width:100%;
		height:auto;
}

/*************** SERVICES CONTAINER*****************/
#services-container
{
		float:left;
		width:100%;
		height:auto;
		margin:1% 0 1.5% 0;
		padding:10px 0 10px 0;
	
			
}

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



/********************** SERVICES **************************/
#services-container .services
{
		float:left;
		width:47%;
		height:auto;
		margin:10px 10px 10px  10px;
		
}


#services-container h2
{
	
		color:#63C;
		border:2px solid #CCC;
		background:#d1b4f9;
		text-align:center;
		border-radius:8px;
		padding:5px 0 5px 0;
	
		
}

#services-container .services h3
{
		color:#5a4073;
		text-align:center;
		font-size:16px;
		padding-bottom:10px;
}

#services-container .services a
{
		color:#5a4073;
		text-decoration:none;
		
}

#services-container .services a:hover
{
		color:#069df4;
		text-decoration:underline;
		
}

#services-container p
{
		font-size:13px;
		line-height:25px;
		text-align:justify;
	
		
}



/*************** CONTENT *****************/
#content
{
		float:left;
		width:100%;
		height:auto;
		margin:1% 0 1.5% 0;	
}

#content h1
{
		color:#4f256d;
		padding-top:10px;

	
		
}

#content h2
{
		padding-top:20px;

}

#content h3
{
		padding-top:20px;

}

#content p
{
		line-height:30px;
		text-align:justify;
		padding-right:10px;
}

#content ul
{
		line-height:30px;
		text-align:justify;
		list-style-image:url(../images/058.gif);
		padding:20px;
}



/***************** WELCOME MESSAGE****************/
#welcome-message
{
		float:left;
		width:100%;
		margin:10px 0 0 0;
		
			
		
}

#content #welcome-message h1
{
		color:#4f256d;
		background-color:inherit;
		padding:0;
		
}

#welcome-message p
{
		line-height:30px;
		text-align:justify;
		padding-right:10px;
}


/**************** PORTFOLIO PAGE *****************/
#content span.quote
{
		font-style:italic;
		font-weight:bold;
		color:#609;
		text-align:center;
}


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

#contact-address p.c-address
{
		background-image:url(../contact/images/box-icon.png);
		background-repeat:no-repeat;
		background-position:left;
		height:52px;
		padding-left:60px;
}

#contact-address p.c-mobile
{
		background-image:url(../contact/images/mob-icon.png);
		background-repeat:no-repeat;
		background-position:left;
		height:52px;
		padding-left:60px;
		padding-top:10px;
}

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


#contact-form
{
		float:left;
		width:51%;
		height:auto;
		margin:10px 0 10px 10px;
		padding:10px;
		background:#609;
		border-radius:8px;
		color:#FFF;
		background: -webkit-linear-gradient(#6b03cc, #e0c5fa); /* For Safari 5.1 to 6.0 */
		background: -o-linear-gradient(#6b03cc, #e0c5fa); /* For Opera 11.1 to 12.0 */
		background: -moz-linear-gradient(#6b03cc, #e0c5fa); /* For Firefox 3.6 to 15 */
		background: linear-gradient(#6b03cc, #e0c5fa); /* Standard syntax */
}

.submit
{
		cursor:pointer;
	
}

.submit:hover
{
		background:#63F;
		color:#FFF;

}

/***************** SERVICES PAGE ********************/
#content h2#silver
{
		background-image:url(../services/images/silverbg.png);
		background-repeat:no-repeat;
		background-position:left;
		height:28px;
		padding-left:40px;
		font-size:20px;
}

#content h2#bronze
{
		background-image:url(../services/images/bronze.png);
		background-repeat:no-repeat;
		background-position:left;
		height:28px;
		padding-left:40px;
		font-size:20px;
}

#content  h2#gold
{
		background-image:url(../services/images/golbg.png);
		background-repeat:no-repeat;
		background-position:left;
		height:30px;
		padding-left:40px;
		font-size:20px;
}

#content  h2#platinum
{
		background-image:url(../services/images/platinum.png);
		background-repeat:no-repeat;
		background-position:left;
		height:29px;
		padding-left:40px;
		font-size:20px;
}
		
/*********FOOTER *****************************/
#footer-content
{
		float:left;
		width:100%;
		background:#639;
		margin:0;
		color:#FFF;
			
}

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


/******************** ADDRESS **************************/
#address
{
		float:left;
		width:35%;
		margin:1% 1% 1.5% 1%;
				
}

#address a
{
		
		color:#FFF;
}

#address a:hover
{
		
		color: #F60;
		text-decoration:none;
}

#address p.mgl-address

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

#address p.telephone
{
		margin:0 0 0 0;
		padding:10px 0 0 60px;
		background-image:url(../images/ph-icon1.png);
		background-position:left;
		background-repeat:no-repeat;
		height:50px;
		
}


#address p.mgl-mobile
{
		margin:10px 0 0 0;
		padding:10px 0 0 60px;
		background-image:url(../images/ph-icon.png);
		background-position:left;
		background-repeat:no-repeat;
		height:52px;
		
}

#address p.myemail

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

/******************* FREE QUOTE ********************/
#free-quote
{
		float:left;
		width:35%;
		margin:1% 1% 1.5% 2%;
						
}

#free-quote a
{
		color:#FFF;
}

table.mgl-quote input
{
		padding:10px;
		margin-bottom:5px;
}

/******************* SOCIAL MEDIA ********************/
#social-media
{
		float:left;
		width:23%;
		margin:10px 0 1.5% 10px;
}


.social-boxes
{
		float:left;
		width:20%;
		margin:10px 0 1.5% 10px;
					
}



/********************************* FOOTER *****************************/
#footer-links
{
		padding:0;
		width:100%;
		margin:0;
		float:left;
		border-top:5px solid #5f319e;
		background:#d1b4f9;
			
			
}

#footer-links p
{
		font-size:12px;
		padding-left:10px;
		padding-right:10px;
}

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

#footer-links a:hover
{
		color: #639;
		text-decoration:underline;
}



/********* TABLET LAYOUT 768px*********************/
/**************************************************/
@media only screen and (max-width: 768px) 
{
#top-banner #call
{		float:left;
		width:30%;
		margin:0 0 10px 0;
		padding:20px 0 0 60px;
		background-image:url(../images/ph-icon.png);
		background-position:left;
		background-repeat:no-repeat;
		height:50px;
		font-size:13px;
}

#top-banner #fax
{
		float:left;
		width:30%;
		margin:0 0 0 10px;
		padding:20px 0 0 60px;
		background-image:url(../images/fax-icon.png);
		background-position:left;
		background-repeat:no-repeat;
		height:50px;
		font-size:13px;
}


/********************** SERVICES **************************/
#services-container .services
{
		float:left;
		width:45%;
		margin:2% 1% 1.5% 0.5%;
}


.services h2
{
		font-size:18px;
		text-align:center;
		margin:4% 0 0 5%;
		padding-top:3px;
}



}