html {
	height: 100%;
}

body {
	height: 100%;
	margin: 0;
	padding: 0;
	background: #fff;
	font-size: 9px;
}

* {
	box-sizing: border-box;
}

a {
	display: block;
	text-decoration: none;
}

img {
	border: none;
}

h1, h2, h3, ul, ol, form {
	margin: 0;
	padding: 0;
}
h1, h2, h3 {
	font-weight: normal;
}
ul, ol {
	list-style: none;
}

.table, .tableCell {
	width: 100%;
	height: 100%;
}
.table {
	display: table;
}
.tableCell {
	display: table-cell;
	vertical-align: middle;
}

.container {
	width: 95%;
	max-width: 1100px;
	margin: 0 auto;
}

#header {
	padding: 2em 0;	
}
#header .container {
	padding-left: 4em;
	position: relative;
}
#header #logo {
	width: 11.25%;
	max-width: 135px;
	min-width: 90px;
}
#header #logo img {
	display: block;
	width: 100%;
}
#header #topMenu {
	position: absolute;
	right: .7em;
	bottom: 0;
	font: 1.5em 'replicapro_regular';
}
#header #topMenu .tableCell {
	vertical-align: bottom;
}
#header #topMenu a, #header #topMenu .sep {
	float: left;	
}
#header #topMenu a {
	color: #858281;
	transition: color .5s;
}
#header #topMenu a:hover {
	color: #bdbbba;
}
#header #topMenu .sep {
	margin: 0 1.6em;
}
#header #topMenu a.lang {
	font-size: .9em;
	margin: 0 2.8em;
	padding-right: .92em;
	/*background: url(../images/language_arrow.png) right center no-repeat;*/
}
#header #topMenu .temp {
	float: left;
	background-position: left center;
	background-repeat: no-repeat;
	background-size: auto 100%;
	font: .9em 'replicapro_bold';
	color: #01add8;
	padding-left: 2em;
}
	
#mainMenu {
	text-align: center;
	position: relative;
	z-index: 1000;
}
#mainMenu .container {
	background: #21b66b;
	padding: 0 7em;
	height: 7em;
	position: relative;
}
#mainMenu #mainMenuBtns {
	height: 100%;
}
#mainMenu #mainMenuBtns a {
	display: inline-block;
	background: #21b66b;
	height: 100%;
	font: 1.3em 'replicapro_regular';
	letter-spacing: .1em;
	color: #fff;
	text-transform: uppercase;
	padding: 0 1.4em;
	margin: 0 1.13em;
	position: relative;
}
#mainMenu #mainMenuBtns a.showsatmobile {display:none;}
@media screen and (max-width:710px) {
    #mainMenu #mainMenuBtns a.showsatmobile{display:block!important;}
}

#mainMenu #mainMenuBtns a:first-child {
	margin-left: 0;
}
#mainMenu #mainMenuBtns a:last-child {
	margin-right: 0;
	border-bottom: none;
}
#mainMenu #mainMenuBtns a:before, #mainMenu #mainMenuBtns a:after {
	display: block;
	position: absolute;
	width: 1px;
	height: 0;
	background-color: #fff;
	content: "";
	transition: animation;
}
#mainMenu #mainMenuBtns a:before {
	top: 0;
	left: 0;
	transition: animation .5s forwards;
}
#mainMenu #mainMenuBtns a:after {
	bottom: 0;
	right: 0;
}
#mainMenu #mainMenuBtns a:hover:before, #mainMenu #mainMenuBtns a.active:before {
	animation: beforeAnim .5s forwards;
}
#mainMenu #mainMenuBtns a:hover:after, #mainMenu #mainMenuBtns a.active:after {
	animation: afterAnim .5s forwards;
}

/* <Services submenu> */
#mainMenu #servicesSubmenu {
	position: absolute;
	top: 2px;
	left: 0;
	width: 100%;
	background: #fff;
	padding: 3.9em 5.6em 2.4em 2.2em;
	display: none;
}
#mainMenu #servicesSubmenu img {
	display: block;
}
#mainMenu #servicesSubmenu .txt {
	float: left;
}
#mainMenu #servicesSubmenu .pic {
	float: right;
	margin-left: 2em;
}
#mainMenu #servicesSubmenu .pic a {
	margin-top: 1.7em;
	transition: opacity .5s;
}
#mainMenu #servicesSubmenu .pic a:hover {
	opacity: .7;
}


