MediaWiki:Wikia.css

/*Wiki Navigation Style*/ /*by Nathan Sykes Wiki*/ .WikiNav a { color: black !important; font-family: 'Champagne & Limousines' !important; text-transform: uppercase; font-weight: 1000px; letter-spacing: 0.05em; } .WikiNav .nav-item { background-color: transparent !important; border-bottom: 0; } .WikiNav .nav-item > a { border-left: 0; padding: 0 12px !important; font-size: 16px; } .WikiNav .nav-item.marked > a { margin: 1px 3px 1px 0; color: black !important; background-color: transparent; border-bottom: 2px solid black; border-top: 2px solid black; border-left: 2px solid black; border-right: 2px solid black; } .WikiNav .subnav-2 * { -webkit-transition: 0.1s all linear; -moz-transition: 0.1s all linear; -o-transition: 0.1s all linear; transition: 0.1s all linear; } .WikiNav .subnav-2 { padding-top:5px; } .WikiNav .subnav-2 a { color: white; } .WikiNav .subnav-2a { border: 0 !important; border-radius: 0 !important; padding: 2px 15px; } .WikiNav .subnav-2a:hover, .WikiNav .marked2 .subnav-2a { background-color: black !important; color: white !important; } .WikiNav .subnav-2a:first-child { margin-left: 0 !important; } .WikiNav .subnav-2a .chevron { display: none; } .WikiNav .marked2 .subnav-3 { box-shadow: 0 0; margin-left: 0; top: 36px !important; border: 0; padding:0; } .WikiNav .marked2 .subnav-3a { padding: 2px 10px; background-color: black; color: white !important; } .WikiNav .marked2 .subnav-3a:hover { background-color: black; color: white !important; } .WikiNav .navbackground { background-color: transparent; margin-top: 5px; } .WikiNav .navbackground > div { background-color: transparent; } .WikiNav .navbackground .chevron { display: none; } /* headings */ .WikiaPage h1, .WikiaPage h2, .WikiaPage h3, .WikiaPage h4, .WikiaPage h5, .WikiaPage h6, .WikiaPage .heading { font-family: Champagne & Limousines; font-weight: normal !important; text-transform: uppercase; letter-spacing: 2.5px; } .WikiaPage h2 { border-bottom: 0; } .WikiaArticle .editsection { float: right; } .WikiaArticle .editsection > a { content: url(/wiki/Special:Filepath?file=edit-pencil.png); width: 16px; height: 16px; } .WikiaArticle .editsection .edit-pencil { display: none; } /*Link Shadows*/ /*by Nathan Sykes Wiki*/

