Team:Uppsala/stylesheet2.css

From 2014.igem.org

(Difference between revisions)
 
(210 intermediate revisions not shown)
Line 1: Line 1:
a {
a {
-
 
text-decoration: none;
text-decoration: none;
-
color: inherit;
 
-
 
-
}
 
-
 
-
#background a {
 
-
 
-
text-decoration: none;
 
-
 
}
}
Line 37: Line 28:
}
}
-
#background {
+
.background {
 +
border: 5px solid #d7d7d7;
font-size: 16pt;
font-size: 16pt;
padding-top: 10px;
padding-top: 10px;
-
padding-left: 10px;
+
padding-left: 5px;
-
padding-right: 10px;
+
padding-right: 5px;
width: 280px;
width: 280px;
-
height: 502px;
+
height: 512px;
background-color: #d7d7d7;
background-color: #d7d7d7;
-
box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
+
webkit-transition: all 0.2s ease-in-out;
-
text-decoration: none;
+
-moz-transition: all 0.2s ease-in-out;
-
color: #000 !important;
+
-o-transition: all 0.2s ease-in-out;
 +
transition: all 0.2s ease-in-out;
 +
/*box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
-webkit-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
-moz-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
*/
 +
}
 +
.background:hover {
 +
 +
border: 5px solid #d40400;
 +
/*box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
 +
-webkit-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
 +
-moz-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
 +
*/
}
}
-
 
.box_text {
.box_text {
Line 66: Line 70:
}
}
-
#background:hover {
 
-
box-shadow: 0px 0px 25px rgba(110,110,110);
 
-
color: #d40400 !important;
 
-
text-decoration: none;
 
-
}
+
#result {
-
#system_design {
+
border: 5px solid #d7d7d7;
font-size: 16pt;
font-size: 16pt;
padding-top: 10px;
padding-top: 10px;
-
padding-left: 10px;
+
padding-left: 5px;
-
padding-right: 10px;
+
padding-right: 5px;
margin-top: 20px;
margin-top: 20px;
margin-left: 10px;
margin-left: 10px;
Line 85: Line 85:
height: 236px;
height: 236px;
background-color: #d7d7d7;
background-color: #d7d7d7;
-
box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
+
webkit-transition: all 0.2s ease-in-out;
 +
-moz-transition: all 0.2s ease-in-out;
 +
-o-transition: all 0.2s ease-in-out;
 +
transition: all 0.2s ease-in-out;
 +
/*box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
-webkit-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
-moz-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
*/
text-decoration: none;
text-decoration: none;
color: #000 !important;
color: #000 !important;
Line 91: Line 98:
}
}
-
#system_design:hover {
+
#result:hover {
-
box-shadow: 0px 0px 25px rgba(110,110,110);
+
border: 5px solid #d40400;
 +
/*
 +
box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
 +
-webkit-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
 +
-moz-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
color: #d40400 !important;
color: #d40400 !important;
text-decoration: none;
text-decoration: none;
-
 
+
*/
}
}
#parts {  
#parts {  
-
 
+
/*
 +
border: 3px solid #d40400;
 +
*/
 +
border: 5px solid #d7d7d7;
 +
font-size: 16pt;
padding-top: 10px;
padding-top: 10px;
-
width: 200px;
+
padding-left: 5px;
-
height: 502px;
+
padding-right: 5px;
 +
width: 187px;
 +
height:512px;
float: right;
float: right;
background-color: #d7d7d7;
background-color: #d7d7d7;
 +
webkit-transition: all 0.2s ease-in-out;
 +
-moz-transition: all 0.2s ease-in-out;
 +
-o-transition: all 0.2s ease-in-out;
 +
transition: all 0.2s ease-in-out;
 +
/*box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
-webkit-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
-moz-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
*/
 +
text-decoration: none;
 +
color: #000 !important;
}
}
-
#parts a {  
+
#parts:hover {  
 +
border: 5px solid #d40400;
 +
/*
 +
box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
 +
-webkit-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
 +
-moz-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
 +
color: #d40400 !important;
text-decoration: none;
text-decoration: none;
-
 
+
*/
}
}
Line 122: Line 155:
}
}
-
#result {
+
#system_design {
 +
 
 +
/*
 +
border: 3px solid #d40400;
 +
*/
 +
border: 5px solid #d7d7d7;
font-size: 16pt;
font-size: 16pt;
padding-top: 10px;
padding-top: 10px;
-
padding-left: 10px;
+
padding-left: 5px;
-
padding-right: 10px;
+
padding-right: 5px;
margin-left: 10px;
margin-left: 10px;
width: 480px;
width: 480px;
height: 236px;
height: 236px;
background-color: #d7d7d7;
background-color: #d7d7d7;
-
box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
+
webkit-transition: all 0.2s ease-in-out;
 +
