Difference between revisions of "Team:ZJU-China/pageCSS"

Line 1: Line 1:
 +
@import url('https://fonts.googleapis.com/css?family=Alegreya+Sans+SC|Bungee|Bungee+Hairline|Graduate|Harmattan|IM+Fell+DW+Pica+SC|Julius+Sans+One|Mate+SC|Play|Saira|Sarpanch|Tajawal');
 
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption{
 
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption{
 
     margin: 0;
 
     margin: 0;
Line 29: Line 30:
 
margin-right: auto;
 
margin-right: auto;
 
margin-top: 20%;
 
margin-top: 20%;
font-family: airborne;
+
font-family: 'IM Fell DW Pica SC', cursive;
 +
font-weight: lighter;
 
/*border: 1px dashed black;*/
 
/*border: 1px dashed black;*/
 
position: relative;
 
position: relative;
Line 35: Line 37:
  
 
.tl {
 
.tl {
font-family: airborne;
+
font-family: 'IM Fell DW Pica SC';
 +
font-weight: lighter;
 
color: #222222;
 
color: #222222;
 
font-size: 6em;
 
font-size: 6em;
Line 55: Line 58:
 
.tl h5 {
 
.tl h5 {
 
margin: 0;
 
margin: 0;
font-family: airborne;
+
font-family: 'IM Fell DW Pica SC', cursive;
 
font-size: .8em;
 
font-size: .8em;
 +
font-weight: lighter;
 
color: gray;
 
color: gray;
 
}
 
}
Line 62: Line 66:
 
.intro {
 
.intro {
 
margin-top: 2em;
 
margin-top: 2em;
font-family: crimson;
+
font-family: 'Saira';
 
font-weight: 600 !important;
 
font-weight: 600 !important;
 
font-size: 1.6em;
 
font-size: 1.6em;
Line 120: Line 124:
 
}
 
}
  
 
+
/*
  
 
@font-face {
 
@font-face {
Line 145: Line 149:
 
font-family: airborne;
 
font-family: airborne;
 
src: url(https://static.igem.org/mediawiki/2018/d/db/T--ZJU-China--airborne.woff);
 
src: url(https://static.igem.org/mediawiki/2018/d/db/T--ZJU-China--airborne.woff);
        src: url(https://static.igem.org/mediawiki/2018/e/e0/T--ZJU-China--airborne.ttf) format('truetype');
+
    src: url(https://static.igem.org/mediawiki/2018/e/e0/T--ZJU-China--airborne.ttf) format('truetype');
 
}
 
}
 +
  
 
@font-face {
 
@font-face {
Line 161: Line 166:
 
font-family: manksans;
 
font-family: manksans;
 
src: url(../fonts/MankSans.ttf);
 
src: url(../fonts/MankSans.ttf);
}
+
}*/
  
 
.intro, .cnt_psg {
 
.intro, .cnt_psg {
Line 203: Line 208:
 
display: block;
 
display: block;
 
vertical-align: middle;
 
vertical-align: middle;
font-size: 1em;
+
font-size: .9em;
 
line-height: 2em;
 
line-height: 2em;
font-family: manksans;
+
font-family: 'Play';
font-weight: 1200;
+
font-weight: normal;
 
 
 
}
 
}
Line 242: Line 247:
 
font-size: 1.4em;
 
font-size: 1.4em;
 
line-height: 1.5em;
 
line-height: 1.5em;
font-family: crimson;
+
font-family: 'Harmattan', sans-serif;
 +
font-size: 1.5em;
 +
font-weight: 100;
 
}
 
}
  
 
.psg_ttl {
 
.psg_ttl {
font-family: sackers !important;
+
font-family: 'Saira' !important;
 
font-size: 2em !important;
 
font-size: 2em !important;
 
color: steelblue;
 
color: steelblue;
font-weight: bolder;
+
font-weight: 1200 !important;
 
margin-top: 2em;
 
margin-top: 2em;
 
margin-bottom: 1em;
 
margin-bottom: 1em;
Line 270: Line 277:
 
.psg > h5 {
 
.psg > h5 {
 
text-align: center;
 
text-align: center;
font-family: crimson;
+
font-family: 'Harmattan';
 
font-size: 1.4em;
 
font-size: 1.4em;
 
}
 
}
Line 280: Line 287:
  
 
td > span {
 
td > span {
font-family: concorde;
+
font-family: 'Harmattan';
 
}
 
}
  
 
th > span {
 
th > span {
font-family: concorde;
+
font-family: 'Harmattan';
 
font-weight: bolder;
 
font-weight: bolder;
 
}
 
}
Line 301: Line 308:
 
     background-color: white;
 
     background-color: white;
 
     background-image: repeating-linear-gradient(-45deg, white, gray, 10px, transparent 10px, transparent 8px);
 
     background-image: repeating-linear-gradient(-45deg, white, gray, 10px, transparent 10px, transparent 8px);
 +
}
 +
 +
 +
 +
 +
/*SPONSERS*/
 +
 +
 +
.sponsors {
 +
float: right;
 +
bottom: 0;
 +
width: 105%;
 +
margin-bottom: 2em;
 +
/*background-color: black;*/
 +
text-align: center;
 +
}
 +
 +
#sponsor_ttl {
 +
font-size: 2em;
 +
/*color: white;*/
 +
line-height: 2em;
 +
text-align: center ;
 +
}
 +
 +
#sponsor_ttl:before,
 +
#sponsor_ttl:after {
 +
content: '';
 +
position: absolute;
 +
left: 5%;
 +
height: 1px;
 +
width: 90%;
 +
    background-image: repeating-linear-gradient(-45deg, white, gray, 10px, transparent 10px, transparent 8px);
 +
}
 +
 +
#sponsor_ttl:before {
 +
margin-top: 0;
 +
}
 +
 +
