/* ==========================================================================
	HTML5 
	
	www.menofmars.co.uk
	
	Author: Adrian Rolea / Bogdan Rolea / Emeric Iacob Marius
	
	Contact : bogdan@midsummerfilms.com / adrian@midsummerfilms.com
========================================================================== */

	html,
	button,
	input,
	select,
	textarea {
		color: white;
		font-family: 'Helvetica', normal;
		font-weight:normal;
		background: #034d74;
	}

	body {
		font-size: 1em;
		line-height: 1.2;
		background: url('../img/bg-main.jpg') no-repeat 0 0;
		background-size: 100% 100%;
	}

	::-moz-selection {
		background: #b3d4fc;
		text-shadow: none;
	}

	::selection {
		background: #b3d4fc;
		text-shadow: none;
	}

	hr {
		display: block;
		height: 1px;
		border: 0;
		border-top: 1px solid #ccc;
		margin: 1em 0;
		padding: 0;
	}

	img {
		vertical-align: middle;
	}

	fieldset {
		border: 0;
		margin: 0;
		padding: 0;
	}

	textarea {
		resize: vertical;
	}

	.chromeframe {
		margin: 0.2em 0;
		background: #ccc;
		color: #000;
		padding: 0.2em 0;
	}

	.clear {
		clear: both;
		display: block;
		float: none !important;
		font-size: 0 !important;
		height: 0 !important;
		min-height: 0 !important;
		max-height: 0 !important;
		line-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		width: 0 !important;
		min-width: 0 !important;
		max-width: 0 !important;
	}

	.title-page {
		color: #f58a6a;
		font-size: 16px;
		text-transform: uppercase;
		margin: 0;
	}
	
	.tabtxt {
		margin: 0.5em;
		padding: 0px;
		font-size: 10pt;
		font-weight: normal;
		font-style: normal;
		font-variant: normal;
		color: #333333;
		background-color: #FFFFFF;
		text-align: left;
		vertical-align: top;
	}

	.title-page.orange {
		color:#f58a6a;
	}

	p {
		font-size: 13px;
		margin: 0 0 15px 0;
	}

	article ul {
		margin: 0;
		padding: 0;
		
	}

	article li {
		list-style-type: square;
		font-size: 13px;
		margin: 10px 0 10px 14px;
	}


