User:PenXPen/common.css

.infoboxtable { float: right; background:rgba(0,0,0,.75); border: 1px solid #00FFFF; border-radius:5px; width: 350px; }

.infoboxname { font-family: 'Khand', sans-serif; background:#104E4F; color: #00FFFF; font-size: 115%; text-transform: none; border: 1px solid #00FFFF; border-radius:5px; }

.infoboxlabel { width: 50%; background:#104E4F; color: #00FFFF; text-transform: none; border: 1px solid #00FFFF; border-radius:5px; padding-left: 5px; }

.infoboxdetails { padding-right: 5px; background:#104E4F; color: #00FFFF; } .infoboxdatatitle { background:#104E4F; color: #00FFFF; } .infoboxdata { text-align: right; background:#104E4F; color: #00FFFF; }

/* Alternate Colouring for Tables */ table.sortable { border: 1px solid #87d2d1; }

.sortable th, .unsortable th { color: #ffffff; }

.sortable tr:nth-child(2n+1), .pyjama tr:nth-child(2n+1) { background: none repeat scroll 0 0 #1C1E20; }

.sortable tr:nth-child(2n), .pyjama tr:nth-child(2n) { background: none repeat scroll 0 0 #000000; }

/* Tabber Styles */ /* This will style the div that contains the whole tabber object. Generally this can be left alone. */ body .tabberlive { }

/* This will style each tab's content area. */ body .tabberlive .tabbertab { border-left: 1px solid #87d2d1; border-bottom: 1px solid #87d2d1; border-right: 1px solid #87d2d1; }

/* This is the box that surrounds all the tabs. */ body ul.tabbernav { border-bottom: 1px solid #87d2d1; padding: 0px 5px 0px 5px; margin-top= -2px; }

.tabberlive .tabbertab, .tabber .tabbertab { border: 1px solid #87d2d1; }

/* This is a box that surrounds each of the tabs. */ body ul.tabbernav li {

}

/* This is the style for the tabs, parts of this can be overridden for the current tab with the next selector */ body ul.tabbernav li a, body ul.tabbernav li a:link, body ul.tabbernav li a:visited, body ul.tabbernav li a:hover { background: #000; color: #fff; text-shadow: 1px 1px 0 #000000; border: 1px solid #87d2d1; }

/* This is the style for the currently selected tab */ body ul.tabbernav li.tabberactive a, body ul.tabbernav li.tabberactive a:link, body ul.tabbernav li.tabberactive a:visited, body ul.tabbernav li.tabberactive a:hover { background: #87d2d1; color: #fff; text-shadow: 1px 1px 0 #000000; border: 1px solid #87d2d1; }

.heading { bottom-border:#87d2d1; color:#ffffff; margin-top:2px; margin-left:2px; margin-right:15px; margin-bottom:2px; }

table.backgroundz { background: url("http://hydra-media.cursecdn.com/titanfall.gamepedia.com/3/30/Tiledimage.png") repeat; }

.tooltip{display:inline;position:relative} .tooltip:hover{text-decoration:none} .tooltip:hover:after{ background:#111; background:rgba(0,0,0,.75); border-radius:5px; bottom:26px; color:#fff; content:attr(title); display:block; left:5%; padding:5px 15px; position:absolute; white-space:nowrap; z-index:98 } .tooltip:hover:before{ border:solid; border-color:#111 transparent; border-width:6px 6px 0 6px; bottom:20px; content:""; display:block; left:75%; position:absolute; z-index:99 }

.item {width:100px;border:solid 1px #ccc;float:left;height:20px;z-index:0;overflow:hidden;position:relative;}
 * 1) items {width:300px;}

.item:hover{overflow:visible;z-index:100;} .item:hover .inner{z-index: 100;} .inner{position: absolute; background: white; width: 100%; }

/* Infoboxes */

.weapon { background: transparent url(http://hydra-media.cursecdn.com/weaponheroes.gamepedia.com/c/c9/Title-bgsm.png) repeat-x; }

.weapon1 { background: transparent url("http://hydra-media.cursecdn.com/weaponheroes.gamepedia.com/2/24/TextBox.png") repeat-x; }

/* Gradients */

.weapon2 { background:#1271a2; background:-moz-linear-gradient(top, #0d83be, #1271a2 30%, #0d83be 80%); background:-webkit-gradient(linear, left top, left bottom, color-stop (0% #0d83be), color-stop(30%,#1271a2), color-stop(80%,#0d83be )); background:-webkit-linear-gradient(top, #0d83be 0%, #1271a2 30%, #0d83be 80%); background:-o-linear-gradient(top, #0d83be 0%, #1271a2 30%, #0d83be 80%); background:-ms-linear-gradient(top, #0d83be 0%, #1271a2 30%, #0d83be 80%); background:linear-gradient(to bottom, #0d83be 0%, #1271a2 30%, #0d83be 80%); border: 1px solid #00aaff; font-family: verdana,tahoma,arial,sans-serif; }

.weaponinfobox { color: #FFFFFF; width: 300px margin-bottom: 0.5em; margin-left: 1em; padding: 5px; float: right; } .weaponinfobox td, .weaponinfobox th { vertical-align: top; } .weaponinfobox caption { font-size: larger; margin-left: inherit; } .weaponinfobox.bordered { border-collapse: collapse; } .weaponinfobox.bordered td, .weaponinfobox.bordered th { border: 1px solid #555555; } .weaponinfobox.bordered .borderless td, .weaponinfobox.bordered .borderless th { border: 0; }

/* CSS placed here will be applied to all skins */ .mainex { height: 81px; width: 200px; border: 1px solid white; overflow: hidden; }

.mainex .activator { height: 200px; width: 200px; float: left; display: block; } .img { text-align: center; margin: 15px; height: 49px; width: 197px; float: left; }

.expandcontent { display: none; margin: 15px; } .activator:hover { width: 900px; } .activator:hover .expandcontent { display: block; } .activator:hover .img { float: left; }

body.page-Titanfall_Wiki h1.firstHeading { display:none; }

body.page-Titanfall_2_Wiki h1.firstHeading { display:none; }

.ctbox { border: 1px solid #000000; background: url("http://hydra-media.cursecdn.com/titanfall.gamepedia.com/6/66/Metal-texture-black.jpg") repeat center top padding-box; box-shadow: #000000; color: #ffffff; margin: 0 0 10px 0; padding: 29px; vertical-align: top; }

table.ctrow { table-layout: fixed; border-collapse: separate; border-spacing: 10px; margin: -10px 0 0 0; padding: 0px; width: 33%; }

/* this CSS governs the responsive 2 column main page layout */

.fpcontent { width: 100%; overflow: hidden; z-index: 1; }

.fpmaybecols { overflow: hidden; margin: -5px 0 -5px 0; }

.fpmaybecols + .fpmaybecols { margin: 0 0 -5px 0; }

.fpbox { background: rgba(0,0,0,.75); color: #e0e0e0; /* change for hydra (light) wikis */ margin: 5px 5px 5px 5px; padding: 5px 5px 5px 5px; }

.fpplainbox { padding: 5px 8px 10px 8px; margin: 0 5px 10px 5px; vertical-align: top; }

.fpbox .welcome { border-bottom: 2px solid #87d2d1; color: #e0e0e0; /* change for hydra (light) wikis */ font-size: 150%; margin: 0 0 10px 0; padding: 0 0 5px 0; text-transform: uppercase; }

.fpbox .heading { border-bottom: 1px solid #505050; color: #e0e0e0; /* change for hydra (light) wikis */ font-size: 132%; font-variant: small-caps; margin: 0 0 10px 0; padding: 0 0 5px 0; }

.fpbox .heading .smalllink { color: #e0e0e0; /* change for hydra (light) wikis */ font-size: 75%; font-weight: bold; }

.fpbox hr { border: none; border-bottom: 1px solid #87d2d1; }

div#content hr { background-color: #87d2d1; color: #87d2d1; }

.fplinks { margin: -5px; }

.fplinks .linkslabel { background: rgba(0,0,0,.75); border-bottom: 2px solid #87d2d1; font-weight: bold; margin: 15px 5px 5px 5px; padding: 0 0 5px 0; }

.fplink { display: inline-block; vertical-align: middle; width: 100%; }

/* Yeah, using display: table makes for a lot of extra markup, but it makes proportionate sizing and vertical centering a lot easier, so going with it */ .fplink .box { border-collapse: separate; border-spacing: 5px; display: table; width: 100%; }

.fplink .box .row { display: table-row; }

.fplink .box .row .cell { background: rgba(0,0,0,.75); color: #e0e0e0; /* change for hydra (light) wikis */ display: table-cell; font-weight: bold; position: relative; text-transform: uppercase; vertical-align: middle; }

.fplink.wide .box .row .cell { padding: 0 5px; }

height: 114px;{ width: 114px; }
 * 1) fptopsection .fplink.image,
 * 2) fpflexsection .fplink.image,
 * 3) fpbottomsection .fplink.image

.fplink.image .box .row .cell { height: 100px; width: 100px; vertical-align: bottom; }

.fplink.image .box .row .cell .image img { height: 100px; width: 100px; }

@media (min-width: 470px) { .fplink { width: 50%; }

.fplink.wide { width: 100%; } }

@media (min-width: 580px) { .fplink { width: 33.333%; }

.fplink.wide { width: 66.666%; } }

@media (min-width: 690px) { .fplink { width: 25%; }

.fplink.wide { width: 50%; } }

@media (min-width: 800px) { .fplink { width: 20%; }

.fplink.wide { width: 40%; } }

@media (min-width: 910px) { .fplink { width: 16.666%; }

.fplink.wide { width: 33.333%; } }

@media (min-width: 990px) { .fpcontent { padding-right: 520px; width: auto; }

#fptopsection { float: left; width: 100%; }

#fpflexsection { float: right; width: 520px; margin-right: -520px }

#fpbottomsection { float: left; width: 100%; margin-top: -5px; }

#fptopsection .fplink, #fpbottomsection .fplink { width: 50%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 100%; }

#fpflexsection .fplink { width: 25%; }

#fpflexsection .fplink.wide { width: 50%; } }

@media (min-width: 1100px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 33.333%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 66.666%; } }

@media (min-width: 1210px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 25%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 50%; } }

@media (min-width: 1320px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 20%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 40%; } }

@media (min-width: 1430px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 16.666%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 33.333%; }

.fplink a { padding: 3px 5px; } }

@media (min-width: 1540px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 14.285%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 28.571%; }

#fptopsection .fpmaybercol .fpbox, #fpbottomsection .fpmaybercol .fpbox { background-image: none; }

.fpmaybelcol { float: left; width: 70.886%; }

#fptopsection .fpmaybelcol .fplink, #fpbottomsection .fpmaybelcol .fplink { width: 20%; }

#fptopsection .fpmaybelcol .fplink.wide, #fpbottomsection .fpmaybelcol .fplink.wide { width: 40%; }

.fpmaybercol { float: right; width: 29.113%; }

#fptopsection .fpmaybercol .fplink, #fpbottomsection .fpmaybercol .fplink { width: 50%; }

#fptopsection .fpmaybercol .fplink.wide, #fpbottomsection .fpmaybercol .fplink.wide { width: 100%; } }

@media (min-width: 1650px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 12.5%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 25%; } }

@media (min-width: 1697px) { #fptopsection .fpmaybelcol .fplink, #fpbottomsection .fpmaybelcol .fplink { width: 16.666%; }

#fptopsection .fpmaybelcol .fplink.wide, #fpbottomsection .fpmaybelcol .fplink.wide { width: 33.333%; } }

@media (min-width: 1760px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 11.111%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 22.222%; } }

@media (min-width: 1850px) { #fptopsection .fpmaybelcol .fplink, #fpbottomsection .fpmaybelcol .fplink { width: 14.285%; }

#fptopsection .fpmaybelcol .fplink.wide, #fpbottomsection .fpmaybelcol .fplink.wide { width: 28.571%; } }

@media (min-width: 1870px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 10%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 20%; }

#fptopsection .fplink.image, #fpbottomsection .fplink.image { width: 134px; height: 134px; }

#fptopsection .fplink.image .box .row .cell, #fpbottomsection .fplink.image .box .row .cell { width: 120px; height: 120px; }

#fptopsection .fplink.image .box .row .cell .image img, #fpbottomsection .fplink.image .box .row .cell .image img { width: 120px; height: 120px; } }

@media (min-width: 1918px) { #fptopsection .fpmaybercol .fplink, #fpbottomsection .fpmaybercol .fplink { width: 33.333%; }

#fptopsection .fpmaybercol .fplink.wide, #fpbottomsection .fpmaybercol .fplink.wide { width: 66.666%; } }

@media (min-width: 1980px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 9.09%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 18.181%; } }

@media (min-width: 2006px) { #fptopsection .fpmaybelcol .fplink, #fpbottomsection .fpmaybelcol .fplink { width: 12.5%; }

#fptopsection .fpmaybelcol .fplink.wide, #fpbottomsection .fpmaybelcol .fplink.wide { width: 25%; } }

@media (min-width: 2090px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 8.33%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 16.666%; } }

@media (min-width: 2161px) { #fptopsection .fpmaybelcol .fplink, #fpbottomsection .fpmaybelcol .fplink { width: 11.111%; }

#fptopsection .fpmaybelcol .fplink.wide, #fpbottomsection .fpmaybelcol .fplink.wide { width: 22.222%; } }

@media (min-width: 2200px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 7.692%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 15.384%; } }

@media (min-width: 2296px) { #fptopsection .fpmaybercol .fplink, #fpbottomsection .fpmaybercol .fplink { width: 25%; }

#fptopsection .fpmaybercol .fplink.wide, #fpbottomsection .fpmaybercol .fplink.wide { width: 50%; } }

@media (min-width: 2310px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 7.142%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 14.285%; } }

@media (min-width: 2316px) { #fptopsection .fpmaybelcol .fplink, #fpbottomsection .fpmaybelcol .fplink { width: 10%; }

#fptopsection .fpmaybelcol .fplink.wide, #fpbottomsection .fpmaybelcol .fplink.wide { width: 20%; } }

@media (min-width: 2420px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 6.666%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 13.333%; }

.fplink a { padding: 5px 5px; }

#fptopsection .fplink.image, #fpbottomsection .fplink.image { width: 164px; height: 164px; }

#fptopsection .fplink.image .box .row .cell, #fpbottomsection .fplink.image .box .row .cell { width: 150px; height: 150px; }

#fptopsection .fplink.image .box .row .cell .image img, #fpbottomsection .fplink.image .box .row .cell .image img { width: 150px; height: 150px; } }

.fplink.image .image { position: absolute; top: 0; right: 0; bottom: 0; left: 0; font-size: 75%; z-index: 1; }

.fplink.image a { z-index: 2; }

.fplink a { display: block; position: relative; top: 0; right: 0; bottom: 0; left: 0; padding: 1px 5px; }

.fplink.image .image a { padding: 0; }

.fplink.image .link a { background: rgba(0,0,0,.75); border-top: 2px solid #505050; }

.fplink.wide a { margin: 0 -5px; }

.fpvideos { margin: 0 auto; overflow: hidden; text-align: center; }

.fpvideo { display: inline-block; margin: 0 5px; }