#sponsor_ttl:after {
 +
margin-top: 2em;
 +
}
 +
 +
.sponsors > img {
 +
width: 30%;
 +
height: auto;
 +
margin-left: 1%;
 +
margin-top: 2%;
 +
}
 +
 +
 +
#sponsor_ttl {
 +
font-family: 'Saira';
 +
color: gray;
 +
font-weight: 10;
 
}
 
}

Revision as of 06:21, 6 October 2018

@import url('https://fonts.googleapis.com/css?family=Alegreya+Sans+SC%7CBungee%7CBungee+Hairline%7CGraduate%7CHarmattan%7CIM+Fell+DW+Pica+SC%7CJulius+Sans+One%7CMate+SC%7CPlay%7CSaira%7CSarpanch%7CTajawal'); html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption{

   margin: 0;
   padding: 0;
   border: 0;
   outline: 0;
   font-size: 100%;
   vertical-align: baseline;
   background: transparent;

} /* .sponsors { position: absolute; height: 30%; width: 100%; margin: 0; padding: 0; margin-left: 0; margin-top: 0; left: 0; bottom: 0; background-size: 100% 100%; -webkit-background-size: 100% 100%; }*/

.title { height: auto; width: 90%; margin-left: auto; margin-right: auto; margin-top: 20%; font-family: 'IM Fell DW Pica SC', cursive; font-weight: lighter; /*border: 1px dashed black;*/ position: relative; }