a:hover { text-shadow: white 1 1 4px; color: gray !important; text-decoration:none; -webkit-transition: all .2s linear 0s; -moz-transition: all .2s linear 0s; -ms-transition: all .2s linear 0s; -o-transition: all .2s linear 0s; transition: all .2s linear 0s; } a { color: #7489bc; -webkit-transition: all .2s linear 0s; -moz-transition: all .2s linear 0s; -ms-transition: all .2s linear 0s; -o-transition: all .2s linear 0s; transition: all .2s linear 0s; } a:active { color: gray } a:visited:hover, .color2 a:visited:hover { color:plum; text-shadow: white 0 0 3px; text-decoration:none; } a:hover, .color2 a:hover { color:plum; text-shadow: white 0 0 3px; text-decoration:none; -webkit-transition: all .2s linear 0s; -moz-transition: all .2s linear 0s; -ms-transition: all .2s linear 0s; -o-transition: all .2s linear 0s; transition: all .2s linear 0s; } .WikiaFooter .tools-menu a:hover { color:gray; text-shadow: white 0 3px 3px text-decoration:none; -webkit-transition: all .2s linear 0s; -moz-transition: all .2s linear 0s; -ms-transition: all .2s linear 0s; -o-transition: all .2s linear 0s; transition: all .2s linear 0s; } a.new:hover { color:plum; text-shadow: white 0 0 3px; text-decoration:none; -webkit-transition: all .2s linear 0s; -moz-transition: all .2s linear 0s; -ms-transition: all .2s linear 0s; -o-transition: all .2s linear 0s; transition: all .2s linear 0s; } a.tag { color: inherit; }

/*HOVER (Credits goes to the Hailee Steinfeld Wiki)*/ .hoverimage img { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; opacity: 1; filter: alpha(opacity=100); } .hoverimage img:hover { opacity: 0.5; filter: alpha(opacity=50); } .inversehover { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; } .inversehover:hover { -webkit-filter: invert(100%); }

/* General Portable Infobox CSS */ .portable-infobox { background-color: transparent; border: 2px solid black; color: black; width: 300px; } .portable-infobox .pi-border-color { border-color: #666; } .portable-infobox .pi-title, .portable-infobox .pi-header { text-align: center; } .portable-infobox .pi-title { background: black; color: white; line-height: 26px; font-size: 17px; font-weight: bold; } .portable-infobox .pi-data .pi-data-label { display: flex; -webkit-flex-basis: auto; -moz-flex-basis: auto; flex-basis: auto; -webkit-align-items: center; -moz-align-items: center; align-items: center; width: 50%; } .portable-infobox .pi-header { background-color: #BCBCBC; border-bottom: 1px solid #666; } .portable-infobox h2.pi-item.pi-header { padding: 3px; } .portable-infobox .pi-item-spacing { padding: 2px; } .portable-infobox .pi-image-thumbnail { width: 100%; height: auto; } .portable-infobox .pi-image { background-color: #000; } .portable-infobox .pi-data-value:not(.pi-horizontal-group-item) { text-align: right; } .portable-infobox .pi-data-value ul { text-align: left; } .portable-infobox .pi-navigation { background-color: transparent; border-bottom: 1px solid #666; font-size: smaller; text-align: center; }

/* Template:Welcome Styling */ .welcome { background: url("https://vignette.wikia.nocookie.net/charlieputh/images/e/e7/Charlie-Puth-Pub-1-Catie-Laffoon.jpg/revision/latest/scale-to-width-down/640?cb=20170510181146"); border: 5px ridge silver; color: black; padding: 5px; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; } .welcometext { width:60%; } .welcome:before { content: "WELCOME TO CHARLIE PUTH WIKI!"; font-size: 130%; font-weight: bold; margin-left: 30px; margin-right: -50px; } .welcome:hover { background: url("http://www.billboard.com/files/styles/article_main_image/public/media/charlie-puth-atlantic-catie-laffoon-2015-billboard-650.jpg") right no-repeat !important; border: 5px ridge silver; color: #black; } .welcome:hover:before { content: "WELCOME TO THE ATLANTIC RECORDS!"; } .welcome:hover a { color: lightblue!important; } .welcome:hover .welcomeimage1 { visibility: hidden!important; } .welcomeimage1 { visibility: visible; } .welcome:hover .welcomeimage2 { visibility: visible!important; } .welcomeimage2 { visibility: hidden; } .welcomeimage1, .welcomeimage2 { border-radius: 100px; height: 160px; margin-left: -184px; margin-top: -95px; overflow: hidden; position: absolute; width: 160px; border: 4px solid gray; display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: transform; transition-property: transform; } .welcomeimage2:hover, .welcomeimage2:focus, .welcomeimage2:active { -webkit-transform: scale(1.08); transform: scale(1.08); }

/* CSS Supporting Template:UserBox */ .userbox, .userbox img { -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; } .userbox:hover img { border-radius: 100%; } .userbox { box-shadow: 4px 4px 4px gray; } .hiddenstars { width: 40px; } .hiddenstars .star1, .hiddenstars .star2, .hiddenstars .star3, .hiddenstars .star4, .hiddenstars .star5, .hiddenstars .star6 { -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; -webkit-transition: all 0.6s ease; color: #ededed; font-family: 'Times New Roman', serif; font-size: 70px !important; text-shadow: 0 0 20px #407fd6; transition: all 3s ease; width: 20px; margin-left:90px!important; } .hiddenstars:hover .star1 { font-size: 0px!important; margin-left: 300px!important; transform: rotate(-720deg); } .hiddenstars:hover .star2 { font-size: 0px!important; margin-left: 260px!important; margin-top: 100px!important; transform: rotate(720deg); } .hiddenstars:hover .star3 { font-size: 0px!important; margin-left: 140px!important; margin-top: -80px!important; transform: rotate(720deg); } .hiddenstars:hover .star4 { font-size: 0px!important; margin-left: -50px!important; margin-top: 100px!important; transform: rotate(-320deg); } .hiddenstars:hover .star5 { font-size: 0px!important; margin-left: 400px!important; transform: rotate(600deg); } .hiddenstars:hover .star6 { font-size: 0px!important; transform: rotate(600deg); } .hiddenstars .star2 { margin-top: -22px; } .hiddenstars .star3 { margin-top: -22px; } .hiddenstars .star4 { margin-top: -22px; } .hiddenstars .star5 { margin-top: -22px; } .hiddenstars .star6 { margin-top: -22px; }.hiddenstars { width: 40px; } .hiddenstars .star1, .hiddenstars .star2, .hiddenstars .star3, .hiddenstars .star4, .hiddenstars .star5, .hiddenstars .star6 { -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; -webkit-transition: all 0.6s ease; color: #ededed; font-family: 'Times New Roman', serif; font-size: 70px !important; text-shadow: 0 0 20px #407fd6; transition: all 3s ease; width: 20px; margin-left:90px!important; } .hiddenstars:hover .star1 { font-size: 0px!important; margin-left: 300px!important; transform: rotate(-720deg); margin-top: -22px; } .hiddenstars:hover .star2 { font-size: 0px!important; margin-top: -60px !important; margin-left: 260px!important; transform: rotate(720deg); } .hiddenstars:hover .star3 { font-size: 0px!important; margin-top: -80px !important; margin-left: 140px!important; transform: rotate(720deg); } .hiddenstars:hover .star4 { font-size: 0px!important; margin-top: -60px !important; margin-left: -50px!important; transform: rotate(-320deg); } .hiddenstars:hover .star5 { font-size: 0px!important; margin-left: 400px!important; margin-top: -22px; transform: rotate(600deg); } .hiddenstars:hover .star6 { font-size: 0px!important; transform: rotate(600deg); margin-top: -22px; } .hiddenstars .star2 { margin-top: -22px; } .hiddenstars .star3 { margin-top: -22px; } .hiddenstars .star4 { margin-top: -22px; } .hiddenstars .star5 { margin-top: -22px; } .hiddenstars .star6 { margin-top: -22px; }

/* Main page slider elements * Special thanks to the Avatar Wiki */ .portal_section {margin:0;} .portal_body {padding:0 10px;} .portal_sliderlink_1:hover, .portal_sliderlink_2:hover, .portal_sliderlink_3:hover, .portal_sliderlink_4:hover, .portal_sliderlink_5:hover, .portal_sliderlink_6:hover, .portal_sliderlink_7:hover, .portal_sliderlink_8:hover, .portal_sliderlink_9:hover, .portal_sliderlink_10:hover, .portal_sliderlink_11:hover, .portal_sliderlink_12:hover, .portal_sliderlink_13:hover, .portal_sliderlink_14:hover, .portal_sliderlink_15:hover, .portal_sliderlink_16:hover, .portal_sliderlink_17:hover, .portal_sliderlink_18:hover, .portal_sliderlink_19:hover, .portal_sliderlink_20:hover, .portal_sliderlink_21:hover, .portal_sliderlink_22:hover, .portal_sliderlink_23:hover, .portal_sliderlink_24:hover, .portal_sliderlink_25:hover, .portal_sliderlink_26:hover, .portal_sliderlink_27:hover {opacity:0.5} .ui-tabs {position:relative; padding:.2em; zoom:1} .ui-tabs .ui-tabs-nav {margin:0; padding:.2em .2em 0;} .ui-tabs .ui-tabs-nav li {list-style:none; float:left; position:relative; top:1px; margin:0 .2em 1px 0; border-bottom:0 !important; padding:0; white-space:nowrap} .ui-tabs .ui-tabs-nav li a {float:left; padding:.5em 1em; text-decoration:none} .ui-tabs .ui-tabs-nav li.ui-tabs-selected {margin-bottom:0; padding-bottom:1px} .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a {cursor:text} .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a {cursor:pointer} .ui-tabs .ui-tabs-panel {display:block; border-width:0; padding:0; background: none} .ui-tabs .ui-tabs-hide {display:none !important;} .ui-tabs-hide {display:none !important;} /* Slider background */ .slider-bg { -webkit-background-size: auto 500px; background-size: auto 500px; background-image: url("https://vignette.wikia.nocookie.net/charlieputh/images/e/e7/Charlie-Puth-Pub-1-Catie-Laffoon.jpg/revision/latest?cb=20170510181146"); background-position: top left; }
 * 1) portal_slider {margin-left:auto; margin-right:auto; padding:0; position:relative; width:675px; height:450px; background:transparent; border:none;}
 * 2) portal_slider > .portal_body {padding:0}
 * 3) portal_content {font-size:0.9em; line-height:1.7em}
 * 4) portal_content .portal_body > table {height:400px}
 * 5) portal_content ul ul {margin-left: 1em}

/* wordmark hover */ .WikiHeader .wordmark { -moz-transform: rotate(0deg) scale(1) skew(180deg) translate(0px); -moz-transition: All 0.6863s ease; -o-transform: rotate(0deg) scale(1) skew(180deg) translate(0px); -o-transition: All 0.6863s ease; -webkit-transform: rotate(0deg) scale(1) skew(180deg) translate(0px); -webkit-transition: All 0.6863s ease; color: #708090; font-weight: bold; margin-bottom: 10px; width: 250px; word-wrap: break-word; } .WikiHeader .wordmark:hover { -webkit-transform: rotate(1deg) scale(1.090) skew(180deg) translate(0px); -moz-transform: rotate(1deg) scale(1.090) skew(180deg) translate(0px); -ms-transform: rotate(1deg) scale(1.090) skew(180deg) translate(0px); -o-transform: rotate(1deg) scale(1.090) skew(180deg) translate(0px); } a.wikia-photogallery-add.wikia-button.noprint { display: none; } .wikia-button.comments.secondary { margin-right:0px; }