/* ==========================================================================
		COMMON STYLES
========================================================================== */
	.main {
		background-size: 100% 100%;
	}

	.main .title-page {
		margin: 0 0 25px 0;
	}

	.main #content > article {
		margin-top: 60px;
	}

	blockquote {
		font-size: 12px;
	}

	.load {
		position: relative;
		overflow: hidden;
	}

	.bar {
		position: absolute;
		top: 501px;
		left: 0;
		background: #ed8669;
		width: 3px;
		height: 3100px;
	}
	/* container */
		#container {
			width: 97%;
			margin: 0 auto;
			z-index: 9999;
		}

		.main #container {
			position: relative;
		}
	/* end container */

	/* content */
		 /* This is the CSS for the login form */ 
		#loginform {
			position: relative;
			left: 30px;

		} 	

		#register{
			position: relative;
			left: 3px;

		} 	

		


		#content {
			border-top: 2px solid #ed8669;
			border-bottom: 2px solid #ed8669;
			margin: 16px 0 16px 232px;
			position: relative;
			min-height: 540px;
			overflow: hidden;
		}

		#content > article {
			margin: 0 350px 0 285px;
		}
	/* end content */

	/* menu */
		#menu {
			position: absolute;
			top: 57px;
			left: 0;
			width: 467px;
			min-height: 463px;
			z-index: 1000;
		}
		
		#menu:after,
		#menu:before {
			content: '';
			background: #ed8669;
			display: block;
			width: 3px;
			height: 40px;
			position: absolute;
			left: 232px;
		}

		#menu:after {
			bottom: -40px;
		}

		#menu:before {
			top: -40px;
		}

		.c-menu {
			position: absolute;
			width: 100%;
			height: 100%;
		}

		.homepage-menu {
			background: url('../img/bg-menu-homepage.png') no-repeat center center;
		}

		.services-menu {
			background: url('../img/bg-menu-services.png') no-repeat center center;
		}

		.products-menu {
			background: url('../img/bg-menu-products.png') no-repeat center center;
		}

		.about-menu {
			background: url('../img/bg-menu-about.png') no-repeat center center;
		}

		.clients-menu {
			background: url('../img/bg-menu-clients.png') no-repeat center center;
		}

		.contact-menu {
			background: url('../img/bg-menu-contact.png') no-repeat center center;
		}

		#menu ul {
			margin: 0;
			padding: 0;
		}

		#menu li {
			list-style-type: none;
		}

		#menu a {
			color: #eff1f4;
			font-size: 12px;
			text-transform: uppercase;
			text-decoration: none;
			line-height: 14px;
			display: block;
		}

		/* menu positioning */
			#menu ul > li {
				position: absolute;
			}

			 #menu .item1 {
				top: 45px;
				left: 229px;
			 }

			 #menu .item2 {
				top: 121px;
				left: 332px;
			 }

			 #menu .item3 {
				top: 343px;
				left: 335px;
			 }

			 #menu .item4 {
				top: 403px;
				left: 142px;
			 }

			 #menu .item5 {
				top: 343px;
				left: 72px;
			 }

			 #menu .item6 {
				top: 121px;
				left: 60px;
			 }

			 #menu .current {
				color: #f58868;
			 }
		/* end menu positioning */
	
		/* top and bottom borders ;) */
			#menu .top,
			#menu .bottom {
				border-left: 2px solid #ed8669;
				border-right: 2px solid #ed8669;
				height: 14px;
				width: 99%;
				position: absolute;
			}

			#menu .top {
				border-top: 2px solid #ed8669;
				top: 0;			
			}

			#menu .top div,
			#menu .bottom div {
				height: 10px;
				border-left: 1px dashed #ed8669;
				border-right: 1px dashed #ed8669;
			}

			#menu .top div {
				border-top: 1px dashed #ed8669;
				margin: 4px 4px 0 4px;
			}

			#menu .bottom div {
				border-bottom: 1px dashed #ed8669;
				margin: 0 4px 4px 4px;
			}

			#menu .bottom {
				border-bottom: 2px solid #ed8669;
				bottom: 0;
			}
		/* end top and bottom borders ;) */
	/* end menu */

	/* top menu */
		.top-menu {
			margin: -3px 0 0 285px;
			padding: 0;
			overflow: hidden;
			position: relative;
			z-index: 1000;
		}

		.top-menu li {
			margin: 0 -5px 0 0;
			padding: 0 47px 0 2px;
			height: 45px;
			float: left;
			list-style-type: none;
			background: url('../img/top-menu-border.png') no-repeat top right;
		}

		.top-menu a {
			color: #eff1f4;
			font-size: 12px;
			text-decoration: none;
			display: block;
			margin: 7px 0 0 0;
			line-height: 15px;
			transition: ease-in-out all 0.4s;
		}

		.top-menu a:hover {
			color: #fdc589;
		}
	/* end top menu */

	/* sidebar */
		.sidebar {
			position: absolute;
			top: 0px;
			right: 0;
			border-right: 1px solid #ed8869;
			z-index: 100;
			width: 250px;
			
		}

		.sidebar p,
		.sidebar h4 {
			margin-right:20px;
		}
	/* end sidebar */

	/* form sidebar */
		.container-form {
			margin-top: 78px;
		}

		.i-text {
			color: #eff1f4;
			font-size: 12px;
			font-style: italic;
			font-weight: bold;
			background: rgba(50, 62, 72, 0.61);
			border: none;
			border-bottom: 1px solid #ed8869;
			padding: 3% 3% 3% 12%;
			margin: 0;
			width: 85%;
			display: block;
			position: relative;
			left: 1px;
		}

		.i-submit {
			color: #046f77;
			font-size: 12px;
			font-weight: bold;
			text-align: center;

			background: #ff8e6c;
			border: none;
			border-top: 1px solid #ed8869;
			display: block;
			padding: 8px 0;
			width: 96%;
			position: relative;
			left: 10px;
		}

		form > div {
			position: relative;
			transition: ease-in-out all 0.4s;
		}

		form > div:before {
			border-top: 1px solid #ed8869;
			content: '';
			width: 10px;
			height: 22px;
			background: #ff8e6c;
			position: absolute;
			top: -1px;
			left: 1px;
		}

		form > div:after {
			content: '';
			position: absolute;
			bottom: 0;
			left: 1px;
			border-radius: 0 0 0 0;

			width: 0px;
			height: 0px;
			border-style: solid;
			border-width: 0 9px 12px 0;
			border-color: transparent #ff8e6c transparent 
		}

		form > div:hover {
			opacity: 0.85;
		}
	/* end form sidebar */

	/* news box */
		.about .news-box {
			width: 400px;
		}
		
		.news-box {
			margin: 78px 0 0 0;
		}

		.homepage .news-box {
			margin: 40px 0 0 0;
		}

		.services .news-box {
			margin: 123px 0 0 0;
		}

		.news-box h3 {
			margin: 0 0 10px 20px;
			background: url('../img/news-title-ico.png') no-repeat left center;
			padding: 0 0 0 24px;

			font-size: 14px;
			text-transform: uppercase;
		}

		.news-box ul {
			margin: 0;
			padding: 0;
			
			background:  url('../img/acordion-bg.png');
		}

		.news-box ul li > a:hover,
		.news-box ul li.visible > a {
			background-color: #ff8e6c;
			background-image: url('../img/news-first-ico.png');
			background-repeat: no-repeat;
			background-position: 0px 12px;
			color: #193c5a;
			font-size: 12px;
			padding: 0 0 0 16px;
			height: 31px;
			line-height: 32px;
			min-width: 205px;
			margin: 0;
			position: relative;			
		}

		.news-box ul li > a:hover:before,
		.news-box ul li.visible > a:before {
			content: '';
			width: 10px;
			height: 23px;
			background: #ff8e6c;
			position: absolute;
			bottom: -1px;
			left: -9px;
		}

		.news-box ul li > a:hover:after,
		.news-box ul li.visible > a:after {
			content: '';
			position: absolute;
			top: 0;
			left: -9px;
			border-radius: 0 0 0 0;
			bottom:-1px;
			width: 0px;
			height: 0px;
			border-style: solid;
			border-width: 0 0 9px 9px;
			border-color: transparent transparent #ff8e6c;
		}

		.news-box li {
			list-style-type: none;
			background-color: rgba(50, 62, 72, 0.61);
			background-image: url('../img/news-ico.png');
			background-repeat: no-repeat;
			background-position: left bottom;
		}

		.news-box li > a {
			border-bottom: 1px solid #ed8869;
			padding: 4px 0 4px 33px;
		}

		.news-box li .sub-content {
			font-size: 12px;
			margin: 10px 10px 10px 15px;
			height: 140px;
			overflow-y: auto;
			display: none;
		}

		.main .sub-content .title-page {
			margin: 0;
		}

		.news-box li.visible {
			padding-bottom: 10px;
			border-bottom: 1px solid #ed8869;
		}

		.news-box li.visible .sub-content {
			display: block;
		}

		.news-box a {
			color: #ffffff;
			font-size: 12px;
			text-decoration: none;
			display: block;
		}

		.news-box li .sub-content a {
			color: #ff8e6c;
			display: inline-block;
		}
	/* end news box */

	/* contact info */
		address {
			font-style: normal;
			margin: 0 0 0 15px;
		}

		address a {
			color: #eff1f4;
			text-decoration: none;
		}
	/* end contact info */

	/* bg elements */
		.bg-element {
			position: absolute;
			top: 0;
		}

		.bg-element.one {
			left: 100px;
		}

		.bg-element.two {
			top: 250px;
			right: 0;
		}
	/* end bg elements */
