Template:Montgomery Cougars NJUSA/Common CSS

From 2014hs.igem.org

(Difference between revisions)
(Created page with "/* https://2011.igem.org/Team:DTU-Denmark/How_to_customize_an_iGEM_wiki#Centralizing_the_layout_using_templates */ - →Clear Wiki Shit: #contentSub, #search-controls, .firstHe...")
Line 23: Line 23:
     width: auto;
     width: auto;
}
}
 +
 +
/*
 +
Arcana 2.1 by HTML5 UP
 +
html5up.net | @n33co
 +
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 +
*/
 +
 +
/*********************************************************************************/
 +
/* Global                                                                        */
 +
/*********************************************************************************/
 +
 +
/* Basic */
 +
 +
*,*:before,*:after{-moz-box-sizing:content-box;-webkit-box-sizing:content-box;-o-box-sizing:content-box;-ms-box-sizing:content-box;box-sizing:content-box}
 +
 +
body
 +
{
 +
background: #f0f0f0 url('images/bg1.png');
 +
font-family: 'Open Sans Condensed', sans-serif;
 +
font-size: 14pt;
 +
line-height: 1.75em;
 +
color: #4c4c4c;
 +
}
 +
 +
h1,h2,h3,h4
 +
{
 +
font-family: 'Open Sans Condensed', sans-serif;
 +
color: #1d1d1d;
 +
}
 +
 +
h2, h3
 +
{
 +
font-size: 1.6em;
 +
letter-spacing: -1px;
 +
margin: 0 0 0.75em 0;
 +
}
 +
 +
strong
 +
 +
{ color: #1d1d1d;
 +
}
 +
 +
a
 +
{
 +
color: #478903;
 +
text-decoration: underline;
 +
}
 +
 +
a:hover
 +
{
 +
text-decoration: none;
 +
}
 +
 +
/* Reusable */
 +
 +