/* </Services submenu> */


@keyframes beforeAnim {
    0% {
		margin-top: 0;
		top: 0;
		height:0;
	}
    50% {
		margin-top: 0;
		top: 0;
		height: 3.3em;
	}
   	100% {
		margin-top: -.8em;
		top: 50%;
		height: 1.4em;
	}
}

@keyframes afterAnim {
    0% {
		margin-bottom: 0;
		bottom: 0;
		height:0;
	}
    50% {
		margin-bottom: 0;
		bottom: 0;
		height: 3.5em;
	}
   	100% {
		margin-bottom: -.6em;
		bottom: 50%;
		height: 1.4em;
	}
}
	
/*#mainMenu #mainMenuBtns a:hover, #mainMenu #mainMenuBtns a.active {
	border-bottom: .4em solid #fff;
	padding-top: .4em;
}*/
#mainMenu a.home, #mainMenu a.mobile, #mainMenu a.search {
	position: absolute;
	top: 0;
	width: 7em;
	height: 100%;
	background-color: #1da35f;
	background-position: center;
	background-repeat: no-repeat;
	transition: opacity .5s;
}
#mainMenu a.home {
	left: 0;
	background-image: url(../images/home_icon.png);
	background-size: cover;
}
#mainMenu a.mobile {
	display: none;
	right: 0;
	background-image: url(../images/mobile_menu_icon.png);
}
#mainMenu a.home:hover, #mainMenu a.mobile:hover, #mainMenu a.search:hover {
	opacity: .8;
}

#categoryTitle {
	font: 2.2em 'replicapro_regular';
	letter-spacing: .15em;
	color: #fff;
	text-transform: uppercase;
	margin-top: -1.6em;
	background: #29292b;
}
#categoryTitle .container {
	padding: 3.7em 0 1.6em 1.1em;
}

#body {
	padding: 4em 0 7em;
	background: #f3f3f3;
}

#body #categorySubmenu {
	float: left;
	width: 17.4%;
	padding-top: 2.3em;
	margin-left: 2.5em;
}
#body #categorySubmenu .title {
	font: 1.8em 'replicapro_bold';
	text-transform: uppercase;
	padding-bottom: .6em;
	color: #000;
	background: url(../images/categories_icon.png) right top no-repeat;
	border-bottom: 1px solid #d0d0d0;
	margin-bottom: 2em;
}
#body #categorySubmenu a {
	margin-bottom: 3em;
	position: relative;
}
#body #categorySubmenu a:last-child {
	margin-bottom: 0;
}
#body #categorySubmenu a h2 {
	font: 1.3em 'replicapro_bold';
	color: #6d6d6d;
	text-transform: uppercase;
	transition: color .5s, padding-left .5s;
}
#body #categorySubmenu a:before {
	display: block;
	position: absolute;
	left: 0;
	top: 40%;
	width: 0;
	height: 1px;
	background-color: #25b56f;
	content: "";
	transition: width 0.25s;
}
#body #categorySubmenu a:hover h2, #body #categorySubmenu a.active h2 {
	color: #25b56f;
	padding-left: 1.7em;
}
#body #categorySubmenu a:hover:before, #body #categorySubmenu a.active:before {
	width: 1.5em;
}
#body #categorySubmenu select {
	display: none;
	background: url(../images/categories_arrow.png) right 1em center no-repeat;
	width: 100%;
	border: 1px solid #6d6d6d;
	outline: none;
	font: 1.9em 'replicapro_bold';
	color: #color;
	padding: .7em .5em;
	-webkit-appearance: none;
}

