MediaWiki:Instant Expert.css

/* Instant Expert */ /** General styling **/ @font-face { font-family: "Maetl"; font-style: normal; font-weight: normal; src: url("http://static.wikia.com/markva-public/images/2/24/Maetl.eot?#iefix") format("embedded-opentype"), url("http://static.wikia.com/markva-public/images/e/ed/Maetl.woff") format("woff"), url("http://static.wikia.com/markva-public/images/a/a1/Maetl.ttf") format("truetype"), url("http://static.wikia.com/markva-public/images/b/b1/Maetl.svg#Maetl") format("svg"); }

@media screen and (max-width: 1023px) { .instantexpert .main-page-tag-rcs { -webkit-column-count: auto; -moz-column-count: auto; column-count: auto; } }

/** Boxes **/ .instantexpert .box { background-image: url("http://vignette4.wikia.nocookie.net/deusex/images/7/70/Instant_Expert_background.png/revision/latest?cb=20160726003203&path-prefix=en"); margin: 20px 0px; padding: 20px; }

.instantexpert .box-small { background-color: #1d1e1e; background-image: none; padding: 10px 20px 15px; }

.instantexpert .box h2 { border-bottom: medium none; color: #e1e1e1; font-family: "Maetl","Arial"; font-size: 26px; margin: 10px 0px 15px; text-transform: none; }

.instantexpert .box h3 { color: #e1e1e1; font-family: "Maetl","Arial"; font-size: 26px; margin: 10px 15px 20px; text-align: center; text-transform: none; }

/** Header **/ .instantexpert .banner { background-color: #000000; }

.instantexpert .oct2016-banner { background-color: #000000; }

/** Overview **/

.instantexpert .box-overview .overview-video .article-thumb { margin-top: 0.4em; }

.instantexpert .box-overview .overview-video figcaption .title { color: #af873d; }

.instantexpert .box-overview .container p:last-child { margin-bottom: 0px; }

/** What's New **/ /* Tips row */ .instantexpert .box-whatsnew .new { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; list-style: outside none none; margin: 15px 0px 0px; }

.instantexpert .box-whatsnew .new > div { width: calc(33% - 10px); }

.instantexpert .box-whatsnew .new h3 { font-size: 18px; margin: 0px 0px 10px; text-align: left; }

.instantexpert .box-whatsnew .new img { height: auto; margin-bottom: 15px; width: 100%; }

/* Other rows */ .instantexpert .box-whatsnew .new2 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; box-pack:center; justify-content: center; list-style: outside none none; margin: 15px 0px 0px; flex-wrap:wrap; }

.instantexpert .box-whatsnew .new2 > div { width: calc(33% - 10px); margin-right:10px; }

.instantexpert .box-whatsnew .new2 h3, .instantexpert .box-whatsnew .new2 h5 { font-size: 12px; margin: 0px 0px 0px 10px; text-align: left; padding-left:5px!important; }

.instantexpert .box-whatsnew .new2 img { height: auto; margin-bottom: 5px; width: 180px; }

/** Explore **/ .instantexpert .box-explore .wikia-gallery, .instantexpert .box-explore .wikia-gallery-item, .instantexpert .box-explore .gallery-image-wrapper, .instantexpert .box-explore .gallery-image-wrapper a, .instantexpert .box-explore .thumb, .instantexpert .box-explore .lightbox-caption { height: auto ! important; margin: 0px; padding: 0px; width: auto ! important; }

.instantexpert .box-explore .wikia-gallery-row { margin-bottom: -10px; white-space: normal; }

.instantexpert .box-explore .wikia-gallery-item { margin: 0px 10px 10px; }

.instantexpert .box-explore .lightbox-caption { color: #af873d; display: block; font-size: 18px; font-weight: bold; margin-top: 10px; text-align: center; }

.instantexpert .box-explore .gallery-image-wrapper { border: medium none; }

.instantexpert .box-explore .gallery-image-wrapper img { height: auto; width: 185px; }

@media screen and (min-width: 1596px) { .instantexpert .box-explore .lightbox-caption { margin-top: 15px; }

.instantexpert .box-explore .gallery-image-wrapper img { width: 250px; }	}

/** Buy **/ .instantexpert .box-buy { margin: 0px 0px 20px; }

.instantexpert .box-buy .container { margin: 0px auto; width: 300px; }

.instantexpert .box-buy a:hover { text-decoration: none; }

.instantexpert .box-buy a::after { background-color: #1D1E1E; border-bottom: 1px solid #000000; border-left: 1px solid #000000; border-right: 1px solid #000000; color: #e1e1e1; content: "Buy Mankind Divided Today"; display: block; font-weight: bold; margin-top: -25px; padding: 5px; position: relative; text-align: center; text-decoration: none; z-index: 1; }

.instantexpert .box-buy a:hover::after { background-color: #131315; text-decoration: none; }

/** Meet **/ .instantexpert .box-meet .description { font-size: 12px; line-height: 18px; margin-top: 10px; }

/** Videos **/ .instantexpert .box-videos .wikia-gallery, .instantexpert .box-videos .wikia-gallery .wikia-gallery-item:last-child { margin-bottom: 0px; }

.instantexpert .box-videos .wikia-gallery-item { margin: 10px 0px; padding: 0px; }

.instantexpert .box-videos .gallery-image-wrapper { border: medium none; }

.instantexpert .box-videos .title { color: #af873d; margin-top: 5px; }

@media screen and (max-width: 1023px) { .instantexpert .box-videos .wikia-gallery-item { margin-left: 20px; margin-right: 20px; } }

/** Grid that will be 5-up and have captions on top, rather than bottom **/

.instantexpert .picgrid { margin: 15px 0px 0px; } .instantexpert .picgrid .elements { margin:auto -10px auto -10px; text-align:center }

.instantexpert .picgrid .aug-elements { margin-left:20px; text-align:left; padding: 30px 0 0 40px; }

.instantexpert .picgrid .aug-element { display:inline-block; margin-bottom: 3px; margin-right:-1px; width: 86px; }

.instantexpert .picgrid .aug-tag-element { display:inline-block; margin-bottom: 2px; margin-right:1px; width: 20px; }

.instantexpert .picgrid .tips-element { display:inline-block; margin-bottom: 14px; margin-right:20px; width: 200px; } .instantexpert .picgrid .element { display: inline-block; margin-bottom: 14px; margin-right: 30px; width : 180px; } .instantexpert .picgrid .aug-element .aug-image { height:86px; width:86px; }

.instantexpert .picgrid .tips-element .tips-image { height:auto; width:200px; } .instantexpert .picgrid .element .image { height:auto; width:180px; }

.instantexpert .picgrid .element .image:after, .instantexpert .picgrid .tips-element .tips-image:after { color: #f2f6fa; font-weight: bold; font-size: 60px; position: relative; top: 80px; } .instantexpert .picgrid .aug-element .text, .instantexpert .picgrid .tips-element .text, .instantexpert .picgrid .element .text { margin-left:0px; margin-top:2px; text-align:left; font-size:12px }

.instantexpert .picgrid .aug-element .text { line-height:130%; font-weight:bold }