-moz-transition: all 0.2s ease-in-out;
 +
-o-transition: all 0.2s ease-in-out;
 +
transition: all 0.2s ease-in-out;
 +
/*box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
-webkit-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
-moz-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);
 +
*/
text-decoration: none;
text-decoration: none;
color: #000 !important;
color: #000 !important;
Line 138: Line 183:
}
}
-
#result:hover {
+
#system_design:hover {
-
box-shadow: 0px 0px 25px rgba(110,110,110);
+
border: 5px solid #d40400;
 +
 
 +
/*
 +
box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
 +
-webkit-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
 +
-moz-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);
color: #d40400 !important;
color: #d40400 !important;
text-decoration: none;
text-decoration: none;
 +
*/
 +
}
 +
 +
.project_h2 {
 +
 +
padding-top: 20px;
 +
border-top: 1px solid #d40400;
}
}
-
#discussion {
+
/* ---- Team ---- */
-
padding-top: 10px;
+
.team_pic {
 +
 
 +
display: block;
 +
width: 900px;
 +
margin-right: auto;
 +
margin-left: auto;
 +
 
 +
}
 +
 
 +
/* ---- Targeting project ---- */
 +
 
 +
.swarm {
 +
 
 +
display: block;
 +
width: 900px;
 +
margin-right: auto;
 +
margin-left: auto;
 +
 
 +
}
 +
 
 +
/* ---- Chapter buttons ---- */
 +
 
 +
.prev {
 +
 
 +
width: 150px;
 +
float: left;
 +
opacity: 0.6;
 +
webkit-transition: all 0.1s ease-in-out;
 +
-moz-transition: all 0.1s ease-in-out;
 +
-o-transition: all 0.1s ease-in-out;
 +
transition: all 0.1s ease-in-out;
 +
 
 +
}
 +
 
 +
.prev:hover {
 +
 
 +
opacity: 1.0;
 +
 
 +
}
 +
 
 +
.next:hover {
 +
 
 +
opacity: 1.0;
 +
 
 +
}
 +
 
 +
.next {
 +
 
 +
width: 150px;
 +
float: right;
 +
opacity: 0.6;
 +
webkit-transition: all 0.1s ease-in-out;
 +
-moz-transition: all 0.1s ease-in-out;
 +
-o-transition: all 0.1s ease-in-out;
 +
transition: all 0.1s ease-in-out;
 +
}
 +
 
 +
.next_pic {
 +
 
 +
width: 100px;
 +
float: right;
 +
 
 +
}
 +
 
 +
.prev_pic {
 +
 
 +
width: 100px;
 +
 
 +
}
 +
 
 +
#button_container {
 +
 
 +
height: 100px;
 +
 
 +
}
 +
 
 +
#clear {
 +
 
 +
clear: both;
 +
 
 +
}
 +
 
 +
/* ---- Home ---- */
 +
 
 +
.border_h2 {
 +
 
 +
border-bottom: 1px solid;
 +
padding-bottom: 10px;
 +
 
 +
}
 +
 
 +
#fucking-border {
 +
 
 +
border-top: 1px solid #d31906;
 +
margin-top: 10px;
 +
clear: both;
 +
padding-top: 20px;
 +
 
 +
}
 +
 
 +
.border_h2_right {
 +
 
 +
float: right;
 +
 
 +
}
 +
 
 +
.extra_fat {
 +
 
 +
font-size: 28pt !important;
 +
border-bottom: 1px solid;
 +
padding-bottom: 10px;
margin-top: 20px;
margin-top: 20px;
-
margin-left: 15px;
 
-
width: 500px;
 
-
background: #d7d7d7;
 
 +
}
 +
 +
#grid_container {
 +
 +
height: 550px;
 +
 +
}
 +
 +
#left_content {
 +
 +
float: left;
 +
 +
}
 +
 +
#right_content {
 +
 +
float: right;
 +
width: 430px;
 +
 +
}
 +
 +
.main_pic_left {
 +
 +
float: left;
 +
width: 600px;
 +
 +
}
 +
 +
#left_content_invert {
 +
 +
float: right;
 +
 +
 +
}
 +
 +
#right_content_invert {
 +
 +
width: 430px;
 +
 +
}
 +
 +
/* ---- Project overview ---- */
 +
 +
#p_containerR {
 +
 +
width: 50%;
 +
float: right;
 +
margin-bottom: 10px;
 +
