/* * This is a manifest file that'll be compiled into application.css, which will include all the files * listed below. * * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets, * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path. * * You're free to add application-wide styles to this file and they'll appear at the top of the * compiled file, but it's generally better to create a new file per style scope. * *= require_self *= require_tree ../../../vendor/assets/stylesheets *= require_tree . *= require base *= require ForceDirected *= require jquery.mCustomScrollbar *= require jquery-ui */ @font-face { font-family: 'LatoLight'; src: url('/assets/Fonts/Lato-Lig-webfont.eot'); src: url('/assets/Fonts/Lato-Lig-webfont.eot?#iefix') format('embedded-opentype'), url('/assets/Fonts/Lato-Lig-webfont.woff') format('woff'), url('/assets/Fonts/Lato-Lig-webfont.ttf') format('truetype'), url('/assets/Fonts/Lato-Lig-webfont.svg#LatoLight') format('svg'); font-weight: normal; font-style: normal; } /* clear styles */ html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td, legend { margin: 0; padding: 0; } img { border:0; padding:0; margin:0; display:block; text-indent:-9999px; } html, body, .main, .wrapper, #container { height: 100%; overflow:hidden; } html { } body { background:#031924 url(background2-for-repeating.jpg) repeat 0 0; font-family: 'LatoLight', helvetica, sans-serif; background-attachment:fixed; color:#FFF; } h1,h2,h3,h4,h5,h6 { font-weight:normal; } h1 { display:block; text-align:left; font-family: "vinyl",sans-serif; } h2 { display:block; text-align:center; font-family: "katarine-web",sans-serif; background: url('black_bg.png'); font-size:24px; line-height:35px; } a { color:#2d6a5d; text-decoration:none; } button.button, a.button, input[type="submit"] { border: none; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2); box-shadow: 0 1px 2px rgba(0,0,0,.2); border: none; border-bottom-left-radius: 0; border-top-left-radius: 0; height: 30px; outline: none; padding: 0 0; width: 60px; -webkit-box-shadow: none; box-shadow: none; background: #69a3a4; background: -webkit-linear-gradient(top,#69a3a4,#69a3aF); background: linear-gradient(top,#4387fd,#4683ea); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4387fd,endColorstr=#4683ea,GradientType=1); vertical-align: top; color: #fff!important; margin: 0px; cursor: default!important; display: inline-block; font-weight: bold; line-height: 29px; min-width: 54px; text-align: center; text-decoration: none!important; -webkit-border-radius: 2px; border-radius: 2px; -webkit-user-select: none; } button.button:hover, a.button:hover, input[type="submit"]:hover { -webkit-box-shadow: 0 1px 0 rgba(0,0,0,.15),0 1px 2px rgba(0,0,0,.2); box-shadow: 0 1px 0 rgba(0,0,0,.15),0 1px 2px rgba(0,0,0,.2); } /* * Utility */ .clearfloat { clear:both; } .leaveSpace { display:block; height:50px; } .hidden { display: none; } /* * Layout stuffs */ #barometer_tab { display:none; } #saveMapLayout { display:none; } #error_explanation { background: #612127; padding: 30px; color: #FFF; } #error_explanation h2 { display:none; } #error_explanation ul { list-style:none; } .profile { height:100%; margin-bottom:50px; } .centeredProfile { margin:0 auto; display: block; width: 845px; } .requestInvite { display:block; margin:-720px auto 0; } .new_session, .new_user, .new_map, .edit_topic, .edit_synapse, .edit_map, .invite { display: block; width: 350px; position:absolute; left:50%; top:0; margin:200px 0 0 -195px; background: url('bg.png'); padding: 20px; border-radius: 5px; color: #000; border:1px solid #000; box-shadow: 6px 6px 8px rgba(0,0,0,0.4); } .edit_user{ display: block; width: 800px; position:absolute; left:50%; top:0; margin:50px 0 0 -420px; background: url('bg.png'); padding: 20px; border-radius: 15px; color: #000; border:2px solid #000; } .onConsole .new_map { display:none; } .onConsole .new_map button, .onConsole .new_map input.add { float:left; margin-top:5px; } .invite p { margin:10px 0; } .invite strong { text-align:center; display:block; color:#67AF9F; } #closenewtopic, #closenewsynapse { position:absolute; top: 3px; right:3px; } .anypage .new_topic { /* start it off screen while it initializes the spinner, then it will be hidden with jquery */ top:-1000px; left:-1000px; display: block; position: absolute; width:300px; margin:-40px 0 0 -50px; } .anypage .new_synapse { display: none; position: absolute; } #new_topic .twitter-typeahead { position:absolute !important; top:40px; left:50px; z-index:9999; width:202px; height: 37px; font-family: 'katarine-web'; } .anypage #topic_name, .anypage .tt-hint { width:190px; background: rgba(0,0,0,0.8); height: 25px; margin: 0; padding: 5px 5px; border: 1px solid black; outline: none; font-size: 25px; line-height: 35px; color: rgba(255,255,255,0.7); font-family: 'katarine-web'; } #metacodeImg { height:120px; } #metacodeImgTitle { color:#000; float:left; width:120px; text-align:center; margin-left:90px; } label, select, input, textarea { display:block; } label { margin-top:10px; margin-bottom:4px; } input[type="submit"] { margin-top:5px; } #user_remember_me { margin-top:11px; } #user_remember_me, label[for="user_remember_me"] { float:left; } .contentarea p, .contentarea ul, .contentarea ol, .contentarea table { font-size:14px; line-height:1.55em; padding:0.5em 0 } .contentarea ul li { padding:0.2em 0; } .contentarea ol li { padding:0.2em 0; } .contentarea ul { margin:0 0 0 1em; } .contentarea ol { margin:0 0 0 1.3em; } .main { /*overflow:hidden; */ } #infovis-canvas { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } /* --- top options --*/ .notice.metamaps, .alert.metamaps { position: absolute; margin: 20px; background: url(/assets/black_bg.png); padding: 10px; border-radius: 5px; box-shadow: 6px 6px 8px rgba(0,0,0,0.4); border:1px solid #000; } .headertop { display:block; position:fixed; top:20px; z-index:10; border-radius:5px; margin: 10px 0px 10px 10px; background:#111614; padding:5px 10px; box-shadow: 6px 6px 8px rgba(0,0,0,0.4); } .headertop .tab { background: url(tab.png) no-repeat 0 0; position:absolute; top:-11px; right:-2px; display:block; width:45px; height:15px; cursor:move; } .headertop button, .headertop input { height: 30px; background: none; color: #717474; font-family: 'LatoLight'; font-size: 17px; border: none; border-right:1px solid #717474; cursor: pointer; margin:3px 0; clear:both; float:right; } .headertop button:hover, .headertop input:hover { border-right: 1px solid #6d7310; color: #6d7310; } .wrapper { display:block; height:100%; margin:0 0; } /* bottom right corner stuffs */ .wrapper div.index { position: fixed; bottom: 9px; right: 0px; z-index: 9999; width: auto; background: rgba(0,0,0,0.7); padding: 1px 10px 0px 10px; font-family: "vinyl",sans-serif; font-style:italic; height: 35px; font-size: 30px; line-height: 38px; border:1px solid #000; border-right:none; border-bottom-left-radius:5px; border-top-left-radius:5px; } .wrapper div.index .openCheatsheet { position:absolute; top:0; left:-45px; background: rgba(0,0,0,0.3) url('MMCCicon_help.png') no-repeat center center; background-size: 32px 32px; border:1px solid #000; border-radius:5px; height:36px; width:36px; cursor:pointer; } .wrapper div.index .openCheatsheet:hover { background-color: rgba(0,0,0,0.5); } .wrapper div.index span { float:left; } .wrapper div.index span.mapName { text-transform:uppercase; margin-right:9px; } .wrapper div.index span.mapInfo { width: 24px; height: 24px; line-height: 24px; text-align: center; margin-top: 5px; font-size: 27px; background: url('MMCCicon_info.png') no-repeat center center; background-size:24px 24px; cursor:pointer; } .wrapper h1.index { position: fixed; bottom: 9px; right: 0; z-index: 9999; width: auto; background: rgba(0,0,0,0.7); padding: 1px 10px 0px 20px; text-transform:uppercase; font-style:italic; height: 35px; font-size: 30px; line-height: 38px; border:1px solid #000; border-right:none; border-bottom-left-radius:5px; border-top-left-radius:5px; } /* account */ .sidebarAccount { position:absolute; top:5px; right:0; z-index:200; width: 35px; height:35px; } .sidebarAccountIcon { position:absolute; width: 35px; height: 35px; background: rgba(0,0,0,0.7) url('MMCCicon_mapper.png') no-repeat center center; background-size: 28px 28px; cursor:pointer; } .sidebarAccountBox { position:absolute; display:none; height:auto; background: rgba(0,0,0,0.9); top: 35px; right:0; padding: 10px; border: 1px solid black; min-width:120px; font-family: 'LatoLight', helvetica, sans-serif; } .sidebarAccountBox.loggedin { width:auto; } .sidebarAccountBox.loggedout { width:200px; } .sidebarAccountBox h3 { font-family: 'vinyl', helvetica, sans-serif; text-transform:uppercase; font-style:italic; } .sidebarAccountBox ul { list-style:none; } .sidebarAccountBox li.accountIcon { padding: 0; background-size: 18px 18px; background-repeat: no-repeat; background-position: 0px 6px; font-size: 18px; line-height: 20px; } li.accountIcon:hover { background-position: 4px 6px; } li.accountMaps { background-image: url('MMCCicon_map.png'); } li.accountSettings { background-image: url('MMCCicon_settings.png'); } li.accountInvite{ background-image: url('MMCCicon_invite.png'); } li.accountLogout { background-image: url('MMCCicon_logout.png'); } li.accountIcon a { display:block; padding: 6px 0 6px 25px; } .sidebarAccountBox a { color:white; } .sidebarAccountBox input[type="email"], .sidebarAccountBox input[type="password"] { width: 200px; height: 32px; font-size: 15px; direction: ltr; -webkit-appearance: none; appearance: none; display: inline-block; margin: 0; padding: 0 8px; background: #fff; border: 1px solid #d9d9d9; border-top: 1px solid #c0c0c0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; font: -webkit-small-control; color: initial; letter-spacing: normal; word-spacing: normal; text-transform: none; text-indent: 0px; text-shadow: none; display: inline-block; text-align: start; } .sidebarAccountBox .links a { display:block; margin-top:5px; } /* wand */ .sidebarWand { position:absolute; top:5px; right:35px; z-index:200; width: 35px; height:35px; border-right:1px solid black; } .sidebarWandIcon { position:absolute; width: 35px; height: 35px; background: rgba(0,0,0,0.7) url('MMCCicon_wand.png') no-repeat center center; background-size: 28px 28px; cursor:pointer; } .sidebarWandBox { position:absolute; display:none; height:auto; width:182px; background: rgba(0,0,0,0.9); top: 35px; right:-36px; padding: 10px; border: 1px solid black; font-family: 'LatoLight', helvetica, sans-serif; } .sidebarWandBox ul { list-style:none; } .sidebarWandBox li.wandIcon { padding: 6px 0 6px 25px; background-size: 18px 18px; background-repeat: no-repeat; background-position: 0px 6px; font-size: 18px; line-height: 20px; color:white; cursor:pointer; } li.wandIcon:hover { background-position: 4px 6px; } li.wandSaveLayout { background-image: url('MMCCicon_save_layout.png'); } li.wandForkMap { background-image: url('MMCCicon_save_new_map.png'); } li.wandChangeMetacodes { background-image: url('MMCCicon_metacode_set.png'); } /* end wand */ /* wand */ .sidebarFilter { position:absolute; top:5px; right:71px; z-index:200; width: 35px; height:35px; border-right:1px solid black; } .sidebarFilter.loggedout { right:35px; } .sidebarFilterIcon { position:absolute; width: 35px; height: 35px; background: rgba(0,0,0,0.7) url('MMCCicon_filter.png') no-repeat center center; background-size: 28px 28px; cursor:pointer; } /* we set a few of these params off screen to begin with, so that when we initialize the scroll bar it works, but then we hide the element and position it correctly */ .sidebarFilterBox { position:fixed; top: -1000px; right:-1000px; display:block; /* position:absolute; top: 35px; right:-72px; display:none; */ height:auto; width:260px; background: rgba(0,0,0,0.9); padding: 10px; border: 1px solid black; font-family: 'LatoLight', helvetica, sans-serif; text-align:center; } h3.filterByMetacode { margin-bottom: 10px; text-align: left; float:left; } .sidebarFilterBox span { float: left; background: #17AFBD; padding: 1px 4px; border-radius: 2px; margin-left: 5px; cursor: pointer; } .sidebarFilterBox #filter_by_metacode { height:270px; overflow:hidden; } .sidebarFilterBox ul { list-style:none; } .sidebarFilterBox li { float:left; width:61px; height:70px; cursor:pointer; } .sidebarFilterBox li:hover { background-color: rgba(255,255,255,0.1); } .sidebarFilterBox li img { width:45px; height:45px; margin:0 auto; } .sidebarFilterBox li p { font-size:11px; line-height:11px; font-family:arial, sans-serif; } .sidebarFilterBox li.toggledOff { opacity: 0.4; } /* end filter by metacode */ /* collaborate */ .sidebarCollaborate { position:absolute; top:5px; right:106px; z-index:200; width: 35px; height:35px; border-right:1px solid black; } .sidebarCollaborateIcon { position:absolute; width: 35px; height: 35px; background: rgba(0,0,0,0.7) url('MMCCicon_realtime_junto.png') no-repeat -3px -1px; background-size: 40px 40px; cursor:pointer; } .sidebarCollaborateBox { position:absolute; display:none; height:auto; width:auto; background: rgba(0,0,0,0.9); top: 36px; right:0; padding: 10px; border: 1px solid black; min-width:120px; font-family: 'LatoLight', helvetica, sans-serif; } /* end collaborate */ /* search */ .sidebarSearch { position:absolute; top:5px; left:0; height: 35px; z-index:200; } .sidebarSearchIcon { float:left; width: 35px; height: 35px; background: rgba(0,0,0,0.7) url('search_icon_32x32.png') no-repeat center center; background-size: 25px 25px; cursor:pointer; } .sidebarSearch .twitter-typeahead { float:left; } .sidebarSearchField, .sidebarSearch .tt-hint { height:25px; padding:5px 0; width:0px; margin: 0; border: 0; outline: none; font-size: 25px; line-height:35px; background:rgba(0,0,0,0.7); color: rgba(255,255,255,0.6); font-family: 'katarine-web'; } .sidebarSearch .tt-dropdown-menu { left:-35px !important; background: rgba(0,0,0,0.7); min-width: 440px; border: 1px solid black; } .sidebarSearch .tt-dropdown-menu h3 { font-family:'vinyl',helvetica,sans-serif; text-transform:uppercase; font-style:italic; font-size:20px; line-height:20px; margin: 10px 0 3px 10px; float:left; } .sidebarSearch .tt-dropdown-menu .limitToMe { float:left; width: 15px; height: 15px; margin-top: 11px; margin-left: 15px; } .sidebarSearch .tt-dropdown-menu .limitToMeLabel { float:left; margin-top: 11px; } .sidebarSearch .tt-dropdown-menu .minimizeResults { float:right; width:35px; height:35px; background: url('/assets/MMCCicon_minimize_arrow.png') no-repeat center center; background-size: 25px 25px; cursor:pointer; } .sidebarSearch .tt-dropdown-menu .maximizeResults { float:right; width:35px; height:35px; background: url('/assets/MMCCicon_maximize_arrow.png') no-repeat center center; background-size: 25px 25px; cursor:pointer; } .sidebarSearch .tt-suggestions { font-family:'LatoLight', helvetica, sans-serif; overflow:visible; } .sidebarSearch .tt-suggestion { background: rgba(0,0,0,0.5); border: 1px solid black; } .sidebarSearch .tt-is-under-cursor { background:black; } .sidebarSearch .tt-dataset-maps .tt-is-under-cursor .resultmap, .sidebarSearch .tt-dataset-topics .tt-is-under-cursor .resulttopic { min-height: 57px; } .sidebarSearch .tt-suggestion .icon { float:left; width:36px; height:36px; margin-right:5px; } .sidebarSearch .topicMetacode { float:left; margin-right:5px; max-width:70px; } .sidebarSearch .tt-dataset-topics .topicIcon { width:36px; height:36px; } .sidebarSearch .tt-dataset-topics .tt-is-under-cursor .topicIcon { margin:0 auto; padding-left:2px } .sidebarSearch .tt-dataset-topics .metacodeTip { display:none; } .sidebarSearch .tt-dataset-topics .tt-is-under-cursor .metacodeTip { display: block; font-family: 'vinyl'; text-transform: uppercase; font-style: italic; font-size: 13px; margin: 0 5px 0 2px; text-align: center; } .sidebarSearch .tt-dataset-mappers .tt-suggestion .icon { width:28px; height:28px; padding:4px; } .sidebarSearch .resultText { width: 240px; display: block; float: left; } .sidebarSearch .resultTitle { font-weight:bold; font-size:20px; line-height:22px; width:100%; padding-top:8px; } .sidebarSearch .resultDesc { font-style:italic; font-size:16px; line-height:16px; width:100%; padding: 6px 0; } .sidebarSearch .tip { display:none; } .sidebarSearch div.autoOptions { width: 122px; float: right; position:relative; display:none; } .sidebarSearch .tt-is-under-cursor .autoOptions { display:block; } .sidebarSearch .tt-suggestion .resultnoresult .autoOptions { display:none; } .sidebarSearch .autoOptions button, .sidebarSearch .autoOptions a, .sidebarSearch .autoOptions div { position: absolute; padding: 0; margin: 0; border: none; outline: none; } .sidebarSearch button.addToMap { width: 20px; height: 20px; background: url(/assets/MMCCicon_add.png) no-repeat center center; background-size: 18px 18px; top: 30px; left: 84px; cursor: pointer; } .sidebarSearch a.goTo { width: 20px; height: 20px; background: url(/assets/MMCCicon_pop-out.png) no-repeat center center; background-size: 18px 18px; top: 7px; left: 84px; } .sidebarSearch div.mapCount { width: 20px; height: 20px; background: url(/assets/MMCCicon_map.png) no-repeat 0px center; background-size: 14px 14px; top: 7px; left: 39px; padding-left: 18px; font-size: 12px; line-height: 20px; } .sidebarSearch div.topicCount { width: 20px; height: 20px; background: url(/assets/MMCCicon_topic.png) no-repeat 0px center; background-size: 14px 14px; top: 7px; left: 39px; padding-left: 18px; font-size: 12px; line-height: 20px; } .sidebarSearch div.synapseCount { width: 20px; height: 20px; background: url(/assets/MMCCicon_synapse.png) no-repeat 0px center; background-size: 15px 15px; top: 30px; left: 38px; padding-left: 19px; font-size: 12px; line-height: 20px; } .sidebarSearch div.topicOriginatorIcon { width: 20px; height: 20px; background: url(/assets/MMCCicon_mapper.png) no-repeat center center; background-size: 17px 17px; top: 7px; left: 13px; } .sidebarSearch .tip { position: absolute; background: white; width: auto; top: 0; right: 23px; color: black; white-space: nowrap; border-radius: 4px; font-size:15px !important; font-family:'LatoLight'; line-height:17px; padding: 3px 5px 2px; border: 1px solid black; z-index:100; } .sidebarSearch .mapCount .tip,.sidebarSearch .synapseCount .tip, .sidebarSearch .topicCount .tip { right:40px; } .sidebarSearch .hoverForTip:hover .tip { display:block; } .sidebarSearch .mapContributorsIcon .mapContributors { right:40px; white-space:normal; width:200px; } .sidebarSearch div.mapContributorsIcon { height: 20px; background: url(/assets/MMCCicon_mapper.png) no-repeat 0px center; background-size: 17px 17px; top: 7px; right: 85px; padding-left: 19px; font-size: 12px; line-height: 20px; padding-right: 5px; } .sidebarSearch div.topicPermission, .sidebarSearch div.mapPermission { width: 20px; height: 20px; background-size: 19px 19px !important; top: 30px; left: 13px; } .sidebarSearch div.topicPermission.commons, .sidebarSearch div.mapPermission.commons { background: url(/assets/MMCCicon_commons.png) no-repeat center center; } .sidebarSearch div.topicPermission.public, .sidebarSearch div.mapPermission.public { background: url(/assets/MMCCicon_public.png) no-repeat center center; } .sidebarSearch div.topicPermission.private, .sidebarSearch div.mapPermission.private { background: url(/assets/MMCCicon_private.png) no-repeat center center; } .sidebarSearch .tt-dataset-mappers a.goTo { top:7px; } .sidebarSearch .tt-dataset-mappers div.mapCount { top:8px; } /* end search */ .nodemargin { padding-top:120px; } .divider { margin: 20px 50px 20px 50px; border-bottom:2px solid #FFF; } .empty { margin-left:50px; } #menus { margin:0 7px; } #cards { height:100%; } #cards p.empty { margin-left:50px; } /* right click menu */ .rightclickmenu { position:absolute; background:white; z-index: 20; border-radius: 2px; color: black; } .rightclickmenu > ul { padding: 2px; } .rightclickmenu ul li { list-style: none; padding: 3px 45px 3px 30px; font-family: arial, sans-serif; font-size: 17px; line-height: 17px; background-repeat: no-repeat; background-size: 20px 20px; background-position: 5px 2px; } .rightclickmenu ul li:hover { background-color: #e4e4e4; background-position: 7px 2px; cursor:pointer; } .rightclickmenu .rc-delete { background-image: url(MMCCicon_delete_black.png); } .rightclickmenu .rc-remove { background-image: url(MMCCicon_remove_from_map_black.png); } .rightclickmenu .rc-hide { background-image: url(MMCCicon_hide.png); } .rightclickmenu .rc-popout { background-image: url(MMCCicon_pop-out_black.png); } .rightclickmenu p { padding:7px; } /* end right click menu */ /* --- styling the logo button ---*/ /*.footer { width: 188px; display: block; position: fixed; bottom: 9px; height: 38px; background: rgba(0,0,0,0.5); border-bottom-right-radius: 5px; border-top-right-radius: 5px; z-index: 15000; border:1px solid #000; } .logo { position:fixed; bottom:6px; left:10px; z-index:12; display:block; width:auto; padding: 3px 8px; margin: -0.75em 0 0; } */ .footer { display: block; position: fixed; bottom: 9px; height: 35px; z-index: 15000; border:1px solid #000; border-bottom-right-radius:5px; border-top-right-radius:5px; } .addMap { position: absolute; right: -50px; top: -1px; width: 44px; height: 35px; background: rgba(185,182,237,0.3) url('MMCCicon_add_map.png') no-repeat 3px -4px; background-size: 40px 40px; border-left: 1px solid rgba(255,255,255,0.6); border-radius: 5px; border: 1px solid black; cursor:pointer; } .addMap:hover { background-color: rgba(185,182,237,0.5); } .logo { z-index:12; display:block; width: 136px; background: rgba(0,0,0,0.7) url(menu_icon_32.png) no-repeat -10px 8px; padding: 5px 0px 1px 15px; background-size: 22px 20px; } #mainTitle { padding: 0 5px; } #mainTitle a { color:#FFF; font-family: "vinyl",sans-serif; font-style: italic; text-transform:uppercase; font-weight: 400; font-size:30px; line-height:30px; } .footer .menu { display:none; position:absolute; border:none; bottom:36px; left:-1px; height:124px; z-index:12; width:151px; color: #67AF9F; white-space: nowrap; text-align: center; font-size: 16px; overflow: hidden; padding: 0; margin: 0; /*border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; box-shadow: 0 2px rgba(0, 0, 0, 0.05), 0 -2px rgba(0, 0, 0, 0.05) inset; -webkit-box-shadow: 0 2px rgba(0, 0, 0, 0.05), 0 -2px rgba(0, 0, 0, 0.05) inset; -moz-box-shadow: 0 2px rgba(0, 0, 0, 0.05), 0 -2px rgba(0, 0, 0, 0.05) inset;*/ background: rgba(0,0,0,0.7);/*url('black_bg.png'); */ border-left:1px solid #000; border-right:1px solid #000; } .footer ul li { margin:0; clear:both; float:none; list-style-type:none; display:block; padding:0; text-align:center; } li.beta { border-top: 1px solid black; border-bottom: 1px solid black; position: relative; height: 30px; } .inBeta { background: rgba(0,0,0,0.6); display: inline-block; color: white; height: 30px; padding: 0 5px; font-family: 'LatoLight'; font-size: 30px; position: absolute; top: 0; left: 0; line-height: 30px; } li.beta button { position: absolute; top: 0; right: 0; width: 84px; border-radius: 0; font-size: 12px; margin: 0; } li.meta, li.tutorial, li.exploreMaps { height:30px; line-height:30px; font-size:20px; } li.meta a, li.tutorial a, li.exploreMaps a { display:block; } li.tutorial, li.exploreMaps { border-top:1px solid white; } .footer ul li a { color: #FFF; } .home_bg { display:block; height:100%; } #homeMap { height: 350px; width: 510px; margin: 0 auto; transform: rotate(18deg); -ms-transform: rotate(18deg); -webkit-transform: rotate(18deg); } #homeMap-label div.node{ transform: rotate(-18deg); -ms-transform: rotate(-18deg); -webkit-transform: rotate(-18deg); font-family: 'vinyl'; text-transform: uppercase; } .home_content { width: 830px; margin:0 auto; } span.blue { color: #36bbe8; } .home_desc { font-style: oblique; text-transform: uppercase; font-family: 'vinyl'; font-size: 40px; margin: 40px 20px 25px; text-align:center; background: url('home_bg2.png') no-repeat center -46px; } .contact { text-align: center; margin: 1em 0 1em 0; } .contact a { color: #36bbe8; } #edit_synapse label, #edit_synapse_left, #edit_synapse_right { display: inline-block; } #edit_synapse label.left { margin-right: 0.5em; } .templates { display:none; }