Difference between revisions of "Template:SYSU-Software/css/common.css"

Revision as of 04:57, 1 November 2017 (view source) Sysu software (Talk | contribs) ← Older edit		Latest revision as of 02:53, 2 November 2017 (view source) Sysu software (Talk | contribs)
Line 275:		Line 275:
	text-shadow: 0.03em 0.03em 0.15em #5d5231;		text-shadow: 0.03em 0.03em 0.15em #5d5231;
	text-transform: uppercase;		text-transform: uppercase;
−	font-family: serif;	+	font-family: Arial, sans-serif;
		+	font-variant: small-caps;
	text-decoration: none;		text-decoration: none;
	}		}

---

Latest revision as of 02:53, 2 November 2017

• {

   margin: 0;
   padding: 0;
   font-style: normal;

}

html {

   font-size: 1rem !important;
   /* override semantic ui configuration*/

}

.realPage h1,h2,h3,h4,h5,h6 {

   color: #296592;
   margin-bottom: 0.8em;
   border-bottom: none;

}

h3, h4, h5, h6 {

   margin-top: 0.8em !important;

}

h1 {

   font-size: 4rem;

}

h2 {

   font-size: 3rem;
   text-transform: uppercase;
   text-align: center;

}

h3 {

   font-weight: 600;
   font-size: 2.5rem;

}

h4 {

   font-size: 2rem;
   font-weight: normal;

}

h5 {

   font-size: 1.5rem;
   font-weight: normal;

}

h6 {

   font-size: 1.2rem;

}

p {

   font-size: 1.3rem;
   line-height: 1.3em;

}

code {

   font-family: Courier New, Courier, monospace;

}

ul {

   list-style-position: inside;
   margin-bottom: 2em;

}

ol {

   margin: 1em 0 1em 2em;

}

li {

   line-height: 1.3em;
   text-align: left;

}

1. overview {

   margin-bottom: 1.3rem;

}

.overview>p {

   color: #296592;
   text-align: center;
   font-size: 1.5rem;
   margin-top: 1rem;

}

.overview {

   padding-bottom: 4em;
   margin-bottom: 5em;
   border-bottom: solid grey 1px !important;

}

.overview p:first-child {

   margin-top: 0;

}

section h2 {

   background-image: url("");
   background-size: 0.4em;
   background-position: center bottom;
   background-repeat: no-repeat;
   padding-bottom: 1em;
   margin-bottom: 3rem !important;

}

section {

   width: 70%;
   margin-left: auto;
   margin-right: auto;
   margin-bottom: 5rem;

}

section:last-of-type {

   margin-bottom: 4rem;

}

section.full {

   width: 100%;

}

section.plain {

   padding-bottom: 3rem;
   margin-bottom: 3rem;
   border-bottom: 1px solid gray;

}

section.plain:last-of-type {

   border: none;

}

.paragraph {

   margin-bottom: 2em;

}

.paragraph:last-child {

   margin-bottom: 0em;

}

.paragraph p {

   margin-top: 0.3em;

}

.paragraph p:first-child {

   margin-top: 0;

}

img.centered {

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

}

img.middle {

   margin: 2rem auto 2rem;
   width: 60%;

}

img.blue-shadowed {

   display: box;
   box-shadow: 0.3vw 0.3vw 0.6vw rgb(214, 232, 239)

}

img.green-shadowed {

   display: box;
   box-shadow: 0.3vw 0.3vw 0.6vw rgb(216, 235, 220);

}

img.black-shadowed {

   display: box;
   box-shadow: 0.3vw 0.3vw 0.6vw #999999;

}

img.blue-background {

   display: box;
   box-shadow: 1vw 1vw #E1F1FD;

}

.fig-ep {

   font-weight: 400;
   color: #909090;
   margin-top: 1.5em;
   margin-bottom: 2.5em;
   font-size: 1.1rem;
   line-height: 1.5em;
   text-align: center !important;

}

.quote {

   text-shadow: 0.5px 0.5px 0.2px #DDD;
   font-style: italic;

}

/* 顶部导航栏我统一使用firstnav，相应的在模板里写了 */

