Template:Team:Aachen/Stylesheet

From 2014.igem.org

(Difference between revisions)
 
(6 intermediate revisions not shown)
Line 2: Line 2:
<head>
<head>
<style type="text/css">
<style type="text/css">
 +
 +
/****/
 +
/* Menu RIGHT
 +
/****/
 +
 +
.menuright-grid {
 +
    margin: 0px 0 0 0;
 +
    padding: 0;
 +
    list-style: none;
 +
    display: inline-block;
 +
    text-align: center;
 +
    float: right;
 +
    width: 200px;
 +
    position: relative;
 +
}
 +
.menuright-grid:after,
 +
.menuright-item:before {
 +
    content: '';
 +
    display: table;
 +
}
 +
.menuright-grid:after {
 +
    clear: both;
 +
}
 +
.menuright-grid li {
 +
    width: 150px;
 +
    display: inline-block;
 +
    margin-bottom:20px;
 +
    position:relative;
 +
    float: left;
 +
    margin-left: 20px ;
 +
    margin-right: auto ; /*75px*/
 +
    display: table-cell;
 +
}
 +
.menuright-grid ul {
 +
    display: table;
 +
}
 +
.menuright-item {
 +
    border-radius: 10%;
 +
    border: 3px solid #0069B3;  /* #1B4046; */
 +
    position: relative;
 +
    cursor: default;
 +
 +
    -webkit-transition: all 0.4s ease-in-out;
 +
    -moz-transition: all 0.4s ease-in-out;
 +
    -o-transition: all 0.4s ease-in-out;
 +
    -ms-transition: all 0.4s ease-in-out;
 +
    transition: all 0.4s ease-in-out;
 +
}
 +
 +
.menuright-img {
 +
    background-size:100% 100%;
 +
    border-radius: 10%;
 +
    height: 150px;
 +
    width: 150px;
 +
}
 +
.menuright-info {
 +
    position: absolute;
 +
    width: 150px;
 +
    height: 150px;
 +
    border-radius: 10%;
 +
    opacity: 1;
 +
    text-align: center;
 +
    font-size: medium;
 +
    background-color: #cfe2f4;
 +
    -webkit-backface-visibility: hidden; /*for a smooth font */
 +
}
 +
.menuright-info p{
 +
    padding-top:25%;
 +
}
 +
.menuright-img:hover {
 +
opacity: 0.2;
 +
cursor: pointer;
 +
}
 +
 +
.menuright-info-item
 +
{
 +
height:280px;
 +
width:225px;
 +
position: relative;
 +
float: left;
 +
margin: 10px;
 +
}
 +
 +
.menuright-info-item img
 +
{
 +
max-width:100%;
 +
max-height:100%;
 +
margin:left;
 +
display:inline-block;
 +
}
 +
/****/
 +
/* Menu Left
 +
/****/
 +
 +
.menuleft-grid {
 +
    margin: 0px 0 0 0;
 +
    padding: 0;
 +
    list-style: none;
 +
    display: inline-block;
 +
    text-align: center;
 +
    float: left;
 +
    width: 300px;
 +
    position: relative;
 +
}
 +
.menuleft-grid:after,
 +
.menuleft-item:before {
 +
    content: '';
 +
    display: table;
 +
}
 +
.menuleft-grid:after {
 +
    clear: both;
 +
}
 +
.menuleft-grid li {
 +
    width: 150px;
 +
    display: inline-block;
 +
    margin-bottom:20px;
 +
    position:relative;
 +
    float: left;
 +
    margin-left: 20px ;
 +
    margin-right: auto ; /*75px*/
 +
    display: table-cell;
 +
}
 +
.menuleft-grid ul {
 +
    display: table;
 +
}
 +
.menuleft-item {
 +
    border-radius: 10%;
 +
    border: 3px solid #0069B3;  /* #1B4046; */
 +
    position: relative;
 +
    cursor: default;
 +
 +
    -webkit-transition: all 0.4s ease-in-out;
 +
    -moz-transition: all 0.4s ease-in-out;
 +
    -o-transition: all 0.4s ease-in-out;
 +
    -ms-transition: all 0.4s ease-in-out;
 +
    transition: all 0.4s ease-in-out;
 +
}
 +
 +
.menuleft-img {
 +
    background-size:100% 100%;
 +
    border-radius: 10%;
 +
    height: 150px;
 +
    width: 150px;
 +
}
 +
.menuleft-info {
 +
    position: absolute;
 +
    width: 150px;
 +
    height: 150px;
 +
    border-radius: 10%;
 +
    opacity: 1;
 +
    text-align: center;
 +
    font-size: medium;
 +
    background-color: #cfe2f4;
 +
    -webkit-backface-visibility: hidden; /*for a smooth font */
 +
}
 +
.menuleft-info p{
 +
    padding-top:25%;
 +
}
 +
.menuleft-img:hover {
 +
opacity: 0.2;
 +
cursor: pointer;
 +
}
 +
 +
.menusmall-info-item
 +
{
 +
height:280px;
 +
width:225px;
 +
position: relative;
 +
float: left;
 +
margin: 10px;
 +
}
 +
 +
.menuleft-info-item img
 +
{
 +
max-width:100%;
 +
max-height:100%;
 +
margin:left;
 +
display:inline-block;
 +
}
/****/
/****/
Line 63: Line 242:
     text-align: center;
     text-align: center;
     font-size: medium;
     font-size: medium;
-
     background-color: #E8E8E8;
+
     background-color: #cfe2f4;
     -webkit-backface-visibility: hidden; /*for a smooth font */
     -webkit-backface-visibility: hidden; /*for a smooth font */
}
}
Line 94: Line 273:
/*************************************************************************/
/*************************************************************************/
.team-grid {
.team-grid {
-
     margin: 0px 0 0 0;
+
     margin: auto 0 auto 0;
     padding: 0;
     padding: 0;
     list-style: none;
     list-style: none;
     display: inline-block;
     display: inline-block;
     text-align: center;
     text-align: center;
-
     width: 100%;
+
     width: 992px;
     z-index:1000;
     z-index:1000;
}
}
Line 150: Line 329:
     text-align: center;
     text-align: center;
     font-size: medium;
     font-size: medium;
-
     background-color: #E8E8E8;
+
     background-color: #cfe2f4;
     -webkit-backface-visibility: hidden; /*for a smooth font */
     -webkit-backface-visibility: hidden; /*for a smooth font */
}
}

Latest revision as of 14:56, 16 October 2014