.tl { font-family: 'IM Fell DW Pica SC'; font-weight: lighter; color: #222222; font-size: 6em; text-align: right; text-indent: 2em; }

.tl:after { content: ; position: absolute; margin: 0; padding: 0; border: 3.5px #5b80ae solid; height: 100%; width: 0; top: 0; }

.tl h5 { margin: 0; font-family: 'IM Fell DW Pica SC', cursive; font-size: .8em; font-weight: lighter; color: gray; }

.intro { margin-top: 2em; font-family: 'Saira'; font-weight: 600 !important; font-size: 1.6em; }

.element1 { width: 100%; min-height: 100%; /*position: absolute;*/ float: left; /*display: inline;*/ margin-top: 5%; left: 5%; box-shadow: 0 0 6px 3px darkgray ; }

.element1:before { content: ; display: inline; position: relative; left: 0; top: 0; width: 1px; padding: 0; margin-top: 0; margin-bottom: 0; height: 1000px; /*height: 10000%;*/ background-color: #494E6B; border: 4px solid #494e6b; /*border: darkred;*/ }

.element1 h5 { font-size: 2em; text-indent: 1em; font-family: 'sackers'; display: inline-block; }

.element1 p{ margin-left: 5%; margin-right: 5%; font-family: gigi; display: inline-block; }

.element1 img { width: 86%; margin-left: 7%; }

.panel-heading > h5 { font-family: concorde; font-size: 1.2em; line-height: 2em; }

/*

@font-face { font-family:juramedium; src: url(../fonts/Jura-Medium.ttf); }

@font-face { font-family: sackers; src: url(../fonts/sackers.otf); }

@font-face { font-family: crimson; src: url(../fonts/crimson.ttf); }

@font-face { font-family: cotham; src: url(../fonts/cotham.otf); }

@font-face { font-family: airborne; src: url(https://static.igem.org/mediawiki/2018/d/db/T--ZJU-China--airborne.woff);

   src: url(https://static.igem.org/mediawiki/2018/e/e0/T--ZJU-China--airborne.ttf) format('truetype');

}


@font-face { font-family: concorde; src: url(../fonts/Concorde.otf); }

@font-face { font-family: neosanspro; src: url(../fonts/NeoSansPro.ttf); }

@font-face { font-family: manksans; src: url(../fonts/MankSans.ttf); }*/

.intro, .cnt_psg { width: 82%; /*margin-top: 10em;*/ margin-left: 12%; line-height: 1.5em; /*font-family: 'sackers';*/ /*font-size: 1em;*/ }

.cnt_psg { margin-top: 5em;

}

.cnt { width: 17%; position: fixed; /*border: 1px solid black;*/ height: 100px; top: 20%; margin-left: -8%; display: none; font-family: manksans;

/*box-shadow: 0 0 10px 2px steelblue ;*/ }

/*.cnt:before { content: ; height: 100%; background-color: black; width: 2px; position: absolute; margin-top: 0; left: 0; }*/

.cnt > p { display: block; vertical-align: middle; font-size: .9em; line-height: 2em; font-family: 'Play'; font-weight: normal;

}

.cnt_p:hover { color: #6699a1 !important; font-weight: bolder; }

.cnt_p:after { content: ; /*height: 0 !important; width: 100%; border: solid 0.5px lightsteelblue; position: absolute; margin-top: 2.2em; font-size: 1em; right: 0;*/ height: 2em; display: none; border: 1px solid #33a6b8; /*border-color: inherit;*/ position: absolute; margin-top: 0; left: 0; width: 0; }

.psg { width: 85%; float: right; }

.psg p { font-size: 1.4em; line-height: 1.5em; font-family: 'Harmattan', sans-serif; font-size: 1.5em; font-weight: 100; }

.psg_ttl { font-family: 'Saira' !important; font-size: 2em !important; color: steelblue; font-weight: 1200 !important; margin-top: 2em; margin-bottom: 1em; }

table { margin-top: 4em; width: 80% !important; margin-left: auto; margin-right: auto; }

.psg > img { display: block; margin-left: auto; margin-right: auto; /*border: #000000 solid 1px;*/ }

.psg > h5 { text-align: center; font-family: 'Harmattan'; font-size: 1.4em; }

.psg > div { margin-top: 2em; margin-bottom: 2em; }

td > span { font-family: 'Harmattan'; }

th > span { font-family: 'Harmattan'; font-weight: bolder; }

td, th { text-align: center; }

hr {

   margin-left: auto;
   margin-right: auto;
   margin-top: 40px;
   height: 2px;
   width: 90%;
   border: none;
   background-color: white;
   background-image: repeating-linear-gradient(-45deg, white, gray, 10px, transparent 10px, transparent 8px);

}



/*SPONSERS*/


.sponsors { float: right; bottom: 0; width: 105%; margin-bottom: 2em; /*background-color: black;*/ text-align: center; }

  1. sponsor_ttl {

font-size: 2em; /*color: white;*/ line-height: 2em; text-align: center ; }

  1. sponsor_ttl:before,
  2. sponsor_ttl:after {

content: ; position: absolute; left: 5%; height: 1px; width: 90%;

   background-image: repeating-linear-gradient(-45deg, white, gray, 10px, transparent 10px, transparent 8px);

}

  1. sponsor_ttl:before {

margin-top: 0; }

  1. sponsor_ttl:after {

margin-top: 2em; }

.sponsors > img { width: 30%; height: auto; margin-left: 1%; margin-top: 2%; }


  1. sponsor_ttl {

font-family: 'Saira'; color: gray; font-weight: 10; }