1. firstnav {

   background-color: rgba(1, 124, 135, 0.8);
   top: 16px;

}

1. firstnav a {

   color: white;
   text-decoration: none;

}

1. sdin-link {

   display: flex;
   align-items: center;
   /* vertical align sdin icon */

}

1. sdin-icon {

   width: 100px;
   padding-top: 15px;
   padding-bottom: 15px;
   margin-left: 3vw;
   margin-right: 3vw;
   display: block;

}

1. active-page {

   background-color: rgba(0, 78, 84, 0.8);
   border-width: 0;

}

.page-category {

   background-color: rgba(1, 124, 135, 0.8) !important;

}

1. firstnav .page-category .item {

   color: white !important;

}

1. firstnav {

   flex-wrap: wrap !important;

}

1. first-page {

   position: relative;
   width: 100%;
   min-height: 400px;

}

1. ship-background {

   position: absolute;
   z-index: -1;
   top: 0;
   left: 0;
   width: 100%;
   height: 800px;
   background-image: url("");
   background-size: cover;
   background-position: center 98%;

}

1. top-title {

   font-size: 5rem;
   padding-top: 3em;
   color: #EAC260;
   white-space: nowrap;
   text-align: center;
   font-weight: bold;
   text-transform: uppercase;
   margin-top: 0 !important;
   text-shadow: 0.03em 0.03em 0.15em #5d5231;

}

1. slogan {

   font-size: 3.125rem;
   margin-top: 1.2em;
   color: #EAC260;
   font-weight: bold;
   text-align: center;
   text-shadow: 0.03em 0.03em 0.15em #5d5231;
   text-transform: uppercase;
   font-family: Arial, sans-serif;
   font-variant: small-caps;
   text-decoration: none;

}

1. truePage #sysu-software-2017 {

   margin-top: 0.5em;
   margin-bottom: 9em;
   font-size: 1.57rem;
   /*25px*/
   color: #EAC260;
   text-shadow: 0.03em 0.03em 0.15em #5d5231;
   text-align: center;
   font-weight: 200;
   font-family: Courier New, Courier, monospace;

}

.fullseg {

   width: 100%;

}

.page-content {

   width: 70%;
   margin-top: 8em;
   margin-left: auto;
   margin-right: auto;

}

.center {

   text-align: center;

}

1. contact {

   background-image: url("");
   background-size: cover;
   background-position: center top;
   height: 450px;

}

.contact-item:first-child {

   margin-top: 0;

}

.contact-item {

   margin-top: 2em;

}

1. contact-content {

   padding: 50px 12.5% 50px 12.5%;
   width: 70%;
   height: 100%;
   display: flex;
   justify-content: center;
   flex-direction: column;

}

.contact-heading {

   font-size: 1.4rem;
   color: #969696;
   padding-bottom: 0.6em;
   line-height: 1em;
   text-transform: uppercase;
   text-align: center;

}

.contact-value {

   text-align: center;
   font-size: 1.4rem;
   line-height: 1.5em;
   color: white;
   text-decoration: none;

}

.contact-icons {

   display: flex;
   flex-direction: row;
   justify-content: center;

}

.contact-icon:first-child {

   margin-left: 0;

}

.contact-icon {

   margin-left: 1.8em;

}

.contact-icon>img {

   width: 3.5em;
   height: 3.5em;

} /* editing for upload to 2017.igem*/

div#top_title {

   display: none !important;

} div#top_menu_under .has_submenu{

   font-size: 12px !important;

} div#content.mw-body{

   width: 100%;
   padding: 0;
   margin: 0;

} div#sideMenu {

   display: none !important;

}

div#mw-content-text>p:first-of-type {

   display: none;

} /* Webfont: LatoLatin-Bold */

