Difference between revisions of "Team:Czech Republic/Template:Stylesheet"

 
(400 intermediate revisions by 4 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
−
<head>
 
 
<style>
 
<style>
−
a
+
 
 +
/* OVERRIDE IGEM SETTINGS ---------------------------------------------- */
 +
 
 +
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading, .visualClear
 
{
 
{
−
     color: #000000;
+
     display: none;
 
}
 
}
  
−
html
+
#content
 
{
 
{
−
     font-family: Verdana, sans-serif;
+
     width: 100%;
−
     background-color: #EEEEEE;
+
     padding: 0;
 +
    border: 0;
 
}
 
}
  
−
main
+
#globalWrapper
 
{
 
{
−
     margin-left: 70px;
+
     padding: 0;
−
     margin-top: 90px;
+
     font-size: 100%;
 
}
 
}
  
−
h3
+
#main-div ul, #main-div ol
 
{
 
{
−
     margin-top: 0;
+
     margin: 0px 0px 10px 0;
−
    margin-bottom: 5px;
+
 
}
 
}
  
−
p, label
+
#main-div ol li
 
{
 
{
−
     margin-top: 2px;
+
     margin-left: 30px;
−
    margin-bottom: 2px;
+
 
}
 
}
  
−
input[type="text"], input[type="number"]
+
#main-div ul li
 
{
 
{
−
    border: 1px solid #777777;
+
     margin-left: 20px;
−
    border-radius: 4px;
+
     list-style: none;
−
    height: 25px;
+
−
     margin-bottom: 5px;
+
−
     vertical-align: middle;
+
−
    padding: 3px;
+
 
}
 
}
  
−
input[type="checkbox"]
+
#main-div ul li:before
 
{
 
{
−
     margin-bottom: 10px;
+
    content: "• ";
−
     vertical-align: middle;
+
    color: #CC1D24;
 +
     margin-left: -12px;
 +
    padding-right: 3px;
 +
    position: relative;
 +
     z-index: 5;
 
}
 
}
  
−
textarea:focus, input[type="text"]:focus, input[type="number"]:focus, .resize:hover
+
#main-div ul.gallery li
 
{
 
{
−
     border-color: #000000;
+
     list-style: none;
−
    background-color: #E5E5E5;
+
 
}
 
}
  
−
/* PANEL -------------------------------------------------------------------*/
+
#main-div ul.gallery li:before
 +
{
 +
    content: ""
 +
}
  
−
.panel
+
.image
 
{
 
{
−
     z-index: 2;
+
     position: relative;
−
     position: fixed;
+
     z-index: 20;
 +
}
  
−
     width: 100%;
+
.break
−
    height: 50px;
+
{
 +
     clear: both;
 +
}
  
−
     border-bottom: 1px solid #777777;
+
#main-div .thumb.tright
 +
{
 +
     border: 0;
 +
    margin: 1em;
 +
}
  
−
     left: 0;
+
#main-div .thumbinner
−
     top: 0;
+
{
 +
     padding: 0 !important;
 +
     border: 0;
 +
    background-color: transparent;
 +
}
  
−
    background-color: #D5D5D5;
+
#main-div .thumbinner a img
 +
{
 +
    border: 0;
 
}
 
}
  
−
#panel ul
+
#main-div .thumb div
 
{
 
{
−
     list-style-type: none;
+
     background-color: transparent;
−
    padding: 0;
+
 
}
 
}
  
−
.features a, .about a
+
#main-div .thumbcaption
 
{
 
{
−
     text-decoration: none;
+
     text-align: justify;
−
     display: block;
+
     font-weight: 400;
−
     padding: 8px 0 8px 10px;
+
     font-size: 11px;
−
     width: 290px;
+
     color: #505050;
 
}
 
}
  
−
.features, .about
+
#main-div .thumbcaption .magnify
 
{
 
{
−
     margin-top: 30%;
+
     display: none;
 
}
 
}
  
−
.features li
+
#main-div dd
 
{
 
{
−
     font-size: 22px;
+
     margin-left: 0.2em;
−
    padding: 0;
+
−
    border-top: 1px solid #000000;
+
−
    background-color: #EEEEEE;
+
 
}
 
}
  
−
.features li:hover, .about li:hover
+
/* GLOBAL FONT SETTINGS ---------------------------------------------- */
 +
 
 +
@font-face
 +
{
 +
    font-family: Roboto;
 +
    src: url(https://static.igem.org/mediawiki/2015/2/2e/Czech_Republic_Roboto-Light.ttf);
 +
    font-weight: 300;
 +
}
 +
@font-face
 +
{
 +
    font-family: Roboto;
 +
    src: url(https://static.igem.org/mediawiki/2015/1/10/Czech_Republic_Roboto-Bold.ttf);
 +
    font-weight: 700;
 +
}
 +
@font-face
 
{
 
{
−
     background-color: #E05454;
+
     font-family: Roboto;
 +
    src: url(https://static.igem.org/mediawiki/2015/1/11/Czech_Republic_Roboto-Regular.ttf);
 +
    font-weight: 400;
 
}
 
}
  
−
.features li:hover > a, .about li:hover > a
+
#bodyContent, body, html
 
{
 
{
−
     color: #FFFFFF;
+
     font-family: "Roboto", sans-serif;
 +
    font-weight: 300;
 +
    font-size: 14px;
 +
    background-color: white;
 
}
 
}
  
−
.about li
+
strong, b
 
{
 
{
−
    font-size: 15px;
+
  color: #000000;
 +
  font-weight: 700;
 +
}
 +
 
 +
header
 +
{
 +
    margin: 0 0 20px 0;
 
     padding: 0;
 
     padding: 0;
−
    border-top: 1px solid #000000;
 
−
    background-color: #D5D5D5;
 
 
}
 
}
  
−
.last
+
.info-box
 
{
 
{
−
    border-bottom: 1px solid #000000;
 
 
}
 
}
  
−
#version
+
.info-box .right h2
 
{
 
{
−
     position: fixed;
+
     margin-left: 0.25em;
−
    font-size: 15px;
+
−
    bottom: 15px;
+
−
    left: 15px;
+
 
}
 
}
  
−
#menu_button
+
.info-box h2
 
{
 
{
−
    width: 40px;
+
     margin-top: 0;
−
    height: 40px;
+
−
    cursor: pointer;
+
−
    display: block;
+
−
    margin-left: auto;
+
−
    margin-right: 15px;
+
−
     margin-top: 30px;
+
 
}
 
}
  
−
/* HEADER ---------------------------------------------------------------- */
+
.toclevel-3, .toclevel-4, .toclevel-5
 +
{
 +
    display: none;
 +
}
  
−
#header
+
#main-div header h1
 
{
 
{
−
z-index: 1;
+
    margin: 0;
−
position: fixed;
+
    font-size: 48px;
−
     width: 100%;
+
    font-weight: 400;
−
     height: 88px;
+
    text-transform: uppercase;
−
     border-bottom: 1px solid #777777;
+
    color: #303030;
−
     left: 70px;
+
}
 +
 
 +
#main-div h1, #main-div h2
 +
{
 +
    clear: both;
 +
}
 +
 
 +
#main-div h6
 +
{
 +
    font-weight: 400;
 +
    font-size: 1.2em;
 +
    color: #303030;
 +
}
 +
 
 +
#main-div h5
 +
{
 +
    font-weight: 400;
 +
    font-size: 1.3em;
 +
    color: #303030;
 +
}
 +
 
 +
#main-div h4
 +
{
 +
    font-weight: 700;
 +
    font-size: 1.3em;
 +
    color: #303030;
 +
}
 +
 
 +
#main-div h3
 +
{
 +
    font-weight: 700;
 +
    font-size: 1.4em;
 +
    color: #303030;
 +
}
 +
 
 +
#main-div h2
 +
{
 +
    font-weight: 700;
 +
    font-size: 1.5em;
 +
}
 +
 
 +
#main-div h1
 +
{
 +
    font-weight: 700;
 +
    font-size: 1.8em;
 +
}
 +
 
 +
address
 +
{
 +
    font-style: normal;
 +
}
 +
 
 +
/* WKIMEDIA HEADERS ---------------------------------------------- */
 +
 
 +
.mw-headline
 +
{
 +
    border-top: 70px solid transparent;
 +
    margin-top: -70px;
 +
    display: inline-block;
 +
    position: relative;  
 +
}
 +
 
 +
h1 .mw-headline:after
 +
{
 +
     content: "";
 +
    position: absolute;
 +
     height: 0.5em;
 +
 
 +
     border-bottom: 1px solid #CC1D24;
 +
      
 +
    margin-left: 10px;
 
     top: 0;
 
     top: 0;
−
     background: linear-gradient(to left, #D5D5D5, #FFFFFF, #FFFFFF, #D5D5D5);
+
     left: 100%;
 +
 
 +
    width: 100px;
 +
    width: -webkit-calc(950px - 100%);
 +
    width: calc(950px - 100%);
 
}
 
}
  
−
#header_image
+
.ref-back
 
{
 
{
−
     width: 375px;
+
     border-top: 70px solid transparent;
−
    display: block;
+
     margin-top: -70px;
−
     margin-left: auto;
+
     display: inline-block;
−
     margin-right:auto;
+
 
}
 
}
  
−
#header_image img
+
.floatnone img
 
{
 
{
−
     margin-top: 10px;
+
     margin: 5px 0 15px 0;
−
    height: 70px;
+
−
    width: 375px;
+
 
}
 
}
  
−
/* CENTER ------------------------------------------------------------------*/
+
pre
 +
{
 +
    word-wrap: break-word;
 +
    white-space: pre-wrap;
 +
    height: 8em;
 +
    overflow-y: scroll;
 +
    resize: vertical;
 +
}
  
−
.center
+
/* GLOBAL --------------------------------------------------------------- */
 +
 
 +
p, a
 
{
 
{
−
     width: 70%;
+
     margin-top: 2px;
−
     clear: both;
+
     margin-bottom: 10px;
−
     margin-left: auto;
+
     text-align: justify;
−
     margin-right: auto;
+
     position: relative;
 +
    z-index: 2;
 
}
 
}
  
−
/* NAVIGATION ---------------------------------------------------------------- */
+
#main-div a, #main-div a:visited,
 +
#main-div a.external, #main-div a.external:visited
 +
{
 +
    color: #CC1D24;
 +
}
  
−
#analyzer_button, #gas_button, #randomizer_button
+
#main-div a.external
 
{
 
{
−
    clear: both;
+
     background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6+R8AAAABmJLR0QAzAAdACT9W2pXAAAACXBIWXMAAA3XAAAN1wFCKJt4AAAAB3RJTUUH3wkQEC4amPZikgAAAP5JREFUKM+VkjtrAlEQhb97s5jVwgexsRCbBERThDwgRYr8Ba2sbLRLk9YmgbSC3XZbS3q7QCB2QrLpTG0hWIh2rhrWR6GEZffekAwMwwxzmJkzR3xkj/mvSU39AfA0jqEBPe3jNVAGFvs8BPICQAH0VdsEC4aZSkaBDDAAKoALxADzp8mPuLirM59M2+54cj547baAL6AAPAND5STHsjFTyepR/uQtd3vzCDSADlAEespJAELKOVBLF/PN75l7P3r/PAVGPnLCRzqWDcBmvW5kLs/6B5HIVZBV5Z8cy0ZI6a2Wy9JhIv4S2sanCE+ngM2Of0N1k+7RiD/K6FfbAqsCPj1oC/QAAAAAAElFTkSuQmCC)
−
    margin: 20px 10px 10px 10px;
+
−
    float: right;
+
−
     background-color: #FFFFFF;
+
−
    padding: 10px 20px;
+
−
    border: 1px solid #E05454;
+
−
    border-radius: 10px;
+
 
}
 
}
  
−
#analyzer_button:hover, #gas_button:hover, #randomizer_button:hover
+
h1, h2, h3, h4, h5, h6
 
{
 
{
−
     background-color: #FFE0E0;
+
     margin: 15px 0px 0px 0px;
 +
    border: none;
 +
    padding: none;
 +
    color: #CC1D24;
 
}
 
}
  
−
#gas_button
+
hr
 
{
 
{
−
     float: left;
+
     margin: 1em 0 1.5em 0;
−
    padding: 5px 10px;
+
 
}
 
}
  
−
#analyzer_button:hover > #wheel, #gas_button:hover > #catcher, #randomizer_button:hover > #square
+
/* TABLE --------------------------------------------------------------- */
 +
 
 +
.wikitable td
 
{
 
{
−
     -webkit-animation-play-state: running;
+
     text-align: center;
−
     -moz-animation-play-state: running;
+
     padding: 5px 20px;
−
    -ms-animation-play-state: running;
+
−
    -o-animation-play-state: running;
+
−
    animation-play-state: running;
+
 
}
 
}
  
−
#wheel
+
.wikitable th
 
{
 
{
−
     -webkit-animation: spin 3s linear infinite;
+
     text-align: left;
−
     -moz-animation: spin 3s linear infinite;
+
     padding: 10px;
−
    -ms-animation: spin 3s linear infinite;
+
}
−
    -o-animation: spin 3s linear infinite;
+
−
    animation: spin 3s linear infinite;
+
  
−
    -webkit-animation-play-state: paused;
+
.wikitable
−
    -moz-animation-play-state: paused;
+
{
−
    -ms-animation-play-state: paused;
+
     width: 100%
−
    -o-animation-play-state: paused;
+
−
     animation-play-state: paused;
+
 
}
 
}
  
−
#catcher
+
/* TABLE OF CONTENTS --------------------------------------------------------------*/
 +
 
 +
@media screen and (min-width: 1800px)
 
{
 
{
−
    -webkit-animation: flip 2s linear infinite;
+
#main-div #toc, #main-div .toc
−
    -moz-animation: flip 2s linear infinite;
+
{
−
     -ms-animation: flip 2s linear infinite;
+
     z-index: 98;
−
    -o-animation: flip 2s linear infinite;
+
     position: fixed;
−
     animation: flip 2s linear infinite;
+
  
−
     -webkit-animation-play-state: paused;
+
     left: 50%;
−
     -moz-animation-play-state: paused;
+
     margin: 0px 0px 0px 540px;
−
     -ms-animation-play-state: paused;
+
     top: 97px;
−
     -o-animation-play-state: paused;
+
 
−
    animation-play-state: paused;
+
     padding: 0px;
 +
}
 
}
 
}
  
−
#square
+
#main-div #toc, #main-div .toc
 
{
 
{
−
     -webkit-animation: wobble 0.5s linear infinite;
+
     border: none;
−
     -moz-animation: wobble 0.5s linear infinite;
+
     background: transparent;
−
    -ms-animation: wobble 0.5s linear infinite;
+
}
−
    -o-animation: wobble 0.5s linear infinite;
+
−
    animation: wobble 0.5s linear infinite;
+
  
−
    -webkit-animation-play-state: paused;
+
#main-div #toc #toctitle, #main-div .toc #toctitle
−
    -moz-animation-play-state: paused;
+
{
−
     -ms-animation-play-state: paused;
+
     text-align: left;
−
     -o-animation-play-state: paused;
+
     margin-bottom: 10px;
−
    animation-play-state: paused;
+
 
}
 
}
  
−
@-webkit-keyframes spin
+
#main-div #toc #toctitle h2, #main-div .toc #toctitle h2
 
{
 
{
−
  100%
+
     font-size: 120%;
−
  {
+
    margin-right: 10px;
−
     -webkit-transform: rotate(360deg);
+
−
      -moz-transform: rotate(360deg);
+
−
        -ms-transform: rotate(360deg);
+
−
        -o-transform: rotate(360deg);
+
−
            transform: rotate(360deg);
+
−
  }
+
 
}
 
}
  
−
@keyframes spin
+
#main-div #toc li
 
{
 
{
−
  100%
+
     margin-left: 0;
−
  {
+
    list-style: none;
−
     -webkit-transform: rotate(360deg);
+
−
      -moz-transform: rotate(360deg);
+
−
        -ms-transform: rotate(360deg);
+
−
        -o-transform: rotate(360deg);
+
−
            transform: rotate(360deg);
+
−
  }
+
 
}
 
}
  
−
@-webkit-keyframes flip
+
#main-div #toc ul li:before
 
{
 
{
−
  100%
+
    content: "";
−
  {
+
−
        -webkit-transform: rotateY(360deg);
+
−
          -moz-transform: rotateY(360deg);
+
−
            -ms-transform: rotateY(360deg);
+
−
            -o-transform: rotateY(360deg);
+
−
                transform: rotateY(360deg);
+
−
  }
+
 
}
 
}
  
−
@keyframes flip
+
/* PANEL -------------------------------------------------------------------*/
 +
#panel
 
{
 
{
−
     100%
+
     z-index: 100;
 +
    position: fixed;
 +
 
 +
    height: 40px;
 +
    width: 100%;
 +
 
 +
    left: 0px;
 +
    top: 17px;
 +
 
 +
    background-color: #303030;
 +
}
 +
 
 +
.centered-list
 +
{
 +
    text-align: center;
 +
    width: 95%;
 +
    margin: auto;
 +
}
 +
 
 +
#panel-ul
 +
{
 +
    margin: 0px;
 +
    padding: 0px;
 +
    list-style-type: none;
 +
    display: inline-block;
 +
}
 +
 
 +
#panel-ul li
 +
{
 +
    display: inline-block;
 +
 
 +
    margin: 0px;
 +
    padding: 0px 20px;
 +
 
 +
    height: 100%;
 +
}
 +
 
 +
#panel-ul li a
 +
{
 +
    color: white;
 +
    text-decoration: none;
 +
 
 +
    margin: 0px;
 +
    padding: 0px;
 +
}
 +
 
 +
#panel-ul-logo {
 +
    display: inline-block;
 +
    margin: 0;
 +
}
 +
 
 +
#panel-ul-logo img {
 +
    vertical-align: middle;
 +
    width: 112px;
 +
    height: 40px;
 +
}
 +
 
 +
#panel-ul li:hover > a, #panel-ul-logo:hover
 +
{
 +
    text-decoration: none;
 +
    transition: opacity 0.2s ease;
 +
    -webkit-transition: opacity 0.3s ease;
 +
    -moz-transition: opacity 0.3s ease;
 +
    -o-transition: opacity 0.3s ease;
 +
    opacity: 0.65;
 +
}
 +
 
 +
/* MOBILE VERSION ------------------------------------ */
 +
 
 +
#panel-ul-switch {
 +
    display: inline-block;
 +
}
 +
 
 +
@media screen and (max-width: 1000px)
 +
{
 +
    .centered-list {
 +
        position: relative;
 +
    }
 +
 
 +
    #panel-ul-logo {
 +
        float: left;
 +
    }
 +
   
 +
    #panel-ul {
 +
        display: none;
 +
    }
 +
 
 +
    #panel-ul-switch:hover #panel-ul {
 +
        display: block;
 +
    }
 +
 
 +
    #panel-ul-button:hover > div > div
 
     {
 
     {
−
         -webkit-transform: rotateY(360deg);
+
        transition: opacity 0.3s ease;
−
          -moz-transform: rotateY(360deg);
+
         -webkit-transition: opacity 0.3s ease;
−
            -ms-transform: rotateY(360deg);
+
        -moz-transition: opacity 0.3s ease;
−
            -o-transform: rotateY(360deg);
+
        -o-transition: opacity 0.3s ease;
−
                transform: rotateY(360deg);
+
        opacity: 0.65;
 +
    }
 +
 
 +
    #panel-ul-switch #panel-ul {
 +
        position: absolute;
 +
        background-color: #303030;
 +
        width: 200px;
 +
        top: 40px;
 +
        right: 0;
 +
    }
 +
 
 +
    #panel-ul-switch {
 +
        float: right;
 +
    }
 +
 
 +
    #panel-ul li, #panel-ul li a {
 +
        display: block;
 +
    }
 +
 
 +
    #panel-ul li
 +
    {
 +
        padding: 10px 20px;
 +
    }
 +
 
 +
    #panel-ul-button {
 +
        display: inline-block;
 +
        width: 30px;
 +
        height: 30px;
 +
        margin: 5px;
 +
        cursor: pointer;
 +
    }
 +
 
 +
    #panel-ul-button > div > div
 +
    {
 +
        background-color: white;
 +
        height: 4px;
 +
        width: 25px;
 +
        margin: 4px 0px;
 
     }
 
     }
 
}
 
}
  
