Template:Team:NTNU-Trondheim/Press/css

From 2013.igem.org

(Difference between revisions)
 
(36 intermediate revisions not shown)
Line 32: Line 32:
div.col14 {width: 10px;}
div.col14 {width: 10px;}
 +
.circular {
 +
width: 300px;
 +
height: 300px;
 +
border-radius: 150px;
 +
-webkit-border-radius: 150px;
 +
-moz-border-radius: 150px;
 +
background: url(https://static.igem.org/mediawiki/2013/b/b2/Marialab.jpg) no-repeat;
 +
}
 +
.circular2 {
 +
width: 180px;
 +
height: 180px;
 +
border-radius: 90px;
 +
-webkit-border-radius: 90px;
 +
-moz-border-radius: 90px;
 +
background: url(https://static.igem.org/mediawiki/2013/b/b2/Marialab.jpg) no-repeat;
 +
}
 +
 +
.circular3 {
 +
width: 230px;
 +
height: 230px;
 +
border-radius: 115px;
 +
-webkit-border-radius: 115px;
 +
-moz-border-radius: 115px;
 +
background: url(https://static.igem.org/mediawiki/2013/b/b2/Marialab.jpg) no-repeat;
 +
}
-
#round {
+
#cssmenu ul,
-
display: inline-block;
+
#cssmenu li,
-
position: relative;
+
#cssmenu span,
-
overflow: hidden;
+
-
width: 300px;
+
-
height: 300px;
+
-
-moz-border-radius: 300px;
+
-
border-radius: 300px;
+
-
-webkit-border-radius: 300px;
+
-
}
+
-
#rounded-corners {
+
#cssmenu a {
-
display: inline-block;
+
  margin: 0;
-
position: relative;
+
  padding: 0;
-
overflow: hidden;
+
  position: relative;
-
-moz-border-radius: 50px;
+
-
border-radius: 50px;
+
-
-webkit-border-radius: 50px;
+
}
}
-
 
+
#cssmenu {
 +
  height: 49px;
 +
  border-radius: 5px 5px 0 0;
 +
  -moz-border-radius: 5px 5px 0 0;
 +
  -webkit-border-radius: 5px 5px 0 0;
 +
  background: #fefefe;
 +
  background: -moz-linear-gradient(top, #fefefe 0%, #eee9f0 100%);
 +
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fefefe), color-stop(100%, #eee9f0));
 +
  background: -webkit-linear-gradient(top, #fefefe 0%, #eee9f0 100%);
 +
  background: -o-linear-gradient(top, #fefefe 0%, #eee9f0 100%);
 +
  background: -ms-linear-gradient(top, #fefefe 0%, #eee9f0 100%);
 +
  background: linear-gradient(top, #fefefe 0%, #eee9f0 100%);
 +
  border-bottom: 2px solid #C3A7F3;
 +
  width: auto;
 +
  margin-top: 340px;
}
}
 +
#cssmenu:after,
 +
#cssmenu ul:after {
 +
  content: '';
 +
  display: block;
 +
  clear: both;
 +
}
 +
#cssmenu a {
 +
  background: #fefefe;
 +
  background: -moz-linear-gradient(top, #fefefe 0%, #ececec 100%);
 +
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fefefe), color-stop(100%, #ececec));
 +
  background: -webkit-linear-gradient(top, #fefefe 0%, #ececec 100%);
 +
  background: -o-linear-gradient(top, #fefefe 0%, #ececec 100%);
 +
  background: -ms-linear-gradient(top, #fefefe 0%, #ececec 100%);
 +
  background: linear-gradient(top, #fefefe 0%, #ececec 100%);
 +
  color: black;
 +
  display: inline-block;
 +
  font-family: Helvetica, Arial, Verdana, sans-serif;
 +
  font-size: 12px;
 +
  line-height: 49px;
 +
  padding: 0 20px;
 +
  text-decoration: none;
 +
}
 +
#cssmenu ul {
 +
  list-style: none;
 +
}
 +
#cssmenu > ul {
 +
  float: left;
 +
}
 +
#cssmenu > ul > li {
 +
  float: left;
 +
}
 +
#cssmenu > ul > li > a {
 +
  color: #000;
 +
  font-size: 12px;
 +
}
 +
#cssmenu > ul > li:hover:after {
 +
  content: '';
 +
  display: block;
 +
  width: 0;
 +
  height: 0;
 +
  position: absolute;
 +
  left: 50%;
 +
  bottom: 0;
 +
  border-left: 10px solid transparent;
 +
  border-right: 10px solid transparent;
 +
  border-bottom: 10px solid #C3A7F3;
 +
  margin-left: -10px;
 +
}
 +
#cssmenu > ul > li:first-child > a {
 +
  border-radius: 5px 0 0 0;
 +
  -moz-border-radius: 5px 0 0 0;
 +
  -webkit-border-radius: 5px 0 0 0;
 +
}
 +
