Team:Aalto-Helsinki/stylesheet.css

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
-
/*
 
-
GENERAL CSS FOR EVERYTHING
 
-
*/
 
-
 
@font-face {
@font-face {
-
    font-family: "Fonttia";
+
  font-family: "TitilliumWeb";
-
     src: url("http://igem-qsf.github.io/igem-wiki/fonts/Santana.ttf") format("truetype");
+
     src: url(fonts/TitilliumWeb-Regular.ttf) format("truetype");
}
}
-
p {
+
*{font-family:"TitilliumWeb";}
-
  /* font-size:50px; */
+
 
 +
a:link {color:#FFFFFF;}
 +
a:visited {color:#FFFFFF;}
 +
a:hover {color:#50BCBC;}
 +
a:active {color:black;}
 +
 
 +
a:hover, a:visited, a:link, a:active {
 +
    /* poistin ton !importantin. kyllä linkit pitää normitekstissä alleviivata eikä se nyt onnistu
 +
    * text-decoration: none !important; */
}
}
 +
a:not(.underline) {
 +
    text-decoration: none !important;
-
h1, h2, h3, h4, h5, h6 {
 
-
    border-bottom: 0px;
 
-
    font-family: "Fonttia", "Helvetica Neue", Helvetica, Arial, sans-serif;
 
}
}
-
/*
+
#ahlogo{
-
GENERAL END
+
}
-
*/
+
 +
#logo{
 +
  height: 8em;
 +
    padding-bottom: 1em;
 +
}
 +
/* Header-jutut */
-
/*
+
header {
-
LINKCOLORS
+
  color:white;
-
ALL LINK (A)
+
}
-
AND HOVER (A:HOVER) COLORS
+
-
AND LINK STYLES
+
-
*/
+
-
a, a:visited, #menubar a, .sidebar-nav li a {
+
header a {
-
   font-family: "Fonttia", "Helvetica Neue", Helvetica, Arial, sans-serif;
+
   color: white;
-
   color: #0AA699;
+
   padding-right: 3vw;
-
   text-decoration: none !important;
+
   font-size: 1.5em;
}
}
-
a:hover, #menubar a:hover {
+
.last-link {
-
    color:#90F0E8;
+
  padding-right:1vw;
}
}
-
.sidebar-nav a.active.submenu,
+
header h1{
-
.sidebar-nav li a:hover,
+
  font-size: 1.35em;
-
.sidebar-nav li a.active,
+
   padding-right: 0;
-
.sidebar-nav li ul li a.active,
+
   padding-left: 1.5vw;
-
.sidebar-nav li ul li a.active:hover {
+
-
  color: white;
+
-
   text-decoration: none;
+
-
   background-color: #0AA699;
+
}
}
-
/*
+
header #logo {
-
COLORS END
+
  margin-top: 1.5em;
-
*/
+
  padding-left:1em;
 +
  height: 1.5em;
 +
  margin-right:0.2em;
 +
}
 +
header #lang {
 +
    margin-top: 3em;
 +
    font-size: 0.6em;
 +
}
-
#menubar{
+
header .navbar {
-
   margin-left:200px;
+
   background-color:rgba(0,0,0,0.7);
 +
  border:0px;
}
}
-
.left-menu:hover {
+
#navigation {
-
   background-color: transparent;
+
   margin-top: 2.5em;
}
}
-
.right-menu li a {
+
/* Header päättyy */
-
  background-color: transparent;
+
 
 +
/* Yksittäisten sivujen ylägradientti grafiikasta valkoiseksi*/
 +
 
 +
.top-graphic{
 +
    min-height:100vh;
 +
    background-image: url('www.aaltohelsinki.com/img/sepia_1920x1080_pack.jpg');
 +
    background-size: cover;
}
}
-
.navbar td{
+
.top-graphic .content{
-
  text-align:center;
+
    padding-top:30vh;
 +
    color:black;
 +
    text-align:justify;
}
}
-
.navbar .menu-link {
+
.top-graphic .content img {
-
  border:1px solid black;
+
    margin-top:10vh;
-
  height:45px;
+
}
}
-
#welcomepage {
+
.top-graphic .content h1 {
 +
    margin-bottom:5%;
 +
    color:black;
}
}
-
#pagecontent {
+
/* Leipätekstin modifikaatio */
-
  margin: 0 auto;
+
 
-
  margin-top: 5em;
