|
Tags: Blanking Manual revert |
| (13 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| {{#css:
| |
|
| |
|
| @import 'https://fonts.googleapis.com/css?family=Foo';
| |
| @import 'https://fonts.googleapis.com/css?family=Open+Sans';
| |
| @import 'https://fonts.googleapis.com/css?family=Indie+Flower';
| |
| @import 'https://fonts.googleapis.com/css?family=DIN W05 Light';
| |
| @import 'https://fonts.googleapis.com/css?family=Arial Narrow';
| |
|
| |
|
| |
| .container {
| |
| margin: auto;
| |
| height: auto;
| |
| width: 940px;
| |
| background-color:#000;
| |
| border: 5px solid #006A35;
| |
| color:#FFF;
| |
| font-family:'Arial Narrow',Candara,Calibri,Segoe,'Segoe UI',Optima,Arial,sans-serif;
| |
| }
| |
|
| |
| .photo-header {
| |
| width: 940 px;
| |
| height: 500 px;
| |
| }
| |
|
| |
| .footer {
| |
| background-color: #0a0a0a;
| |
| color: #FFF;
| |
| margin: 0px;
| |
| padding: 3px 5px 3px 5px;
| |
| font-family: 'DIN W05 Light',Candara,Calibri,Segoe,'Segoe UI',Optima,Arial,sans-serif;
| |
| font-size: smaller;
| |
| clear:both;
| |
| }
| |
|
| |
| .column {
| |
| float: left;
| |
| }
| |
|
| |
| .full {
| |
| width:100%;
| |
| }
| |
|
| |
| .thirds {
| |
| width: 33.33%;
| |
| }
| |
|
| |
| .halves {
| |
| width: 50%;
| |
| }
| |
|
| |
| .left {
| |
| width: 30%;
| |
| }
| |
|
| |
| .right {
| |
| width: 70%;
| |
| }
| |
|
| |
| .row:after {
| |
| content: "";
| |
| display: table;
| |
| clear: both;
| |
| }
| |
|
| |
| .heading{
| |
| color: #006A35;
| |
| margin: 5px 0px 10px 0px;
| |
| padding: 0px 0px 0px 0px;
| |
| font-family: 'DIN W05 Light';
| |
| font-size: 35pt;
| |
| font-weight: bold;
| |
| text-align:center;
| |
| }
| |
|
| |
| .subheading{
| |
| color: #006A35;
| |
| font-family: 'DIN W05 Light',Candara,Calibri,Segoe,'Segoe UI',Optima,Arial,sans-serif;
| |
| font-weight:bold;
| |
| }
| |
|
| |
| .infobox {
| |
| width:100%;
| |
| padding:5px 10px 5px 10px;
| |
| text-align:left;
| |
| font-family: 'DIN W05 Light',Candara,Calibri,Segoe,'Segoe UI',Optima,Arial,sans-serif;
| |
| }
| |
|
| |
| .info-title {font-family: 'DIN W05 Light', sans-serif !important; font-weight:bold !important;color:#EEB210 !important;font-size: 15pt;}
| |
| .content {font-family: 'Arial Narrow', sans-serif !important; color:#FFF;}
| |
| .spacing {padding:5px 25px 5px 25px;}
| |
| .clearfix {clear:both;}
| |
|
| |
|
| |
| .info-title a:link {font-family: 'DIN W05 Light', sans-serif !important; font-weight:bold !important;color:#006A35 !important;}
| |
| .info-title a:hover {text-decoration:underline !important;}
| |
| .info-title a:visited {font-family: 'DIN W05 Light', sans-serif !important; font-weight:bold !important;color:#006A35 !important;}
| |
|
| |
|
| |
| .content a:link {font-family: 'DIN W05 Light', sans-serif !important;color:#FFF !important;}
| |
| .content a:hover {text-decoration:underline !important;}
| |
| .content a:visited {font-family: 'DIN W05 Light', sans-serif !important;color:#FFF !important;}
| |
|
| |
| .container1 {
| |
| position: relative;
| |
| display: inline-block;
| |
|
| |
| }
| |
|
| |
| .container2 {
| |
| position: relative;
| |
| display: inline-block;
| |
|
| |
| }
| |
|
| |
| .image {
| |
| display: block;
| |
| width: 100%;
| |
| height: auto;
| |
|
| |
| }
| |
|
| |
| .overlay {
| |
| position: absolute;
| |
|
| |
| top: 0;
| |
| bottom: 0;
| |
| left: 0;
| |
| right: 0;
| |
| height: 100%;
| |
| width: 100%;
| |
| opacity: 1;
| |
| transition: .5s ease;
| |
| background-color: #151515;
| |
| }
| |
|
| |
| .overlay2 {
| |
| position: absolute;
| |
|
| |
| top: 0;
| |
| bottom: 0;
| |
| left: 0;
| |
| right: 0;
| |
| height: 100%;
| |
| width: 100%;
| |
| opacity: 0;
| |
| transition: .5s ease;
| |
| background-color: #006A35;
| |
| }
| |
|
| |
| .overlay3 {
| |
| position: absolute;
| |
|
| |
| top: 0;
| |
| bottom: 0;
| |
| left: 0;
| |
| right: 0;
| |
| height: 100%;
| |
| width: 100%;
| |
| opacity: 0;
| |
| transition: .5s ease;
| |
| background-color: #151515;
| |
| }
| |
|
| |
| .container1:hover .overlay {
| |
| opacity: 0;
| |
|
| |
| }
| |
|
| |
| .container2:hover .overlay2 {
| |
| opacity: .9;
| |
| }
| |
|
| |
| .container2:hover .overlay3 {
| |
| opacity: 1;
| |
| }
| |
|
| |
| .text {
| |
| color: white;
| |
| font-size: 12pt;
| |
| position: absolute;
| |
| font-family: Josefin Sans;
| |
| top: 50%;
| |
| left: 50%;
| |
| -webkit-transform: translate(-50%, -50%);
| |
| -ms-transform: translate(-50%, -50%);
| |
| transform: translate(-50%, -50%);
| |
| text-align: center;
| |
| }
| |
|
| |
| .text2 {
| |
| color: white;
| |
| font-size: 12pt;
| |
| position: relative;
| |
| top: 50%;
| |
| left: 50%;
| |
| font-family: Josefin Sans;
| |
| -webkit-transform: translate(-50%, -50%);
| |
| -ms-transform: translate(-50%, -50%);
| |
| transform: translate(-50%, -50%);
| |
| text-align: center;
| |
| }
| |
| .drop2C {
| |
| position: relative;
| |
| display: inline-block;
| |
| opacity: .9;
| |
| transition: all 1500ms ease 500ms;
| |
| min-width: max-content;
| |
| padding: 16px;
| |
| }
| |
|
| |
| .drop2C-content {
| |
| position: absolute;
| |
| top: 200px;
| |
| left: -10px;
| |
| color: white;
| |
| font-size: 9pt;
| |
| background-color: rgb(127, 101, 148);
| |
| border: 2px double rgb(234, 75, 242);
| |
| border-radius: 25px;
| |
| min-width: 275px;
| |
| padding: 12px 16px;
| |
| z-index: 1;
| |
| display: none;
| |
| box-shadow: inset 1px 1px 2px 0px rgba(158,165,176,0.25),inset 2px 2px 12px 0px rgba(226, 227, 236,.5),inset -2px -2px 12px 0px rgba(226, 227, 236,.5),inset 0px 0px 48px rgba(226, 227, 236,.5),0px 0px 15px rgba(255, 255, 255, .5),0px 0px 10px rgba(255, 255, 255, .5),0px 0px 4px rgba(255, 255, 255, .5) !important;
| |
| }
| |
|
| |
| .drop2C:hover {
| |
| animation: bounce .5s;
| |
| opacity: 1;
| |
| z-index: 2;
| |
| -webkit-transform: scale(1.5);
| |
| -ms-transform: scale(1.5);
| |
| transform: scale(1.5);
| |
| -moz-box-shadow: 1px 1px 50px #000000;
| |
| webkit-box-shadow: 1px 1px 50px #000000;
| |
| box-shadow: 1px 1px 50px #000000;
| |
| }
| |
|
| |
| .drop2C:hover .drop2C-content {
| |
| display: block;
| |
| }
| |
|
| |
| .spacer1A {
| |
| -webkit-box-sizing: content-box;
| |
| -moz-box-sizing: content-box;
| |
| box-sizing: content-box;
| |
| line-height: 10px;
| |
| padding:20px 5px 10px;
| |
| position: relative;
| |
| left: -25px;
| |
| top: -45px;
| |
| border: none;
| |
| font-family: 'Tangerine', cursive; font-size: 50px;
| |
| color: rgb(255,255,255);
| |
| text-align: center;
| |
| -o-text-overflow: ellipsis;
| |
| text-overflow: ellipsis;
| |
| text-shadow: 0 0 10px rgb(255,255,255) , 0 0 20px rgb(157, 61, 202) , 0 0 30px rgb(157, 61, 202) , 0 0 40px rgb(157, 61, 202) , 0 0 70px rgb(136,136,136) , 0 0 80px rgb(136,136,136) , 0 0 100px rgb(136,136,136) , 0 0 150px rgb(136,136,136) ;
| |
| -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms;
| |
| -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms;
| |
| -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms;
| |
| transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms;
| |
| z-index: 1;
| |
| }
| |
| .spacer4 {
| |
| -webkit-box-sizing: content-box;
| |
| -moz-box-sizing: content-box;
| |
| box-sizing: content-box;
| |
| line-height: 10px;
| |
| padding:20px 5px 10px;
| |
| position: relative;
| |
| object-position: right;
| |
| left: -25px;
| |
| top: -5px;
| |
| border: none;
| |
| border-radius: 500px;
| |
| -moz-border-radius: 500px;
| |
| -webkit-border-radius: 500px;
| |
| background-image: url("");
| |
| background-position: top;
| |
| -webkit-mask-image: linear-gradient(to right, rgb(0, 0, 0, 1) 55%, rgb(0, 0, 0, -0.2) 100%);
| |
| mask-image: linear-gradient(to right, rgb(0, 0, 0, 1) 55%, rgb(0, 0, 0, -0.2) 100%);
| |
| }
| |
|
| |
| .drop2C2-content {
| |
| position: absolute;
| |
| top: 175px;
| |
| left: -30px;
| |
| color: white;
| |
| font-size: 12pt;
| |
| text-align: center;
| |
| background-color: rgb(127, 101, 148);
| |
| border: 2px double rgb(234, 75, 242);
| |
| border-radius: 25px;
| |
| min-width: 150px;
| |
| padding: 6px 8px;
| |
| z-index: 2;
| |
| display: none;
| |
| box-shadow: inset 1px 1px 2px 0px rgba(158,165,176, .75),inset 2px 2px 12px 0px rgba(226, 227, 236, 1),inset -2px -2px 12px 0px rgba(226, 227, 236, 1),inset 0px 0px 48px rgba(226, 227, 236, 1),0px 0px 15px rgba(255, 255, 255, 1),0px 0px 10px rgba(255, 255, 255, 1),0px 0px 4px rgba(255, 255, 255, 1) !important;
| |
| }
| |
|
| |
| .drop2C:hover .drop2C2-content {
| |
| display: block;
| |
| }
| |
|
| |
| }}
| |
| <!-- wiki profile container -->
| |
| <div class="container">
| |
|
| |
| <!-- header -->
| |
| <div class="photo-header">[[File:WMHeader.png|center|link=]]</div>
| |
|
| |
|
| |
| <!-- infobox and introduction -->
| |
| <div class="row">
| |
| <div class="column left">
| |
| <div class="heading">Pack Details</div>
| |
| {| class="infobox" align="left" style="text-align:center;"
| |
| |-
| |
| |class=info-title|Totem:
| |
| |-
| |
| |class=content|Raccoon
| |
| |-
| |
| |class=info-title|Totem Type:
| |
| |-
| |
| |class=content|Cunning/City
| |
| |-
| |
| |class=info-title|Territory:
| |
| |-
| |
| |class=content|....
| |
| |-
| |
| |class=info-title|Landmarks:
| |
| |-
| |
| |class=content|Landmark 1 (hangout#)
| |
| |-
| |
| |class=content|Landmark 2 (hangout#)
| |
| |-
| |
| |class=content|Landmark 3 (hangout#)
| |
| |-
| |
| |}
| |
|
| |
| </div>
| |
|
| |
| <div class="column right">
| |
| <div class="heading">The Pack</div>
| |
| <p class="content spacing"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla mollis accumsan nisl ac sollicitudin. Integer vitae nisl imperdiet, pharetra lacus quis, aliquet elit. Nulla vel neque nec velit faucibus vestibulum. Nunc ultrices lectus lacus, at imperdiet enim malesuada a. Praesent vitae nulla tempus, cursus diam sed, bibendum diam. Sed dictum gravida dignissim. Nam eu efficitur lacus. Vestibulum elit nisi, facilisis ultricies dui sit amet, laoreet iaculis elit. Maecenas condimentum venenatis suscipit. Donec fringilla at turpis at ultricies. Praesent malesuada vel diam eu ullamcorper..</p></div>
| |
| </div>
| |
| <br>
| |
| [[File:WMDivider.png|center|100%]]
| |
|
| |
| <br>
| |
| <center><span class="heading">Members</span></center>
| |
| <center><div class="container2">
| |
| [[File:Rigby2.jpg|class=image|x200px|Link=Rigby]] <div class="overlay2">
| |
| <div class="text"><span style="font-size:16pt;">'''[[Rigby]]'''</span><br>Fostern<br>Ragabash<br>Bone Gnawer</div>
| |
| </div>
| |
| </div>
| |
| <div class="container2">
| |
| [[File:Mark.png|class=image|x200px|Link=Mark]] <div class="overlay2">
| |
| <div class="text"><span style="font-size:16pt;">'''[[Mark]]'''</span><br>Cliath<br>Ragabash<br>Bone Gnawer</div>
| |
| </div>
| |
| </div>
| |
| <div class="container2">
| |
| [[File:Placeholder.png|class=image|x200px|Link=JoAnne]] <div class="overlay2">
| |
| <div class="text"><span style="font-size:16pt;">'''[[JoAnne]]'''</span><br>Cliath<br>Ahroun<br>Bone Gnawer</div>
| |
| </div>
| |
| </div>
| |
| </center>
| |
| <br>
| |
| <div class="row">
| |
| <div class="column full">
| |
|
| |
| </div>
| |
| </div> </center>
| |
| <br><br>
| |
| <div class="row">
| |
| <div class="column full">
| |
| <div class="heading">Deeds</div>
| |
| * Deed 1
| |
| * Deed 1
| |
| * Deed 1
| |
| * Deed 1
| |
| </div>
| |
|
| |
| </div>
| |
|
| |
| <div class="footer">
| |
| [[File:WMGrouch.gif|center|link=]]
| |
| </div>
| |
| </div>
| |
