Template:Team:Technion-Israel/Technion-Israel-style.css

From 2014.igem.org

(Difference between revisions)
m (Undo revision 186057 by KarenJ (talk))
m
Line 929: Line 929:
color: #e04749;
color: #e04749;
}
}
 +
 +
#cssmenu {
 +
  position: fixed;
 +
  top: 10px;
 +
  left: 10px;
 +
  margin: 0;
 +
  font-family: 'Source Sans Pro';
 +
  line-height: 1;
 +
  width: 180px;
 +
  display: none;
 +
}
 +
.align-right {
 +
  float: right;
 +
}
 +
#cssmenu ul {
 +
  margin: 0;
 +
  padding: 0;
 +
  list-style: none;
 +
  display: block;
 +
}
 +
#cssmenu ul li {
 +
  position: relative;
 +
  margin: 0;
 +
  padding: 0;
 +
}
 +
#cssmenu ul li a {
 +
  text-decoration: none;
 +
  cursor: pointer;
 +
}
 +
#cssmenu > ul > li > a {
 +
  color: #dddddd; /*color of text when closed*/
 +
  text-transform: uppercase;
 +
  display: block;
 +
  padding: 20px;
 +
  border-top: 1px solid #878787;
 +
  border-left: 1px solid #878787;
 +
  border-right: 1px solid #878787;
 +
  background: #878787; /*color of backgroung when closed*/
 +
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
 +
  letter-spacing: 1px;
 +
  font-size: 16px;
 +
  font-weight: 300;
 +
  -webkit-transition: all 0.25s ease-in;
 +
  -moz-transition: all 0.25s ease-in;
 +
  -ms-transition: all 0.25s ease-in;
 +
  -o-transition: all 0.25s ease-in;
 +
  transition: all 0.25s ease-in;
 +
  position: relative;
 +
}
 +
#cssmenu > ul > li:first-child > a {
 +
  border-top-left-radius: 3px;
 +
  border-top-right-radius: 3px;
 +
}
 +
#cssmenu > ul > li:last-child > a {
 +
  border-bottom-left-radius: 3px;
 +
  border-bottom-right-radius: 3px;
 +
  border-bottom: 1px solid #878787;
 +
}
 +
#cssmenu > ul > li:hover > a,
 +
#cssmenu > ul > li.open > a,
 +
#cssmenu > ul > li.active > a {
 +
background-color: rgba(135, 135, 135, 0.70);
 +
color: #ffffff; /*color of text when main is closed*/
 +
}
 +
#cssmenu ul > li.has-sub > a::after {
 +
  content: "";
 +
  position: absolute;
 +
  display: block;
 +
  width: 0;
 +
  height: 0;
 +
  border-top: 12px solid #000000;
 +
  border-botom: 12px solid transparent;
 +
  border-left: 90px solid transparent;
 +
  border-right: 90px solid transparent;
 +
  left: 0;
 +
  bottom: -13px;
 +
  bottom: 0px;
 +
  z-index: 1000001;
 +
  opacity: 0;
 +
  -webkit-transition: all .2s ease;
 +
  -moz-transition: all .2s ease;
 +
  -ms-transition: all .2s ease;
 +
  -o-transition: all .2s ease;
 +
  transition: all .2s ease;
 +
}
 +
#cssmenu ul > li.has-sub > a::before {
 +
  content: "";
 +
  position: absolute;
 +
  display: block;
 +
  width: 0;
 +
  height: 0;
 +
  border-top: 12px solid #151515;
 +
  border-botom: 12px solid transparent;
 +
  border-left: 90px solid transparent;
 +
  border-right: 90px solid transparent;
 +
  left: 0;
 +
  bottom: -12px;
 +
  bottom: -1px;
 +
  z-index: 1000003;
 +
  opacity: 0;
 +
  -webkit-transition: all .2s ease;
 +
  -moz-transition: all .2s ease;
 +
  -ms-transition: all .2s ease;
 +
  -o-transition: all .2s ease;
 +
  transition: all .2s ease;
 +
}
 +
#cssmenu ul > li.has-sub::after {
 +
  content: "";
 +
  display: block;
 +
  position: absolute;
 +
  width: 0;
 +
  height: 0;
 +
  border: 7px solid transparent;
 +
  border-top-color: #dddddd;
 +
  z-index: 1000002;
 +
  right: 20px;
 +
  top: 24.5px;
 +
  pointer-events: none;
 +
}
 +
#cssmenu ul > li:hover::after,
 +
#cssmenu ul > li.active::after,
 +
#cssmenu ul > li.open::after {
 +
  border-top-color: #ffffff;
 +
}
 +
#cssmenu ul > li.has-sub.open > a::after {
 +
  opacity: 1;
 +
  bottom: -13px;
 +
}
 +
#cssmenu ul > li.has-sub.open > a::before {
 +
  opacity: 1;
 +
  bottom: -12px;
 +
}
 +
#cssmenu ul ul {
 +
  display: none;
 +
}
 +
#cssmenu ul ul li {
 +
  border-left: 1px solid #ccc;
 +
  border-right: 1px solid #ccc;
 +
}
 +
#cssmenu ul ul li a {
 +
  background: #f1f1f1; /*color of whole menu*/
 +
  display: block;
 +
  position: relative;
 +
  font-size: 15px;
 +
  padding: 14px 20px;
 +
  border-bottom: 1px solid #dddddd;
 +
  color: #777777; /*color of text*/
 +
  font-weight: 300;
 +
  -webkit-transition: all 0.25s ease-in;
 +
  -moz-transition: all 0.25s ease-in;
 +
  -ms-transition: all 0.25s ease-in;
 +
  -o-transition: all 0.25s ease-in;
 +
  transition: all 0.25s ease-in;
 +
}
 +
#cssmenu ul ul li:first-child > a {
 +
  padding-top: 18px;
 +
}
 +
#cssmenu ul ul ul li {
 +
  border: 0;
 +
}
 +
#cssmenu ul ul li:hover > a,
 +
#cssmenu ul ul li.open > a,
 +
#cssmenu ul ul li.active > a {
 +
  background: #e4e4e4; /*color when hover*/
 +
  color: #666666;
 +
}
 +
#cssmenu ul ul > li.has-sub > a::after {
 +
  border-top: 13px solid #dddddd;
 +
}
 +
#cssmenu ul ul > li.has-sub > a::before {
 +
  border-top: 13px solid #e4e4e4;
 +
}
 +
#cssmenu ul ul ul li a {
 +
  padding-left: 30px;
 +
}
 +
#cssmenu ul ul > li.has-sub::after {
 +
  top: 18.5px;
 +
  border-width: 6px;
 +
  border-top-color: #777777;
 +
}
 +
#cssmenu ul ul > li:hover::after,
 +
#cssmenu ul ul > li.active::after,
 +
#cssmenu ul ul > li.open::after {
 +
  border-top-color: #666666;
 +
}
 +
 +
</style>
</style>
</head>
</head>
</html>
</html>

Revision as of 18:19, 13 October 2014

Retrieved from "http://2014.igem.org/Template:Team:Technion-Israel/Technion-Israel-style.css"