Difference between revisions of "Template:ITB INDONESIA/dev/css/style"

Line 7: Line 7:
 
   font: Helvetica, Arial, sans-serif;
 
   font: Helvetica, Arial, sans-serif;
 
   color: #14464a;
 
   color: #14464a;
 +
  line-height: 1.3em;
 
}
 
}
  
Line 103: Line 104:
 
p {
 
p {
 
   word-spacing: 0.1em;
 
   word-spacing: 0.1em;
 +
}
 +
 +
.achievement ul {
 +
  margin: 0 0 0 -10px;
 +
  list-style-type: none;
 +
}
 +
 +
.achievement ul li {
 +
  margin: 10px 0;
 +
  position: relative;
 +
}
 +
 +
.achievement ul li.done::before, .achievement ul li.not-done::before {
 +
  background-size: 1.2em;
 +
  width: 1.5em;
 +
  height: 1.5em;
 +
  content: " ";
 +
  display: inline-block;
 +
  background-repeat: no-repeat;
 +
  position: absolute;
 +
  left: -1.7em;
 +
}
 +
 +
.achievement ul li.done::before {
 +
  background-image: url("../img/check_mark.png");
 +
}
 +
 +
.achievement ul li.not-done::before {
 +
  background-image: url("../img/cross_mark.png");
 
}
 
}
  
Line 120: Line 150:
 
.bg-light-green {
 
.bg-light-green {
 
   background-color: #e0f2eb;
 
   background-color: #e0f2eb;
 +
}
 +
 +
.bg-bronze {
 +
  background-color: #daab85;
 +
}
 +
 +
.bg-silver {
 +
  background-color: white;
 +
}
 +
 +
.bg-gold {
 +
  background-color: #dfcd78;
 +
}
 +
 +
.clearfix {
 +
  clear: both;
 +
}
 +
.firstHeading {
 +
  display: none;
 +
}
 +
 +
#content {
 +
  width: 100%;
 +
  font: Helvetica, Arial, sans-serif;
 +
  color: #14464a;
 +
  line-height: 1.3em;
 +
}
 +
 +
#bodyContent {
 +
  padding: 1% 5%;
 +
  overflow: hidden;
 +
}
 +
 +
nav {
 +
  margin-bottom: 20px;
 +
}
 +
 +
.logo {
 +
  width: 20%;
 +
  float: left;
 +
}
 +
 +
.main-nav {
 +
  float: left;
 +
  width: 80%;
 +
}
 +
 +
.main-nav a {
 +
  color: #14464a;
 +
  text-decoration: none;
 +
}
 +
 +
.main-nav > ul {
 +
  font-size: 1.2em;
 +
  font-weight: 100;
 +
  margin: 1% 0 1% 0;
 +
}
 +
 +
.main-nav > ul > li {
 +
  float: left;
 +
  padding: 10px 1em;
 +
  position: relative;
 +
  list-style: none;
 +
}
 +
 +
.main-nav > ul > li ul {
 +
  position: absolute;
 +
  display: none;
 +
  margin: 0 0 10px 0;
 +
  padding: 0;
 +
  background-color: #e0f2eb;
 +
  width: 120%;
 +
  top: 2.4em;
 +
  left: 0;
 +
}
 +
 +
.main-nav > ul > li ul li {
 +
  display: block;
 +
  padding: 5px 20px;
 +
}
 +
 +
.main-nav > ul li:hover {
 +
  background-color: #e0f2eb;
 +
  cursor: pointer;
 +
}
 +
 +
.main-nav > ul li:hover > ul {
 +
  display: block;
 +
}
 +
 +
.main-nav .socmed {
 +
  border-top: 1px solid #14464a;
 +
  padding-top: 2%;
 +
  float: left;
 +
}
 +
 +
.main-nav .socmed img {
 +
  width: 2%;
 +
  margin-right: 5px;
 +
}
 +
 +
h1, h2, h3 {
 +
  border-bottom: 1px solid #14464a;
 +
  padding-bottom: 5px;
 +
  font-weight: 100;
 +
}
 +
 +