−
@-webkit-keyframes wobble
+
/* CONTENT ------------------------------------------------------------------*/
 +
 
 +
#home-div
 
{
 
{
−
  0%
+
    left: 0;
−
  {
+
    margin: 0;
−
      -webkit-transform:  rotate(0deg);
+
    padding: 0;
−
          -moz-transform: rotate(0deg);
+
−
          -ms-transform: rotate(0deg);
+
−
            -o-transform: rotate(0deg);
+
−
              transform: rotate(0deg);
+
−
  }
+
−
  25%
+
−
  {
+
−
      -webkit-transform:  rotate(15deg);
+
−
          -moz-transform: rotate(15deg);
+
−
          -ms-transform: rotate(15deg);
+
−
            -o-transform: rotate(15deg);
+
−
              transform: rotate(15deg);
+
−
  }
+
−
  75%
+
−
  {
+
−
      -webkit-transform:  rotate(-15deg);
+
−
          -moz-transform: rotate(-15deg);
+
−
          -ms-transform: rotate(-15deg);
+
−
            -o-transform: rotate(-15deg);
+
−
              transform: rotate(-15deg);
+
−
  }
+
−
  100%
+
−
  {
+
−
      -webkit-transform:  rotate(0deg);
+
−
          -moz-transform: rotate(0deg);
+
−
          -ms-transform: rotate(0deg);
+
−
            -o-transform: rotate(0deg);
+
−
              transform: rotate(0deg);
+
−
  }
+
 
}
 
}
  