/* ==========================================================================
		COMMON STYLES
========================================================================== */


/* ==========================================================================
		HEADER
========================================================================== */
	header {
		overflow: hidden;
		height: 126px;
		background: #B9CDE5;
	}

	/* logo */
	#logo {
		width: 164px;
		float: left;
		margin: 30px 0 0 10%;
	}

	#logo img {
		vertical-align: top;
	}
	/* end logo */

	/* header image */
	#h-image {
		float: right;
		height: 100%;
		width: 70%;
		background: url('../img/header-image.png') no-repeat 0 0;
		background-size: 100%;
	}
	/* header image */
/* ==========================================================================
		HEADER
========================================================================== */

/* ==========================================================================
		FOOTER
========================================================================== */
	footer {
		background-color: #252525;
		background-image: url('../img/footer-image.png');
		background-repeat: no-repeat;
		background-position: top right;
		height: 39px;
		font-size: 10px;
	}

	footer > div {
		width: 98%;
		margin: 0 auto;
	}

	/* copyright */
	footer .copyright {
		float: left;
		height: 19px;
		font-size: 10px;
	}
	/* end copyright */

	/* contact details */
	footer .contact {
		margin-top:10px;
		height: 19px;
		float: right;
	}

	footer .contact address {
		font-style: normal;
		
	}

	footer .contact a {
		text-decoration: none;
	}

	footer .contact a:hover {
		text-decoration: underline;
	}

	footer .contact span,
	footer .contact a,
	footer .contact address {
		display: inline-block;
		vertical-align: top;
		color: #feffff;
	}
	/* end contact details */
