body { min-width: 1000px; background-color: #fcfaf7; } header { margin: 0; padding: 0; position: relative; padding-bottom: 40px; background-color: #ffffff; } form#search { position: absolute; height: 28px; width: 208px; top: 5px; left: 20px; margin: 0; padding: 0; } form#search input { border: 1px solid #ffffff; display: block; width: 208px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; outline: 0; float: left; font: 13px / 18px 'Open Sans',Tahoma,Helvetica,sans-serif; padding: 4px 10px 4px 25px; margin: 0; background: #ffffff url(./../../styles/dito/img/?f=search&c=666666) no-repeat 4px center; transition: border-color 0.5s; -webkit-transition: border-color 0.5s; } form#search input:hover, form#search input:focus { border: 1px solid #e0dedc; } form#search input::-webkit-input-placeholder { color: #666666; } form#search input::-moz-placeholder { color: #666666; } form#search input:-ms-input-placeholder { color: #666666; } #common { width: 960px; padding: 10px 20px; margin: 0 auto; position: relative; text-align: right; line-height: 18px; } #common a { color: #666666; text-decoration: none; -webkit-text-size-adjust:none; transition: color 0.5s; -webkit-transition: color 0.5s; } #common a:hover { color: #b27a36; } #common a:after { content:'|'; color: #e0dedc; padding: 0 10px; } #common a:last-child:after { content: ''; padding: 0; } header>img { display: block; margin: 20px auto; } #mainnav { padding: 0; margin: 0; position: absolute; width: 100%; bottom: 0; border-bottom: 1px solid #e0dedc; z-index: 1000; -webkit-transform: translateZ(0); background-color: #ffffff; } #mainnav.fixed { top: 0; bottom: auto; position: fixed; } #mainnav:after { position: absolute; height: 35px; width: 100%; background: url(./../../styles/dito/img/shadow.png) no-repeat center top; content: ' '; z-index: 1000; top: 39px; } #mainnav>ul { width: 960px; margin: 0 auto; list-style: none; display: block; padding: 0 20px; position: relative; } #mainnav>ul:after { content: ' '; display: block; clear: both; } #mainnav>ul>li { display: block; margin: 0; padding: 0; float: left; } #mainnav>ul>li>a { display: block; line-height: 18px; padding: 10px 10px; text-decoration: none; color: #666666; position: relative; transition: color 0.5s; -webkit-transition: color 0.5s; } #mainnav>ul>li>a:hover { color: #b27a36; } #mainnav>ul>li.ditoactive>a { color: #b27a36; } #mainnav>ul>li.ditoopen>a:after { content: ' '; display: block; position: absolute; z-index: 1020; background: url(./../../styles/dito/img/?f=bit&c=e0dedc) no-repeat center center; bottom: -1px; left: 0; width: 100%; height: 16px; } #mainnav>ul>li>ul { margin: 0; list-style: none; border-bottom: 1px solid #e0dedc; border-left: 1px solid #e0dedc; border-right: 1px solid #e0dedc; background-color: #fdfdfd; left: -9999px; top: 39px; z-index: 1010; position: absolute; width: 938px; padding: 10px 0 10px 20px; opacity: 0; transition: opacity 0.2s, transform 0.2s; transform: translate(0,-20px); display: block; } #mainnav>ul>li.ditoopen>ul { left: 20px; opacity: 1; transform: translate(0,0); } #mainnav>ul>li.ditoopen>ul:after { position: absolute; height: 35px; width: 100%; background: url(./../../styles/dito/img/shadow.png) no-repeat center top; content: ' '; z-index: 1000; top: 100%; left: 0; } #mainnav>ul>li>ul>li { display: block; margin: 0; padding: 0; } #mainnav>ul>li>ul>li>ul { display: block; margin: 0; padding: 0; list-style: none; float: left; width: 187px; } #mainnav>ul>li>ul>li>ul>li { margin: 0; padding: 0; } #mainnav>ul>li>ul>li>ul>li>a { display: block; padding: 0 20px 10px 0; text-decoration: none; color: #666666; transition: color 0.5s; -webkit-transition: color 0.5s; } #mainnav>ul>li>ul>li>ul>li>a:hover { color: #b27a36; } #mainnav>ul>li>ul>li>ul>li:first-child>a { font-size: 16px; } #mainnav>ul>li>ul>li>ul>li>a>img { display: block; border: 1px solid #e0dedc; } #mainnav>ul>li#home>a { background: url(./../../styles/dito/img/?f=home&c=666666) no-repeat left center; width: 18px; height: 18px; display: block; position: relative; padding: 10px 10px 10px 0; } #eyecatcher { width: 100%; min-width: 1000px; height: 320px; overflow: hidden; position: relative; border-bottom: 1px solid #e0dedc; } #eyecatcher>ul { display: block; list-style: none; height: 320px; margin: 0; padding: 0; width: 32000px; transition: transform 1s; -webkit-transition: transform 1s; } #eyecatcher>ul>li { display: block; height: 320px; margin: 0; padding: 0; float: left; overflow: hidden; } #eyecatcher img { display: block; position: absolute; } #eyecatchernav { display: block; margin: 10px auto; } #eyecatchernav>a { float: left; display: block; height: 16px; width: 24px; background: url(./../../styles/dito/img/?f=bullet&c=b27a36) no-repeat center top; } #eyecatchernav>a:hover { background-position: center center; } #eyecatchernav>a.ditoactivebutton { background-position: center bottom; } #eyecatchernav:after { content: ' '; display: block; clear: both; } #maincontainer { width: 960px; padding: 20px 20px; margin: 0 auto; } #breadcrumbs { color: #888888; } #breadcrumbs a { color: #444444; text-decoration: none; } #breadcrumbs a:hover { color: #b27a36; text-decoration: none; } #header { width: 960px; margin-bottom: 40px; } #sidebarleft { float: left; margin-right: 40px; min-height: 1px; } #content { float: left; } #main:after { content: ' '; display: block; clear: both; } #sidebarright { float: left; margin-left: 40px; min-height: 1px; } #footer { width: 960px; margin-top: 40px; } footer { background-color: #ffffff; color: #333333; padding: 40px 0 0 0; margin: 0; border-top: 1px solid #e0dedc; } footer>ul { width: 960px; margin: 0 auto; padding: 0 0 40px 0; display: block; list-style: none; } footer>ul>li { margin: 0; padding: 0 40px 0 0; display: block; list-style: none; float: left; } footer>ul>li:last-child { padding: 0; } footer>ul ul { margin: 0; padding: 0; display: block; } footer>ul>li li { margin: 0; padding: 0; display: block; list-style: none; } footer>ul em { font-style: normal; font-size: 110%; color: #333333; display: block; padding: 0 10px 10px 0; } footer>ul a { display: block; padding: 0 10px 2px 0; color: #666666; } footer>ul::after { content: ''; clear: both; display: block; } footer>div { padding: 0 0 20px 0; width: 960px; margin: 0 auto; } footer a { color: #666666; text-decoration: none; } footer a:hover { color: #333333; text-decoration: none; } footer img { display: block; border: none; padding-top: 4px; }