+
.big-text{
-
  width: 50%;
+
    margin-bottom: 5%;
-
  padding: 1em;
+
    font-size:x-large;
-
  border-radius: 10px;
+
    margin-right:5%;
}
}
-
#top-section {
+
body{
-
   height: 0px;
+
   background-color:black;
-
  border: none;
+
    margin: 0;
-
  width: 980px;
+
    padding: 0;
-
  margin: 0 auto;
+
-
  padding: 0 0 0 0;
+
-
  background-color: transparent;
+
-
  overflow: hide;
+
-
  position: initial;
+
}
}
 +
article {
 +
  color:floralwhite;
 +
  padding-top: 5vh;
 +
  padding-bottom: 5vh;
 +
  padding-left: 15vw;
 +
  padding-right: 15vw;
 +
  min-height:85vh;
 +
    font-size:large;
 +
}
 +
article h1 {
 +
    font-family: "Kirvy-Regular", Verdana, Tahoma;
 +
}
-
/*
+
/* Pääsivun tyylit */
-
SIDEBAR STYLES  sidebar.css
+
-
(linkcolors/background included in LINKCOLORS)
+
-
*/
+
-
#sidebar.affix-top{
+
.what{
-
   position: static;
+
  padding-top: 20vh;
-
   margin-top:30px;
+
   background-image:url('www.aaltohelsinki.com/img/sepia_1920x1080_pack.jpg');
-
   width:228px;
+
   background-size: cover;
 +
   min-height:100vh;
 +
  color: black;
 +
    text-align: center;
}
}
-
#sidebar.affix {
+
.team{
-
   position: fixed;
+
   background-color: #912964;
-
  top:70px;
+
-
  width:228px;
+
}
}
-
#wrapper {
+
.university-title {
-
  padding-left: 200px;
+
    color: rgb(81,81,81);
-
  transition: all 0.4s ease 0s;
+
    font-style: italic;
 +
    font-size: 20px;
 +
    margin-top: 0;
}
}
-
#sidebar-wrapper {
+
.idea {
-
   margin-left: -250px;
+
   background-color: #0A4958;
-
  left: 250px;
+
-
  width: 200px;
+
-
  position: fixed;
+
-
  height: 100%;
+
-
  overflow-y: auto;
+
-
  z-index: 1000;
+
-
  transition: all 0.4s ease 0s;
+
}
}
-
#page-content-wrapper {
+
.follow {
-
   width: 100%;
+
   background-color: white;
 +
  color: black;
}
}
-
.sidebar-nav {
+
.seekers {
-
  position: absolute;
+
    color: black;
-
  top: 0;
+
    background-image:url('www.aaltohelsinki.com/img/kasi_vectored_gradient_transp.png');
-
  width: 200;
+
    background-size: 40%;
-
  list-style: none;
+
    background-position:center;
-
  margin: 0;
+
    background-repeat: no-repeat;
-
  padding: 0;
+
}
}
-
.sidebar-nav li {
+
.seekers a.BBSeeker {
-
  line-height: 35px;
+
    color:#B00C69;
-
  text-indent: 18px;
+
}
}
-
.sidebar-nav li a {
+
.seekers a.TSeeker {
-
  /* display: block; */
+
    color:#399f70;
}
}
-
.sidebar-nav li ul li{
+
#sm-logo {
-
  list-style: none;
+
    padding-bottom: 1em;
}
}
-
.sidebar-nav img {
+
.support {
-
   margin-left:20px;
+
   background-color: #F6E7D2;
 +
  color:black;
}
}
-
.sidebar-nav > .sidebar-brand {
+
.more {
-
  height: 65px;
+
    font-size:2em;
-
  line-height: 60px;
+
    font-family: "Infinity", Verdana, Tahoma;
-
  font-size: 18px;
+
}
}
-
.content-header {
+
/* Välilehtisivujen tyylejä */
-
  height: 65px;
+
 
-
  line-height: 65px;
+
.detail{
 +
    background-color:white;
 +
    color:black;
 +
    padding-top:0;
 +
    min-height:50vh;
 +
    padding-bottom: 0;
}
}
-
.content-header h1 {
+
#sponsors {
-
   margin: 0;
+
   font-family: "Raleway-Regular", Verdana, Tahoma;
-
  margin-left: 20px;
+
-
  line-height: 65px;
+
-
  display: inline-block;
+
}
}
-
#menu-toggle {
+
#sponsors .row {
-
  display: none;
