Template:Aalto-Helsinki--saara.css

.teamphoto { background: url('file:///C:/Users/Saara/Documents/iGEM/Aalto-Helsinki-2016-Wiki/img/team2_scaled.jpg') no-repeat; background-size: 100%; background-position: 0% 30%; height: 110%; width: 100%; /*background: #cc6055;*/ }

.mainphoto { /*background: url('/2016/img/lake2.jpg') no-repeat;*/ /*background: url('file:///C:/Users/Saara/Documents/iGEM/Aalto-Helsinki-2016-Wiki/img/snapshot.png') no-repeat;*/ background-size: 100%; background-size: cover; background-position: 0% 30%; height: 110%; width: 100%; }

@font-face {

   font-family: 'robotolight';
   src: url('css/roboto-light-webfont.woff2') format('woff2'),
        url('/wiki/images/3/31/T--Aalto-Helsinki--roboto-light-webfont.woff') format('woff');
   font-weight: normal;
   font-style: normal;

}

1. svg1{

/*padding-top: 7%;*/ margin-left: 35%; position: inherit; margin: auto; display: block; }

ul.topnav li a.current { color: #000080;

}

ul.topnav li a img { position:relative; width:15%; }

ul.botnav li a.active { 
  color: #F0C133;
}

.index:hover{

opacity: 0.6;

}
@font-face {
   font-family: 'im_fell_french_canon_proIt';
   src: url('css/fefcit27c-webfont.woff2') format('woff2'),
        url('/wiki/images/c/c9/T--Aalto-Helsinki--fefcit27c-webfont.woff') format('woff');
   font-weight: normal;
   font-style: normal;

}

@font-face {

   font-family: 'robotoregular';
   src: url('css/roboto-regular-webfont.woff2') format('woff2'),
        url('/wiki/images/a/aa/T--Aalto-Helsinki--roboto-regular-webfont.woff') format('woff');
   font-weight: normal;
   font-style: normal;

}

.img{ float: left; }

.section { /*background: url('file:///C:/Users/Saara/Documents/iGEM/Aalto-Helsinki-2016-Wiki/img/trees.png') no-repeat;*/ /*background-size: 100%;*/ position: relative;

   margin-left: 0;

margin-right: 0; margin-top: 0;

   padding: 0;

height: 170px;

   background-color: #5D5B5E;
   overflow: hidden;

font-size: 20px; text-align: center; color: white; padding-top: 23px; }

.section p { margin: 0; }

.algaephoto { margin-bottom: 30px; margin-right: 15px; vertical-align: middle; float: left; width: 30%; border: 5px; }

.box-shadow { position: relative; float: right; }

.box-shadow::after {

   box-shadow: inset 0 0 10px 10px white;
   bottom: 0;
   content: "";
   display: block;
   left: 0;
   position: absolute;
   right: 0;
   top: 0;

height: 90%;

   width: 30%;

}

section h2 { display: block; margin-top: 250px; font-size: 70px; color: white; }

p.justify { text-align: justify; }

.modelingphoto { background: url('file:///C:/Users/Saara/Documents/iGEM/Aalto-Helsinki-2016-Wiki/img/dna.jpg') no-repeat; background-size: 100%; background-position: 0% 0%; height: 110%; width: 100%; }

.hpphoto { background: url('file:///C:/Users/Saara/Documents/iGEM/Aalto-Helsinki-2016-Wiki/img/lake.jpg') no-repeat; background-size: 100%; background-position: 0% 0%; height: 110%; width: 100%; }

.collabphoto { background: url('file:///C:/Users/Saara/Documents/iGEM/Aalto-Helsinki-2016-Wiki/img/jarvi3.jpg') no-repeat; background-size: 100%; background-position: 0% 0%; height: 110%; width: 100%; }

.achievementsphoto { background: url('file:///C:/Users/Saara/Documents/iGEM/Aalto-Helsinki-2016-Wiki/img/lake1.jpg') no-repeat; background-size: 100%; background-position: 0% 0%; height: 110%; width: 100%; }

progress {

 /* Positioning */
 position: fixed;
 left: 0;
 bottom: 0;
 margin-bottom: 47px;

 /* Dimensions */
 width: 100%;
 height: 3px;

 /* Reset the appearance */
 -webkit-appearance: none;
    -moz-appearance: none;
         appearance: none;

 /* Get rid of the default border in Firefox/Opera. */
 border: none;

 /* Progress bar container for Firefox/IE10+ */
 background-color: transparent;

 /* Progress bar value for IE10+ */
 color: #F0C133;

}

progress::-webkit-progress-bar {

 background-color: transparent;

}

progress::-webkit-progress-value {

 background-color: #F0C133;

}

progress::-moz-progress-bar {

 background-color: #F0C133;

}

.title { font-family: 'bebas_neuebold'; font-size: 120px; letter-spacing: 2px; text-shadow: 4px 4px 0px rgba(0,0,0,0.2); }

1. button {

   cursor: pointer;

}

1. button:hover {

   cursor: pointer;
   opacity: 0.6;

}

.container1 {

 margin: 0 auto;
 width: 250px;
 height: 700px;
 position: relative;
 perspective: 550px;

}

.carousel {

 height: 100%;
 width: 100%;
 position: absolute;
 margin-top: 250px;
 transform-style: preserve-3d;
 transition: transform 1s;

}

.item {

 display: block;
 position: absolute;
 background: #000;
 width: 250px;
 height:200px;
 line-height: 200px;
 font-size: 20px;
 text-align: center;
 color: #FFF;
 opacity: 0.95;

}

.a {

 transform: rotateY(0deg) translateZ(260px);
 background: url('file:///C:/Users/Saara/Documents/iGEM/Aalto-Helsinki-2016-Wiki/img/lake11.jpg') no-repeat;
 background-size: 100%;
 background-position: 0% 0%;

} .b {

 transform: rotateY(60deg) translateZ(260px);
 background: #D3D3D3;

} .c {

 transform: rotateY(120deg) translateZ(260px);
 background: url('file:///C:/Users/Saara/Documents/iGEM/Aalto-Helsinki-2016-Wiki/img/jarvi1.jpg') no-repeat;

 

} .d {

 transform: rotateY(180deg) translateZ(260px);
 background: #D3D3D3;

} .e {

 transform: rotateY(240deg) translateZ(260px);
 background: url('file:///C:/Users/Saara/Documents/iGEM/Aalto-Helsinki-2016-Wiki/img/first1.jpg') no-repeat;
 

} .f {

 transform: rotateY(300deg) translateZ(260px);
 background: #D3D3D3;

}

.next, .prev {

 color: #444;
 position: absolute;
 top: 100px;
 padding: 1em 2em;
 cursor: pointer;
 background: #CCC;
 border-radius: 5px;
 border-top: 1px solid #FFF;
 box-shadow: 0 5px 0 #999;
 transition: box-shadow 0.1s, top 0.1s;

} .next:hover, .prev:hover { color: #000; } .next:active, .prev:active {

 top: 104px;
 box-shadow: 0 1px 0 #999;

} .next { right: 5em; margin-top: 750px } .prev { left: 5em; margin-top: 750px}