Line 134: | Line 134: | ||
-webkit-transform: rotate(-90deg); | -webkit-transform: rotate(-90deg); | ||
-o-transform: rotate(-90deg); | -o-transform: rotate(-90deg); | ||
} | |||
/* Tooltip container */ | |||
.tooltip { | |||
position: relative; | |||
display: inline-block; | |||
border-bottom: 1px dotted black; /* If you want dots under the hoverable text */ | |||
} | |||
/* Tooltip text */ | |||
.tooltip .tooltiptext { | |||
visibility: hidden; | |||
width: 120px; | |||
background-color: black; | |||
color: #fff; | |||
text-align: center; | |||
padding: 5px 0; | |||
border-radius: 6px; | |||
/* Position the tooltip text - see examples below! */ | |||
position: absolute; | |||
z-index: 1; | |||
} | |||
/* Show the tooltip text when you mouse over the tooltip container */ | |||
.tooltip:hover .tooltiptext { | |||
visibility: visible; | |||
} | } |
Revision as of 10:46, 23 July 2020
/* Adding varying font faces for the PPS Wiki Similar or Identical to their Style: */ @font-face { font-family: 'Bebas Neue'; src: url('/resources/assets/fonts/BebasNeue-Book.woff') format('woff'); font-weight: 300; font-style: normal; } @font-face { font-family: 'Bebas Neue Bold'; src: url('/resources/assets/fonts/BebasNeue-Bold.woff') format('woff'); font-weight: bold; font-style: normal; } @font-face { font-family: 'Muli'; src: url('/resources/assets/fonts/Muli-Regular.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Muli Bold'; src: url('/resources/assets/fonts/Muli-Black.woff') format('woff'); font-weight: 900; font-style: bold; } @font-face { font-family: 'Muli Italic'; src: url('/resources/assets/fonts/Muli-Italic.woff') format('woff'); font-weight: normal; font-style: italic; } @font-face { font-family: 'Muli Light'; src: url('/resources/assets/fonts/Muli-Light.woff') format('woff'); font-weight: 300; font-style: normal; } /* Settings for the default fonts being used through the entire wiki: */ body { font-family: "Muli", normal; } #content h1{ font-family: "Bebas Neue Bold", normal; font-size: 350%; line-height: 0%; } #content h2 { font-family: "Bebas Neue", normal; font-size: 250%; line-height: 0%; } #content h3 { font-family: "Bebas Neue Bold", normal; font-size: 250%; line-height: 0%; } #content h4 { font-family: "Bebas Neue", normal; font-size: 200%; line-height: 0%; } #content { overflow: unset !important; } /* Alterations in the Logo to make it fit neater on the page: */ #logo { background-size: 45px; background-repeat: no-repeat; background-position: left; display: inline-block; padding-left: 50px; text-decoration: none; vertical-align: middle; text-transform: uppercase; letter-spacing: 2px; word-spacing: 3px; height: 100%; font-family: "Bebas Neue Bold", normal; } /* Alterations for aligning the Devices section properly: */ .infobox { padding: 0.0em; float: right; clear: right; font-size: 250%; text-align: right; font-family: "Bebas Neue Bold", normal; margin: 0em 1em 0em 0em; } /* Settings for the GAME SPACE PLAY category boxes: */ .infobox2 { padding: 0.0em; float: right; clear: both; font-size: 100%; text-align: left; font-family: "Bebas Neue Bold", normal; margin: 0em 1em 0em 0em; position: relative; left: -1000px; } /* To make images responsive */ .res-img img { max-width:100%; height:auto; } /* change transparency, used for inactive selection options in matrix so we only need one image per subcategory*/ .inactive{ opacity: 0.25; } /* To make text rotate (used in table headers)*/ .rotate { -moz-transform:rotate(-90deg); -webkit-transform: rotate(-90deg); -o-transform: rotate(-90deg); } .longtitle{ font-family: "Bebas Neue Bold", normal; font-size: 150%; -moz-transform:rotate(-90deg); -webkit-transform: rotate(-90deg); -o-transform: rotate(-90deg); } /* Tooltip container */ .tooltip { position: relative; display: inline-block; border-bottom: 1px dotted black; /* If you want dots under the hoverable text */ } /* Tooltip text */ .tooltip .tooltiptext { visibility: hidden; width: 120px; background-color: black; color: #fff; text-align: center; padding: 5px 0; border-radius: 6px; /* Position the tooltip text - see examples below! */ position: absolute; z-index: 1; } /* Show the tooltip text when you mouse over the tooltip container */ .tooltip:hover .tooltiptext { visibility: visible; }