+
    margin-right:0;
}
}
-
.inset {
+
.img-cheesy {
-
  padding: 20px;
+
    margin: 3em auto;
 +
    text-align: center;
 +
    font-style: italic;
 +
  }
 +
.img-cheesy img {
 +
    text-align: center;
 +
    margin: 0 auto;
 +
    padding: 0;
 +
}
 +
.img-cheesy i {
 +
    margin: 0;
 +
    padding: 0;
}
}
-
@media (max-width:767px) {
+
.blacklinks {
 +
 
 +
}
 +
.blacklinks a{
 +
    color: black;
 +
    text-decoration: underline;
 +
}
 +
.view-padding {
 +
    padding-top: 8vh;
 +
}
 +
/* partnerit sivun taulukko */
 +
.partners {
 +
  color: white;
 +
  padding-top: 20vh;
 +
  background-image:url('www.aaltohelsinki.com/img/DSC_6156-2_pack.jpg');
 +
  background-size: cover;
 +
}
-
#wrapper {
+
.content-partners {
-
   padding-left: 0;
+
   margin-bottom: 0;
 +
  padding-bottom: 15vh;
}
}
-
#sidebar-wrapper {
+
.sponsor-pack {
-
  left: 0;
+
    font-size: 1.1em;
 +
    font-weight: 400;
 +
    margin: 0 auto;
 +
    border: 0px solid rgb(0,0,0);
 +
 
 +
    background-color: rgba(10,10,10,0.4);
 +
    width: 80%;
 +
    position: relative;
 +
 
}
}
-
#wrapper.active {
+
 
-
  position: relative;
+
.sponsor-pack h1{
-
  left: 250px;
+
    font-size: 1.8em;
 +
    text-align: center;
 +
    padding: 0.5em 0;
}
}
 +
.sponsor-pack .sisalto, .sponsor-list .sisalto {
 +
    margin: 0 auto;
 +
    width: 80%;
 +
}
 +
/* naa ympyrat on oikeastan ribboneita. ne on niiku ihkusälää */
 +
.sponsor-circle {
 +
    position: absolute;
 +
    right: 1em;
 +
    width:0;
 +
    height:80px;
 +
    border-right:25px solid rgb(180,00,100);
 +
    border-left:25px solid rgb(190,0,100);
 +
    border-bottom:30px solid transparent;
-
#wrapper.active #sidebar-wrapper {
 
-
  left: 250px;
 
-
  width: 250px;
 
-
  transition: all 0.4s ease 0s;
 
}
}
-
#menu-toggle {
+
 
-
  display: inline-block;
+
.sponsor-circle.second {
 +
    border-right:25px solid rgb(250,150,00);
 +
    border-left:25px solid rgb(250,160,00);
 +
    border-bottom:30px solid transparent;
 +
}
 +
.sponsor-circle.third {
 +
    border-right:25px solid rgb(00,110,60);
 +
    border-left:25px solid rgb(00,120,60);
 +
    border-bottom:30px solid transparent;
}
}
-
.inset {
+
.sponsor-list {
-
  padding: 15px;
+
    padding: 1em;
 +
    font-size: 1.1em;
 +
    font-weight: 400;
 +
    margin: 0 auto;
 +
    margin-top: 5em;
 +
    border: 0px solid rgb(0,0,0);
 +
    width: 80%;
 +
 
 +
    background-color: rgba(120, 63, 68, 0.45);
}
}
-
/*
+
.sponsor-list h1 {
-
SIDEBAR END
+
    margin-top: 0;
-
*/
+
}
 +
 
 +
/* Footerin tyylit */
 +
 
 +
footer {
 +
  padding-top: 20px;
 +
  color:white;
 +
  background-image:url('www.aaltohelsinki.com/img/turqous_pack.jpg');
 +
  background-size: cover;
 +
  color: black;
 +
}
 +
 
 +
footer a {
 +
  color: white;
 +
  padding-left: 1.5vw;
 +
}
 +
 
 +
footer a:hover {
 +
  color: white;
 +
}
 +
 
 +
footer #navigation {
 +
  padding-top: 1vh;
 +
  margin-bottom: 1vh;
 +
}
 +
 
 +
footer .bottom {
 +
  background-color:rgba(0,0,0,0.7);
 +
  padding-bottom: 0.5vh;
 +
}
 +
 
 +
/* Pääsivun footer */
 +
 
 +
#mainfooter {
 +
    min-height:50vh;
 +
    background-image:url('www.aaltohelsinki.com/img/1920x1080_FOOTER_pack.jpg');
 +
}
 +
 
 +
/* Tabisivujen footerien tyylit */
 +
 
 +
#teamfooter, #projectfooter {
 +
    background-image:url('www.aaltohelsinki.com/img/turqos_1920x1080_pack.jpg');
 +
}
 +
 
 +
#mainfooter #sponsors {
 +
  padding-top:20vh;
 +
}
 +
 
 +
#teamfooter #sponsors, #projectfooter #sponsors{
 +
    padding-top:34vh;
 +
}
 +
 
 +
#teamfooter .bottom, #projectfooter .bottom{
 +
    margin-top:17.5vh;
 +
}
 +
#sponsorfooter {
 +
    background-image: none;
 +
    background-color: #EDAC91;
 +
}
 +
 
 +
#contact {
 +
    font-size: 10px;
 +
    color:white;
 +
}
 +
 
 +
#sponsors .row {
 +
    margin-right:0;
 +
}
 +
.valign-outer {
 +
  display: table;
 +
    width: 100%;
 +
    height: 85vh;
 +
 
 +
    //padding: 20vh 0;
 +
}
 +
 
 +
.valign-inner {
 +
  display: table-cell;
 +
  vertical-align: middle;
 +
 
 +
}
 +
.valign-inner-center {
 +
  margin-left: auto;
 +
    margin-right: auto;
 +
    width: 70%;
 +
 
 +
}
 +
@media (max-width: 700px) {
 +
  header #logo {
 +
    display: none;
 +
  }
 +
    /* partnerit sivun taulukko responsiiviseksi ilman bootstrappia joka ei toimi */
 +
    .sponsor-pack {
 +
        width: 100%;
 +
        font-size: 0.8em;
 +
    }
 +
}

Revision as of 06:51, 13 August 2014

@font-face {

 font-family: "TitilliumWeb";
   src: url(fonts/TitilliumWeb-Regular.ttf) format("truetype");

}

  • {font-family:"TitilliumWeb";}

a:link {color:#FFFFFF;} a:visited {color:#FFFFFF;} a:hover {color:#50BCBC;} a:active {color:black;}

a:hover, a:visited, a:link, a:active {

   /* poistin ton !importantin. kyllä linkit pitää normitekstissä alleviivata eikä se nyt onnistu
    * text-decoration: none !important; */

} a:not(.underline) {

   text-decoration: none !important;

}

  1. ahlogo{

}

  1. logo{
 height: 8em;
   padding-bottom: 1em;

}

/* Header-jutut */

header {

 color:white;

}

header a {

 color: white;
 padding-right: 3vw;
 font-size: 1.5em;

}

.last-link {

 padding-right:1vw;

}

header h1{

 font-size: 1.35em;
 padding-right: 0;
 padding-left: 1.5vw;

}

header #logo {

 margin-top: 1.5em;
 padding-left:1em;
 height: 1.5em;
 margin-right:0.2em;

}

header #lang {

   margin-top: 3em;
   font-size: 0.6em;

}

header .navbar {

 background-color:rgba(0,0,0,0.7);
 border:0px;

}

  1. navigation {
 margin-top: 2.5em;

}

/* Header päättyy */

/* Yksittäisten sivujen ylägradientti grafiikasta valkoiseksi*/

.top-graphic{

   min-height:100vh;
   background-image: url('www.aaltohelsinki.com/img/sepia_1920x1080_pack.jpg');
   background-size: cover;

}

.top-graphic .content{

   padding-top:30vh;
   color:black;
   text-align:justify;

}

.top-graphic .content img {

   margin-top:10vh;

}

.top-graphic .content h1 {

   margin-bottom:5%;
   color:black;

}

/* Leipätekstin modifikaatio */

.big-text{

   margin-bottom: 5%;
   font-size:x-large;
   margin-right:5%;

}

body{

 background-color:black;
   margin: 0;
   padding: 0;

}

article {

 color:floralwhite;
 padding-top: 5vh;
 padding-bottom: 5vh;
 padding-left: 15vw;
 padding-right: 15vw;
 min-height:85vh;
   font-size:large;

}

article h1 {

   font-family: "Kirvy-Regular", Verdana, Tahoma;

}

/* Pääsivun tyylit */

.what{

 padding-top: 20vh;
 background-image:url('www.aaltohelsinki.com/img/sepia_1920x1080_pack.jpg');
 background-size: cover;
 min-height:100vh;
 color: black;
   text-align: center;

}

.team{

 background-color: #912964;

}

.university-title {

   color: rgb(81,81,81);
   font-style: italic;
   font-size: 20px;
   margin-top: 0;

}

.idea {

 background-color: #0A4958;

}

.follow {

 background-color: white;
 color: black;

}

.seekers {

   color: black;
   background-image:url('www.aaltohelsinki.com/img/kasi_vectored_gradient_transp.png');
   background-size: 40%;
   background-position:center;
   background-repeat: no-repeat;

}

.seekers a.BBSeeker {

   color:#B00C69;

}

.seekers a.TSeeker {

   color:#399f70;

}

  1. sm-logo {
   padding-bottom: 1em;

}

.support {

 background-color: #F6E7D2;
 color:black;

}

.more {

   font-size:2em;
   font-family: "Infinity", Verdana, Tahoma;

}

/* Välilehtisivujen tyylejä */

.detail{

   background-color:white;
   color:black;
   padding-top:0;
   min-height:50vh;
   padding-bottom: 0;

}

  1. sponsors {
 font-family: "Raleway-Regular", Verdana, Tahoma;

}

  1. sponsors .row {
   margin-right:0;

}

.img-cheesy {

   margin: 3em auto;
   text-align: center;
   font-style: italic;
  }

.img-cheesy img {

   text-align: center;
   margin: 0 auto;
   padding: 0;

} .img-cheesy i {

   margin: 0;
   padding: 0;

}

.blacklinks {

} .blacklinks a{

   color: black;
   text-decoration: underline;

} .view-padding {

   padding-top: 8vh;

} /* partnerit sivun taulukko */ .partners {

 color: white;
 padding-top: 20vh;
 background-image:url('www.aaltohelsinki.com/img/DSC_6156-2_pack.jpg');
 background-size: cover;

}

.content-partners {

 margin-bottom: 0;
 padding-bottom: 15vh;

}

.sponsor-pack {

   font-size: 1.1em;
   font-weight: 400;
   margin: 0 auto;
   border: 0px solid rgb(0,0,0);
   background-color: rgba(10,10,10,0.4);
   width: 80%;
   position: relative;

}


.sponsor-pack h1{

   font-size: 1.8em;
   text-align: center;
   padding: 0.5em 0;

} .sponsor-pack .sisalto, .sponsor-list .sisalto {

   margin: 0 auto;
   width: 80%;

} /* naa ympyrat on oikeastan ribboneita. ne on niiku ihkusälää */ .sponsor-circle {

    position: absolute;
   right: 1em;
    width:0;
    height:80px;
    border-right:25px solid rgb(180,00,100);
    border-left:25px solid rgb(190,0,100);
    border-bottom:30px solid transparent;

}


.sponsor-circle.second {

    border-right:25px solid rgb(250,150,00);
    border-left:25px solid rgb(250,160,00);
    border-bottom:30px solid transparent;

} .sponsor-circle.third {

   border-right:25px solid rgb(00,110,60);
    border-left:25px solid rgb(00,120,60);
    border-bottom:30px solid transparent;

}

.sponsor-list {

   padding: 1em;
   font-size: 1.1em;
   font-weight: 400;
   margin: 0 auto;
   margin-top: 5em;
   border: 0px solid rgb(0,0,0);
   width: 80%;
   background-color: rgba(120, 63, 68, 0.45);

}

.sponsor-list h1 {

   margin-top: 0;

}

/* Footerin tyylit */

footer {

 padding-top: 20px;
 color:white;
 background-image:url('www.aaltohelsinki.com/img/turqous_pack.jpg');
 background-size: cover;
 color: black;

}

footer a {

 color: white;
 padding-left: 1.5vw;

}

footer a:hover {

 color: white;

}

footer #navigation {

 padding-top: 1vh;
 margin-bottom: 1vh;

}

footer .bottom {

 background-color:rgba(0,0,0,0.7);
 padding-bottom: 0.5vh;

}

/* Pääsivun footer */

  1. mainfooter {
   min-height:50vh;
   background-image:url('www.aaltohelsinki.com/img/1920x1080_FOOTER_pack.jpg');

}

/* Tabisivujen footerien tyylit */

  1. teamfooter, #projectfooter {
   background-image:url('www.aaltohelsinki.com/img/turqos_1920x1080_pack.jpg');

}

  1. mainfooter #sponsors {
 padding-top:20vh;
}
  1. teamfooter #sponsors, #projectfooter #sponsors{
   padding-top:34vh;

}

  1. teamfooter .bottom, #projectfooter .bottom{
   margin-top:17.5vh;

}

  1. sponsorfooter {
   background-image: none;
   background-color: #EDAC91;

}

  1. contact {
   font-size: 10px;
   color:white;

}

  1. sponsors .row {
   margin-right:0;

} .valign-outer {

 display: table;
   width: 100%;
   height: 85vh;
   //padding: 20vh 0;

}

.valign-inner {

 display: table-cell;
 vertical-align: middle;

} .valign-inner-center {

 margin-left: auto;
   margin-right: auto;
   width: 70%;

} @media (max-width: 700px) {

 header #logo {
   display: none;
 }
   /* partnerit sivun taulukko responsiiviseksi ilman bootstrappia joka ei toimi */
   .sponsor-pack {
       width: 100%;
       font-size: 0.8em;
   }

}