−
@keyframes wobble
+
#main-div
 
{
 
{
−
  0%
+
    left: 0;
−
  {
+
    margin: 0;
−
      -webkit-transform:  rotate(0deg);
+
    padding: 45px 20px 40px 20px;
−
          -moz-transform: rotate(0deg);
+
 
−
          -ms-transform: rotate(0deg);
+
    width: 960px;
−
            -o-transform: rotate(0deg);
+
    margin: 0px auto;
−
              transform: rotate(0deg);
+
−
  }
+
−
  25%
+
−
  {
+
−
      -webkit-transform: rotate(15deg);
+
−
          -moz-transform: rotate(15deg);
+
−
          -ms-transform: rotate(15deg);
+
−
            -o-transform: rotate(15deg);
+
−
              transform: rotate(15deg);
+
−
  }
+
−
  75%
+
−
  {
+
−
      -webkit-transform:  rotate(-15deg);
+
−
          -moz-transform: rotate(-15deg);
+
−
          -ms-transform: rotate(-15deg);
+
−
            -o-transform: rotate(-15deg);
+
−
              transform: rotate(-15deg);
+
−
  }
+
−
  100%
+
−
  {
+
−
      -webkit-transform:  rotate(0deg);
+
−
          -moz-transform: rotate(0deg);
+
−
          -ms-transform: rotate(0deg);
+
−
            -o-transform: rotate(0deg);
+
−
              transform: rotate(0deg);
+
−
  }
+
 
}
 
}
  
