@Dark: #2E3233; @Mid: #697579; @Light: #E1E2DE; @White: #F7F7F4; @Green: #97ca4d; @texture: url(/layout/stack.jpg) fixed; @background: url(/layout/background_white.jpg) fixed; @midBackground: rgba(100, 100, 100, .4); @darkBackground: url(/layout/background_dark.jpg) fixed; @tint: rgba(100, 100, 100, .1); html { height: 100%; } body { font-size:14px; line-height: 18px; color: @Mid; font-family: verdana, helvetica, sans-serif; padding:0; margin:0; height: 100%; background: @background; } .wrapper{ min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -300px; } h1, h2, h3, h4{ font-weight: normal; } h1{ font-size: 26px; line-height: 30px; margin: 20px 0 0; padding: 20px 0 0; text-align: left } h2{ font-size: 24px; line-height: 28px; margin: 10px 0; color: @Dark; } a{ color: @Dark; text-decoration: none; } .error{ background: #df1825; color: white; text-align: center; padding: 10px 0; } #Header{ position: relative; width: 100%; background: @texture; color: @Dark; } #menuButton{ display: none; width: 50px; height: 50px; position: absolute; top:0; right: 0; background: url(/layout/menu.png) 50% 50% no-repeat; background-size: 90%; } #User{ padding: 5px 0; width: 100%; background: @Dark; color: @Mid; text-align: right; margin-bottom: 20px; } #User a{ color: @Green; font-weight: normal; text-decoration: none; } #User .admin{ padding: 4px 10px; background: @Green; color: @Dark; border-radius: 4px; font-size: 10px; line-height: 12px; font-weight: bold; text-transform: uppercase; } #User form{ display: inline-block; } #User form#LoginForm{ display: none; } #User button{ padding: 4px 10px; background: @Green; color: @Dark; border-radius: 4px; font-size: 10px; line-height: 12px; font-weight: bold; text-transform: uppercase; } .account{ background: url(/layout/account.png) no-repeat 0 50%; padding: 0 10px; padding-left: 20px; line-height: 20px; } .AccessRequests{ color: @Green; background: no-repeat 4px 50%; background-size: 14px; background-image: url(/layout/access.png); padding: 4px 5px; padding-left: 17px; border-radius: 4px; font-size: 10px; line-height: 12px; display: inline-block; margin-left: 10px; font-weight: bold; } #AccountMenu a{ background-size: 34px auto; background-repeat: no-repeat; background-position: 0 0; padding-left: 32px; } .accountButton a{ background-image: url(/layout/account_button.png); } .recordsButton a{ background-image: url(/layout/records_button.png); } .libraryButton a{ background-image: url(/layout/library_button.png); } .accessButton a{ background-image: url(/layout/access_button.png); } #AccountMenu .current a{ background-position: 0 -34px; } #Logo{ background: url(/layout/NRM-Library.png) no-repeat; background-size: contain; display: block; float: left; width: 350px; height: 70px; } #Search{ position: relative; float: right; background: @White; border-radius: 5px; width: 250px; height: 30px; margin-top: 10px; z-index: 999; } #Search input{ position: absolute; top:0; left: 0; margin: 0; padding: 0; background: none; border: none; width: 156px; height: 18px; padding: 6px 4px 6px 10px; font-size: 17px ;line-height: 17px; } #Search button{ position: absolute; top: 0; right: 0; margin: 0; padding: 0; background: none; border: none; width: 30px; border-left: 1px solid @Green; height: 30px; background: url(/layout/search_button.png) no-repeat; background-size: contain; border-radius: 0; } #SearchText { font-size: 12px; float: right; width: 100%; text-align: right; margin-top: -25px; font-weight: normal; padding-right: 15px; background: url(/layout/drop_down.png) no-repeat 100% 5px; cursor: pointer; padding-bottom: 10px; } #SearchText.active { background-image: url(/layout/slide_up.png) } #AjaxResults{ list-style: none; background: white; margin: 0; padding: 0; margin-top: 30px; margin-left: 5px; font-size: 11px; max-height: 300px; overflow: auto; margin-right: 30px; box-shadow: 0px 3px 6px rgba(0,0,0,.5); } #AjaxResults h2{ background: @Mid; color: @Light; padding: 2px 0; margin: 0; display: block; text-align: center; font-size: 11px; text-transform: uppercase; line-height: 18px; } #AjaxResults a{ font-weight: normal; text-decoration: none; padding: 5px 10px 5px 25px; display: block; } #AjaxResults li{ padding: 0; background-repeat: no-repeat; background-size: 15px 24px; background-position: 5px 1px; } #AjaxResults li:nth-child(odd) { background-color: @tint; } #AdvancedSearch{ clear: both; width: 100%; min-height: 100px; display: none; background: @Green; padding: 10px 0 60px; position: relative; } #AdvancedSearch button{ clear: both; background: @Dark; border: 1px solid @White; display: block; position: absolute; bottom:10px; right: 50%; margin-right: -101px; width: 200px; text-align: center; } .advancedType{ padding-left: 10px; float:left; margin-right: 10px; } .advancedSubType{ } #AdvancedSearch input{ } #AdvancedSearch hr{ border-bottom: 1px solid rgba(0,0,0,.2); } #AdvancedSearch input[type=checkbox] + label{ font-style: italic; background-size: 15px 24px; background-repeat: no-repeat; padding-left: 15px; display: inline-block; margin-right: 10px; line-height: 25px; opacity: .5; } #AdvancedSearch input[type=checkbox]:checked + label { font-style: normal; opacity: 1; } #SearchTypes{ border: 1px solid @Dark; border-width: 1px 1px 0 1px; list-style: none; margin: 0; padding: 0; float: left; width: 20%; margin-right: 2%; } #SearchTypes li{ height: 40px; line-height: 40px; font-weight: bold; text-align: center; border-bottom: 1px solid @Dark; } #SearchTypes li.selected{ background: @Dark; color: @White; } .AdSub{ margin-left: 22%; display: none; } #SearchTypes li input{ display: none; } #searchmap{ width: 99%; height: 300px; } #nrm_library_Wrapper #Logo{ background: url(/layout/NRM-Library.png) no-repeat 50% 50%; background-size: contain; display: block; width: 100%; height: 112px; margin-bottom: 20px; margin-top: 40px; } #nrm_library_Wrapper #Search{ position: relative; background: @White; border-radius: 5px; width: 40%; height: 60px; margin: 0 30%; } #nrm_library_Wrapper #Search input{ position: absolute; top:0; left: 0; margin: 0; padding: 0; background: none; border: none; width: 80%; height: 40px; padding: 10px 2% 10px 4%; font-size: 40px ;line-height: 40px; color: @Mid; } #nrm_library_Wrapper #Search button{ position: absolute; top: 0; right: 0; margin: 0; padding: 0; background: none; border: none; width: 60px; border-left: 2px solid @Green; height: 60px; background: url(/layout/search_button.png) no-repeat 50% 50%; background-size: contain; } #nrm_library_Wrapper #SearchText { width: 40%; margin: 10px 30% 0; } #nrm_library_Wrapper #AjaxResults{ margin-top: 60px; margin-right: 60px; } #nrm_library_Wrapper #AdvancedSearch{ } #Main{ text-align: justify; padding: 40px 0; } #SideBar{ width: 24%; min-height: 150px; float: left; height: 100%; z-index: 50; } #SideBar h2, #Record #Head{ margin: 0; padding: 10px; padding-left: 35px; font-size: 22px; line-height: 22px; border: 1px solid @Light; border-width: 0 0 2px; background-repeat: no-repeat; background-size: contain; } #SideBar h3{ background: @darkBackground; color: @Light; font-size: 14px;line-height: 14px; margin: 0; padding: 5px 10px; text-align: center; margin-bottom: 1px; } #SideBar .LimitGroup{ display: none; } #SideBar ul{ border: 1px solid @Light; border-width: 2px 0 0; margin: 0; padding: 0; list-style: none; } #SideBar ul li{ margin: 0; padding: 0; } #SideBar ul li a{ display: block; padding: 8px 10px 8px 30px; margin: 0; text-decoration: none; color: @Dark; } #SideBar ul li:last-child a{ margin: 0; } #SideBar ul li:hover{ background-color: rgba(0,0,0,.2); } #SideBar ul li.current { background: @Dark; } #SideBar ul li.current a{ color: @White; } #SideBar ul.current{ display: block; } #Main #SideBar input{ width: 94%; padding: 5px 3%; margin: 0; margin: 5px 0; } .searchword{ padding: 0 8px; line-height: 14px; border: 1px solid @Light; border-radius: 10px; margin: 5px; margin-bottom: 0; display: inline-block; background-size: contain; background-repeat: no-repeat; text-decoration: none; position: relative; font-weight: normal; padding-right: 24px; background: white url(/layout/del_searchword.png) 100% 0% no-repeat; background-size: 20px 20px; } .searchword:hover{ box-shadow: 0px 0px 6px @Mid; } #ResultsMenu{ overflow: auto; max-height: 500px; margin-top: 5px; border-top: 1px solid @Light; border-bottom: 1px solid @Light; } .limitSearch, .limitKeyword, .limitCategory, .limitType, .limitAuthor{ border-bottom: 1px solid @Light; font-size: 12px; line-height: 14px; text-align: left; } .limitSearch, .limitKeyword, .limitCategory, .limitType, .limitAuthor { padding: 5px 5px; text-decoration: none; font-weight: normal; display: block; background-repeat: no-repeat; overflow: hidden; padding-left: 20px; background-size: 15px 24px; background-position: 5px 0px; min-height: 10px } .limitKeyword:hover, .limitCategory:hover, .limitType:hover, .limitAuthor:hover{ background-color: @midBackground; } .limitKeyword{ background-image: url(/layout/media_icons/keyword.png); } .limitCategory{ background-image: url(/layout/media_icons/category.png); } .limitType{ background-image: url(/layout/media_icons/type.png); } .limitAuthor{ background-image: url(/layout/media_icons/author.png); } .selected{ background-color: @midBackground; } .searchword .limitSearch, .searchword .limitKeyword, .searchword .limitCategory, .searchword .limitType, .searchword .limitAuthor { padding: 3px 0; padding-left: 17px; border-bottom: none; background-position: 0 -2px; } .searchword .limitSearch{ padding-left: 0; } .searchword .limitType{ background-size: 13px 20px; background-position: 0 1px; } .recordcount{ float: right; color: @Mid; font-size: 11px; } .searchResult{ padding: 10px 45px 0; display: block; background-repeat: no-repeat; background-size: 25px 40px; background-position: 8px 5px; background-color: @White; border-bottom: 1px solid @Light; margin-bottom: 10px; text-decoration: none; font-weight: normal; min-height: 30px; } .searchResult .showAbstract, .searchResult .hideAbstract{ width: 100%; height: 15px; margin-top: 2px; background: #e1e2de no-repeat 50% -15px; padding: 0 45px; margin-left:-45px; display: block; background-image: url(/layout/show_abstract.png); } .searchResult .hideAbstract{ background-position: 50% 0; } .searchResult .abstract{ display: none; font-size: 12px; line-height: 14px; margin-top: 10px; color: @Mid; padding-bottom: 10px; } .searchResult .abstract p{ margin: 0 0 10px; } .actionmessage{ display: none; position: absolute; z-index: 999; top:150px; left: 50%; margin-left: -200px; width: 400px; background: @Green; padding: 10px; border-radius: 5px; box-shadow: 0px 0px 8px rgba(0,0,0,.6); text-align: center; color: white; } .searchResult input{ display:none; } .searchResult a{ text-decoration: none; font-weight: normal; min-height: 32px; } .date{ color: @Mid; } .hasDownload, .hasLink{ display: inline-block; padding: 2px 5px; padding-left: 18px; line-height: 11px; background: @Light no-repeat 5px 50%; color: @Mid; border-radius: 5px; margin-right: 10px; font-size: 11px; text-transform: uppercase; background-image: url(layout/download.png); background-size: 11px; } .hasLink{ background-image: url(layout/link.png); } .bookmarked { background-color: #eaffe0; } .RecordCount{ padding-top: 15px; float: left; font-weight: bold; } .ShowBookmarkForm{ position: relative; text-align: right; height: 45px; } .ShowBookmarkForm span{ background: @Green; padding: 0 10px; height: 30px; display: inline-block; line-height: 30px; border-radius: 5px; color: white; margin-bottom: 10px; } .BookmarkForm{ display: none; padding: 0 10px 10px; position: absolute; top:0; right: 0; background: @Green; color: white; } .BookmarkForm h1{ border-bottom: 1px solid white; font-size: 14px; line-height: 14px; padding: 5px 0; text-align: center; margin: 0; font-weight: bold; } .BookmarkForm button{ background: white; color: @Green; padding: 2px 10px; } .AddtoList{ float: right; margin-top: -15px; margin-right: -40px; background-image: url(/layout/bookmark.png); background-size: 30px 60px; width: 30px; height: 30px; } .bookmarked .AddtoList{ background-position: 0 -30px; } .searchResult:hover{ box-shadow: 0px 0px 6px @Mid; } .existing{ } .Remove, .RemoveList{ margin-top: -5px; margin-right: -40px; float:right; } .Remove button, .RemoveList button { padding: 5px; } .RemoveList{ margin-right: 0; } #CloseBookmark{ border-radius: 7px; background: @White; color: @Green; float: right; height: 14px; width: 14px; padding: 0; line-height: 14px; } #Record{ width: 74%; float:left; margin-left: 2%; padding: 0; } #RecordLinks{ height: 45px; list-style: none; text-align: right; margin: 0; padding: 0; } #RecordLinks li{ margin: 0; padding: 0; display: inline-block; width: 40px; height: 40px; } #RecordLinks li .hover{ float: right; width: 100px; display: none; height: 18px; margin-top:-18px; margin-right: -30px; text-align: center; color: @Mid; } #RecordLinks li:hover .hover{ display: block; width: 100px; } .share { background: url(/layout/share.png); position: relative;} .print { background: url(/layout/print.png); } .bookmark { background: url(/layout/bookmark.png); } .share:hover, .print:hover, .bookmark:hover { background-position: 0 -40px; } .addthis_sharing_toolbox{ position: absolute; top:3px; right: 0; padding-right: 40px; width: 200px; height: 32px; display: none; } .addthis_sharing_toolbox a{ width: 32px; height: 32px; } .share:hover .addthis_sharing_toolbox{ display: block; } .back{ position: relative; min-height: 26px; background: @Green; color: @White; font-size: 14px; text-decoration: none; line-height: 26px; padding: 0 10px; margin: 10px 0 10px 23px; } .arrow{ position: absolute; left: -13px; width:0px; height:0px; border-top:13px solid transparent; border-bottom:13px solid transparent; border-right:13px solid @Green; } #addRecord{ float: right; color: @White; font-weight: normal; } #RecordTitle{ background: white no-repeat 10px 15px; padding: 20px 2% 20px 60px; border-bottom: 1px solid @Light; background-size:40px; } #RecordTitle h1{ color: @Dark; } #RecordTitle h1, #RecordBody p:first-child{ margin: 0; padding: 0; } #WebLink{ display: block; background: @midBackground; color: @Dark; padding: 10px 2% 15px; text-align: center; text-decoration: none; border-bottom: 1px solid @Mid; } .download button{ background: @Dark no-repeat 15px 50%; background-size: 20px; width: 100%; border: 1px solid @White; padding-left: 45px; background-image: url(/layout/download.png); } #RecordCloud{ width: 50px; height: 45px; float: right; margin-left: 10px; display: block; background: url(/layout/recordcloud.png) 50% 50% no-repeat; overflow: hidden; text-indent: -999px; } #RecordBody{ background: white; padding: 20px 60px; } #Record h2{ font-size: 12px; line-height: 14px; margin: 0; padding: 0; margin-top: 5px; color: @Mid; opacity: .7; text-align: left; } #Record h2 a{ text-decoration: none; color: @Mid; } #Record h2 a:hover{ text-decoration: underline; } #RecordDownload{ background: @midBackground; color: @Dark; padding: 10px 2% 15px; text-align: center; } #RecordDownload p{ margin-top: 10px; text-align: center; } .download{ display: none; } .download button, #WebLink button{ background: @Dark no-repeat 15px 50%; background-size: 20px; width: 100%; border: 1px solid @White; padding-left: 45px; background-image: url(/layout/download.png); } #WebLink button{ padding-left: 40px; background-image: url(/layout/link.png); } #ReportBrokenLink{ display: none; } #ReportBrokenLink button{ background: #770000; padding: 5px; display: inline-block; width: 150px; font-size: 12px; } .listAuthors{ color: @Mid; text-align: left; } .container .button{ padding: 10px 20px; background: #97ca4d; color: #2e3233; border-radius: 4px; font-size: 16px; line-height: 16px; font-weight: bold; text-transform: uppercase; text-decoration: none; } span.edit_button, span.delete_button, span.on_button, span.off_button, span.approve_button{ background-position:50% 50%; background-repeat: no-repeat; padding-left: 22px; background-size: 70%; } span.edit_button{ background-image: url(layout/edit_button.png); } span.delete_button{ background-image: url(layout/del_button.png); background-size: 50%; } span.on_button, span.off_button{ background-image: url(layout/on_off.png); } span.off_button{ background-position:100% 50%; background-color: #A22; padding-left: 22px; border-radius: 10px; background-size: 78%; } span.approve_button{ background-image: url(layout/approve.png); } .column{ width: 28%; padding: 5px 1%; margin-right: 5%; float: left; } .column:nth-of-type(3){ margin-right: 0; } .link, .linksearch{ cursor: pointer; } .link:hover, .linksearch:hover{ background: rgba(0,0,0,.05); } #Main input, #Main textarea{ padding: 5px 10px; border-radius: 4px; border: 1px solid #bbb; } #RegistryForm{ background: white; width: 48%; margin-left: 4%; float: right; padding: 0 20px; min-height: 260px; } #existinguser{ color: darkred; display: none; } h2{ font-size: 20px; margin: 20px 0 0; } h2 img{ -webkit-filter: drop-shadow(0 0 3px rgba(35, 128, 154, 1)); filter: url(#drop-shadow); } h2 + p, h3 + p{ margin-top: 10px; } h3{ background: @midBackground; font-size: 16px; margin: 30px 0 0; padding: 5px 10px; font-weight: bold; } p{ margin: 20px 0 0; text-align: justify; } small{ font-size: 11px; line-height: 12px; opacity: .75; } a{ font-weight: bold; display: inline-block; text-decoration: underline; } .container a.PDFLink{ padding: 0; background: none; display: block; } .HomeLink{ position: absolute; bottom: 0; left: 0; height: 50px; display: block; background: none; padding: 0; margin: 0; } ul, ol{ margin: 0; padding: 5px 0 0 25px; } ul li, ol li{ padding-bottom: 5px; } ol { counter-reset: item; padding-left: 5px; } ol li { display: block } ol li:before { content: counter(item) ". "; counter-increment: item; font-weight: bold; font-size: 16px; } table{ margin: 20px 0 0; text-align: left; } table thead{ background: @Mid; color: @Dark; font-variant: normal; } table th{ background: #CCC; padding: 2px 5px; } table td{ padding: 2px; } #Cloud{ background: white; text-align: center; overflow: hidden; } button{ background: @Green; padding: 10px 15px; border: none; border-radius: 4px; color: white; font-size: 16px; cursor: pointer; } .Fold{ margin-top: 20px; color: @Dark; padding: 5px 10px; padding-right: 30px; background: rgba(35, 128, 154, 0.2) url(layout/fold_down.png) 100% 50% no-repeat; min-height: 30px; cursor: pointer; } .Fold h2{ margin-top: 0; float: left; margin-right: 20px; } .Fold td:first-child{ width:100px; } .FoldCont{ display: none; padding-bottom: 10px; background: @Mid; padding: 10px; } .FoldCont > p{ margin-top: 10px; } hr{ height: 10px; border: none; border-bottom: 1px solid @Light; margin: 0; clear: both; } .cols{ -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; text-align: left; margin-top: 10px; } .cols p{ margin: 0; text-align: left; display:list-item; } .cols li{ -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; } .threeCols{ float: left; list-style: none; margin: 0; padding: 0; width: 30%; margin-right: 3%; } .threeCols a{ margin: 0; padding: 0; background: none; } .threeCols img{ width: 100%; } .container{ width: 90%; padding: 0 5%; max-width: 1200px; margin: 0 auto; } fieldset{ border: none; padding: 0; margin: 0; } .CollapsiblePanel { margin: 0px; padding: 0px; display: none; } .CollapsiblePanelTab { text-align: center; margin: 0px auto; padding:3px; cursor: pointer; -moz-user-select: none; -khtml-user-select: none; line-height: 1.4em; background: @Green; -moz-border-radius-topright:10px; -moz-border-radius-topleft:10px; -webkit-border-top-right-radius:10px; -webkit-border-top-left-radius:10px; color: @White; font-size: 20px; } .CollapsiblePanelContent { text-align: center; margin: 0px auto; padding: 0; background:@White; border-top:none; -moz-border-radius-bottomright:10px; -moz-border-radius-bottomleft:10px; -webkit-border-bottom-right-radius:10px; -webkit-border-bottom-left-radius:10px; } .CollapsiblePanelTab a { color: @White; text-decoration: none; } .CollapsiblePanelContent table{ margin: 0; } #RecordList{ background: @White; margin: 0; } #RecordList tr:nth-child(even){ background: @Light; } #RecordList button{ padding: 5px; } #RecordList td{ padding: 2px; } .deleteClone{ position:absolute; top:3px; right:3px; color:@Dark; font-weight: bold; font-size: 20px; text-decoration: none; } .clone{ margin-bottom:4px; padding:5px; font-size:11px; color: @Mid; background: @tint; position: relative; } .searchdiv{ position: relative; } .col{ float: left; width: 28%; padding: 5px 2%; margin-right: 1%; background: rgba(100, 100, 100, 0.05); margin-bottom: 5px; } .subCat{ display: none; } .AjaxResults, #AjaxKeywords{ position: absolute; list-style: none; background: white; margin: 0; padding: 0; top: 26px; left: 6px; font-size: 11px; max-height: 300px; overflow: auto; width: 98%; z-index: 999; } #AjaxKeywords{ top: 25px; border: 1px solid @Light; box-shadow: 0px 0px 8px rgba(0,0,0,.6); display: none; } .AjaxResults a, #AjaxKeywords a{ font-weight: normal; text-decoration: none; } .AjaxResults li, #AjaxKeywords li{ padding: 2px 5px; } .AjaxResults li:nth-child(odd), #AjaxKeywords li:nth-child(odd) { background: @tint; } .addkeyword{ float: left; padding: 5px 15px 5px 5px; margin-left: 7px; border: 1px solid #697579; background: rgba(100, 100, 100, 0.05); margin-bottom: 5px; position: relative; border-radius: 5px; } .addkeyword .del, .deleteClone{ position: absolute; top:-2px; right: -5px; background: @Dark; color: @White; font-size: 11px; border-radius: 9px; line-height: 18px; width: 18px; height: 18px; text-align: center; cursor: pointer; } .deleteClone{ top:5px; right: 5px; } .btnAdd{ background: @Green; color: @White; border: none; } .cols{ -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } #SideBar .keyword{ float: left; padding: 2px 27px 2px 5px; line-height: 20px; margin-left: 5px; border: 1px solid #697579; background: rgba(100, 100, 100, 0.05); margin-bottom: 5px; position: relative; border-radius: 15px; } #SideBar .keyword .del{ position: absolute; top:2px; right: 2px; background: @Dark; color: @White; font-size: 9px; border-radius: 10px; line-height: 20px; width: 20px; height: 20px; text-align: center; } .hide, .orderby{ display: none; } #clickmap { width: 100%; height: 250px; display: block; } #Footer{ min-height: 260px; width: 90%; font-size: 11px; line-height: 12px; padding: 20px 5%; clear: both; text-align: right; background: @darkBackground; color: @Light; text-align: center; z-index: 999; } #Push{ height: 300px; } #Footer p{ max-width: 500px; margin: 0; padding: 0 10px 10px; clear: both; text-align: justify; float: right; } #Footer a{ padding: 0; background: none; color: @Green; } #Footer img{ display: inline-block; padding: 0 1%; text-align: right; } #Footer #CondamineAlliance{ display: none; } #Footer:hover #CondamineAlliance{ display: block; } #Footer ul{ list-style: none; padding: 0;margin: 0; } #Footer li{ display: inline-block; list-style: none; padding: 0 10px; margin: 0; border-right: 1px solid @Mid; } #Footer li:last-child{ border-right: none; } #AdminEdit{ text-align: center; padding: 10px 0 0; } .clear{ clear: both; } #Footer a.redfusion{ color: white; } #Footer a.shd{ color: white; background: url(http://www.stevenharris.com.au/shd_dark.png) no-repeat 0% 50%; padding-left: 25px; } #Footer table{ margin-top: 5px; } #Feedback{ text-align: center; font-size: 12px; position: fixed; height: 100%; top: 0; -webkit-transition: 0.4s ease-in-out; -moz-transition: 0.4s ease-in-out; -o-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; right: -400px; width: 430px; overflow: hidden; height: 100%; z-index: 9999; } #Feedback.active{ right: 0px; } #Feedback.active #FeedbackContainer{ box-shadow: 0px 0px 8px rgba(0,0,0,.6); } #FeedbackTab{ position: absolute; top: 350px; left: 0; padding: 5px 15px; border-radius: 5px 5px 0 0; text-transform: uppercase; font-weight: bold; line-height: 20px; -webkit-transform-origin: 0% 0%; -webkit-transform: rotate(-90deg); transform-origin: 0% 0%; transform: rotate(270deg); background: @Dark; color: @White; cursor: pointer; } #FeedbackContainer{ width: 0; margin-left: 30px; width: 400px; background: @Green; overflow-y: scroll; height: 100%; } #FeedbackContainer ul{ list-style: none; padding: 0; margin: 0; width: 100%; background: @Dark; padding-top: 10px; } #FeedbackContainer li{ display: inline-block; padding: 5px 15px; border-radius: 5px 5px 0 0; text-transform: uppercase; font-weight: bold; line-height: 20px; background: @Dark; color: @White; cursor: pointer; } #FeedbackContainer li.selected{ background: @Green; } #FeedbackContainer .helpdiv{ display: none; padding: 0 35px; width: 330px; } #Feedback { color: white; } #Feedback h1{ text-align: center; } #Feedback h2{ font-size: 14px; margin-top: 2px; padding-top: 5px; font-weight: bold; color: white; border-top: 1px solid rgba(255, 255, 255, .4); } #Feedback h2:first-child{ border: none; } #Feedback input[type="text"], #Feedback textarea{ width: 98%; padding: 1%; border: none; border-radius: 3px; } #Feedback .stars{ width: 280px; text-align: right; float: left; line-height: 24px; } #Feedback .stars > div{ float: right; } div.jRatingAverage{ } ul.starrating{ list-style: none; } .stargray, .starfill, .starblank{ float: left; width: 20px; height: 20px; background: url(layout/stars_small.png) no-repeat; margin: 0; padding: 0; margin-left: -4px; } .starfill{ } .starblank{ background-position: -20px 0 } .stargray{ background-position: -40px 0; } .jRatingAverage { background-color:@Dark; position:relative; top:0; left:0; z-index:2; height:100%; } .jRatingColor { background-color: rgba(255,255,255,.3); position:relative; top:0; left:0; z-index:2; height:100%; } .jStar { position:relative; left:0; z-index:3; } p.jRatingInfos { position: absolute; z-index:9999; background: @Green; color: @Green; display: none; width: 91px; height: 29px; font-size:16px; text-align:center; padding-top:5px; } p.jRatingInfos span.maxRate { color:@Green; font-size:14px; } #Terms{ text-decoration: underline; cursor: pointer; } #over{ display: none; width: 100%; height: 100%; position: fixed; top:0 ;left: 0; background: rgba(0,0,0,.6); z-index: 9999; } #popupWindow{ width: 90%; max-width: 800px; background: @background; height: 500px; margin: 100px auto; box-shadow:0px 0px 10px rgba(0,0,0,.5); position: relative; } #closeOver{ background: @Dark; width: 40px; height: 40px; border-radius: 20px; position: absolute; top:-10px; right: -10px; color: @White; text-align: center; line-height: 40px; font-size: 16px; } #popupWindow .popbody{ padding: 0 20px; display: block; height: 500px; overflow-y: scroll; } .info{ display: inline-block; background: @Green; color: @White; position: relative; width: 14px; height: 14px; line-height: 14px; border-radius: 7px; text-align: center; font-size: 12px; opacity: .4; } .info span{ display: none; } .info:hover{ opacity: 1; } .info:hover span{ display: block; position: absolute; left: -100px; width: 200px; bottom: 16px; padding: 5px 10px; background: @Green; box-shadow: 0 0 5px rgba(0,0,0,.4); color: white; z-index: 999; border-radius: 4px; } .name{ color: @Dark; } @media only screen and (max-width : 1000px) { .cols{ -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } #nrm_library_Wrapper #Search{ width: 60%; margin: 0 20%; } .column{ width: 90%; float: none; margin-bottom: 10px; padding: 20px 5%; border-top: 1px solid @Light; } } @media only screen and (max-width : 800px) { #Content{ width: 100% - 150px; padding: 0; margin: 0; margin-left: 150px; } .cols{ -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; } #nrm_library_Wrapper #Logo{ margin: 0 15% 0 0; width: 85%; } #nrm_library_Wrapper #Search, #Search{ width: 100%; margin: 0; margin-top: -20px; position: relative; float: none; } #MapMenuContainer{ display: none; } #mapMenu{ display: block; } #User{ display: none; } #menuButton{ display: block; } #Logo{ width: 100%; background-position: 50% 50%; float:none; } #AjaxResults{ position: absolute; top:30px; margin-top: 0; } #nrm_library_Wrapper #SearchText, #SearchText{ float: none; width: 96%; margin: 0; } #Search, #SearchText{ width: 80%; margin: 0 10%; } #Search input{ width: 80%; } } @media print { body { background: white; } #Header, #SideBar, #Footer, #RecordLinks, #Feedback, #RecordCloud{ display: none } #Record{ width: 96%; margin: 0 2%; } a:link:after { content: " (" attr(href) ") "; font-size: 11px; } }