Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- @font-face {
- font-family: "partybusiness";
- src: url("../fonts/partybusiness.ttf");
- }
- @font-face {
- font-family: ani;
- src: url("../fonts/anicb.ttf");
- src: url("../fonts/anicm.ttf");
- src: url("../fonts/anirb.ttf");
- src: url("../fonts/anirm.ttf");
- }
- @font-face {
- font-family: "teng";
- src: url("../fonts/tngan.ttf");
- src: url("../fonts/tnganb.ttf");
- src: url("../fonts/tnganbi.ttf");
- src: url("../fonts/tngani.ttf");
- }
- body{
- margin: auto;
- width: 900px;
- }
- h1, h2, h3, h5,table,p, .nav-link {
- font-family: 'ani', cursive;
- }
- .tableCaption{
- font-family: 'ani', cursive;
- }
- h2 {
- font-size: calc(15px + 1vw);
- margin: 2vw;
- }
- .elveSymbol {
- color: orange;
- font-family: Tengwar Annatar;
- }
- /* -------------------------------------- */
- /* Navbar */
- /* -------------------------------------- */
- .navbar.navbar-expand-lg .nav-link {
- color: white;
- font-family: "ani" !important;
- font-size: 17px;
- }
- .navbar.navbar-expand-lg .nav-link:hover{
- color: white;
- text-decoration: underline white;
- }
- .navbar.navbar-expand-lg {
- background-color: #FF7700;
- }
- .navbar.navbar-expand-lg .navbar-nav, .nav-item {
- margin-left: auto;
- }
- .navbar.navbar-expand-lg .fa-bars{
- color: white;
- }
- /* -------------------------------------- */
- /* Carousel */
- /* -------------------------------------- */
- .carousel-caption > h5{
- font-size: 3.5vw;
- }
- .carousel-caption > p{
- font-size: 1.6vw;
- }
- .carousel-caption{
- top: 50%;
- transform: translateY(-50%);
- bottom: initial;
- }
- /* -------------------------------------- */
- /* Mise en page Sections */
- /* -------------------------------------- */
- section:nth-child(even) {
- background-color: #2B2B2B;
- color: white;
- }
- section:nth-child(odd) {
- background-color: #EDEDED;
- color: #2B2B2B;
- }
- section {
- padding: 15px;
- }
- .container-fluid {
- padding: 0;
- }
- /* -------------------------------------- */
- /* Section Fellows */
- /* -------------------------------------- */
- h2 em {
- font-size: .6em;
- }
- /* Pills */
- .nav.nav-tabs .nav-item .nav-link {
- background-color: transparent;
- border: none;
- color: grey;
- text-align: center;
- font-size: calc(11px + 0.8vw);
- width: 100%;
- }
- .nav.nav-tabs .nav-item {
- width: 100%;
- }
- .nav.nav-tabs .nav-item .nav-link.active {
- color: orange;
- text-decoration: underline orange;
- }
- .nav.nav-tabs .nav-item .nav-link .elveSymbol {
- display: none;
- }
- .nav.nav-tabs .nav-item .nav-link.active .elveSymbol {
- display: inline;
- color: orange;
- }
- /* Wanted cards */
- .tab-pane.fade {
- display: flex;
- flex-direction: row;
- flex-wrap: wrap;
- justify-content: space-around;
- }
- .tab-content.row {
- height: auto;
- }
- .wantedCard {
- height: 600px;
- margin-top: 15px;
- }
- .wantedCard .wantedPic {
- height: 80%;
- }
- .wantedCard .legend {
- height: 20%;
- background-color: black;
- color: white;
- padding: 3px;
- font-size: 1em;
- }
- .wantedCard:first-of-type .wantedPic {
- background: url("gandalf.png") center no-repeat;
- background-size: cover;
- }
- .wantedCard:nth-of-type(2) .wantedPic {
- background: url("aragorn.png") center no-repeat;
- background-size: cover;
- }
- .wantedCard:nth-of-type(3) .wantedPic {
- background: url("gimli.png") center no-repeat;
- background-size: cover;
- }
- .description {
- height: 100%;
- width: 100%;
- display: flex;
- flex-direction: column;
- background-color: rgba(130,130,130,0.7);
- }
- .wantedPic.disabled .description {
- background-color: rgba(50,50,50,0.7);
- }
- .description h3 {
- flex: 2;
- margin: 0;
- display: flex;
- justify-content: center;
- align-items: center;
- color: white;
- font-size: 2.5em;
- }
- .wantedPic.disabled .description h3 {
- text-decoration: line-through #FF7700;
- }
- .reward {
- width: 100%;
- height: 75px;
- }
- .wantedPic.active .reward p {
- text-align: center;
- margin: 20px 25% 0;
- background-color: rgba(255,255,255,0.8);
- border-radius: 15px;
- box-shadow: 0 0 25px rgba(255,255,255,0.8);
- }
- .wantedPic.disabled .reward p {
- color: #FF7700;
- font-size: 2.5em;
- text-align: center;
- margin-top: 20px;
- }
- .reward p strong {
- color: orange;
- font-weight: normal;
- }
- }
- .wantedPic.active .description:hover { /* Faire disparaitre la description */
- opacity: 0;
- }
- /* -------------------------------------- */
- /* Section Get My Reward */
- /* -------------------------------------- */
- .btn.btn-custom-orange.active {
- color: #FF7700;
- background-color: white;
- border: none;
- font-size: 30px;
- font-family: "ani";
- }
- .coin {
- width: 175px;
- height: 175px;
- border-radius: 50%;
- margin-bottom: 5px;
- }
- /* -------------------------------------- */
- /* Section Best Hunters */
- /* -------------------------------------- */
- .media-body h3 {
- color: #FF7700;
- font-size: 1.5rem;
- }
- .media-body p:first-of-type a {
- color: black;
- text-decoration: underline;
- }
- .media-body .btn.btn-custom-like.active {
- background-color: #2B2B2B;
- border: none;
- color: #FF7700;
- font-size: 25px;
- }
- /* -------------------------------------- */
- /* Section About the Ring */
- /* -------------------------------------- */
- #theRing article {
- display: flex;
- flex-direction: column;
- padding: 0;
- border-radius: 10px 10px 0 0;
- border-bottom: #FF7700 solid 3px;
- margin: 0 20px 20px 20px;
- background-color: #EDEDED;
- color: #2B2B2B;
- }
- #theRing article header {
- padding-left: 10px;
- border-radius: 10px 10px 0 0;
- background-color: #FF7700;
- color: white;
- }
- #theRing article p {
- margin: 20px 0 0 20px;
- }
- #theRing article header h3 {
- margin: 3px;
- }
- /* Mise en forme du tableau */
- table {
- border-collapse: collapse;
- width:85%;
- height: 120px;
- margin-left: auto;
- margin-right: auto;
- margin-top: 10px;
- margin-bottom: 15px;
- }
- caption {
- margin-bottom: 5px;
- text-align: left;
- }
- td, th {
- border: 1px solid black;
- text-align: center;
- }
- th {
- color: white;
- background-color: grey;
- background-color: grey;
- }
- tr:nth-child(odd) {
- background-color: #D6D6D6 ;
- }
- /* Mise en forme de la citation */
- .ringAwesomeContent {
- margin: 15px 20px 15px 10px;
- font-size: 1.2em;
- display: flex;
- justify-content: space-around;
- }
- .ringAwesomeContent .signature {
- color: #D3D3D3;
- }
- .ringAwesomeContent p {
- text-align: right;
- }
- .ringAwesomeContent img {
- float: right;
- border-radius: 50%;
- }
- .portraitCommentaire {
- display: inline;
- }
- /* -------------------------------------- */
- /* Section Join the Army */
- /* -------------------------------------- */
- .armyPic {
- background: url("army.png") center no-repeat;
- background-size: contain;
- }
- .sauronPic {
- background: url("weneedyou-1.png") center no-repeat;
- background-size: contain;
- }
- .row.contactUsBtn {
- min-height: 150px;
- }
- .row.contactUsBtn .btn {
- height: 50px;
- margin-top: auto;
- margin-bottom: auto;
- font-size: 20px;
- }
- /* -------------------------------------- */
- /* Section Contact us */
- /* -------------------------------------- */
- #contactUs form * {
- width: 100%;
- margin: 0 0 10px 0;
- }
- #contactUs {
- border-bottom: none;
- margin-bottom: 0;
- }
- .niceMap {
- background: url("map.png") center no-repeat;
- background-size: contain;
- }
- input, textarea, select{
- font-family: 'ani', cursive;
- }
- /* -------------------------------------- */
- /* Footer */
- /* -------------------------------------- */
- footer.row {
- background-color: #FF7700;
- margin: 0;
- }
- footer ul {
- list-style-type: none;
- }
- footer ul li a, footer p{
- font-family: 'ani', cursive;
- }
- footer a {
- text-decoration: none;
- color: white;
- }
- .additionalFooterLinks {
- font-weight: bold;
- padding-right: 0;
- margin-right: -15px;
- }
- .additionalFooterLinks li {
- padding-right: -15px;
- }
- @media (max-width:576px){
- .carousel.slide, .portraitCommentaire, .joinIllustration {
- display: none;
- }
- }
- @media (min-width:992px){
- .navbar.navbar-expand-lg .nav-item:not(:last-of-type) {
- border-right: 1px solid white;
- }
- .nav.nav-tabs .nav-item {
- width: 33%;
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement