/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block } body { line-height: 1 } ul { list-style: none } blockquote, q { quotes: none } blockquote:before, blockquote:after, q:before, q:after { content:''; content: none; } table { border-collapse: collapse; border-spacing: 0; } a { color: #C49B99; text-decoration:none; } a:hover { color: #fff; } /*---------------------------------------------------------------------------- END RESET ----------------------------------------------------------------------------*/ * { margin:0; padding:0; } html { height: 100%; } body { background-color: #302722; position:relative; font-size:12px; font-family:Palatino Linotype, Book Antiqua, Palatino, serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; min-width:100%; height: 100%; } #header { height:18px; background: transparent url('images/header-bg-mini-beige.png') top center repeat-x; position:relative; top:0; left:0; width:100%; min-width:960px; z-index:1; } #header h1 { margin: 0; font-family:Georgia, Georgia, serif; background: transparent url('images/icon-top-pink.png') top left no-repeat; font-weight:normal; text-transform:uppercase; letter-spacing:25px; margin: 0px auto; width: 960px; } #cat-about #header { height:133px; background: #c49b99 url('images/header-bg-mini-pink.jpg') bottom center repeat-x; position:absolute; top:0; left:0; width:100%; min-width:960px; z-index:1; border-bottom:5px solid #5e5550; } #home #header { -webkit-transition: background 0.4s ease; -moz-transition: background 0.4s ease; -o-transition: background 0.4s ease; transition: background 0.4s ease; height:134px; background: #e3d8cd url('images/header-bg-mini-beige.jpg') bottom center repeat-x; position:absolute; top:0; left:0; width:100%; min-width:960px; z-index:1; border-bottom:5px solid #5e5550; } #home #header h1 { -webkit-transition: background 0.4s ease; -moz-transition: background 0.4s ease; -o-transition: background 0.4s ease; transition: background 0.4s ease; background: transparent url('images/icon-top-beige.png') top left no-repeat; } #home #header.blue { background: #758994 url('images/header-bg-mini-blue.jpg') bottom center repeat-x; } #home #header.blue h1 { background: transparent url('images/icon-top-blue.png') top left no-repeat; } #home #header.pink { background: #c49b9a url('images/header-bg-mini-pink.jpg') bottom center repeat-x; } #home #header.pink h1 { background: transparent url('images/icon-top-pink.png') top left no-repeat; } #header h1 a:link { margin: 0; padding: 0; height: 57px; text-decoration: none; font-size:62px; color: #302722; text-align: center; width: 960px; display: block; padding: 34px 0; } #header h1 a:visited { text-decoration: none; font-size:62px; color: #302722; text-align: center; } #header h1 a:hover { color: #fff; } /*----------------------------------------------------------------- drop down menu -----------------------------------------------------------------*/ #menu { margin:0 auto; width:100%; height:10px; padding-top:16px; position:absolute; z-index:4; top:0; left:0; } #home #menu, #cat-about #menu{ margin:0 auto; width:100%; position:relative; z-index:3; top:134px; left:0; float: left; border-top:10px solid #302722; padding: 0; } #menu-content { margin:0 auto; width:934px; display:none; border:#302722 solid; border-width:0 10px 5px; height:274px; position:relative; background: #302722 url('images/floorplan.jpg') top center no-repeat; } #home #menu-content { background:url('images/floorplanHCA.jpg') top center no-repeat; } #navigation a { display:block; position:absolute; background:transparent; overflow:hidden; -moz-transition: background .5s linear; -webkit-transition: background .5s linear; -ms-transition: background .5s linear; -o-transition: background .5s linear; transition: background .5s linear; opacity: 0.2; filter: alpha(opacity=20); } #navigation a:hover { background: rgba(184, 134, 131, 0.2); background: rgb(184, 134, 131); } #navigation a.currentwall { background: rgba(184, 134, 131, 0.2); background: rgb(184, 134, 131); } #menu-links { margin-bottom:50px; font-size:14px; } #menu-links a:link, #menu-links a:visited { color:#302722; font-size:16px; letter-spacing:5px; text-decoration:none; } #menu-links a:hover, #menu-links a:active { color:#f9f4ef; } #menu-tab { margin:0 auto; color:#c69c9b; padding:0 60px; width:834px; height:25px; background:url('images/menu-tab.png') bottom center no-repeat; } #menu-tab a:link, #menu-tab a:visited { color:#c69c9b; text-decoration:none; } #menu-tab a:hover, #menu-tab a:active { color:#fff; } #menu-tab .current { color: #edebde; } #menu-content h1 { margin: 0 20px; display: block; height: 86px; position: absolute; font-weight:normal; text-transform:uppercase; } #menu-content h1 a { display: inline-block; margin:30px 0 0 40px; text-decoration: none; font-size:30px; letter-spacing:12px; color: #312622; } #menu-content h1 a:hover { color: #866963; } #explore { float: left; } #explore a { float:left; text-align: center; margin: 0; padding:0; text-transform:uppercase; } #explore .explore { font-weight:normal; font-size:20px; } #explore .tab-link { width: 230px; font-size: 14px; font-style: oblique; text-transform:lowercase; position: relative; top: 5px; display: inline-block; background: #302722; padding: 0 0 20px 0; border-bottom-left-radius: 70px 50px; border-bottom-right-radius: 70px 50px; behavior: url(js/PIE.htc); } #explore .a { width: 310px; } #explore .c { width: 290px; } /*----------------------------------------------------------------- end drop down menu -----------------------------------------------------------------*/ /*----------------------------------------------------------------- home page -----------------------------------------------------------------*/ div.fadehover { position: relative; } div.box { position: relative; width: 100%; float: left; text-align: center; } div.box:after { clear: both; content: ''; overflow: auto; } div.box-a { width: 50%; } img.a, img.c { position: absolute; left: 0; top: 0; z-index: 1; } img.b, img.d { position: absolute; top: 0; left: 0; z-index: 0; } /*----------------------------------------------------------------- end home page -----------------------------------------------------------------*/ /*----------------------------------------------------------------- structure -----------------------------------------------------------------*/ #container { /*min-height: 100%;*/ height: auto !important; height: 100%; width:100%; margin: 0 auto -180px; background: #5e5550; } #homecontent, #catalogue, #about { position:relative; margin:0 auto; } #homecontent { width: 960px; padding: 150px 0 40px 0; } #catalogue { width:841px; padding: 200px 0 40px 0; } #about { width: 640px; padding: 200px 0 40px 0; } #rooms { height: 700px; } .intro-link { display: inline-block; position:absolute; top: 0; bottom:0; left:0; right:0; z-index: 2000; } .rlvr1 { margin:0; padding:0; background:transparent url('images/home-sprite6.png') -303px -716px no-repeat; width:517px; height:518px; display:block; position:absolute; top:73px; left:303px; display: block; opacity:1; filter:alpha(opacity=1); } .rlvr2 { margin:0; padding:0; background:transparent url('images/home-sprite6.png') -0px -1240px no-repeat; width:367px; height:715px; display:block; position:absolute; top:0; left:0; display: block; opacity:1; filter:alpha(opacity=1); } .rlvr3 { margin:0; padding:0; background:transparent url('images/home-sprite6.png') -733px -1240px no-repeat; width:205px; height:715px; display:block; position:absolute; top:0; left:733px; display: block; opacity:1; filter:alpha(opacity=1); z-index:2020; } .rlvr4 { margin:0; padding:0; background:transparent url('images/home-sprite6.png') -315px -1961px no-repeat; width:418px; height:405px; display:block; position:absolute; top:310px; left:315px; display: block; opacity:1; filter:alpha(opacity=1); } .rlvr { transition: opacity 20s; -webkit-transition-timing-function: cubic-bezier(0.04, 0.18, 1.8, 1.00)-moz-transition: opacity 1.2s; -webkit-transition: opacity 1.2s; -o-transition: opacity 1.2s; } .rlvr:hover { opacity:0; filter:alpha(opacity=0); } #about h1 { color: #b6b1ae; font-size: 35px; margin: 10px 0 30px 0; } #about h4 { color: #b6b1ae; font-size: 25px; margin: 40px 0 20px 0; } #about p { line-height: 1.5; color: #dedcdb; font-size: 16px; text-align: left; font-weight: light; margin-bottom: 15px; } #homecontent .intro p { line-height: 1.5; color: #fff; font-size: 15px; text-align: left; font-weight: light; background: none; } #homecontent .intro { font-size: 16px; margin-right: 10px; margin-left: 10px; color: #dedcdb; line-height: 1.5; width: 960px; margin: 460px auto 20px; text-align: left; } #homecontent .titles { font-size: 34px; margin-right: 10px; margin-left: 10px; color: #dedcdb; line-height: 1.2; margin: 5px auto 20px; text-align: center; } .well { border: none; } .spinner_gif { position: absolute; top: 50%; right: 50%; } p.firstletter:first-letter { font-size:150%; line-height: 14px; padding:0 3px 0 0; letter-spacing: -3px; } #page-left:link { position: absolute; left:0; display: inline-block; width: 20px; margin: 200px 0; padding: 240px 0px 240px 5px; background-color: #302722; border-bottom-left-radius: 50px 90px; border-top-left-radius: 50px 100px; z-index: 1; } #page-left:hover { position: absolute; left:0; display: inline-block; width: 20px; margin: 200px 0; padding: 240px 0px 240px 5px; background-color: #c49b99; border-bottom-left-radius: 50px 90px; border-top-left-radius: 50px 100px; } #page-right:link { position: absolute; right:0; display: inline-block; width: 20px; margin: 200px 0; padding: 240px 0px 240px 5px; background-color: #302722; border-bottom-right-radius: 50px 90px; border-top-right-radius: 50px 100px; z-index: 1; } #page-right:hover { position: absolute; right:0; display: inline-block; width: 20px; margin: 200px 0; padding: 240px 0px 240px 5px; background-color: #c49b99; border-bottom-right-radius: 50px 90px; border-top-right-radius: 50px 100px; } .prev, .next { text-decoration: none; color: #fff !important; display:block; z-index:101; } a.painting-link { position:absolute; display:block; background-position:top center; background-repeat:no-repeat; z-index: 3; } a.painting-link:hover { /*background:none!important;*/ background-position:center bottom; } #shadow { position:absolute; left:0; top:0; width:100%; z-index:2; } /*----------------------------------------------------------------- end structure -----------------------------------------------------------------*/ /*---------------------------------------------------------------------------- catalogue page ----------------------------------------------------------------------------*/ #catlinks { position:relative; margin:2px auto 2px auto; z-index: 1 !important; } #catlinks a { display:block; height: 30px; position:absolute; } #catlinks a .border { margin-left:70px; display:block; /* margin-left + width = width of #catlinks a */ } #catlinks a:hover .border { background: rgba(184, 134, 131, 0.2); background: rgb(184, 134, 131); opacity: 0.2; filter: alpha(opacity=20); -moz-transition: background .5s linear; -webkit-transition: background .5s linear; -ms-transition: background .5s linear; -o-transition: background .5s linear; transition: background .5s linear; } #catlinks a:hover .pointer { display:block; background: url("images/pointer.png") no-repeat scroll 0 0 transparent; float:left; width: 70px; height: inherit; vertical-align: center; } /* catalogue page slider */ .slides_container { width:791px; height:1022px; overflow:hidden; display: none; } .slides_container div { width:791px; height:1022px; display:block; } .slide { padding: 20px; width:811px; height:1022px; display:block; margin: 0 auto; z-index: 0; } .center { text-align: center; text-align: -moz-center; text-align: -webkit-center; position: relative; } /*---------------------------------------------------------------------------- end catalogue page ----------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------- about page ----------------------------------------------------------------------------*/ #about ul { margin-bottom: 30px; font-size: 16px; } #about ol { text-decoration: none; margin-bottom: 30px; font-size: 16px; list-style: upper-roman; } #about li { color: #B6B1AE; line-height: 1.3; margin-left: 5px; } #about ul li { padding: 5px; } #about a { color: #c49b99; text-decoration: underline; } #about a:hover { color: #fff; } .anchorlinks { font-size: 16px; } .picture { padding: 3px; font-size: 11px/1.4em; /*box-shadow: 0 0.7em 1.5em -14px black;*/ margin: 30px auto 30px auto; color: #DEDCDB; line-height: 20px; } .picture img { border: 2px solid #958E8B; vertical-align:middle; margin-bottom: 3px; } .right { margin: 0.5em 0pt 0.5em 0.8em; float:right; } .left { margin: 0.5em 0.8em 0.5em 0; float:left; } /*---------------------------------------------------------------------------- end about page ----------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------- lightbox/room display ----------------------------------------------------------------------------*/ /* structure */ #painting-container { float:left; width:360px; height: 560px; display:inline-block; position:relative; margin-top: 30px } #painting-container .painting-hover:hover { border: 1px solid red; position:relative; top: 0; bottom:0; left:0; right:0; } #painting { margin:0 auto; display: block; /*-moz-box-shadow: 3px 3px 4px #ccc; -webkit-box-shadow: 3px 3px 4px #ccc; box-shadow: 3px 3px 4px #ccc;*/ } #painting-alt { margin: 0 auto; display: block; background-position:center; /*-moz-box-shadow: 3px 3px 4px #ccc; -webkit-box-shadow: 3px 3px 4px #ccc; box-shadow: 3px 3px 4px #ccc;*/ } #painting-info { font-size: 12px; float:left; width:240px; height: 550px; text-align:left; overflow-y: auto; overflow-x: hidden; padding: 2px 20px; margin: 20px 0; } /*div p:first-child:first-letter { font-size: 30px; line-height: 1; }*/ #painting-info p { font-size: 14px; line-height:1.4; color: #302722; margin-top: 0 !important; } #title { text-align: center; color: #302722; line-height: 1.4; width:100%; } #title:first-letter, #buttons:first-letter { font-size:inherit; padding: 0; } #buttons { text-align: center; } #roominfo { position:absolute; top: 2px; color:#aea8a5; font-size: 16px; } #roominfo a { font-size: 12px; } /* linear navigation */ #linear-nav { width:100%; font-weight: 200; } #next { position:absolute; top:0; bottom: 0; right: 0; padding:300px 250px 380px 20px; } #prev { position:absolute; top: 0; bottom: 0; left: 0; padding:300px 20px 380px 250px; } #split { position:absolute; top: 660px; bottom: 0px; left: 40%; padding: 0px 135px 0px 135px; z-index: 99; } #unsplit { position:absolute; top: 680px; bottom: 0px; left: 40%; padding: 0px 135px 0px 135px; z-index: 90; } #prev, #next, #split, #unsplit { opacity:0; filter:alpha(opacity=0); transition: opacity 1.2s; -webkit-transition-timing-function: cubic-bezier(0.04, 0.18, 1.8, 1.00)-moz-transition: opacity 1.2s; -webkit-transition: opacity 1.2s; -o-transition: opacity 1.2s; } #prev:hover, #next:hover, #split:hover, #unsplit:hover { opacity:.4; filter:alpha(opacity=0); } #linear-nav b { display: none; background: #fff; font-size:16px; color: #302722; bottom:40px; height: 20px; line-height:1em; } #linear-nav #next:hover b { padding: 20px 20px 20px 20px; display: block; position:absolute; left: 20px; text-align: left; border-bottom-left-radius: 20px 20px; border-top-left-radius: 20px 20px; } #linear-nav #prev:hover b { padding: 20px 20px 20px 20px; display: block; position:absolute; right: 20px; text-align: right; border-bottom-right-radius: 20px 20px; border-top-right-radius: 20px 20px; } #linear-nav #next:hover i { width: 0; height: 0; border-top: 30px solid transparent; border-bottom: 30px solid transparent; border-left: 30px solid #fff; position: absolute; right:-30px; top: 0; background-image: none; } #linear-nav #prev:hover i { width: 0; height: 0; border-top: 30px solid transparent; border-bottom: 30px solid transparent; border-right: 30px solid #fff; position: absolute; left:-30px; top: 0; background-image: none; } #linear-nav #split:hover b { padding: 20px 20px 20px 20px; display: block; position:absolute; text-align: center; left:20px; right:20px; border-bottom-right-radius: 20px 20px; border-top-right-radius: 20px 20px; border-bottom-left-radius: 20px 20px; border-top-left-radius: 20px 20px; } #linear-nav #unsplit:hover b { padding: 20px 20px 20px 20px; display: block; position:absolute; text-align: center; left:20px; right:20px; border-bottom-right-radius: 20px 20px; border-top-right-radius: 20px 20px; border-bottom-left-radius: 20px 20px; border-top-left-radius: 20px 20px; } /* custom scrollbar */ #painting-info.viewport { width: 500px; height: 200px; overflow: hidden; position: relative; } #painting-info.overview { list-style: none; position: absolute; left: 0; top: 0; } #painting-info.thumb .end, #painting-info.thumb { background-color: #003D5D; } #painting-info.scrollbar { position: relative; float: right; width: 15px; } #painting-info.track { background-color: #D8EEFD; height: 100%; width:13px; position: relative; padding: 0 1px; } #painting-info.thumb { height: 20px; width: 13px; cursor: pointer; overflow: hidden; position: absolute; top: 0; } #painting-info.thumb .end { overflow: hidden; height: 5px; width: 13px; } #painting-info.disable { display: none; } .noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; } /* toggle feature and buttons style */ div.unactive { display:none; } div.imgcontainer { text-align: center; } #painting-container h3 { font-size: 15px; text-align: center; margin-bottom:10px; } #buttons .button { color: #302722; padding: 10px; } #buttons .unactive { color: #c49b99; text-decoration: underline; } #buttons .button:hover { background: none; } #buttons .unactive:hover { background: rgb(184, 134, 131); background: rgba(184, 134, 131, 0.2); } #buttons { padding: 10px 0 0 0; } #gallerybackground { background: url('images/body-bg.jpg') top center repeat; width: 100%; height: 780px; position:relative; } #gallery { width: 100%px; height: 780px; position:relative; } /*---------------------------------------------------------------------------- end lightbox/room display ----------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------- footer ----------------------------------------------------------------------------*/ .push, .footer { height: 180px; /* .push must be the same height as .footer...this is used to force our sticky footer */ } #footer-container { clear:both; width:100%; height:180px; background-color: #302722; color:#aea8a5; } #footer { width:940px; font-family: Georgia Light, serif; margin:0 auto; clear: both; } #footer h1 { -webkit-transition: background 0.4s ease; -moz-transition: background 0.4s ease; -o-transition: background 0.4s ease; transition: background 0.4s ease; background: url("images/footer-beige.png") no-repeat; font-family:Palatino Linotype, Book Antiqua, Palatino, serif; height: 90px; text-indent:1.8em; } #footer-pink h1 { -webkit-transition: background 0.4s ease; -moz-transition: background 0.4s ease; -o-transition: background 0.4s ease; transition: background 0.4s ease; background: url("images/footer-pink.png") no-repeat; font-family:Palatino Linotype, Book Antiqua, Palatino, serif; height: 90px; text-indent:1.8em; } #footer.blue h1 { background: url("images/footer-blue.png") no-repeat; } #footer.pink h1 { background: url("images/footer-pink.png") no-repeat; } #footer h1 a { font-size: 25px; text-decoration: none; font-weight:normal; text-transform:uppercase; letter-spacing:8px; color:#aea8a5; } #footer h1 a:hover, #footer h4 a:hover { color:#fff; } #footer h4 { font-family: Georgia, serif; font-size: 15px; } #footer a { color: #aea8a5; margin-bottom: 5px; text-decoration: none; } #footer .englishandname { position: relative; bottom: 5em; left: 5em; } #footer .left { float:left; line-height:1.8; font-weight:normal; width: 50%; margin-top: 2em; height: 100px; } #footer .right { float:right; margin-top: 3em; display: inline; } #footbranding{ float: left; padding: 5px 10px; } a.laits-branding { display: block; background: url(images/footer_branding.png) no-repeat; background-position: 0 -104px; height: 32px; width: 175px; } a:hover.laits-branding { background-position: 0 -62px; } a.cola-branding { display: block; background: url(images/footer_branding.png) no-repeat; background-position: 0 0; height: 21px; width: 235px; } a:hover.cola-branding { background-position: 0 -31px; } a.ut-branding { display: block; background: url(images/footer_branding.png) no-repeat; background-position: 0 -146px; height: 8px; width: 235px; } a:hover.ut-branding { background-position: 0 -164px; } #social{ float: left; padding-left: 5px; border-left: 1px solid #766D69; } a#facebook { display: block; background: url(images/social.png) no-repeat; background-position: 0 0; width: 37px; height: 37px; } a#facebook:hover { background-position: 0 -38px; } a#twitter { display: block; background: url(images/social.png) no-repeat; background-position: 0 -76px; width: 37px; height: 37px; } a#twitter:hover { background-position: 0 -114px; } a.youtube { display: block; background: url(images/social.png) no-repeat; background-position: 0 -152px; width: 37px; height: 37px; } a:hover.youtube { background-position: 0 -190px; } /*---------------------------------------------------------------------------- end footer ----------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------- ICONS ----------------------------------------------------------------------------*/ [class^="icon-"], [class*=" icon-"] { display: inline-block; width: 14px; height: 14px; margin-top: 1px; *margin-right: .3em; line-height: 14px; vertical-align: text-top; background-image: url("images/glyphicons-halflings-white.png"); background-position: 14px 14px; background-repeat: no-repeat; } /* White icons with optional class, or on hover/active states of certain elements */ .icon-white, .nav-tabs > .active > a >[class^="icon-"], .nav-tabs > .active > a >[class*=" icon-"], .nav-pills > .active > a >[class^="icon-"], .nav-pills > .active > a >[class*=" icon-"], .nav-list > .active > a >[class^="icon-"], .nav-list > .active > a >[class*=" icon-"], .navbar-inverse .nav > .active > a >[class^="icon-"], .navbar-inverse .nav > .active > a >[class*=" icon-"], .dropdown-menu > li > a:hover >[class^="icon-"], .dropdown-menu > li > a:hover >[class*=" icon-"], .dropdown-menu > .active > a >[class^="icon-"], .dropdown-menu > .active > a >[class*=" icon-"] { background-image: url("images/glyphicons-halflings-white.png"); } .icon-chevron-left { background-position: -432px -72px; } .icon-chevron-right { background-position: -456px -72px; } .icon-share-alt { background-position: -336px -96px; } .icon-remove { background-position: -312px 0; } .split-button { background-position: -432px -72px; background: transparent url('images/splitbutton.png') top center no-repeat; } .test { font-weight: bold; } #wall_name { background: #fff; font-size:16px; color: #302722; display: none; /* required */ position: absolute; /* required */ padding: 10px; /* IE 5-7 */ filter: alpha(opacity=5); /* IE 8 */ -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* all other browsers */ opacity: 0.5; font-weight: 200; border-radius: 20px; height: 40px; -moz-box-shadow: 3px 3px 4px #000; -webkit-box-shadow: 3px 3px 4px #000; box-shadow: 3px 3px 4px #000; /* For IE 5.5 - 7 */ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000'); width: 115px; z-index: 11; }