section {
 +
  margin-left: -100%;
 +
  width: 300%;
 +
  background-color: #f7f7f7;
 +
}
 +
 +
.text-content {
 +
  padding: 20px 0;
 +
  margin-left: 33%;
 +
  margin-right: 33%;
 +
  color: #444444;
 +
}
 +
 +
p {
 +
  word-spacing: 0.1em;
 +
}
 +
 +
.achievement ul {
 +
  margin: 0 0 0 -10px;
 +
  list-style-type: none;
 +
}
 +
 +
.achievement ul li {
 +
  margin: 10px 0;
 +
  position: relative;
 +
}
 +
 +
.achievement ul li.done::before, .achievement ul li.not-done::before {
 +
  background-size: 1.2em;
 +
  width: 1.5em;
 +
  height: 1.5em;
 +
  content: " ";
 +
  display: inline-block;
 +
  background-repeat: no-repeat;
 +
  position: absolute;
 +
  left: -1.7em;
 +
}
 +
 +
.achievement ul li.done::before {
 +
  background-image: url("https://static.igem.org/mediawiki/2015/6/6f/ITB_INDONESIA_check_mark.png");
 +
 +
}
 +
 +
.achievement ul li.not-done::before {
 +
  background-image: url("https://static.igem.org/mediawiki/2015/2/20/ITB_INDONESIA_cross_mark.png");
 +
}
 +
 +
footer {
 +
  border-top: 1px solid #14464a;
 +
  text-align: center;
 +
  margin-top: 20px;
 +
  margin-bottom: 30px;
 +
  padding-top: 20px;
 +
  padding-bottom: 20px;
 +
}
 +
 +
.bg-light-grey {
 +
  background-color: #f7f7f7;
 +
}
 +
 +
.bg-light-green {
 +
  background-color: #e0f2eb;
 +
}
 +
 +
.bg-bronze {
 +
  background-color: #daab85;
 +
}
 +
 +
.bg-silver {
 +
  background-color: white;
 +
}
 +
 +
.bg-gold {
 +
  background-color: #dfcd78;
 
}
 
}
  

Revision as of 07:22, 30 June 2015

.firstHeading { 

 display: none;

}

  1. content {
 width: 100%;
 font: Helvetica, Arial, sans-serif;
 color: #14464a;
 line-height: 1.3em;

}

  1. bodyContent {
 padding: 1% 5%;
 overflow: hidden;

}

nav { 

 margin-bottom: 20px;

}

.logo { 

 width: 20%;
 float: left;

}

.main-nav { 

 float: left;
 width: 80%;

}

.main-nav a { 

 color: #14464a;
 text-decoration: none;

}

.main-nav > ul { 

 font-size: 1.2em;
 font-weight: 100;
 margin: 1% 0 1% 0;

}

.main-nav > ul > li { 

 float: left;
 padding: 10px 1em;
 position: relative;
 list-style: none;

}

.main-nav > ul > li ul { 

 position: absolute;
 display: none;
 margin: 0 0 10px 0;
 padding: 0;
 background-color: #e0f2eb;
 width: 120%;
 top: 2.4em;
 left: 0;

}

.main-nav > ul > li ul li { 

 display: block;
 padding: 5px 20px;

}

.main-nav > ul li:hover { 

 background-color: #e0f2eb;
 cursor: pointer;

}

.main-nav > ul li:hover > ul { 

 display: block;

}

.main-nav .socmed { 

 border-top: 1px solid #14464a;
 padding-top: 2%;
 float: left;

}

.main-nav .socmed img { 

 width: 2%;
 margin-right: 5px;

}

h1, h2, h3 { 

 border-bottom: 1px solid #14464a;
 padding-bottom: 5px;
 font-weight: 100;

}

section { 

 margin-left: -100%;
 width: 300%;
 background-color: #f7f7f7;

}

.text-content { 

 padding: 20px 0;
 margin-left: 33%;
 margin-right: 33%;
 color: #444444;

}

p { 

 word-spacing: 0.1em;

}

.achievement ul { 

 margin: 0 0 0 -10px;
 list-style-type: none;

}

.achievement ul li { 

 margin: 10px 0;
 position: relative;

}