@font-face {

   font-family: 'Lato';
   src: url('../fonts/lato/LatoLatin-Bold.eot');
   /* IE9 Compat Modes */
   src: url('../fonts/lato/LatoLatin-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
   url('../fonts/lato/LatoLatin-Bold.woff2') format('woff2'), /* Modern Browsers */
   url('../fonts/lato/LatoLatin-Bold.woff') format('woff'), /* Modern Browsers */
   url('https://static.igem.org/mediawiki/2017/b/bc/T--SYSU-Software--font_LatoLatin-Bold.ttf') format('truetype');
   font-style: normal;
   font-weight: bold;
   text-rendering: optimizeLegibility;

}

/* Webfont: LatoLatin-BoldItalic */

@font-face {

   font-family: 'Lato';
   src: url('../fonts/lato/LatoLatin-BoldItalic.eot');
   /* IE9 Compat Modes */
   src: url('../fonts/lato/LatoLatin-BoldItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
   url('../fonts/lato/LatoLatin-BoldItalic.woff2') format('woff2'), /* Modern Browsers */
   url('../fonts/lato/LatoLatin-BoldItalic.woff') format('woff'), /* Modern Browsers */
   url('https://static.igem.org/mediawiki/2017/3/34/T--SYSU-Software--font_LatoLatin-BoldItalic.ttf') format('truetype');
   font-style: italic;
   font-weight: bold;
   text-rendering: optimizeLegibility;

}

/* Webfont: LatoLatin-Italic */

@font-face {

   font-family: 'Lato';
   src: url('../fonts/lato/LatoLatin-Italic.eot');
   /* IE9 Compat Modes */
   src: url('../fonts/lato/LatoLatin-Italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
   url('../fonts/lato/LatoLatin-Italic.woff2') format('woff2'), /* Modern Browsers */
   url('../fonts/lato/LatoLatin-Italic.woff') format('woff'), /* Modern Browsers */
   url('https://static.igem.org/mediawiki/2017/0/07/T--SYSU-Software--font_LatoLatin-Italic.ttf') format('truetype');
   font-style: italic;
   font-weight: normal;
   text-rendering: optimizeLegibility;

}

/* Webfont: LatoLatin-Regular */

@font-face {

   font-family: 'Lato';
   src: url('../fonts/lato/LatoLatin-Regular.eot');
   /* IE9 Compat Modes */
   src: url('../fonts/lato/LatoLatin-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
   url('../fonts/lato/LatoLatin-Regular.woff2') format('woff2'), /* Modern Browsers */
   url('../fonts/lato/LatoLatin-Regular.woff') format('woff'), /* Modern Browsers */
   url('https://static.igem.org/mediawiki/2017/c/cd/T--SYSU-Software--font_LatoLatin-Regular.ttf') format('truetype');
   font-style: normal;
   font-weight: normal;
   text-rendering: optimizeLegibility;

}

/* Webfont: LatoLatin-Semibold */

@font-face {

   font-family: 'Lato';
   src: url('../fonts/lato/LatoLatin-Semibold.eot');
   /* IE9 Compat Modes */
   src: url('../fonts/lato/LatoLatin-Semibold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
   url('../fonts/lato/LatoLatin-Semibold.woff2') format('woff2'), /* Modern Browsers */
   url('../fonts/lato/LatoLatin-Semibold.woff') format('woff'), /* Modern Browsers */
   url('https://static.igem.org/mediawiki/2017/e/e7/T--SYSU-Software--font_LatoLatin-Semibold.ttf') format('truetype');
   font-style: normal;
   font-weight: 600;
   text-rendering: optimizeLegibility;

}

/* Webfont: LatoLatin-SemiboldItalic */

@font-face {

   font-family: 'Lato';
   src: url('../fonts/lato/LatoLatin-SemiboldItalic.eot');
   /* IE9 Compat Modes */
   src: url('../fonts/lato/LatoLatin-SemiboldItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
   url('../fonts/lato/LatoLatin-SemiboldItalic.woff2') format('woff2'), /* Modern Browsers */
   url('../fonts/lato/LatoLatin-SemiboldItalic.woff') format('woff'), /* Modern Browsers */
   url('https://static.igem.org/mediawiki/2017/d/d5/T--SYSU-Software--font_LatoLatin-SemiboldItalic.ttf') format('truetype');
   font-style: italic;
   font-weight: 600;
   text-rendering: optimizeLegibility;

}