@import "mixins.less";

body {
	font-family: @body-font;
	background: url('../images/back-texture.jpg') repeat;
}

* {
	margin: 0;
	padding: 0;
}

a {
	color: #000;
	text-decoration: none;

	&:hover {
		text-decoration: underline;
	}
}

ul {
	list-style: none;
}

/* Header */
header {
	background: url('../images/home-header-bg.png') repeat-x;
}

ul {
	&.social-icons {
		text-align: right;

		li {
			display: inline-block;

			a {
				height: 32px;
				width: 32px;
				display: block;
				.transition('background', 0.5s);

				&.facebook {
					background: url('../images/icons/PNG/Greyscale/32x32px/facebook.png') no-repeat;

					&:hover {
						background: url('../images/icons/PNG/Normal/32x32px/facebook.png') no-repeat;
					}
				}

				&.twitter {
					background: url('../images/icons/PNG/Greyscale/32x32px/twitter.png') no-repeat;

					&:hover {
						background: url('../images/icons/PNG/Normal/32x32px/twitter.png') no-repeat;
					}
				}

				&.google {
					background: url('../images/icons/PNG/Greyscale/32x32px/googleplus.png') no-repeat;

					&:hover {
						background: url('../images/icons/PNG/Normal/32x32px/googleplus.png') no-repeat;
					}
				}

				&.vimeo {
					background: url('../images/icons/PNG/Greyscale/32x32px/vimeo.png') no-repeat;

					&:hover {
						background: url('../images/icons/PNG/Normal/32x32px/vimeo.png') no-repeat;
					}
				}
			}
		}
	}
}

/* Main Content */
div.contentWrapper {
	width: 50%;
	margin: 0 auto;
	padding: 2em 0;
	text-align: center;

	h2 {
		padding-bottom: 2em;
		text-transform: capitalize;
		border-bottom: 1px solid #ccc;
	}

	ul {
		&.services {
			margin: 2em 0 0 0;

			li {
				width: 33%;
				height: 5em;
				padding-top: 7em;
				display: inline-block;
				background-repeat: no-repeat;
				background-position: center 30px;
				background-size: 60px 52px;


				&.web-apps {
					opacity: 0.7;
					background-image: url('../images/icons/web-applications.png');
				}

				&.mobile-apps {
					background-image: url('../images/icons/icon-mobile.png');
				}

				&.responsive-websites {
					background-image: url('../images/icons/icon-website.png');
				}

				&.systems {
					background-image: url('../images/icons/icon-software.png');
				}
			}

		}
	}
}

div.logo {
}

/* Footer */
footer {
	a {
		&.email {
			height: 32px;
			padding: 1em 0 1em 3em;
			background: url('../images/icons/PNG/Greyscale/32x32px/email.png') left center no-repeat;

			&:hover {
				background: url('../images/icons/PNG/Normal/32x32px/email.png') left center no-repeat;
			}
		}
	}
}