MediaWiki:Common.css
Jump to navigation
Megjegyzés: közzététel után frissítened kell a böngésződ gyorsítótárát, hogy lásd a változásokat.
- Firefox / Safari: tartsd lenyomva a Shift gombot és kattints a Frissítés gombra a címsorban, vagy használd a Ctrl–F5 vagy Ctrl–R (Macen ⌘–R) billentyűkombinációt
- Google Chrome: használd a Ctrl–Shift–R (Macen ⌘–Shift–R) billentyűkombinációt
- Internet Explorer / Edge: tartsd nyomva a Ctrl-t, és kattints a Frissítés gombra, vagy nyomj Ctrl–F5-öt
- Opera: Nyomj Ctrl–F5-öt
/* CSS placed here will be applied to all skins */ /* HEADER AND TOP NAVIGATION */ /* Prevent sitenotice from showing */ div.sitenotice { display: none; } #mirage-fixed-header { background: #2d5488; box-shadow: none; } #mirage-top-header { background: #feb; } /* Respect width of logo */ img.mw-logo-icon { width: inherit; } /* Word mark color in fixed header */ .mw-wordmark-container span.mw-logo-wordmark { color: #fff; } /* Remove duplicated word mark from main page */ #mirage-navigation-header .mw-logo-wordmark { display: none; } .skin-mirage-dropdown-list a { font-weight: normal; } div#right-navigation { background-color: transparent; } li.mw-list-item, li.skin-mirage-dropdown-container { background: #2d5488; } /* Colors of Recent Changes and Edit rows buttons on hover*/ #module-site-tools > ul > li:hover, li .mw-list-item:hover { background: #2d5488; } /* Background color of "more" button in Recent Changes row */ #module-site-tools > ul > li:last-child { background: #2d5488; color: black; } /* Backgorund color of the contents of the dropdown list on "more" button in Recent Changes row */ div.skin-mirage-dropdown-list > ul > li.mw-list-item { background: none; } /* Move wiki navigation menus to same line as logo */ div#module-site-navigation { margin-top: -2.5rem; } /* Limit space used by site navigation to avoid overlapping buttons */ div#module-site-navigation.skin-mirage-mirage-navigation { max-width: 70%; } /* Move Right Navigation (edit button etc.) in line with Recent changes */ div#right-navigation { position: absolute; margin-right: 15px; margin-top: -1.25rem; right: 0px; } /* Recent Changes button text */ #module-site-tools > ul > li:nth-child(1) > a { color: #fff; } /* Recent Changes button hover text color */ #module-site-tools > ul > li:hover > :not(.skin-mirage-ooui-icon-no-label) { color: rgba(255,255,255,0.85); } /* Edit button row hover styling */ #p-views > ul > li:hover, #mirage-right-rail-button:hover { background-color: rgba(255,255,255,0.15); background: #2d5488; color: #404244; } /* Have to set this color back to transparent to ensure no text shows on the right rail button on hover */ #mirage-right-rail-button:hover { color: transparent; } /* Adjust color for Recent Changes icon */ .skin-mirage-ooui-icon-recentChanges:before { background-image: url(/load.php?modules=skin.mirage.icons&image=recentChanges&format=rasterized&lang=en&skin=fallback&version=14jep); background-image:linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E recent changes %3C/title%3E%3Cg fill=%22%23fff%22%3E%3Cpath d=%22M1 3h16v2H1V3Zm0 6h11v2H1V9Zm0 6h7v2H1v-2Zm17.8-3.1 1-1.1a.6.6 0 0 0 0-.8L18 8.2a.6.6 0 0 0-.8 0l-1 1 2.6 2.7Zm-3.3-2L10 15.3V18h2.6l5.6-5.5-2.7-2.7Z%22/%3E%3C/g%3E%3C/svg%3E"); } /* Adjust color for Special Pages icon */ .skin-mirage-ooui-icon-specialPages:before { background-image: url(/load.php?modules=skin.mirage.icons&image=specialPages&format=rasterized&lang=en&skin=fallback&version=dk89p); background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E special pages %3C/title%3E%3Cg fill=%22%23000%22%3E%3Cpath fill=%22%23fff%22 d=%22M7 0a2 2 0 0 0-2 2h9a2 2 0 0 1 2 2v12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2z%22/%3E%3Cpath fill=%22%23fff%22 d=%22M13 20H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v13a2 2 0 0 1-2 2zm-6.5-3.5.41-1.09L8 15l-1.09-.41-.41-1.09-.41 1.09L5 15l1.09.41.41 1.09zm2.982-.949.952-2.561 2.53-.964-2.53-.964L9.482 8.5l-.952 2.562-2.53.964 2.53.964.952 2.561zM6 10.5l.547-1.453L8 8.5l-1.453-.547L6 6.5l-.547 1.453L4 8.5l1.453.547L6 10.5z%22/%3E%3C/g%3E%3C/svg%3E") } /* Adjust color for Random Page icon */ .skin-mirage-ooui-icon-die:before { background-image:url(/load.php?modules=skin.mirage.icons&image=die&format=rasterized&skin=fallback&version=14jep); background-image:linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E die %3C/title%3E%3Cg fill=%22%23fff%22%3E%3Cpath d=%22M3 1a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2zm2 16a2 2 0 1 1 2-2 2 2 0 0 1-2 2zM5 7a2 2 0 1 1 2-2 2 2 0 0 1-2 2zm5 5a2 2 0 1 1 2-2 2 2 0 0 1-2 2zm5 5a2 2 0 1 1 2-2 2 2 0 0 1-2 2zm0-10a2 2 0 1 1 2-2 2 2 0 0 1-2 2z%22/%3E%3C/g%3E%3C/svg%3E"); } /* Adjust color for three dots menu icon */ .skin-mirage-ooui-icon-ellipsis:before { background-image:url(/load.php?modules=skin.mirage.icons&image=ellipsis&format=rasterized&skin=fallback&version=14jep); background-image:linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E ellipsis %3C/title%3E%3Cg fill=%22%23fff%22%3E%3Ccircle cx=%2210%22 cy=%2210%22 r=%222%22/%3E%3Ccircle cx=%223%22 cy=%2210%22 r=%222%22/%3E%3Ccircle cx=%2217%22 cy=%2210%22 r=%222%22/%3E%3C/g%3E%3C/svg%3E"); } /* Background color for Edit Button and Right Rail collapse/expand button */ #mirage-edit-button > li, #mirage-right-rail-button { background: #2d5488; } /* Border color definitions for the top navigation buttons */ #mirage-edit-button > li, #mirage-edit-button > li + li, #mirage-edit-button > li:first-child, #mirage-edit-button > li:last-child, #mirage-edit-button > li:hover, #mirage-edit-button > li + li:hover, #mirage-edit-button > li:hover:first-child, #mirage-edit-button > li:hover:last-child, #mirage-right-rail-button, #mirage-right-rail-button:focus { border-color: #b99968; } /* Hover color for Edit button */ #mirage-edit-button > li:first-child a:hover { color: rgba(255,255,255,0.85); } /* Color for Edit button */ #mirage-edit-button > li:first-child a { color: white; /*Previous value #white*/ } /* Adjust color for Edit icon */ .skin-mirage-ooui-icon-edit-invert:before { background-image:url(/load.php?modules=skin.mirage.icons&image=edit&variant=invert&format=rasterized&skin=fallback&version=dk89p); background-image:linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E edit %3C/title%3E%3Cg fill=%22%23fff%22%3E%3Cpath d=%22m16.77 8 1.94-2a1 1 0 0 0 0-1.41l-3.34-3.3a1 1 0 0 0-1.41 0L12 3.23zM1 14.25V19h4.75l9.96-9.96-4.75-4.75z%22/%3E%3C/g%3E%3C/svg%3E"); } /* Adjust color for Watch icon */ .skin-mirage-ooui-icon-star-invert:before,#ca-watch a:before { background-image:url(/load.php?modules=skin.mirage.icons&image=star&variant=invert&format=rasterized&skin=fallback&version=dk89p); background-image:linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E star %3C/title%3E%3Cg fill=%22%23fff%22%3E%3Cpath d=%22M20 7h-7L10 .5 7 7H0l5.46 5.47-1.64 7 6.18-3.7 6.18 3.73-1.63-7zm-10 6.9-3.76 2.27 1-4.28L3.5 8.5h4.61L10 4.6l1.9 3.9h4.6l-3.73 3.4 1 4.28z%22/%3E%3C/g%3E%3C/svg%3E")} /* Adjust color for Unwatch icon */ .skin-mirage-ooui-icon-unStar-invert:before,#ca-unwatch a:before { background-image:url(/load.php?modules=skin.mirage.icons&image=unStar&variant=invert&format=rasterized&skin=fallback&version=dk89p); background-image:linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E un-star %3C/title%3E%3Cg fill=%22%23fff%22%3E%3Cpath d=%22M20 7h-7L10 .5 7 7H0l5.46 5.47-1.64 7 6.18-3.7 6.18 3.73-1.63-7z%22/%3E%3C/g%3E%3C/svg%3E")} /* Adjust color for "More" menu icon */ .skin-mirage-ooui-icon-indicator-down-invert:before { background-image:url(/load.php?modules=skin.mirage.indicators&image=down&variant=invert&format=rasterized&skin=fallback&version=1h8wn); background-image:linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22 viewBox=%220 0 12 12%22%3E%3Ctitle%3E down %3C/title%3E%3Cg fill=%22%23fff%22%3E%3Cpath d=%22M9.9 2.9 6 6.8 2.1 2.9 1 4l5 5 5-5z%22/%3E%3C/g%3E%3C/svg%3E"); } /* Adjust color for Right Rail button icon */ .skin-mirage-ooui-icon-doubleChevronEnd:before { background-image:url(/load.php?modules=skin.mirage.icons&image=doubleChevronEnd&format=rasterized&lang=en&skin=fallback&version=14jep); background-image:linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E double chevron start %3C/title%3E%3Cg fill=%22%23fff%22%3E%3Cpath d=%22M11 2 9.7 3.3l6.6 6.7-6.6 6.7L11 18l8-8zM2.5 2 1 3.3 7.8 10l-6.7 6.7L2.5 18l8-8z%22/%3E%3C/g%3E%3C/svg%3E"); } /* Hide the editLock icon that doesn't want to be edited for some unexplainable reason */ .skin-mirage-ooui-icon-editLock-invert:before { display: none; } /* Dropdown list for history, deletion, protection etc. */ li#ca-history, li#ca-delete, li#ca-move, li#ca-protect { background: none; } /* Remove Main Page header from Main page */ body.page-Main_Page .mw-page-title-main { display: none; } /* Remove the Page and Discussion buttons from all pages */ div#left-navigation nav#p-namespaces { display: none; } #module-page-navigation { margin: 0; } /* Styling of username when logged in / don't show username */ #mirage-fixed-header .skin-mirage-username { color: orange; display: none; } /* Styling for background of dropdown on username/not logged in */ .skin-mirage-personaltools-dropdown li { background: none; } /* Text color of dropdown on username/not logged in */ li#pt-login { color: black; } /* Text color on dropdown when no new messages */ .skin-mirage-no-new-messages { color: black; } /* Main background */ body { background: #a6805a; background-position: center center; background-size: cover; background-attachment: fixed; background-repeat: no-repeat; background-image: url("/skins/MirageGrepolis/images/background.jpg"); background-position: center center; background-size: cover; background-repeat: no-repeat; } /* Removes endless spinner for logged out users on main page */ #mw-indicator-smw-entity-examiner { display: none; } /* GENERAL ARTICLE STYLING */ main#content.mw-body, main#content.mw-body-content, #mirage-navigation-header, #module-page-navigation, .skin-mirage-content-container { background: #feb; } h1, h2, .skin-mirage-right-rail-module h3, hr { border-color: #d4ba91; } p, h1, h2, h3, h4, h5, h6, li, i { color: #5e321a; } h2 a, h2 a:visited { font-size: normal; color: #3d2718; font-weight: bold; } h2 a:hover { color: #1480a4; } p a, p a:visited, li a, li a:visited { color: #3d2718; font-weight: bold; } p a:hover { color: #1480a4; } /* Warning on MediaWiki:Custom.css page */ .mw-editinginterface { color: ##5e321a; } /* Table of Contents styling */ .toc { background-color: #d4ba91; border: 1px solid #996b39; border-color: rgba(110,57,0,0.5); min-width: 175px; } .toc h2 { color: #5e321a; } .toc li a, .toc li a:visited, .toctogglelabel { color: #5f391a; font-weight: normal; } /* In-article edit icon styling */ a.skin-mirage-ooui-icon.skin-mirage-ooui-icon-edit.skin-mirage-ooui-icon-small, a:visited.skin-mirage-ooui-icon.skin-mirage-ooui-icon-edit.skin-mirage-ooui-icon-small { color: #3d2718; } a:hover.skin-mirage-ooui-icon.skin-mirage-ooui-icon-edit.skin-mirage-ooui-icon-small { color: #1480a4; } /* TABLE STYLING */ table th { font-weight: normal; background-color: #b99968; color: #5e321a; padding: 10px; } table, th, td, .wikitable { /* Border definition needs to be marked !important to overwrite border color defined inline in multiple navigation templates like Template:GodNav; */ border: 1px solid rgba(110,57,0,0.5) !important; } /* Special .announcement class table on the Main Page */ th.announcement { font-weight: bold; } table td .announcement { color: 5e321a; } table td, table th { text-align: center; padding: 5px; box-shadow: 0px 0px 1px 1px rgba(255,255,255,0.1) inset; background-color: #d4ba91 !important; } td, th { padding: 0; } td { display: table-cell; vertical-align: inherit; } table { display: table !important; width: 100%; border-collapse: separate; border-spacing: 1px !important; margin-bottom: 4px; border-radius: 3px; border-color: rgba(110,57,0,0.5); } table center { color: #5e321a; } table a, table a:visited { color: #3d2718; } table a:hover { color: #1480a4; } /* RIGHT RAIL STYLING */ #mirage-right-rail { background: #feb; } #mirage-right-rail a, #mirage-right-rail a:visited { color: #3d2718; } #mirage-right-rail a:hover { color: #1480a4; } /* Remove background color on Page tools section of Right Rail */ .skin-mirage-module-body ul.skin-mirage-unstyled-list > li { background: none; } /* FOOTER STYLING */ footer { display: grid; align-content: center; justify-content: center; justify-items: center; margin-top: -25px; } footer.mw-footer { background-color: transparent; box-shadow: none; align-content: center; } #footer-info-lastmod, #footer-info-copyright, #footer-places-privacy, #footer-places-about, #footer-places-disclaimer { display: inline-block; margin-right: 15px; } li#footer-info-lastmod, li#footer-info-copyright { font-size: small; color: #efdba6; } footer ul.skin-mirage-unstyled-list#footer-info { margin-right: 0px; color: #efdba6; text-shadow: 1px 1px 1px black; } div#footer-places { margin-right: auto; margin-left: auto; } .mw-footer p, .mw-footer h3 { color: #efdba6; } .mw-footer a { color: #efdba6; font-weight: normal; } .mw-footer a:hover { color: #efdba6; } .mw-footer li { line-height: 1 !important; } div#footer-places { margin-left: initial; } h3#footer-places-label { display: none; } /* The animated tiles on the main page */ #mf-menu { display: none; } .infinitum { background-color: #F9F9F9; border: 1px solid #AAAAAA; font-size: 95%; padding: 5px; } .infinirow { border-bottom: 1px solid #AA9977 !important; border-left: medium none currentColor !important; border-right: 1px solid #AA9977 !important; border-top: medium none currentColor !important; padding: 2px 3px; } .tilt { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; } .tilt:hover { -webkit-transform: rotate(-10deg); -moz-transform: rotate(-10deg); -o-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } .tiltright { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; } .tiltright:hover { -webkit-transform: rotate(10deg); -moz-transform: rotate(10deg); -o-transform: rotate(10deg); -ms-transform: rotate(10deg); transform: rotate(10deg); } .move { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; } .move:hover { -webkit-transform: translate(0px,-10px); -moz-transform: translate(0px,-10px); -o-transform: translate(0px,-10px); -ms-transform: translate(0px,-10px); transform: translate(0px,-10px); } .grow img { height: 500px; width: 750px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; } .grow img:hover { width: 1000px; height: 1800px; } div.mvisto:hover { opacity:0.7; } div.NavFrame { margin: 0; padding: 1px; border: 0px solid #322618; text-align: top; border-collapse: collapse; font-size: 95%; } div.NavFrame + div.NavFrame { border-top-style: none; border-top-style: hidden; } div.NavPic { background-color: #fff; margin: 0; padding: 0px; float: left; } div.NavFrame div.NavHead { height: 1.9em; font-weight: bold; background-color: #C0A875; position: relative; } div.NavFrame p, div.NavFrame div.NavContent, div.NavFrame div.NavContent p { font-size: 12px; } div.NavEnd { margin: 0; padding: 0; line-height: 1px; clear: both; } a.NavToggle { position: absolute; top: 0; right: 3px; font-weight: normal; font-size: 93%; } .slideUp{ animation-name: slideUp; -webkit-animation-name: slideUp; animation-duration: 1s; -webkit-animation-duration: 1s; animation-timing-function: ease; -webkit-animation-timing-function: ease; visibility: visible !important; } @keyframes slideUp { 0% { transform: translateY(100%); } 50%{ transform: translateY(-8%); } 65%{ transform: translateY(4%); } 80%{ transform: translateY(-4%); } 95%{ transform: translateY(2%); } 100% { transform: translateY(0%); } } @-webkit-keyframes slideUp { 0% { -webkit-transform: translateY(100%); } 50%{ -webkit-transform: translateY(-8%); } 65%{ -webkit-transform: translateY(4%); } 80%{ -webkit-transform: translateY(-4%); } 95%{ -webkit-transform: translateY(2%); } 100% { -webkit-transform: translateY(0%); } } .slideRight{ animation-name: slideRight; -webkit-animation-name: slideRight; animation-duration: 1s; -webkit-animation-duration: 1s; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out; visibility: visible !important; } @keyframes slideRight { 0% { transform: translateX(-150%); } 50%{ transform: translateX(8%); } 65%{ transform: translateX(-4%); } 80%{ transform: translateX(4%); } 95%{ transform: translateX(-2%); } 100% { transform: translateX(0%); } } @-webkit-keyframes slideRight { 0% { -webkit-transform: translateX(-150%); } 50%{ -webkit-transform: translateX(8%); } 65%{ -webkit-transform: translateX(-4%); } 80%{ -webkit-transform: translateX(4%); } 95%{ -webkit-transform: translateX(-2%); } 100% { -webkit-transform: translateX(0%); } } .slideExpandUp{ animation-name: slideExpandUp; -webkit-animation-name: slideExpandUp; animation-duration: 1.6s; -webkit-animation-duration: 1.6s; animation-timing-function: ease-out; -webkit-animation-timing-function: ease -out; visibility: visible !important; } @keyframes slideExpandUp { 0% { transform: translateY(100%) scaleX(0.5); } 30%{ transform: translateY(-8%) scaleX(0.5); } 40%{ transform: translateY(2%) scaleX(0.5); } 50%{ transform: translateY(0%) scaleX(1.1); } 60%{ transform: translateY(0%) scaleX(0.9); } 70% { transform: translateY(0%) scaleX(1.05); } 80%{ transform: translateY(0%) scaleX(0.95); } 90% { transform: translateY(0%) scaleX(1.02); } 100%{ transform: translateY(0%) scaleX(1); } } @-webkit-keyframes slideExpandUp { 0% { -webkit-transform: translateY(100%) scaleX(0.5); } 30%{ -webkit-transform: translateY(-8%) scaleX(0.5); } 40%{ -webkit-transform: translateY(2%) scaleX(0.5); } 50%{ -webkit-transform: translateY(0%) scaleX(1.1); } 60%{ -webkit-transform: translateY(0%) scaleX(0.9); } 70% { -webkit-transform: translateY(0%) scaleX(1.05); } 80%{ -webkit-transform: translateY(0%) scaleX(0.95); } 90% { -webkit-transform: translateY(0%) scaleX(1.02); } 100%{ -webkit-transform: translateY(0%) scaleX(1); } } .pullUp{ animation-name: pullUp; -webkit-animation-name: pullUp; animation-duration: 1.1s; -webkit-animation-duration: 1.1s; animation-timing-function: ease-out; -webkit-animation-timing-function: ease-out; transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; -webkit-transform-origin: 50% 100%; } @keyframes pullUp { 0% { transform: scaleY(0.1); } 40% { transform: scaleY(1.02); } 60% { transform: scaleY(0.98); } 80% { transform: scaleY(1.01); } 100% { transform: scaleY(0.98); } 80% { transform: scaleY(1.01); } 100% { transform: scaleY(1); } } @-webkit-keyframes pullUp { 0% { -webkit-transform: scaleY(0.1); } 40% { -webkit-transform: scaleY(1.02); } 60% { -webkit-transform: scaleY(0.98); } 80% { -webkit-transform: scaleY(1.01); } 100% { -webkit-transform: scaleY(0.98); } 80% { -webkit-transform: scaleY(1.01); } 100% { -webkit-transform: scaleY(1); } } .slideDown{ animation-name: slideDown; -webkit-animation-name: slideDown; animation-duration: 1s; -webkit-animation-duration: 1s; animation-timing-function: ease; -webkit-animation-timing-function: ease; visibility: visible !important; } @keyframes slideDown { 0% { transform: translateY(-100%); } 50%{ transform: translateY(8%); } 65%{ transform: translateY(-4%); } 80%{ transform: translateY(4%); } 95%{ transform: translateY(-2%); } 100% { transform: translateY(0%); } } @-webkit-keyframes slideDown { 0% { -webkit-transform: translateY(-100%); } 50%{ -webkit-transform: translateY(8%); } 65%{ -webkit-transform: translateY(-4%); } 80%{ -webkit-transform: translateY(4%); } 95%{ -webkit-transform: translateY(-2%); } 100% { -webkit-transform: translateY(0%); } } .bigEntrance{ animation-name: bigEntrance; -webkit-animation-name: bigEntrance; animation-duration: 1.6s; -webkit-animation-duration: 1.6s; animation-timing-function: ease-out; -webkit-animation-timing-function: ease-out; visibility: visible !important; } @keyframes bigEntrance { 0% { transform: scale(0.3) rotate(6deg) translateX(-30%) translateY(30%); opacity: 0.2; } 30% { transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%); opacity: 1; } 45% { transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%); opacity: 1; } 60% { transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%); opacity: 1; } 75% { transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%); opacity: 1; } 90% { transform: scale(1.01) rotate(0deg) translateX(0%) translateY(0%); opacity: 1; } 100% { transform: scale(1) rotate(0deg) translateX(0%) translateY(0%); opacity: 1; } } @-webkit-keyframes bigEntrance { 0% { -webkit-transform: scale(0.3) rotate(6deg) translateX(-30%) translateY(30%); opacity: 0.2; } 30% { -webkit-transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%); opacity: 1; } 45% { -webkit-transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%); opacity: 1; } 60% { -webkit-transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%); opacity: 1; } 75% { -webkit-transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%); opacity: 1; } 90% { -webkit-transform: scale(1.01) rotate(0deg) translateX(0%) translateY(0%); opacity: 1; } 100% { -webkit-transform: scale(1) rotate(0deg) translateX(0%) translateY(0%); opacity: 1; } } .pulse:hover{ animation-name: pulse; -webkit-animation-name: pulse; animation-duration: 1.5s; -webkit-animation-duration: 1.5s; animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; } @keyframes pulse { 0% { transform: scale(0.9); opacity: 0.7; } 50% { transform: scale(1); opacity: 1; } 100% { transform: scale(0.9); opacity: 0.7; } } @-webkit-keyframes pulse { 0% { -webkit-transform: scale(0.95); opacity: 0.7; } 50% { -webkit-transform: scale(1); opacity: 1; } 100% { -webkit-transform: scale(0.95); opacity: 0.7; } } .stretchLeft{ animation-name: stretchLeft; -webkit-animation-name: stretchLeft; animation-duration: 1.5s; -webkit-animation-duration: 1.5s; animation-timing-function: ease-out; -webkit-animation-timing-function: ease-out; transform-origin: 100% 0%; -ms-transform-origin: 100% 0%; -webkit-transform-origin: 100% 0%; } @keyframes stretchLeft { 0% { transform: scaleX(0.3); } 40% { transform: scaleX(1.02); } 60% { transform: scaleX(0.98); } 80% { transform: scaleX(1.01); } 100% { transform: scaleX(0.98); } 80% { transform: scaleX(1.01); } 100% { transform: scaleX(1); } } @-webkit-keyframes stretchLeft { 0% { -webkit-transform: scaleX(0.3); } 40% { -webkit-transform: scaleX(1.02); } 60% { -webkit-transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(1); } } .stretchRight{ animation-name: stretchRight; -webkit-animation-name: stretchRight; animation-duration: 1.5s; -webkit-animation-duration: 1.5s; animation-timing-function: ease-out; -webkit-animation-timing-function: ease-out; transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%; } @keyframes stretchRight { 0% { transform: scaleX(0.3); } 40% { transform: scaleX(1.02); } 60% { transform: scaleX(0.98); } 80% { transform: scaleX(1.01); } 100% { transform: scaleX(0.98); } 80% { transform: scaleX(1.01); } 100% { transform: scaleX(1); } } @-webkit-keyframes stretchRight { 0% { -webkit-transform: scaleX(0.3); } 40% { -webkit-transform: scaleX(1.02); } 60% { -webkit-transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(1); } } @media only screen and (max-width : 1300px) { .fastlinks { display:none !important; } } /*Make the semantic media wiki readable*/ .smw-editpage-help { background-color: #565656; } /* Make the errors on uploading the same file readable */ .mw-destfile-warning { color: #5e321a; } .externalimage-holder { position: relative; margin: auto; display: inline-block; max-width: 600px; } .externalimage-holder img { width: 100%; height: auto; } img { max-width: 900px; } #document-wrapper { max-width: 1200px; } /* Mobile-specific changes */ @media screen and (max-width: 720px) { /* Remove the unnecessary logo next to the navigation links */ #mirage-navigation-header #mirage-logo { display: none; } /*Remove the wiki title on mobile*/ .mw-logo-wordmark { display: none; } /*Set max image size on mobile, so they scale*/ img { display: block; max-width:90%; width: auto; height: auto; } /* Remove text of Recent Changes button */ div#module-site-tools li.mw-list-item:first-child a { color: transparent; } } /* Dvdszb's edit */ #simpleSearch { width: 25%; float: right; } .mw-page-title-main { display: none; } .mw-logo-wordmark { visibility: hidden; } .mw-logo-wordmark:after { content: 'Grepolis Wiki - HU'; visibility: visible; display: block; position: absolute; padding: 5px; top: 1px; }