|
|
Line 9: |
Line 9: |
| <link rel="stylesheet" type="text/css" href="https://2016.igem.org/Team:Northwestern/css/bootstrap?action=raw&ctype=text/css"> | | <link rel="stylesheet" type="text/css" href="https://2016.igem.org/Team:Northwestern/css/bootstrap?action=raw&ctype=text/css"> |
| <link rel="stylesheet" type="text/css" href="https://2016.igem.org/Team:Northwestern/css/bootstrap-theme?action=raw&ctype=text/css"> | | <link rel="stylesheet" type="text/css" href="https://2016.igem.org/Team:Northwestern/css/bootstrap-theme?action=raw&ctype=text/css"> |
| + | <link rel="stylesheet" type="text/css" href="https://2016.igem.org/Team:Northwestern/css/home?action=raw&ctype=text/css"> |
| <script type="text/javascript" src="https://2016.igem.org/Team:Northwestern/libraries/jquery?action=raw&ctype=text/javascript"></script> | | <script type="text/javascript" src="https://2016.igem.org/Team:Northwestern/libraries/jquery?action=raw&ctype=text/javascript"></script> |
| <script type="text/javascript" src="https://2016.igem.org/Team:Northwestern/libraries/bootstrap?action=raw&ctype=text/javascript"></script> | | <script type="text/javascript" src="https://2016.igem.org/Team:Northwestern/libraries/bootstrap?action=raw&ctype=text/javascript"></script> |
| <script type="text/javascript" src="http://use.edgefonts.net/josefin-sans:n1,n4:default;poiret-one:n4:default;raleway:n4:default.js?action=raw&ctype=text/javascript"></script> | | <script type="text/javascript" src="http://use.edgefonts.net/josefin-sans:n1,n4:default;poiret-one:n4:default;raleway:n4:default.js?action=raw&ctype=text/javascript"></script> |
− | <style>
| |
− | @charset "UTF-8";
| |
− | #home {
| |
− | margin-top: 20px;
| |
− | margin-left: 5px;
| |
− | margin-right: 5px;
| |
− | margin-bottom: 20px;
| |
− | padding-left: 120px;
| |
− | padding-right: 110px;
| |
− | font-family: josefin-sans;
| |
− | font-style: normal;}
| |
− | #home a {
| |
− | color: #000000;
| |
− | text-decoration: underline;
| |
− | }
| |
− | #home a:hover {
| |
− | color: #000000;
| |
− | font-style: italic;
| |
− | text-decoration: none;
| |
− | }
| |
− | #home article .divider {
| |
− | display: block;
| |
− | max-height: 30px;
| |
− | margin-top: 30px;
| |
− | margin-bottom: 30px;
| |
− | }
| |
− | .ch-grid {
| |
− | margin-right: 0;
| |
− | margin-left: 0;
| |
− | margin-bottom: 0;
| |
− | list-style: none;
| |
− | display: block;
| |
− | text-align: center;
| |
− | width: 100%;
| |
− | margin-top: 20px;
| |
− | padding-left: 0px;
| |
− | }
| |
− |
| |
− | .ch-grid:after,
| |
− | .ch-item:before {
| |
− | content: '';
| |
− | display: table;
| |
− | }
| |
− |
| |
− | .ch-grid:after {
| |
− | clear: both;
| |
− | }
| |
− |
| |
− | .ch-grid li {
| |
− | width: 220px;
| |
− | height: 220px;
| |
− | display: inline-block;
| |
− | margin: 20px;
| |
− | }
| |
− | .ch-item {
| |
− | width: 100%;
| |
− | height: 100%;
| |
− | border-radius: 50%;
| |
− | position: relative;
| |
− | cursor: default;
| |
− | box-shadow:
| |
− | inset 0 0 0 16px rgba(255,255,255,0.6),
| |
− | 0 1px 2px rgba(0,0,0,0.1);
| |
− |
| |
− | -webkit-transition: all 0.4s ease-in-out;
| |
− | -moz-transition: all 0.4s ease-in-out;
| |
− | -o-transition: all 0.4s ease-in-out;
| |
− | -ms-transition: all 0.4s ease-in-out;
| |
− | transition: all 0.4s ease-in-out;
| |
− | }
| |
− |
| |
− | .ch-img-1 {
| |
− | background-image: url(https://static.igem.org/mediawiki/2016/5/5f/T--Northwestern--OMVs.png);
| |
− | background-repeat: no-repeat;
| |
− | background-position: center center;
| |
− | background-size: cover;
| |
− | }
| |
− |
| |
− | .ch-img-2 {
| |
− | background-image: url(https://static.igem.org/mediawiki/2016/f/f5/T--Northwestern--NU_arch.png);
| |
− | background-repeat: no-repeat;
| |
− | background-position: center center;
| |
− | background-size: cover;
| |
− | }
| |
− |
| |
− | .ch-img-3 {
| |
− | background-image: url(https://static.igem.org/mediawiki/2016/d/d6/T--Northwestern--SaCas9.png);
| |
− | background-repeat: no-repeat;
| |
− | background-position: center center;
| |
− | background-size: contain;
| |
− | }
| |
− |
| |
− | .ch-info {
| |
− | position: absolute;
| |
− | background: rgba(10,8,71, 0.8);
| |
− | width: inherit;
| |
− | height: inherit;
| |
− | border-radius: 50%;
| |
− | opacity: 0;
| |
− |
| |
− | -webkit-transition: all 0.4s ease-in-out;
| |
− | -moz-transition: all 0.4s ease-in-out;
| |
− | -o-transition: all 0.4s ease-in-out;
| |
− | -ms-transition: all 0.4s ease-in-out;
| |
− | transition: all 0.4s ease-in-out;
| |
− |
| |
− | -webkit-transform: scale(0);
| |
− | -moz-transform: scale(0);
| |
− | -o-transform: scale(0);
| |
− | -ms-transform: scale(0);
| |
− | transform: scale(0);
| |
− |
| |
− | -webkit-backface-visibility: hidden;
| |
− |
| |
− | }
| |
− |
| |
− | .ch-info h3.ch-bubble {
| |
− | color: #fff !important;
| |
− | text-transform: uppercase !important;
| |
− | letter-spacing: 2px !important;
| |
− | font-size: 22px !important;
| |
− | margin: 0 30px !important;
| |
− | padding: 45px 0 0 0 !important;
| |
− | height: 140px !important;
| |
− | font-family: josefin-sans;
| |
− | text-align: center !important;
| |
− | text-shadow: 0 0 1px #fff,
| |
− | 0 1px 2px rgba(0,0,0,0.3);
| |
− | font-style: normal;
| |
− | font-weight: 100;
| |
− | }
| |
− |
| |
− | .ch-info p {
| |
− | color: #fff;
| |
− | padding: 10px 5px !important;
| |
− | font-style: italic !important;
| |
− | margin: 0 30px !important;
| |
− | font-size: 12px !important;
| |
− | text-align: center !important;
| |
− | border-top: 1px solid rgba(255,255,255,0.5);
| |
− | opacity: 0;
| |
− | -webkit-transition: all 1s ease-in-out 0.4s;
| |
− | -moz-transition: all 1s ease-in-out 0.4s;
| |
− | -o-transition: all 1s ease-in-out 0.4s;
| |
− | -ms-transition: all 1s ease-in-out 0.4s;
| |
− | transition: all 1s ease-in-out 0.4s;
| |
− | font-family: josefin-sans;
| |
− | font-weight: 100;
| |
− | }
| |
− |
| |
− | .ch-info p a.ch-bubble{
| |
− | color: #fff !important;
| |
− | text-decoration: none !important;
| |
− | color: rgba(255,255,255,0.7) !important;
| |
− | font-style: normal !important;
| |
− | text-align: center !important;
| |
− | font-weight: 700 !important;
| |
− | text-transform: uppercase !important;
| |
− | font-size: 9px !important;
| |
− | letter-spacing: 1px !important;
| |
− | padding-top: 4px !important;
| |
− | font-family: josefin-sans;
| |
− | }
| |
− |
| |
− | .ch-info p a.ch-bubble:hover {
| |
− | color: #bf83a5 !important;
| |
− | text-decoration: none !important;
| |
− | font-style: normal !important;
| |
− | color: rgba(191,131,165, 0.8) !important;
| |
− | }
| |
− |
| |
− | .ch-item:hover {
| |
− | box-shadow:
| |
− | inset 0 0 0 1px rgba(255,255,255,0.1),
| |
− | 0 1px 2px rgba(0,0,0,0.1);
| |
− | }
| |
− | .ch-item:hover .ch-info {
| |
− | -webkit-transform: scale(1);
| |
− | -moz-transform: scale(1);
| |
− | -o-transform: scale(1);
| |
− | -ms-transform: scale(1);
| |
− | transform: scale(1);
| |
− | opacity: 1;
| |
− | }
| |
− |
| |
− | .ch-item:hover .ch-info p {
| |
− | opacity: 1;
| |
− | }
| |
− | #home footer {
| |
− | margin-top: 40px;
| |
− | }
| |
− | </style>
| |
| </head> | | </head> |
| <body> | | <body> |