Template:Team:Wellesley Desyne/css/wp app.css

From 2013.igem.org

(Difference between revisions)
 
(9 intermediate revisions not shown)
Line 597: Line 597:
         display: table-cell !important; } }
         display: table-cell !important; } }
-
/* Touch-enabled device targeting */
 
-
.show-for-touch {
 
-
    display: none !important; }
 
-
 
-
.hide-for-touch {
 
-
    display: inherit !important; }
 
-
 
-
.touch .show-for-touch {
 
-
    display: inherit !important; }
 
-
 
-
.touch .hide-for-touch {
 
-
    display: none !important; }
 
-
 
-
/* Specific visilbity for tables */
 
-
table.hide-for-touch {
 
-
    display: table; }
 
-
 
-
.touch table.show-for-touch {
 
-
    display: table; }
 
-
 
-
thead.hide-for-touch {
 
-
    display: table-header-group !important; }
 
-
 
-
.touch thead.show-for-touch {
 
-
    display: table-header-group !important; }
 
-
 
-
tbody.hide-for-touch {
 
-
    display: table-row-group !important; }
 
-
 
-
.touch tbody.show-for-touch {
 
-
    display: table-row-group !important; }
 
-
 
-
tr.hide-for-touch {
 
-
    display: table-row !important; }
 
-
 
-
.touch tr.show-for-touch {
 
-
    display: table-row !important; }
 
-
 
-
td.hide-for-touch {
 
-
    display: table-cell !important; }
 
-
 
-
.touch td.show-for-touch {
 
-
    display: table-cell !important; }
 
-
 
-
th.hide-for-touch {
 
-
    display: table-cell !important; }
 
-
 
-
.touch th.show-for-touch {
 
-
    display: table-cell !important; }
 
-
 
-
/* Foundation Block Grids for above small breakpoint */
 