.button
 +
{
 +
display: inline-block;
 +
background: #0893cf;
 +
box-shadow: inset 0px 0px 0px 1px #48d3FF, 0px 2px 3px 0px rgba(0,0,0,0.25);
 +
border: solid 1px #0893cf;
 +
border-radius: 6px;
 +
padding: 0.45em 1.1em 0.5em 1.1em;
 +
color: #fff;
 +
font-size: 0.8em;
 +
text-decoration: none;
 +
text-shadow: -1px -1px 0 rgba(0,0,0,0.5);
 +
background-image: -moz-linear-gradient(top, #38C3FF, #0893cf);
 +
background-image: -webkit-linear-gradient(top, #38C3FF, #0893cf);
 +
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#38C3FF), to(#0893cf));
 +
background-image: -ms-linear-gradient(top, #38C3FF, #0893cf);
 +
background-image: -o-linear-gradient(top, #38C3FF, #0893cf);
 +
background-image: linear-gradient(top, #38C3FF, #0893cf);
 +
outline: 0;
 +
white-space: nowrap;
 +
}
 +
 +
.button:hover
 +
{
 +
background: #28a3df;
 +
background-image: -moz-linear-gradient(top, #58d3FF, #28a3df);
 +
background-image: -webkit-linear-gradient(top, #58d3FF, #28a3df);
 +
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#58d3FF), to(#28a3df));
 +
background-image: -ms-linear-gradient(top, #58d3FF, #28a3df);
 +
background-image: -o-linear-gradient(top, #58d3FF, #28a3df);
 +
background-image: linear-gradient(top, #58d3FF, #28a3df);
 +
}
 +
 +
.button:active
 +
{
 +
background: #38C3FF;
 +
background-image: -moz-linear-gradient(top, #0893cf, #38C3FF);
 +
background-image: -webkit-linear-gradient(top, #0893cf, #38C3FF);
 +
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0893cf), to(#38C3FF));
 +
background-image: -ms-linear-gradient(top, #0893cf, #38C3FF);
 +
background-image: -o-linear-gradient(top, #0893cf, #38C3FF);
 +
background-image: linear-gradient(top, #0893cf, #38C3FF);
 +
}
 +
 +
.divider
 +
{
 +
border-top: solid 1px #e5e5e5;
 +
border-bottom: solid 1px #e5e5e5;
 +
height: 4px;
 +
margin: 2em 0 2em 0;
 +
}
 +
 +
.divider-top
 +
{
 +
margin-bottom: 0;
 +
}
 +
 +
.divider-bottom
 +
{
 +
margin-top: 0;
 +
}
 +
 +
.cta-box
 +
{
 +
background: url('images/bg2.png');
 +
text-align: center;
 +
padding: 1.25em 0 1.25em 0;
 +
text-shadow: 1px 2px 0px #fff;
 +
font-size: 2em;
 +
}
 +
 +
.cta-box .button
 +
{
 +
margin-left: 0.8em;
 +
}
 +
 +
.highlight-box
 +
{
 +
background: url('images/bg2.png');
 +
text-align: center;
 +
padding: 3.5em 0 3.5em 0;
 +
text-shadow: 1px 2px 0px #fff;
 +
}
 +
 +
.highlight-box h2
 +
{
 +
font-size: 3.2em;
 +
letter-spacing: -3px;
 +
margin: 0 0 0.6em 0;
 +
}
 +
 +
.highlight-box span
 +
{
 +
font-size: 2em;
 +
color: #a1a1a1;
 +
}
 +
 +
.thumbnails
 +
{
 +
}
 +
 +
.thumbnails .divider
 +
{
 +
border-bottom: 0;
 +
border-top: solid 1px #e5e5e5;
 +
margin: 1em 0 1em 0;
 +
}
 +
 +
.thumbnails .thumbnail
 +
{
 +
overflow: hidden;
 +
}
 +
 +
.thumbnails .thumbnail img
 +
{
 +
border: solid 5px #fff;
 +
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
 +
float: left;
 +
margin-right: 25px;
 +
}
 +
 +
.thumbnails .thumbnail blockquote
 +
{
 +
margin: 0 0 0.75em 0;
 +
margin-left: 130px;
 +
}
 +
 +
.thumbnails .thumbnail cite
 +
{
 +
color: #888;
 +
margin-left: 130px;
 +
display: block;
 +
}
 +
 +
.thumbnails .thumbnail cite strong
 +
{
 +
padding-right: 0.25em;
 +
}
 +
 +
.link-list
 +
{
 +
}
 +
 +
.link-list li
 +
{
 +
border-top: solid 1px #d0d0d0;
 +
line-height: 2.5em;
 +
}
 +
 +
.link-list li:first-child
 +
{
 +
border-top: none;
 +
}
 +
 +
/*
 +
Arcana 2.1 by HTML5 UP
 +
html5up.net | @n33co
 +
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 +
*/
 +
 +
/*********************************************************************************/
 +
/* Desktop (>= 480px)                                                            */
 +
/*********************************************************************************/
 +
 +
/* Wrappers */
 +
 +
#main-wrapper
 +
{
 +
background: #fff;
 +
padding: 2em 0 4em 0;
 +
}
 +
 +
#header-wrapper
 +
{
 +
box-shadow: inset 0px 10px 80px 0px rgba(0,0,0,0.2);
 +
height: 102px;
 +
position: relative;
 +
padding: 2.25em 0 2.25em 0;
 +
}
 +
 +
#footer-wrapper
 +
{
 +
padding: 3.5em 0 5em 0;
 +
box-shadow: inset 0px 10px 60px 0px rgba(0,0,0,0.15);
 +
}
 +
 +
/* Site Header */
 +
 +
#site-header
 +
{
 +
position: relative;
 +
background: url('images/header.png');
 +
background-size: 100% 190px;
 +
height: 190px;
 +
text-shadow: -1px -1px 1px rgba(0,0,0,1);
 +
}
 +
 +
/* Logo */
 +
 +
#logo
 +
{
 +
position: absolute;
 +
left: 40px;
 +
top: 0;
 +
height: 85px;
 +
line-height: 85px;
 +
}
 +
 +
#logo h1
 +
{
 +
font-size: 2.25em;
 +
letter-spacing: -1px;
 +
color: #fff;
 +
}
 +
 +
#logo span
 +
{
 +
display: inline-block;
 +
border-left: solid 2px #d0d0d0;
 +
margin-left: 1em;
 +
padding-left: 1em;
 +
}
 +
 +
/* Site Nav */
 +
 +
#nav
 +
{
 +
position: absolute;
 +
top: 0;
 +
right: 50px;
 +
font-family: 'Open Sans Condensed', sans-serif;
 +
text-align: right;
 +
}
 +
 +
#nav ul
 +
{
 +
list-style: none;
 +
overflow: hidden;
 +
}
 +
 +
#nav ul li
 +
{
 +
display: block;
 +
float: left;
 +
text-decoration: none;
 +
font-size: 1.2em;
 +
height: 90px;
 +
line-height: 90px;
 +
margin: 0 0 0 1.75em;
 +
}
 +
 +
#nav ul li a
 +
{
 +
color: #c0c0c0;
 +
text-decoration: none;
 +
outline: 0;
 +
}
 +
 +
#nav ul li a:hover
 +
{
 +
color: #eee;
 +
}
 +
 +
#nav ul li.current_page_item
 +
{
 +
background: url('images/nav-arrow.png') center 77px no-repeat;
 +
}
 +
 +
#nav ul li.current_page_item a
 +
{
 +
color: #fff;
 +
}
 +
 +
/* Banner */
 +
 +
#banner
 +
{
 +
margin: 0 0 3em 0;
 +
}
 +
 +
#banner a
 +
{
 +
}
 +
 +
#banner a img
 +
{
 +
width: 100%;
 +
display: block;
 +
}
 +
 +
#banner .caption
 +
{
 +
background: #1e1e1e url('images/bg3.png') top left repeat-x;
 +
font-size: 2em;
 +
color: #aaa;
 +
text-align: center;
 +
text-shadow: -1px -1px 1px rgba(0,0,0,1);
 +
padding: 0.6em 0 0.6em 0;
 +
}
 +
 +
#banner .caption span
 +
{
 +
}
 +
 +
#banner .caption span strong
 +
{
 +
color: #ffffff;
 +
}
 +
 +
#banner .caption .button
 +
{
 +
border: solid 1px #001916;
 +
margin-left: 0.8em;
 +
}
 +
 +
/* Site Footer */
 +
 +
#site-footer
 +
{
 +
text-shadow: 1px 2px 0px #fff;
 +
}
 +
 +
#site-footer a
 +
{
 +
text-decoration: none;
 +
color: #525252;
 +
}
 +
 +
#site-footer a:hover
 +
{
 +
text-decoration: underline;
 +
}
 +
 +
 +
#site-footer ul li
 +
{
 +
line-height: 2.5em;
 +
}
 +
 +
#site-footer .divider
 +
{
 +
border-top: solid 1px #d0d0d0;
 +
border-bottom: solid 1px #d0d0d0;
 +
height: 4px;
 +
margin: 1em 0 1em 0;
 +
}
 +
 +
/* Copyright */
 +
 +
#copyright
 +
{
 +
text-align: center;
 +
color: #868686;
 +
}
 +
 +
#copyright a
 +
{
 +
color: #868686;
 +
}
 +
 +
/* Subpage */
 +
 +
.subpage
 +
{
 +
padding-top: 4em !important;
 +
}
 +
 +
.subpage article
 +
{
 +
padding: 0 1em 0 1em;
 +
}
 +
 +
.subpage article.first
 +
{
 +
padding: 0 1em 0 0;
 +
}
 +
 +
.subpage article.last
 +
{
 +
padding: 0 0 0 1em;
 +
}
 +
 +
.subpage h2
 +
{
 +
font-size: 2.2em;
 +
}
 +
 +
.subpage p
 +
{
 +
margin: 0 0 1.5em 0;
 +
}
 +
 +
.subpage section, .subpage article
 +
{
 +
margin: 0 0 2em 0;
 +
}

Revision as of 19:18, 14 March 2014

/* https://2011.igem.org/Team:DTU-Denmark/How_to_customize_an_iGEM_wiki#Centralizing_the_layout_using_templates */

/* Clear Wiki Shit */

  1. contentSub,
  2. search-controls,

.firstHeading,

  1. footer-box,
  2. catlinks,
  3. p-logo { 
   display:none;

}

  1. top-section { 
   border: none;
   height: 0px;

}

  1. content { 
   border: none;

}

  1. menubar > ul > li:last-child { 
   display: none;

}

  1. menubar { 
   width: auto;

}

/* Arcana 2.1 by HTML5 UP html5up.net | @n33co Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)

  • /

/*********************************************************************************/ /* Global */ /*********************************************************************************/

/* Basic */

  • ,*:before,*:after{-moz-box-sizing:content-box;-webkit-box-sizing:content-box;-o-box-sizing:content-box;-ms-box-sizing:content-box;box-sizing:content-box}

body { background: #f0f0f0 url('images/bg1.png'); font-family: 'Open Sans Condensed', sans-serif; font-size: 14pt; line-height: 1.75em; color: #4c4c4c; }

h1,h2,h3,h4 { font-family: 'Open Sans Condensed', sans-serif; color: #1d1d1d; }

h2, h3 { font-size: 1.6em; letter-spacing: -1px; margin: 0 0 0.75em 0; }

strong

{ color: #1d1d1d; }

a { color: #478903; text-decoration: underline; }

a:hover { text-decoration: none; }

/* Reusable */

.button { display: inline-block; background: #0893cf; box-shadow: inset 0px 0px 0px 1px #48d3FF, 0px 2px 3px 0px rgba(0,0,0,0.25); border: solid 1px #0893cf; border-radius: 6px; padding: 0.45em 1.1em 0.5em 1.1em; color: #fff; font-size: 0.8em; text-decoration: none; text-shadow: -1px -1px 0 rgba(0,0,0,0.5); background-image: -moz-linear-gradient(top, #38C3FF, #0893cf); background-image: -webkit-linear-gradient(top, #38C3FF, #0893cf); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#38C3FF), to(#0893cf)); background-image: -ms-linear-gradient(top, #38C3FF, #0893cf); background-image: -o-linear-gradient(top, #38C3FF, #0893cf); background-image: linear-gradient(top, #38C3FF, #0893cf); outline: 0; white-space: nowrap; }

.button:hover { background: #28a3df; background-image: -moz-linear-gradient(top, #58d3FF, #28a3df); background-image: -webkit-linear-gradient(top, #58d3FF, #28a3df); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#58d3FF), to(#28a3df)); background-image: -ms-linear-gradient(top, #58d3FF, #28a3df); background-image: -o-linear-gradient(top, #58d3FF, #28a3df); background-image: linear-gradient(top, #58d3FF, #28a3df); }

.button:active { background: #38C3FF; background-image: -moz-linear-gradient(top, #0893cf, #38C3FF); background-image: -webkit-linear-gradient(top, #0893cf, #38C3FF); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0893cf), to(#38C3FF)); background-image: -ms-linear-gradient(top, #0893cf, #38C3FF); background-image: -o-linear-gradient(top, #0893cf, #38C3FF); background-image: linear-gradient(top, #0893cf, #38C3FF); }

.divider { border-top: solid 1px #e5e5e5; border-bottom: solid 1px #e5e5e5; height: 4px; margin: 2em 0 2em 0; }

.divider-top { margin-bottom: 0; }

.divider-bottom { margin-top: 0; }

.cta-box { background: url('images/bg2.png'); text-align: center; padding: 1.25em 0 1.25em 0; text-shadow: 1px 2px 0px #fff; font-size: 2em; }

.cta-box .button { margin-left: 0.8em; }

.highlight-box { background: url('images/bg2.png'); text-align: center; padding: 3.5em 0 3.5em 0; text-shadow: 1px 2px 0px #fff; }

.highlight-box h2 { font-size: 3.2em; letter-spacing: -3px; margin: 0 0 0.6em 0; }

.highlight-box span { font-size: 2em; color: #a1a1a1; }

.thumbnails { }

.thumbnails .divider { border-bottom: 0; border-top: solid 1px #e5e5e5; margin: 1em 0 1em 0; }

.thumbnails .thumbnail { overflow: hidden; }

.thumbnails .thumbnail img { border: solid 5px #fff; box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25); float: left; margin-right: 25px; }

.thumbnails .thumbnail blockquote { margin: 0 0 0.75em 0; margin-left: 130px; }

.thumbnails .thumbnail cite { color: #888; margin-left: 130px; display: block; }

.thumbnails .thumbnail cite strong { padding-right: 0.25em; }

.link-list { }

.link-list li { border-top: solid 1px #d0d0d0; line-height: 2.5em; }

.link-list li:first-child { border-top: none; }

/* Arcana 2.1 by HTML5 UP html5up.net | @n33co Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)

  • /

/*********************************************************************************/ /* Desktop (>= 480px) */ /*********************************************************************************/

/* Wrappers */

#main-wrapper { background: #fff; padding: 2em 0 4em 0; }

#header-wrapper { box-shadow: inset 0px 10px 80px 0px rgba(0,0,0,0.2); height: 102px; position: relative; padding: 2.25em 0 2.25em 0; }

#footer-wrapper { padding: 3.5em 0 5em 0; box-shadow: inset 0px 10px 60px 0px rgba(0,0,0,0.15); }

/* Site Header */

#site-header { position: relative; background: url('images/header.png'); background-size: 100% 190px; height: 190px; text-shadow: -1px -1px 1px rgba(0,0,0,1); }

/* Logo */

#logo { position: absolute; left: 40px; top: 0; height: 85px; line-height: 85px; }

#logo h1 { font-size: 2.25em; letter-spacing: -1px; color: #fff; }

#logo span { display: inline-block; border-left: solid 2px #d0d0d0; margin-left: 1em; padding-left: 1em; }

/* Site Nav */

#nav { position: absolute; top: 0; right: 50px; font-family: 'Open Sans Condensed', sans-serif; text-align: right; }

#nav ul { list-style: none; overflow: hidden; }

#nav ul li { display: block; float: left; text-decoration: none; font-size: 1.2em; height: 90px; line-height: 90px; margin: 0 0 0 1.75em; }

#nav ul li a { color: #c0c0c0; text-decoration: none; outline: 0; }

#nav ul li a:hover { color: #eee; }

#nav ul li.current_page_item { background: url('images/nav-arrow.png') center 77px no-repeat; }

#nav ul li.current_page_item a { color: #fff; }

/* Banner */

#banner { margin: 0 0 3em 0; }

#banner a { }

#banner a img { width: 100%; display: block; }

#banner .caption { background: #1e1e1e url('images/bg3.png') top left repeat-x; font-size: 2em; color: #aaa; text-align: center; text-shadow: -1px -1px 1px rgba(0,0,0,1); padding: 0.6em 0 0.6em 0; }

#banner .caption span { }

#banner .caption span strong { color: #ffffff; }

#banner .caption .button { border: solid 1px #001916; margin-left: 0.8em; }

/* Site Footer */

#site-footer { text-shadow: 1px 2px 0px #fff; }

#site-footer a { text-decoration: none; color: #525252; }

#site-footer a:hover { text-decoration: underline; }


#site-footer ul li { line-height: 2.5em; }

#site-footer .divider { border-top: solid 1px #d0d0d0; border-bottom: solid 1px #d0d0d0; height: 4px; margin: 1em 0 1em 0; }

/* Copyright */

#copyright { text-align: center; color: #868686; }

#copyright a { color: #868686; }

/* Subpage */

.subpage { padding-top: 4em !important; }

.subpage article { padding: 0 1em 0 1em; }

.subpage article.first { padding: 0 1em 0 0; }

.subpage article.last { padding: 0 0 0 1em; }

.subpage h2 { font-size: 2.2em; }

.subpage p { margin: 0 0 1.5em 0; }

.subpage section, .subpage article { margin: 0 0 2em 0; }

Retrieved from "http://2014hs.igem.org/Template:Montgomery_Cougars_NJUSA/Common_CSS"