#cssmenu > ul > li.active:after {
 +
  content: '';
 +
  display: block;
 +
  width: 0;
 +
  height: 0;
 +
  position: absolute;
 +
  left: 50%;
 +
  bottom: 0;
 +
  border-left: 10px solid transparent;
 +
  border-right: 10px solid transparent;
 +
  border-bottom: 10px solid #C3A7F3;
 +
  margin-left: -10px;
 +
}
 +
#cssmenu > ul > li.active > a {
 +
  -moz-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1);
 +
  -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1);
 +
  box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1);
 +
  background: #ececec;
 +
  background: -moz-linear-gradient(top, #ececec 0%, #ffeeff ef 100%);
 +
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ececec), color-stop(100%, #ffeeff ef));
 +
  background: -webkit-linear-gradient(top, #ececec 0%, #ffeeff ef 100%);
 +
  background: -o-linear-gradient(top, #ececec 0%, #ffeeff ef 100%);
 +
  background: -ms-linear-gradient(top, #ececec 0%, #ffeeff ef 100%);
 +
  background: linear-gradient(top, #ececec 0%, #ffeeff ef 100%);
 +
}
 +
#cssmenu > ul > li:hover > a {
 +
  background: #ececec;
 +
  background: -moz-linear-gradient(top, #ececec 0%, #ffeeff ef 100%);
 +
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ececec), color-stop(100%, #ffeeff ef));
 +
  background: -webkit-linear-gradient(top, #ececec 0%, #ffeeff ef 100%);
 +
  background: -o-linear-gradient(top, #ececec 0%, #ffeeff ef 100%);
 +
  background: -ms-linear-gradient(top, #ececec 0%, #ffeeff ef 100%);
 +
  background: linear-gradient(top, #ececec 0%, #ffeeff ef 100%);
 +
  -moz-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1);
 +
  -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1);
 +
  box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1);
 +
}
 +
#cssmenu .has-sub {
 +
  z-index: 1;
 +
}
 +
#cssmenu .has-sub:hover > ul {
 +
  display: block;
 +
}
 +
#cssmenu .has-sub ul {
 +
  display: none;
 +
  position: absolute;
 +
  width: 200px;
 +
  top: 100%;
 +
  left: 0;
 +
}
 +
#cssmenu .has-sub ul li {
 +
  *margin-bottom: -1px;
 +
}
 +
#cssmenu .has-sub ul li a {
 +
  background: #C3A7F3;
 +
  border-bottom: 1px dotted #C3A7F3;
 +
  filter: none;
 +
  font-size: 11px;
 +
  display: block;
 +
  line-height: 120%;
 +
  padding: 10px;
 +
  color: black;
 +
}
 +
#cssmenu .has-sub ul li:hover a {
 +
  background: #C3A7F3;
 +
}
 +
#cssmenu .has-sub .has-sub:hover > ul {
 +
  display: block;
 +
}
 +
#cssmenu .has-sub .has-sub ul {
 +
  display: none;
 +
  position: absolute;
 +
  left: 100%;
 +
  top: 0;
 +
}
 +
#cssmenu .has-sub .has-sub ul li a {
 +
  background: #C3A7F3;
 +
  border-bottom: 1px dotted #C3A7F3;
 +
}
 +
#cssmenu .has-sub .has-sub ul li a:hover {
 +
  background: #C3A7F3;
 +
}
 +
</style>
</style>
</html>
</html>

Latest revision as of 12:52, 4 October 2013

Retrieved from "http://2013.igem.org/Template:Team:NTNU-Trondheim/Press/css"