-
@media only screen and (min-width: 768px) {
 
-
    /* Remove small grid clearing */
 
-
    .small-block-grid-1 > li:nth-of-type(1n+1) {
 
-
        clear: none; }
 
-
 
-
    .small-block-grid-2 > li:nth-of-type(2n+1) {
 
-
        clear: none; }
 
-
 
-
    .small-block-grid-3 > li:nth-of-type(3n+1) {
 
-
        clear: none; }
 
-
 
-
    .small-block-grid-4 > li:nth-of-type(4n+1) {
 
-
        clear: none; }
 
-
 
-
    .small-block-grid-5 > li:nth-of-type(5n+1) {
 
-
        clear: none; }
 
-
 
-
    .small-block-grid-6 > li:nth-of-type(6n+1) {
 
-
        clear: none; }
 
-
 
-
    .small-block-grid-7 > li:nth-of-type(7n+1) {
 
-
        clear: none; }
 
-
 
-
    .small-block-grid-8 > li:nth-of-type(8n+1) {
 
-
        clear: none; }
 
-
 
-
    .small-block-grid-9 > li:nth-of-type(9n+1) {
 
-
        clear: none; }
 
-
 
-
    .small-block-grid-10 > li:nth-of-type(10n+1) {
 
-
        clear: none; }
 
-
 
-
    .small-block-grid-11 > li:nth-of-type(11n+1) {
 
-
        clear: none; }
 
-
 
-
    .small-block-grid-12 > li:nth-of-type(12n+1) {
 
-
        clear: none; }
 
-
 
-
    .large-block-grid-1 > li {
 
-
        width: 100%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-1 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-1 > li:nth-of-type(1n+1) {
 
-
        clear: both; }
 
-
 
-
    .large-block-grid-2 > li {
 
-
        width: 50%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-2 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-2 > li:nth-of-type(2n+1) {
 
-
        clear: both; }
 
-
 
-
    .large-block-grid-3 > li {
 
-
        width: 33.33333%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-3 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-3 > li:nth-of-type(3n+1) {
 
-
        clear: both; }
 
-
 
-
    .large-block-grid-4 > li {
 
-
        width: 25%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-4 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-4 > li:nth-of-type(4n+1) {
 
-
        clear: both; }
 
-
 
-
    .large-block-grid-5 > li {
 
-
        width: 20%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-5 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-5 > li:nth-of-type(5n+1) {
 
-
        clear: both; }
 
-
 
-
    .large-block-grid-6 > li {
 
-
        width: 16.66667%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-6 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-6 > li:nth-of-type(6n+1) {
 
-
        clear: both; }
 
-
 
-
    .large-block-grid-7 > li {
 
-
        width: 14.28571%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-7 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-7 > li:nth-of-type(7n+1) {
 
-
        clear: both; }
 
-
 
-
    .large-block-grid-8 > li {
 
-
        width: 12.5%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-8 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-8 > li:nth-of-type(8n+1) {
 
-
        clear: both; }
 
-
 
-
    .large-block-grid-9 > li {
 
-
        width: 11.11111%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-9 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-9 > li:nth-of-type(9n+1) {
 
-
        clear: both; }
 
-
 
-
    .large-block-grid-10 > li {
 
-
        width: 10%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-10 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-10 > li:nth-of-type(10n+1) {
 
-
        clear: both; }
 
-
 
-
    .large-block-grid-11 > li {
 
-
        width: 9.09091%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-11 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-11 > li:nth-of-type(11n+1) {
 
-
        clear: both; }
 
-
 
-
    .large-block-grid-12 > li {
 
-
        width: 8.33333%;
 
-
        padding: 0 0.625em 1.25em; }
 
-
    .large-block-grid-12 > li:nth-of-type(n) {
 
-
        clear: none; }
 
-
    .large-block-grid-12 > li:nth-of-type(12n+1) {
 
-
        clear: both; } }
 
p.lead {
p.lead {
     font-size: 1.21875em;
     font-size: 1.21875em;
Line 973: Line 789:
     line-height: 1.6;
     line-height: 1.6;
     color: #6f6f6f; }
     color: #6f6f6f; }
 +
@media only screen and (min-width: 768px) {
@media only screen and (min-width: 768px) {
Line 1,073: Line 890:
.dropdown.button.secondary:before {
.dropdown.button.secondary:before {
     border-color: #333333 transparent transparent transparent; }
     border-color: #333333 transparent transparent transparent; }
 +
 +
/* Panels */
 +
.panel {
 +
    border-style: solid;
 +
    border-width: 1px;
 +
    border-color: #d9d9d9;
 +
    margin-bottom: 1.25em;
 +
    padding: 1.25em;
 +
    background: #f2f2f2; }
 +
.panel > :first-child {
 +
    margin-top: 0; }
 +
.panel > :last-child {
 +
    margin-bottom: 0; }
 +
.panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6, .panel p {
 +
    color: #333333; }
 +
.panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6 {
 +
    line-height: 1;
 +
    margin-bottom: 0.625em; }
 +
.panel h1.subheader, .panel h2.subheader, .panel h3.subheader, .panel h4.subheader, .panel h5.subheader, .panel h6.subheader {
 +
    line-height: 1.4; }
 +
.panel.callout {
 +
    border-style: solid;
 +
    border-width: 1px;
 +
    border-color: #2284a1;
 +
    margin-bottom: 1.25em;
 +
    padding: 1.25em;
 +
    background: #2ba6cb;
 +
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
 +
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; }
 +
.panel.callout > :first-child {
 +
    margin-top: 0; }
 +
.panel.callout > :last-child {
 +
    margin-bottom: 0; }
 +
.panel.callout h1, .panel.callout h2, .panel.callout h3, .panel.callout h4, .panel.callout h5, .panel.callout h6, .panel.callout p {
 +
    color: white; }
 +
.panel.callout h1, .panel.callout h2, .panel.callout h3, .panel.callout h4, .panel.callout h5, .panel.callout h6 {
 +
    line-height: 1;
 +
    margin-bottom: 0.625em; }
 +
.panel.callout h1.subheader, .panel.callout h2.subheader, .panel.callout h3.subheader, .panel.callout h4.subheader, .panel.callout h5.subheader, .panel.callout h6.subheader {
 +
    line-height: 1.4; }
 +
.panel.radius {
 +
    -webkit-border-radius: 3px;
 +
    border-radius: 3px; }
 +
 +
/* Wrapped around .top-bar to contain to grid width */
/* Wrapped around .top-bar to contain to grid width */
Line 1,272: Line 1,134:
.top-bar-js-breakpoint {
.top-bar-js-breakpoint {
-
     width: 58.75em !important;
+
     width: 300em !important;
     visibility: hidden; }
     visibility: hidden; }
 +
 +
@media only screen and (min-width: 5em) {
 +
    .top-bar {
 +
        background: #cee163;
 +
        *zoom: 1;
 +
        overflow: visible; }
 +
    .top-bar:before, .top-bar:after {
 +
        content: " ";
 +
        display: table; }
 +
    .top-bar:after {
 +
        clear: both; }
 +
    .top-bar .toggle-topbar {
 +
        display: none; }
 +
    .top-bar .title-area {
 +
        float: left; }
 +
    .top-bar .name h1 a {
 +
        width: auto; }
 +
    .top-bar input,
 +
    .top-bar .button {
 +
        line-height: 2em;
 +
        font-size: 0.875em;
 +
        height: 2em;
 +
        padding: 0 10px;
 +
        position: relative;
 +
        top: 8px; }
 +
    .top-bar.expanded {
 +
        background: #cee163; }
 +
 +
    .contain-to-grid .top-bar {
 +
        max-width: 62.5em;
 +
        margin: 0 auto;
 +
        margin-bottom: 1.875em; }
 +
 +
    .top-bar-section {
 +
        -webkit-transition: none 0 0;
 +
        -moz-transition: none 0 0;
 +
        transition: none 0 0;
 +
        left: 0 !important; }
 +
    .top-bar-section ul {
 +
        width: auto;
 +
        height: auto !important;
 +
        display: inline; }
 +
    .top-bar-section ul li {
 +
        float: left; }
 +
    .top-bar-section ul li .js-generated {
 +
        display: none; }
 +
    .top-bar-section li a:not(.button) {
 +
        padding: 0 15px;
 +
        line-height: 45px;
 +
        background: #cee163; }
 +
    .top-bar-section li a:not(.button).hover {
 +
        background: black; }
 +
    .top-bar-section .has-dropdown > a {
 +
        padding-right: 35px !important; }
 +
    .top-bar-section .has-dropdown > a:after {
 +
        content: "";
 +
        display: block;
 +
        width: 0;
 +
        height: 0;
 +
        border: inset 5px;
 +
        border-color: rgba(255, 255, 255, 0.5) transparent transparent transparent;
 +
        border-top-style: solid;
 +
        margin-top: -2.5px;
 +
        top: 22.5px; }
 +
    .top-bar-section .has-dropdown.moved {
 +
        position: relative; }
 +
    .top-bar-section .has-dropdown.moved > .dropdown {
 +
        visibility: hidden; }
 +
    .top-bar-section .has-dropdown.hover > .dropdown, .top-bar-section .has-dropdown.not-click:hover > .dropdown {
 +
        visibility: visible; }
 +
    .top-bar-section .has-dropdown .dropdown li.has-dropdown > a:after {
 +
        border: none;
 +
        content: "\00bb";
 +
        margin-top: -16px;
 +
        right: 5px; }
 +
    .top-bar-section .dropdown {
 +
        left: 0;
 +
        top: auto;
 +
        background: transparent;
 +
        min-width: 100%; }
 +
    .top-bar-section .dropdown li a {
 +
        color: white;
 +
        line-height: 1;
 +
        white-space: nowrap;
 +
        padding: 7px 15px;
 +
        background: #1e1e1e; }
 +
    .top-bar-section .dropdown li label {
 +
        white-space: nowrap;
 +
        background: #1e1e1e; }
 +
    .top-bar-section .dropdown li .dropdown {
 +
        left: 100%;
 +
        top: 0; }
 +
    .top-bar-section > ul > .divider, .top-bar-section > ul > [role="separator"] {
 +
        border-bottom: none;
 +
        border-top: none;
 +
 +
        clear: none;
 +
        height: 45px;
 +
        width: 0px; }
 +
    .top-bar-section .has-form {
 +
        background: #cee163;
 +
        padding: 0 15px;
 +
        height: 45px; }
 +
    .top-bar-section ul.right li .dropdown {
 +
        left: auto;
 +
        right: 0; }
 +
    .top-bar-section ul.right li .dropdown li .dropdown {
 +
        right: 100%; }
 +
 +
    .no-js .top-bar-section ul li:hover > a {
 +
        background: #090909;
 +
        color: white; }
 +
    .no-js .top-bar-section ul li:active > a {
 +
        background: #090909;
 +
        color: white; }
 +
    .no-js .top-bar-section .has-dropdown:hover > .dropdown {
 +
        visibility: visible; } }
 +
.js-generated {
.js-generated {
     display: block; }
     display: block; }
 +
 +
@-webkit-keyframes rotate {
 +
    from {
 +
        -webkit-transform: rotate(0deg); }
 +
 +
    to {
 +
        -webkit-transform: rotate(360deg); } }
 +
 +
@-moz-keyframes rotate {
 +
    from {
 +
        -webkit-transform: rotate(0deg); }
 +
 +
    to {
 +
        -webkit-transform: rotate(360deg); } }
 +
 +
@-o-keyframes rotate {
 +
    from {
 +
        -webkit-transform: rotate(0deg); }
 +
 +
    to {
 +
        -webkit-transform: rotate(360deg); } }
 +
 +
@keyframes rotate {
 +
    from {
 +
        -webkit-transform: rotate(0deg); }
 +
 +
    to {
 +
        -webkit-transform: rotate(360deg); } }
/* Clearing Styles */
/* Clearing Styles */
Line 1,436: Line 1,444:
         padding-left: 0;
         padding-left: 0;
         padding-top: 0; } }
         padding-top: 0; } }
 +
 +
/* Breadcrumbs */
/* Breadcrumbs */
.breadcrumbs {
.breadcrumbs {
Line 1,486: Line 1,496:
     content: " ";
     content: " ";
     margin: 0; }
     margin: 0; }
-
/* Inline Lists */
 
-
.inline-list {
 
-
    margin: 0 auto 1.0625em auto;
 
-
    margin-left: -1.375em;
 
-
    margin-right: 0;
 
-
    padding: 0;
 
-
    list-style: none;
 
-
    overflow: hidden; }
 
-
.inline-list > li {
 
-
    list-style: none;
 
-
    float: left;
 
-
    margin-left: 1.375em;
 
-
    display: block; }
 
-
.inline-list > li > * {
 
-
    display: block; }
 
-
 
-
/* Panels */
 
-
.panel {
 
-
    border-style: solid;
 
-
    border-width: 1px;
 
-
    border-color: #d9d9d9;
 
-
    margin-bottom: 1.25em;
 
-
    padding: 1.25em;
 
-
    background: #f2f2f2; }
 
-
.panel > :first-child {
 
-
    margin-top: 0; }
 
-
.panel > :last-child {
 
-
    margin-bottom: 0; }
 
-
.panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6, .panel p {
 
-
    color: #333333; }
 
-
.panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6 {
 
-
    line-height: 1;
 
-
    margin-bottom: 0.625em; }
 
-
.panel h1.subheader, .panel h2.subheader, .panel h3.subheader, .panel h4.subheader, .panel h5.subheader, .panel h6.subheader {
 
-
    line-height: 1.4; }
 
-
.panel.callout {
 
-
    border-style: solid;
 
-
    border-width: 1px;
 
-
    border-color: #2284a1;
 
-
    margin-bottom: 1.25em;
 
-
    padding: 1.25em;
 
-
    background: #2ba6cb;
 
-
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
 
-
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; }
 
-
.panel.callout > :first-child {
 
-
    margin-top: 0; }
 
-
.panel.callout > :last-child {
 
-
    margin-bottom: 0; }
 
-
.panel.callout h1, .panel.callout h2, .panel.callout h3, .panel.callout h4, .panel.callout h5, .panel.callout h6, .panel.callout p {
 
-
    color: white; }
 
-
.panel.callout h1, .panel.callout h2, .panel.callout h3, .panel.callout h4, .panel.callout h5, .panel.callout h6 {
 
-
    line-height: 1;
 
-
    margin-bottom: 0.625em; }
 
-
.panel.callout h1.subheader, .panel.callout h2.subheader, .panel.callout h3.subheader, .panel.callout h4.subheader, .panel.callout h5.subheader, .panel.callout h6.subheader {
 
-
    line-height: 1.4; }
 
-
.panel.radius {
 
-
    -webkit-border-radius: 3px;
 
-
    border-radius: 3px; }
 
/* Side Nav */
/* Side Nav */

Latest revision as of 10:47, 27 September 2013

Retrieved from "http://2013.igem.org/Template:Team:Wellesley_Desyne/css/wp_app.css"