@charset "utf-8";
/* MNB Advertising Website CSS Document */




/* ========================================================================== */
/* ==================== Reset Styles for This Site Starts =================== */


* 		{ margin: 0px; padding: 0px;}

body 	{ background-color: #fff; line-height: 1.2; font-weight: 200; word-spacing: normal; }

h1, h2, h3, h4, h5, h6 { font-family: ; color: #222; font-weight: normal; word-spacing: normal; }

p		{ font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 1.25; font-weight: 200; word-spacing: normal; }

ul 		{ font-family: Arial, Helvetica, sans-serif; font-size: 14px; list-style: none; }

li 		{ font-family: Arial, Helvetica, sans-serif; font-size: 12px; list-style: none; line-height: 1.6; }

a 		{ font-family: Arial, Helvetica, sans-serif; color: #555; text-decoration: none;  line-height: 1.2;}

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

img 	{border: none !important;}


/* ==================== Reset Styles for This Site Closed =================== */

/* ================ Predifined Classes for This Site Starts ================= */


/* -- Font Families -- */
.hel-cd-m {font-family: 'helvetica_condensedmedium';}
.beb-re {font-family: 'bebasregular';}
.beb-ne-re {font-family: 'bebas_neueregular';}
.bon-li {font-family: 'bonvenocflight';}
.arial {font-family: Arial, Helvetica, sans-serif;}


/* -- Font Sizes -- */
.f48 {font-size: 48px; text-transform: uppercase;}
.f30 {font-size: 30px; line-height: 1.35;}
.f28 {font-size: 28px;}
.f24 {font-size: 24px;}
.f22 {font-size: 22px;}
.f18 {font-size: 18px;}
.f16 {font-size: 16px;}
.f15 {font-size: 15px;}
.f14 {font-size: 14px;}
.f13 {font-size: 13px;}
.f12 {font-size: 12px; line-height: 1.2;}
.f11 {font-size: 11px; line-height: 1.2;}
.f10 {font-size: 10px; line-height: 1.2;}


/* -- Line Heights -- */
.lin-1h2 {line-height: 1.2;}
.lin-1h25 {line-height: 1.25;}
.lin-1h3 {line-height: 1.3;}
.lin-1h35 {line-height: 1.35;}
.lin-1h4 {line-height: 1.4;}
.lin-1h45 {line-height: 1.45;}
.lin-1h5 {line-height: 1.5;}


/* -- Font Colors -- */
.red {color: #da1628;}
.grn {color: #6eaa24;}
.blk-6 {color: #666;}
.gry {color: #999;}
.wit {color: #efefef;}
.blk {color: #444;}
.yel {color: #feef04;}
.bfb {color: #bfbfbf;}


/* -- Text Align -- */
.text-l {text-align: left;}
.text-r {text-align: right;}
.text-c {text-align: center;}
.text-j {text-align: justify;}


/* -- Text Transform -- */
.text-tr {text-transform: uppercase;}



/* -- Background Colors -- */
.bg-red {background-color: #da1628;}
.bg-grn {background-color: #6eaa24;}
.bg-gry {background-color: #999;}
.bg-wit {background-color: #fff;}
.bg-dgr {background-color: #324041;}
.bg-efe {background-color: #efefef;}
.bg-dfd {background-color: #dfdfdf;}
.bg-cfc {background-color: #cfcfcf;}
.bg-f9f {background-color: #f9f9f9;}


/* -- Margins & Padding -- */
.mar-pad-10 {margin: 10px; padding: 10px;}
.center { margin:0 auto !important;}


/* -- Margins -- */
.mar-20 {margin: 20px;}
.mar-10 {margin: 10px;}

.mar-top-10 {margin-top: 10px;}
.mar-bot-10 {margin-bottom: 10px;}
.mar-lft-10 {margin-left: 10px;}
.mar-rit-10 {margin-right: 10px;}

.mar-top-20 {margin-top: 20px;}
.mar-bot-20 {margin-bottom: 20px;}
.mar-lft-20 {margin-left: 20px;}
.mar-rit-20 {margin-right: 20px;}

.mar-top-40 {margin-top: 40px;}
.mar-bot-40 {margin-bottom: 40px;}
.mar-lft-40 {margin-left: 40px;}
.mar-rit-40 {margin-right: 40px;}

.mar-top-60 {margin-top: 60px;}
.mar-bot-60 {margin-bottom: 60px;}
.mar-lft-60 {margin-left: 60px;}
.mar-rit-60 {margin-right: 60px;}

.mar-top-bot-10 {margin: 10px 0 10px 0;}
.mar-lft-rit-10 {margin: 0 10px 0 10px;}

.mar-top-bot-20 {margin: 20px 0 20px 0;}
.mar-lft-rit-20 {margin: 0 20px 0 20px;}

.mar-top-0-bot-20 {margin: 0 0 20px 0;}
.mar-top-20-bot-0 {margin: 20px 0 0 0;}

.mar-top-0-bot-40 {margin: 0 0 40px 0;}
.mar-top-40-bot-0 {margin: 40px 0 0 0;}


/* -- Paddings -- */
.pad-10 { padding: 10px;}
.pad-20 { padding: 20px;}

.pad-top-10 {padding: 10px 0 0 0;}
.pad-bot-10 {padding: 0 0 10px 0;}
.pad-lft-10 {padding: 0 0 0 10px;}
.pad-rit-10 {padding: 0 10px 0 0;}

.pad-top-20 {padding: 20px 0 0 0;}
.pad-bot-20 {padding: 0 0 20px 0;}
.pad-lft-20 {padding: 0 0 0 20px;}
.pad-rit-20 {padding: 0 20px 0 0;}


.pad-top-bot-10 {padding: 10px 0 10px 0;}
.pad-top-bot-20 {padding: 20px 0 20px 0;}

.pad-lft-rit-20 { padding: 0 20px 0 20px;}



/* -- borders -- */

.bor-red-1px { border: 1px solid #da1628;}
.bor-grn-1px { border: 1px solid #6eaa24;}
.bor-dfd-1px { border: 1px solid #dfdfdf;}
.bor-cfc-1px { border: 1px solid #cfcfcf;}
.bor-gry-1px { border: 1px dotted #999;}
.bor-dgr-1px { border: 1px dotted #324041;}
.bor-blk-1px { border: 1px dotted #000;}

.bor-red-1px-r { border-right: 1px solid #da1628;}
.bor-red-1px-l { border-left: 1px solid #da1628;}
.bor-red-1px-t { border-top: 1px solid #da1628;}
.bor-red-1px-b { border-bottom: 1px solid #da1628;}

.bor-grn-1px-r { border-right: 1px solid #6eaa24;}
.bor-grn-1px-l { border-left: 1px solid #6eaa24;}
.bor-grn-1px-t { border-top: 1px solid #6eaa24;}
.bor-grn-1px-b { border-bottom: 1px solid #6eaa24;}

.bor-dfd-1px-r { border-right: 1px solid #dfdfdf;}
.bor-dfd-1px-l { border-left: 1px solid #dfdfdf;}
.bor-dfd-1px-t { border-top: 1px solid #dfdfdf;}
.bor-dfd-1px-b { border-bottom: 1px solid #dfdfdf;}

.bor-cfc-1px-r { border-right: 1px solid #cfcfcf;}
.bor-cfc-1px-l { border-left: 1px solid #cfcfcf;}
.bor-cfc-1px-t { border-top: 1px solid #cfcfcf;}
.bor-cfc-1px-b { border-bottom: 1px solid #cfcfcf;}

.bor-gry-1px-r { border-right: 1px dotted #999;}
.bor-gry-1px-l { border-left: 1px dotted #999;}
.bor-gry-1px-t { border-top: 1px solid #999;}
.bor-gry-1px-b { border-bottom: 1px solid #999;}

.bor-dgr-1px-r { border-right: 1px dotted #324041;}
.bor-dgr-1px-l { border-left: 1px dotted #324041;}
.bor-dgr-1px-t { border-top: 1px solid #324041;}
.bor-dgr-1px-b { border-bottom: 1px solid #324041;}

.bor-blk-1px-r { border-right: 1px dotted #000;}
.bor-blk-1px-l { border-left: 1px dotted #000;}
.bor-blk-1px-t { border-top: 1px solid #000;}
.bor-blk-1px-b { border-bottom: 1px solid #000;}


/* -- Flots -- */
.fl-l {float: left;}
.fl-r {float: right;}


/* -- Clears -- */
.clear-b {clear:both;}
.clear-l {clear:left;}
.clear-r {clear:right;}
.clear-n {clear:none;}


/* -- Width & Height -- */
.width-ful {width: 100% !important;}
.width-960 {width: 960px !important;}

/* -- Buttons -- */
.button-big {padding: 8px 30px; text-align: center; border-radius: 5px; webkit-border-radius: 5px; moz-border-radius: 5px;}
.button-big:hover { background-color: #da1628; color: #efefef; text-decoration: none;}
/* ================= Predifined Classes for This Site Closed ================= */
/* =========================================================================== */






/* =========================================================================== */
/* ===================== Custom Styles for This Site Srats =================== */


	#wrapper {width: 960px; height: auto; margin: 45px auto !important;}
	#header{width: 960px; height: 125px; float: left;}		
			.logo{width: 511px; height: 101px; margin-top: -8px;}
			.topLinks{width: 449px; height: 20px; text-align: right;}
			.topLinks a:first-child { background-color: #E8283A; color: #fff; padding: 5px 17px; border-radius: 4px;}
			.topLinks a:first-child:hover { background-color: #444;}
			.moreInfo{width: 449px; height: 60px; margin: 1px 0px 0px 0px; text-align: right;}
			
	#mainMenu{width: 960px; height: 84px; margin: 25px 0px; float: left;}
			.item{padding: 28px;}
			
	
	#banner{width: 942px; height: auto; margin: 0 auto 0 0px; float: left;}
	
	/* -- Middle Content Background Div Styles -- */
	.newsBg {width: 100%; height: auto; }
	.borderVerySmall{height: 5px; background: url(../images/colour_bar.gif) repeat-x; width: 100%;}
	.newsSlider{width: 960px; min-height: 25px; height: auto;}
	
	
	/* -- Middle Content Background Div Styles -- */
	.midBg {width: 100%; height: auto; }
	.borderSmall{height: 15px; background: url(../images/colour_bar.gif) repeat-x; width: 100%;}
	.midcontent{width: 960px; min-height: 435px; height: auto;}
	.midcontent h1{ width: 920px; line-height: .7; margin: 45px 20px 10px;}
	
	.midcontent .boxContainer {width: 960px;}
	.midcontent .boxContainer .box01{width: 280px; margin: 0px 20px 10px 20px;}
	.midcontent .boxContainer .box01 h2{width: 280px; height: 43px; margin: 10px 0px 10px 0px; border-bottom: 1px solid #da1628; text-transform: uppercase;}
	.midcontent .boxContainer .box01 p{width: 280px; height: 230px; margin: 15px 0px 20px 0px;}
	
	
	/* -- Middle Content Background Div Styles -- */
	.clientBg {width: 100%; height: auto; }
	.borderSmall{height: 15px; background: url(../images/colour_bar.gif) repeat-x; width: 100%;}
	.clientContent{width: 960px; min-height: 92px; height: auto;}
	
	
	/* -- Footer Content Background Div Styles -- */
	.footerBg {width: 100%; height: auto;}
	.borderBig{height: 30px; background: url(../images/colour_bar.gif) repeat-x; width: 100%;}
	.footer{ width: 960px; min-height: 380px; height: auto;}
	
	
	.footerNav01 {width: 180px; height: 270px;}
	.footerNav02 {width: 256px; height: 270px;}
	.footerNav02 .footerLogo {width: 252px; height: 114px; background: url(../images/footerLogo.png) no-repeat;}
	
	.copyrightsDiv{width: 960px; height: 45px; margin: 10px 0  10px 0;}
	.copyrights{width: auto; height: auto;}
	.builtBy{width: auto; height: auto;}
	.socialIcons{width: auto; height: auto;}
			.facebook{width: 32px; height: 32px; border: none; background: url(../images/facebook-icon.png) no-repeat ; background-size: contain; }
			.twitter{width: 32px; height: 32px; border: none; background: url(../images/twitter-icon.png) no-repeat; background-size: contain;}
	
	/* -- Cookies Content Background Div Styles -- */
	.cookiesBg {width: 100%; height: auto;}
	.cookies{ width: 960px; height: 30px; padding: 15px 0 15px 0;}
	.cookies a{ color: #feef04;}
	.cookies a:hover{color: #fff; text-decoration: underline;}

/* ===================== Custom Styles for This Site Closed ================== */
/* =========================================================================== */



/* =========================================================================== */
/* ================ Custom Styles for Inner Sections Starts ================== */

/* -- Content Section Background Div Styles -- */
.contentSection  {width: 960px; min-height: 405px; height: auto;}
.contentSection .leftArea {width: 650px; min-height: 405px; height: auto;}
.contentSection .leftArea h1 {width: 650px !important; height: 30px;}
.contentSection .leftArea h4 {width: 650px !important; height: auto;}
.contentSection .leftArea .img {width: 650px; height: 260px;}
.contentSection .leftArea ul li { list-style: circle;}

		.leftArea .chairman {width: 650px; min-height: 350px; height: auto;}
		.leftArea .chairman .picture{width: 127px; height: 148px; margin: 3px 20px 0 20px !important; border: 3px solid #6eaa24 !important;}

		.leftArea .teamMember {width: 295px; min-height: 350px; height: auto;}
		.leftArea .teamMember .picture{width: 127px; height: 148px; margin: 20px auto 0 80px !important; border: 3px solid #6eaa24 !important;}
		
		.leftArea .gallery {width: 100%; height: auto; clear: both;}
		
		.leftArea .clientsArea {width: 650px; min-height: 350px; height: auto;}
		.leftArea .clientsArea img{width: 200px; height: 150px; margin: 20px 8px 0px 0px !important; border: 3px solid #cfcfcf !important;}
		.leftArea .clientsArea img:hover{width: 200px; height: 150px; margin: 20px 8px 0px 0px !important; border: 3px solid #666 !important;}
		

.contentSection .leftAreaFull {width: 960px; min-height: 405px; height: auto;}
.contentSection .leftAreaFull h1 {width: 960px !important; height: 30px;}
.contentSection .leftAreaFull h4 {width: 960px !important; height: auto;}

		.leftAreaFull .teamMember {width: 291px; min-height: 350px; height: auto;}
		.leftAreaFull .teamMember .picture{width: 127px; height: 148px; margin: 20px auto 0 80px !important; border: 3px solid #6eaa24 !important;}
		
		
		.leftArea #requestButtonsSection {
				width: 500px; height: 50px; margin: 20px 5px 5px 70px; padding: 5px; border: 1px dotted #cfcfcf; float: left; }
										
				#requestButtonsSection #section01 {
				width: 245px; height: 50px; float: left; }
										
				#requestButtonsSection #section01 p {
					font-family: Arial, Helvetica, sans-serif; font-size: 11px; line-height: 1.2; text-align: center; color: #666; }
										
											
				#requestButtonsSection #section01 p #phone {
					font-family: Arial, Helvetica, sans-serif; font-size: 24px !important; color: #13b4e3 !important; }
										
				#requestButtonsSection #section02 {
					width: 225px; height: 50px; border-left: 1px dotted #cfcfcf; float: left; }
										
				#requestButtonsSection #section02 p span {
					font-family: Arial, Helvetica, sans-serif; font-size: 11px; line-height: 1.2; margin-left: 10px; color: #666; }
										
				#requestButtonsSection #section02 p #arrow {
					font-family: Arial, Helvetica, sans-serif; font-size: 13px; margin-left: 5px; margin-top: -2px; color: #333; }
										
				#requestButtonsSection #section02 p a {
					color: #666 !important; text-decoration: none; }
										
				#requestButtonsSection #section02 p a:hover {
					color: #13b4e3 !important; text-decoration: underline; }
		
		

.contentSection .rightMenu {width: 288px; min-height: 405px; height: auto;}
.contentSection .rightMenu h1 {width: 100%;}
.contentSection .rightMenu .rightMenuHeader {width: 268px; height: auto; font-family: 'bebasregular'; font-size: 24px; color: #efefef; background-color: #da1628; padding: 10px; border-top-left-radius: 5px; border-top-right-radius: 5px; text-align: center; border-bottom: 1px solid #2c2c2c;}
.contentSection .rightMenu .item {width: 253px; height: auto; font-family: 'helvetica_condensedmedium'; font-size: 19px; color: #999; background-color: #324041; padding: 5px 5px 5px 30px; text-align: left; border-top: 1px solid #404e4f; border-bottom: 1px solid #2c2c2c;}
.contentSection .rightMenu .item span {width: 13px; height: 24px; margin: 0px 5px 5px 5px; background: url(../images/right-arrow.png) no-repeat; float: right;}

.contentSection .rightMenu .item:hover {width: 253px; height: auto; font-family: 'helvetica_condensedmedium'; font-size: 19px; color: #da1628; background-color: #324041; padding: 5px 5px 5px 30px; text-align: left; border-top: 1px solid #404e4f; border-bottom: 1px solid #2c2c2c;}

.contentSection .rightMenu .itemActive {width: 268px; height: auto; font-family: 'helvetica_condensedmedium'; font-size: 19px; color: #da1628; background-color: #324041; padding: 5px 15px 5px 5px; text-align: left; border-top: 1px solid #404e4f; border-bottom: 1px solid #2c2c2c;}
.contentSection .rightMenu .itemActive span {width: 13px; height: 24px; margin: -1px 5px 5px 5px; background: url(../images/left-arrow.png) no-repeat; float: left;}

.contentSection .rightMenu .itemLast {width: 288px; height: 8px !important; background-color: #da1628; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top: 1px solid #fd3a4c;}



		/* --- Conatct Page Styles --- */
.contentSection .contactArea {width: 960px; min-height: 400px; height: auto;}
.contentSection .contactArea h1 {width: 960px; height: 30px;}
.contentSection .contactArea h4 {width: 960px; height: auto;}
.contentSection .contactArea .iframe {width: 920px; height: 400px;}

		.contactArea .office {width: 291px; min-height: 251px; height: auto;}
		.contactArea .office .picture{width: 285px; height: 65px; margin: 10px auto !important; border: 3px solid #cfcfcf !important;}


/* -- Footer Content Background Div Styles -- */
.footerInner{ width: 960px; min-height: 380px; height: auto;}
.footerInner a {color: #666; text-decoration: none;}
.footerInner a:hover {color: #da1628; text-decoration: none;}

/* ================ Custom Styles for Inner Sections Closed ================== */
/* =========================================================================== */