border: 4px solid #d40400;
 +
border-radius: 25px;
 +
margin-left: 20px;
 +
padding:10px;
 +
box-shadow: inset 0px 0px 20px 0px rgba(0,0,0,1);
 +
}
 +
 +
#p_containerL {
 +
 +
width: 50%;
 +
float: left;
 +
margin-bottom: 10px;
 +
border: 4px solid #d40400;
 +
border-radius: 25px;
 +
margin-right: 20px;
 +
padding:10px;
 +
box-shadow: inset 0px 0px 20px 0px rgba(0,0,0,1);
 +
}
 +
 +
#p_containerM {
 +
 +
width: 100%;
 +
margin-bottom: 10px;
 +
border: 4px solid #d40400;
 +
border-radius: 25px;
 +
box-shadow: inset 0px 0px 20px 0px rgba(0,0,0,1);
 +
}
 +
 +
/* ---- Java Launch --- */
 +
 +
.launchlist {
 +
 +
    color: #5d6a52;
 +
    text-align: center;
 +
    position: relative;
 +
    font-size: 27px;
 +
    padding: 10px;
 +
    margin: 20px 0 0 0;
 +
    font-family:  "Times New Roman", Times, serif;
 +
    font-size: 32px;
 +
    font-variant: small-caps;
 +
    font-weight: bold;
 +
//    box-shadow: 0 0 1px #000;
 +
    -webkit-text-stroke: 1px black;
 +
    -moz-text-stroke: 1px black;
 +
}
 +
 +
.launchlist a:hover {
 +
text-decoration: none;
 +
}
 +
 +
/* ------ Tables ------- */
 +
 +
#partsT table
 +
{
 +
font-family: 'Black Ops One', cursive;
 +
border-collapse:collapse;
 +
}
 +
 +
#partsT td, th
 +
{
 +
font-size:0.8em;
 +
border:1px solid #5d6a52;
 +
padding:3px 7px 2px 7px;
 +
}
 +
#partsT th
 +
{
 +
font-size:1.1em;
 +
text-align:left;
 +
padding-top:5px;
 +
padding-bottom:4px;
 +
background-color: #dee1dc;
 +
color:#5d6a52;
 +
}
 +
 +
#partsT td{
 +
font-family: "Times New Roman", Times, serif;
 +
}
 +
 +
#partsT tr:nth-of-type(odd) {
 +
background-color:#dee1dc;
 +
}
 +
 +
#modVideo{
 +
display: block;
 +
margin-right: auto;
 +
margin-left: auto;
 +
}
 +
 +
#newsP img:hover{
 +
box-shadow: 0px 0px 20px 0px rgba(0,0,0,1);
}
}

Latest revision as of 20:50, 17 October 2014

a { text-decoration: none; }

/* ----Project overview---- */

.overview {

text-align: center; border-bottom: 1px solid #d40400; padding-bottom: 5px; text-decoration: none;

}

  1. right_overview {

float: left; width: 500px; margin-left: 10px; }

  1. left_overview {

float: left; width: 300px;

}

.background {

border: 5px solid #d7d7d7; font-size: 16pt; padding-top: 10px; padding-left: 5px; padding-right: 5px; width: 280px; height: 512px; background-color: #d7d7d7; webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; /*box-shadow: inset 0px 0px 25px rgba(110,110,110, .8); -webkit-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8); -moz-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);

  • /

}

.background:hover {

border: 5px solid #d40400; /*box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8); -webkit-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8); -moz-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8);

  • /

} .box_text {

color: #000; display: block; width: 100%; height: 100%;

}