/* ==========================================================================
		FOOTER
========================================================================== */


/* ==========================================================================
		MEDIA QUERIES
========================================================================== */

	@media screen and (max-width: 1366px) {
		header {
			height: 90px;
		}

		#logo {
			float: left;
			margin: 34px 0 0 8%;
		}

		.bar {
			top: 387px;
		}

		#content {
			margin-left: 172px;
		}

		#content > article {
			margin: 0 350px 0 200px;
		}

		.main #content article {
			margin-top: 30px;
		}

		#menu {
			width: 350px;
			min-height: 350px;
		}

		#menu:after, #menu:before {
			left: 172px;
		}

		#menu:after {
			top: 348px;
		}

		.sidebar-form .container-form {
			padding: 0 0  60px 0;
		}

		.top-menu {
			margin: -3px 0 0 200px;
		}

		/* bg menu */
			.homepage-menu {
				background: url('../img/bg-menu-homepage-small.png') no-repeat center center;
			}

			.services-menu {
				background: url('../img/bg-menu-services-small.png') no-repeat center center;
			}

			.products-menu {
				background: url('../img/bg-menu-products-small.png') no-repeat center center;
			}

			.about-menu {
				background: url('../img/bg-menu-about-small.png') no-repeat center center;
			}

			.clients-menu {
				background: url('../img/bg-menu-clients-small.png') no-repeat center center;
			}

			.contact-menu {
				background: url('../img/bg-menu-contact-small.png') no-repeat center center;
			}
		/* end bg menu */

		/* menu positioning */
			#menu .item1 {
				top: 17px;
				left: 171px;
			}

			#menu .item2 {
				top: 80px;
				left: 258px;
			}

			#menu .item3 {
				top: 267px;
				left: 258px;
			}

			#menu .item4 {
				top: 317px;
				left: 97px;
			}

			#menu .item5 {
				top: 267px;
				left: 40px;
			}

			#menu .item6 {
				top: 80px;
				left: 30px;
			}
		/* end menu positioning */
	}

	

/* ==========================================================================
		Helper classes
========================================================================== */

	.ir {
		background-color: transparent;
		border: 0;
		overflow: hidden;
		*text-indent: -9999px;
	}

	.ir:before {
		content: "";
		display: block;
		width: 0;
		height: 150%;
	}

	.hidden {
		display: none !important;
		visibility: hidden;
	}

	.visuallyhidden {
		border: 0;
		clip: rect(0 0 0 0);
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		width: 1px;
	}

	.visuallyhidden.focusable:active,
	.visuallyhidden.focusable:focus {
		clip: auto;
		height: auto;
		margin: 0;
		overflow: visible;
		position: static;
		width: auto;
	}

	.invisible {
		visibility: hidden;
	}

	.clearfix:before,
	.clearfix:after {
		content: " ";
		display: table;
	}

	.clearfix:after {
		clear: both;
	}

	.clearfix {
		*zoom: 1;
	}

/* ==========================================================================
		Print styles
========================================================================== */

	@media print {
		* {
			background: transparent !important;
			color: #000 !important; /* Black prints faster: h5bp.com/s */
			box-shadow: none !important;
			text-shadow: none !important;
		}

		a,
		a:visited {
			text-decoration: underline;
		}

		a[href]:after {
			content: " (" attr(href) ")";
		}

		abbr[title]:after {
			content: " (" attr(title) ")";
		}

		/*
		* Don't show links for images, or javascript/internal links
		*/

		.ir a:after,
		a[href^="javascript:"]:after,
		a[href^="#"]:after {
			content: "";
		}

		pre,
		blockquote {
			border: 1px solid #999;
			page-break-inside: avoid;
		}

		thead {
			display: table-header-group; /* h5bp.com/t */
		}

		tr,
		img {
			page-break-inside: avoid;
		}

		img {
			max-width: 100% !important;
		}

		@page {
			margin: 0.5cm;
		}

		p,
		h2,
		h3 {
		orphans: 3;
		widows: 3;
		}

		h2,
		h3 {
			page-break-after: avoid;
		}
	}