.achievement ul li.done::before, .achievement ul li.not-done::before { 

 background-size: 1.2em;
 width: 1.5em;
 height: 1.5em;
 content: " ";
 display: inline-block;
 background-repeat: no-repeat;
 position: absolute;
 left: -1.7em;

}

.achievement ul li.done::before { 

 background-image: url("../img/check_mark.png");

}

.achievement ul li.not-done::before { 

 background-image: url("../img/cross_mark.png");

}

footer { 

 border-top: 1px solid #14464a;
 text-align: center;
 margin-top: 20px;
 margin-bottom: 30px;
 padding-top: 20px;
 padding-bottom: 20px;

}

.bg-light-grey { 

 background-color: #f7f7f7;

}

.bg-light-green { 

 background-color: #e0f2eb;

}

.bg-bronze { 

 background-color: #daab85;

}

.bg-silver { 

 background-color: white;

}

.bg-gold { 

 background-color: #dfcd78;

}

.clearfix { 

 clear: both;

} .firstHeading { 

 display: none;

}

  1. content {
 width: 100%;
 font: Helvetica, Arial, sans-serif;
 color: #14464a;
 line-height: 1.3em;

}

  1. bodyContent {
 padding: 1% 5%;
 overflow: hidden;

}

nav { 

 margin-bottom: 20px;

}

.logo { 

 width: 20%;
 float: left;

}

.main-nav { 

 float: left;
 width: 80%;

}

.main-nav a { 

 color: #14464a;
 text-decoration: none;

}

.main-nav > ul { 

 font-size: 1.2em;
 font-weight: 100;
 margin: 1% 0 1% 0;

}

.main-nav > ul > li { 

 float: left;
 padding: 10px 1em;
 position: relative;
 list-style: none;

}

.main-nav > ul > li ul { 

 position: absolute;
 display: none;
 margin: 0 0 10px 0;
 padding: 0;
 background-color: #e0f2eb;
 width: 120%;
 top: 2.4em;
 left: 0;

}

.main-nav > ul > li ul li { 

 display: block;
 padding: 5px 20px;

}

.main-nav > ul li:hover { 

 background-color: #e0f2eb;
 cursor: pointer;

}

.main-nav > ul li:hover > ul { 

 display: block;

}

.main-nav .socmed { 

 border-top: 1px solid #14464a;
 padding-top: 2%;
 float: left;

}

.main-nav .socmed img { 

 width: 2%;
 margin-right: 5px;

}

h1, h2, h3 { 

 border-bottom: 1px solid #14464a;
 padding-bottom: 5px;
 font-weight: 100;

}

section { 

 margin-left: -100%;
 width: 300%;
 background-color: #f7f7f7;

}

.text-content { 

 padding: 20px 0;
 margin-left: 33%;
 margin-right: 33%;
 color: #444444;

}

p { 

 word-spacing: 0.1em;

}

.achievement ul { 

 margin: 0 0 0 -10px;
 list-style-type: none;

}

.achievement ul li { 

 margin: 10px 0;
 position: relative;

}

.achievement ul li.done::before, .achievement ul li.not-done::before { 

 background-size: 1.2em;
 width: 1.5em;
 height: 1.5em;
 content: " ";
 display: inline-block;
 background-repeat: no-repeat;
 position: absolute;
 left: -1.7em;

}

.achievement ul li.done::before { 

 background-image: url("ITB_INDONESIA_check_mark.png");

}

.achievement ul li.not-done::before { 

 background-image: url("ITB_INDONESIA_cross_mark.png");

}

footer { 

 border-top: 1px solid #14464a;
 text-align: center;
 margin-top: 20px;
 margin-bottom: 30px;
 padding-top: 20px;
 padding-bottom: 20px;

}

.bg-light-grey { 

 background-color: #f7f7f7;

}

.bg-light-green { 

 background-color: #e0f2eb;

}

.bg-bronze { 

 background-color: #daab85;

}

.bg-silver { 

 background-color: white;

}

.bg-gold { 

 background-color: #dfcd78;

}

.clearfix { 

 clear: both;

}