.box_text:hover {

color: #d40400; }


  1. result {

border: 5px solid #d7d7d7;

font-size: 16pt; padding-top: 10px; padding-left: 5px; padding-right: 5px; margin-top: 20px; margin-left: 10px; width: 480px; height: 236px; background-color: #d7d7d7; webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; /*box-shadow: inset 0px 0px 25px rgba(110,110,110, .8); -webkit-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8); -moz-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);

  • /

text-decoration: none; color: #000 !important;

}

  1. result:hover {

border: 5px solid #d40400; /* box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8); -webkit-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8); -moz-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8); color: #d40400 !important; text-decoration: none;

  • /

}


  1. parts {

/* border: 3px solid #d40400;

  • /

border: 5px solid #d7d7d7; font-size: 16pt; padding-top: 10px; padding-left: 5px; padding-right: 5px; width: 187px; height:512px; float: right; background-color: #d7d7d7; webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; /*box-shadow: inset 0px 0px 25px rgba(110,110,110, .8); -webkit-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8); -moz-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);

  • /

text-decoration: none; color: #000 !important;

}

  1. parts:hover {

border: 5px solid #d40400;

/* box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8); -webkit-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8); -moz-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8); color: #d40400 !important; text-decoration: none;

  • /

}

.mparts {

text-align: center;

}

  1. system_design {

/* border: 3px solid #d40400;

  • /

border: 5px solid #d7d7d7; font-size: 16pt; padding-top: 10px; padding-left: 5px; padding-right: 5px; margin-left: 10px; width: 480px; height: 236px; background-color: #d7d7d7; webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; /*box-shadow: inset 0px 0px 25px rgba(110,110,110, .8); -webkit-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8); -moz-box-shadow: inset 0px 0px 25px rgba(110,110,110, .8);

  • /

text-decoration: none; color: #000 !important;

}

  1. system_design:hover {

border: 5px solid #d40400;

/* box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8); -webkit-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8); -moz-box-shadow: 0px 0px 25px rgba(212, 4, 0, 0.8); color: #d40400 !important; text-decoration: none;

  • /

}

.project_h2 {

padding-top: 20px; border-top: 1px solid #d40400;

}

/* ---- Team ---- */

.team_pic {

display: block; width: 900px; margin-right: auto; margin-left: auto;

}

/* ---- Targeting project ---- */

.swarm {

display: block; width: 900px; margin-right: auto; margin-left: auto;

}

/* ---- Chapter buttons ---- */

.prev {

width: 150px; float: left; opacity: 0.6; webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out;

}

.prev:hover {

opacity: 1.0;

}

.next:hover {

opacity: 1.0;

}

.next {

width: 150px; float: right; opacity: 0.6; webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; }

.next_pic {

width: 100px; float: right;

}

.prev_pic {

width: 100px;

}

  1. button_container {

height: 100px;

}

  1. clear {

clear: both;

}

/* ---- Home ---- */

.border_h2 {

border-bottom: 1px solid; padding-bottom: 10px;

}

  1. fucking-border {

border-top: 1px solid #d31906; margin-top: 10px; clear: both; padding-top: 20px;

}

.border_h2_right {

float: right;

}

.extra_fat {

font-size: 28pt !important; border-bottom: 1px solid; padding-bottom: 10px; margin-top: 20px;

}

  1. grid_container {

height: 550px;

}

  1. left_content {

float: left;

}

  1. right_content {

float: right; width: 430px;

}

.main_pic_left {

float: left; width: 600px;

}

  1. left_content_invert {

float: right;


}

  1. right_content_invert {

width: 430px;

}

/* ---- Project overview ---- */

  1. p_containerR {

width: 50%; float: right; margin-bottom: 10px; border: 4px solid #d40400; border-radius: 25px; margin-left: 20px; padding:10px; box-shadow: inset 0px 0px 20px 0px rgba(0,0,0,1); }

  1. p_containerL {

width: 50%; float: left; margin-bottom: 10px; border: 4px solid #d40400; border-radius: 25px; margin-right: 20px; padding:10px; box-shadow: inset 0px 0px 20px 0px rgba(0,0,0,1); }

  1. p_containerM {

width: 100%; margin-bottom: 10px; border: 4px solid #d40400; border-radius: 25px; box-shadow: inset 0px 0px 20px 0px rgba(0,0,0,1); }

/* ---- Java Launch --- */

.launchlist {

   color: #5d6a52;
   text-align: center;
   position: relative;
   font-size: 27px;
   padding: 10px;
   margin: 20px 0 0 0;
   font-family:  "Times New Roman", Times, serif;
   font-size: 32px;
   font-variant: small-caps;
   font-weight: bold;

// box-shadow: 0 0 1px #000;

   -webkit-text-stroke: 1px black;
   -moz-text-stroke: 1px black;

}

.launchlist a:hover { text-decoration: none; }

/* ------ Tables ------- */

  1. partsT table

{ font-family: 'Black Ops One', cursive; border-collapse:collapse; }

  1. partsT td, th

{ font-size:0.8em; border:1px solid #5d6a52; padding:3px 7px 2px 7px; }

  1. partsT th

{ font-size:1.1em; text-align:left; padding-top:5px; padding-bottom:4px; background-color: #dee1dc; color:#5d6a52; }

  1. partsT td{

font-family: "Times New Roman", Times, serif; }

  1. partsT tr:nth-of-type(odd) {

background-color:#dee1dc; }

  1. modVideo{

display: block; margin-right: auto; margin-left: auto; }

  1. newsP img:hover{

box-shadow: 0px 0px 20px 0px rgba(0,0,0,1); }