#body #mainListing {
	float: right;
	width: 78.1%;
	margin-right: -2.5em;
	padding: 2.2em 2.9em 16.5em 2.9em;
	background: #fff;
	display: none;
}
#body #mainListing #mainImageContainer {
	position: relative;
	background: url(../images/imagecontainer_bg.png);
}
#body #mainListing #mainImageContainer img, #body #mainListing #mainImageContainer #imagesAnim ol li .img {
	display: block;
	width: 65.9%;
	max-width: 580px;
	background-position: center;
	background-size: cover;
}
#body #mainListing #mainImageContainer #whiteSquare, #body #mainListing #mainImageContainer #imagesAnim ol li .whiteSquare {
	position: absolute;
	right: 3.2%;
	top: 50%;
	margin-top: -14%;
	width: 34%;
	height: 80%;
	background: #fff;
	padding: 1em;
}
#body #mainListing #mainImageContainer #whiteSquare #whiteSquareBorder, #body #mainListing #mainImageContainer #imagesAnim ol li .whiteSquare .whiteSquareBorder {
	height: 100%;
	border: 1px solid #000;
	text-align: center;
	padding: 4.1em 2.9em;
	color: #000;
}
#body #mainListing #mainImageContainer #whiteSquare #whiteSquareBorder h1, #body #mainListing #mainImageContainer #imagesAnim ol li .whiteSquare .whiteSquareBorder h1 {
	font: 2.7em 'replicapro_bold';
	text-transform: uppercase;
}
#body #mainListing #mainImageContainer #whiteSquare #whiteSquareBorder .sep, #body #mainListing #mainImageContainer #imagesAnim ol li .whiteSquare .whiteSquareBorder .sep {
	margin: 1.5em auto;
	height: 2px;
	background: #000;
	width: 17.5%;
}
#body #mainListing #mainImageContainer #whiteSquare #whiteSquareBorder h2, #body #mainListing #mainImageContainer #imagesAnim ol li .whiteSquare .whiteSquareBorder h2 {
	font: 1.4em 'replicapro_regular';
	color: #464646;
}

#body #mainListing ul {
	margin-top: 3.8em;
}
#body #mainListing ul li {
	border-bottom: 1px solid #e3e3e3;
	padding: 2.1em 3em 2.1em .8em;
}
#body #mainListing ul li h2 {
	float: left;
	background: url(../images/listing_arrow.png) left center no-repeat;
	font: 1.5em 'replicapro_bold';
	color: #4b4b4b;
	text-transform: uppercase;
	letter-spacing: .05em;
	padding-left: 1.3em;
}
#body #mainListing ul li .floor {
	float: right;
	font: 1.5em 'replicapro_regular';
	color: #646464;
	letter-spacing: .05em;
}

#footerMenu {
	border-top: 1px solid #e6e6e6;
	background: #f6f6f6;
	padding: 4.1em 0 14.5em;
}
#footerMenu .container, #footer .container {
	padding: 0 3em;
}
#footerMenu .block {
	float: left;
	width: 15%;
	margin-right: 13.3%;
}
/*#footerMenu .block:nth-last-child(2) {*/
#footerMenu .block:nth-last-child(3) {/*This is after having added additional menu to footer menu*/
	margin-right: 0;
	float: right;
}
#footerMenu .block h2 {
	font: 2em 'replicapro_bold';
	color: #323437;
	margin-bottom: 1.2em;
}
#footerMenu .block a {
	font: 1.5em 'replicapro_regular';
	color: #767676;
	margin-bottom: .3em;
	transition: color .5s;
}
#footerMenu .block a:hover {
	color: #323437;
}

#footer {
	background: #36393e;
	padding: 3.7em 0 7.2em;
}
#footer .container {
	position: relative;
}
#footer .left {
	float: left;
	font-family: 'replicapro_regular';
	color: #b3b8c1;
}
#footer .right {
	position: absolute;
	right: 0;
	bottom: 0;
}
#footer .left .copy {
	font-size: 1.4em;
}
#footer .left .menu {
	font-size: 1.5em;
	margin-top: .6em;
}
#footer .left .menu  a {
	display: inline-block;
	color: #b3b8c1;
	transition: color .5s;
}
#footer .left .menu  a:hover {
	color: #fff;
}
#footer .right a {
	display: inline-block;
	margin-right: 3em;
	transition: opacity .5s;
}
#footer .right a:last-child {
	margin-right: 0;
}
#footer .right a:hover {
	opacity: .8;
}