−
/* BUTTONS ------------------------------------------------------------*/
+
#header
 +
{
 +
    width: 100%;
  
−
.button_big
+
    left: 0;
 +
    margin: 0;
 +
    padding:0;
 +
}
 +
 
 +
.left
 +
{
 +
    display: inline-block;
 +
    float: left;
 +
    width: 475px;
 +
}
 +
 
 +
.right
 +
{
 +
    display: inline-block;
 +
    float: right;
 +
    width: 475px;
 +
}
 +
 
 +
.left .mw-headline:after, .right .mw-headline:after
 +
{
 +
    width: 100px;
 +
    width: -webkit-calc(465px - 100%);
 +
    width: calc(465px - 100%);
 +
}
 +
 
 +
.visibility-toggle
 
{
 
{
−
background-color:#FFFFFF;
+
    color: #CC1D24;
−
color: #000000;
+
−
font-size:18px;
+
−
border-radius:5px;
+
−
border: 1px solid #777777;
+
−
width:160px;
+
−
height:35px;
+
 
     cursor: pointer;
 
     cursor: pointer;
 
}
 
}
  
−
.button_small
+
.visibility-toggle:hover
 
{
 
{
−
background-color:#FFFFFF;
+
    text-decoration: underline;
−
color:#000000;
+
−
font-size:18px;
+
−
border-radius:5px;
+
−
border: 1px solid #777777;
+
−
width:90px;
+
−
height:26px;
+
−
        cursor: pointer;
+
 
}
 
}
  
