html {height: 100%;}
body {width: 100%; height: 100%; margin: 0; padding: 0; background: #fff; font-family: arial, sans-serif;}
#wrapper {overflow: hidden; min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -114px}

#header {overflow: hidden; height: 342px; padding-top: 5px; background: url(../img/header.png?v=1) repeat-x;}
	.header-wrapper {position: relative; width: 960px; margin: 0 auto;}
		#header .menu-wrapper {width: 100%; overflow: hidden;}
			#header .menu-wrapper .show-menu {display: none; visibility: hidden;}
			#menu {float: right; width: 66.666666667%;}
				#menu ul {margin: 0; padding: 0; list-style: none; overflow: hidden;}
					#menu li {float: left; height: 65px; font-family: "ff-dax-web-pro", sans-serif; font-size: 18px; line-height: 65px; font-weight: 400;}
						#menu li a {float: left; color: #7f7f7f; text-decoration: none; width: 100%; text-align: center;}
						#menu li.home {width: 17.8125%;}
						#menu li.people {width: 17.8125%;}
						#menu li.operate {width: 23.59375%;}
						#menu li.contact {width: 14.21875%;}
						#menu li.active a, #menu li a:hover {color: #fff; background: url(../img/menu-active.jpg?v=1) repeat-x;}
		#logo {position: relative; padding-top: 55px; width: 26.770833333%; margin: 0; z-index: 2;}
			#logo a {display: block; position: relative; text-decoration: none;}
				#logo a img {width: 100%;}
				#logo a span {position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-indent: -9999em;}

#footer {position: relative; overflow: hidden; height: 114px; background: url(../img/footer.png?v=2) repeat-x 0 -1px;}
	.footer-wrapper {position: relative; width: 960px; margin: 0 auto;}
		#footer .menu {position: absolute; top: 50px; width: 420px; -moz-opacity: 0.25; opacity:.25; filter: alpha(opacity=25); font-family: "ff-dax-web-pro", sans-serif; font-size: 13px; line-height: 15px; font-weight: 400;}
			#footer .menu a {float: left; color: #fff; text-decoration: none; padding: 0 5px; border-right: 1px solid #fff;}
			#footer .menu a.last {border-right: 0;}
			#footer .menu a:hover {text-decoration: underline;}
		#footer .logo {position: relative; display: block; margin: 0 auto; width: 89px; height: 75px; background: url(../img/footer-imaginarius.png?v=2) 0 -1px no-repeat; text-indent: -9999em;}
		#footer .logo:hover {background-position: 0 -78px;}
		#footer .copy {position: absolute; top: 76px; left: 0; width: 100%;  -moz-opacity: 0.25; opacity:.25; filter: alpha(opacity=25); text-align: center; font-size: 14px; font-family: "ff-dax-web-pro", sans-serif; font-size: 13px; line-height: 15px; font-weight: 400; color: #fff;}
			#footer .copy a {color: #fff; text-decoration: none;}
			#footer .copy a:hover {text-decoration: underline;}

#main {margin-top: -259px; overflow: hidden;}
	#main article {position: relative; width: 960px; margin: 0 auto; padding-bottom: 20px; overflow: hidden;}
		#main article h2 {margin: 0; padding: 0; text-indent: -9999em; font-size: 0; line-height: 0;}
		#main article .photo {margin: 0 0 70px 0;}
			#main article .photo figure {margin: 0 0 0 33.333333333%; width: 66.666666667%;}
				#main article .photo img {display: block; width: 100%;}
		#main article .quotation {margin: 0 0 70px 0; text-align: center; text-transform: uppercase; font-family: "ff-dax-web-pro", sans-serif; font-size: 25px; line-height: 30px; font-weight: 700; color: #434343;}
			#main article .quotation p {margin: 0;}
			#main article .quotation strong {font-weight: 700; color: #ea862e;}
		#main article .content {width: 60.416666667%; margin: 0 auto; font-family: "ff-dax-web-pro", sans-serif; font-size: 15px; line-height: 19px; font-weight: 400; color: #393939;}
			#main article .content p {margin-top: 0;}
				#main article .content p strong {font-weight: 700px;}
				#main article .content a {color: #393939; text-decoration: underline; font-style: italic;}
				#main article .content a:hover {text-decoration: none;}
			#main article .content ul {margin: 0; padding: 0 0 0 20px;}
			#main article .content ul li {margin-bottom: 10px;}

		#main article.contact .content {width: 66.666666667%; margin: 0 0 0 33.333333333%;}
			#main article.contact .content h3 {margin: 0 0 18px 0; padding: 0 0 18px 0; border-bottom: 2px solid #d1d1d1; font-family: "ff-dax-web-pro", sans-serif; font-size: 15px; line-height: 19px; font-weight: 700;}
			#main article.contact .content table {width: 100%; margin-bottom: 10px;}

		#main article.home .content {width: 100%; margin: 0; overflow: hidden;}
			#main article.home section {text-align: justify;}
			#main article.home section.box-1, #main article section.box-3 {float: left; width: 26.666666667%;}
			#main article.home section.box-2 {float: left; width: 33.333333333%;}
			#main article.home section.box-1, #main article section.box-2 {margin-right: 6.666666667%;}
				#main article.home section figure {position: relative; width: 100%; margin: 0 auto 24px auto;}
					#main article.home section figure img {display: block; width: 100%;}
				#main article.home section p {margin-top: 0;}

	#main article.people {width: 100%;}
		#main article.people .photo {position: relative; width: 960px; margin: 0 auto 70px auto;}
		#main article.people .content {width: 100%;}
			#main article.people section {}
			#main article.people section.odd {background: #ededed;}
			#main article.people section .person {position: relative; width: 960px; margin: 0 auto; padding: 29px 0; overflow: hidden;}
				#main article.people section .person figure {float: left; width: 20%; margin: 0 0 0 2.083333333%;}
					#main article.people section .person figure img {display: block; width: 100%; zoom: 1; position: relative; -webkit-border-radius: 95px; -moz-border-radius: 95px; border-radius: 95px; behavior: url(/css/PIE.htc);}
				#main article.people section .person .info {float: right; width: 64.583333334%; margin: 0 2.083333333% 0 0;}
					#main article.people section .person .info h3 {margin: 0; font-family: "ff-dax-web-pro", sans-serif; font-size: 15px; line-height: 19px; font-weight: 700;}
					#main article.people section .person .info h4 {margin: 0; font-family: "ff-dax-web-pro", sans-serif; font-style: italic; font-size: 15px; line-height: 19px; font-weight: 700; color: #ec842b;}
					#main article.people section .person .info .description {margin-top: 17px; padding-top: 21px; border-top: 2px solid #c3c3c3;}

#push {height: 114px;}

@media screen and (max-width: 980px) {
#logo {width: 24.770833333%; margin-left: 2%;}
#main article.home .content {width: 92%; margin: 0 auto;}
}

@media screen and (max-width: 960px) {
.header-wrapper {width: 100%;}
.footer-wrapper {width: 100%}
#main article {width: 100%;}
#main article.people .photo {width: 100%;}
#main article.people section .person {width: 100%}
}

@media screen and (max-width: 920px) {
#header li {font-size: 16px;}
}

@media screen and (max-width: 880px) {
#footer .menu {width: 100%; overflow: hidden;}
#footer .menu .part-1 {float: left; width: 43%; text-align: right;}
#footer .menu .part-2 {float: right; width: 43%; text-align: left}
#footer .menu a {float: none; color: #fff; text-decoration: none; padding: 0 5px; border-right: 1px solid #fff;}
#footer .menu a.third {border-right: 0;}
#main article .quotation {width: 92%; margin: 0 auto 30px auto; font-size: 22px; line-height: 27px;}
#main article .content {width: 92%;}
#main article.contact .content {width: 92%; margin: 0 auto;}
}

@media screen and (max-width: 860px) {
#header li {font-size: 15px;}
}

@media screen and (max-width: 820px) {
#menu {float: right; width: 100%;}
#header li {font-size: 16px;}
}

@media screen and (max-width: 768px) {
#main article .photo {margin: 0 0 30px 0;}
#main article.people .photo {margin: 0 0 30px 0;}
#main article.home section.box-1, #main article section.box-3 {float: none; width: 92%;}
#main article.home section.box-2 {float: none; width: 92%;}
#main article.home section.box-1, #main article section.box-2, #main article section.box-3 {margin: 0 auto;}
#main article.home section figure img {width: auto; margin: 0 auto;}
}

@media screen and (max-width: 620px) {
#header li {font-size: 15px;}
}

@media screen and (max-width: 560px) {
#header li {font-size: 14px;}
#footer .menu {font-size: 12px; line-height: 14px;}
}

@media screen and (max-width: 500px) {
#header li {font-size: 13px;}
#footer .menu {font-size: 11px; line-height: 13px;}
}

@media screen and (max-width: 480px) {
#main article.people section .person figure {float: none; width: auto; margin: 0 0 30px 0;}
#main article.people section .person figure img {width: auto;  margin: 0 auto;}
#main article.people section .person .info {float: none; width: 90%; margin: 0 auto;}
#header {height: auto; padding-bottom: 30px;}
#header .menu-wrapper .show-menu {display: block; visibility: visible; position: absolute; z-index: 1000; top: 12px; left: 17px; width: 60px; height: 31px; padding-left: 41px; text-decoration: none; color: #393939; background: #fff;}
#header .menu-wrapper .show-menu img {position: absolute; top: 0; left: 0; width: 31px; height: 31px;}
#header .menu-wrapper .show-menu span {font-family: "ff-dax-web-pro", sans-serif; font-size: 16px; line-height: 31px; font-weight: 700; text-decoration: none;}
#menu {display: none; position: relative; top: 54px; left: 0;	width: 100%; z-index: 999; padding-bottom: 54px;}
#menu.showed {display: block;}
#menu li {float: none; height: 52px; font-family: "ff-dax-web-pro", sans-serif; font-size: 18px; line-height: 52px; font-weight: 400;}
#menu li a {float: none; display: block; color: #343434; text-decoration: none; width: 100%; text-align: center; background: #e6e6e6;}
#menu li.home {width: 100%;}
#menu li.people {width: 100%;}
#menu li.operate {width: 100%;}
#menu li.contact {width: 100%;}
#menu li.active a, #menu li a:hover {color: #fff; background: url(../img/menu-active.jpg?v=1) repeat-x;}
#logo {padding-top: 80px; width: auto; text-align: center;}
#logo a img {width: 80%;}
#main {margin-top: 0;}
#main article .photo figure {width: auto; margin: 0;}
#footer .menu {display: none;}
}