−
.button_big.red, .button_small.red
+
.thumb
 
{
 
{
−
     border-color: #E05454;
+
     z-index: 5;
 +
    position: relative;
 
}
 
}
  
−
.button_big.red:hover, .button_small.red:hover
+
video
 
{
 
{
−
     background-color: #FFE0E0;
+
     margin: 1em;
−
    border-color: #E05454;
+
−
    border-width: 2px;
+
 
}
 
}
  
−
.button_big:hover, .button_small:hover
+
/* FOOTER ------------------------------------------------------------------*/
 +
 
 +
#footer
 
{
 
{
−
     background-color: #D5D5D5;
+
     width: 100%;
−
     border-color: #000000;
+
     position: relative;
−
     border-width: 2px;
+
    left: 0;
 +
    bottom: 0;
 +
 
 +
    clear: both;
 +
 
 +
    background-color: #F2F2F2;
 +
     color: black;
 
}
 
}
 +
 +
#footer-container
 +
{
 +
    width: 100%;
 +
 +
    padding: 4em 0 4em 0;
 +
    margin: 0 0;
 +
}
 +
 +
#footer-right, #footer-left
 +
{
 +
    display: inline-block;
 +
    vertical-align: top;
 +
    margin: 0 8%
 +
}
 +
 +
#footer h1
 +
{
 +
    color: #CC1D24;
 +
    font-size: 15px;
 +
    font-weight: 700;
 +
 +
    border: 0;
 +
    padding: 0;
 +
    margin: 0 0 2em;
 +
 +
    float: left;
 +
}
 +
 +
#footer p, #footer a
 +
{
 +
    text-decoration: none;
 +
    color: inherit;
 +
 +
    font-size: 14px;
 +
    font-weight: 300;
 +
    line-height: 1em;
 +
 +
    margin: 0 0 3px;
 +
    padding: 0;
 +
 +
    clear: both;
 +
    float: left;
 +
}
 +
 +
#footer a:hover
 +
{
 +
    text-decoration: underline;
 +
    color: #CC1D24;
 +
}
 +
 
</style>
 
</style>
−
</head>
 
 
</html>
 
</html>

Latest revision as of 15:18, 18 September 2015