|
|
| Line 130: |
Line 130: |
| | } | | } |
| | | | |
| − | /* Stylesheet */
| |
| − |
| |
| − | h1, h2, h3, h4, h5, h6, a {
| |
| − | font-family: 'Amiko', sans-serif;
| |
| − | }
| |
| − | p {
| |
| − | font-family: 'Karla', sans-serif; margin-bottom: 0; /*iGEM*/
| |
| − | }
| |
| − | #ua-navbar {
| |
| − | margin-top: 16px; /*iGEM*/
| |
| − | transition: background-color 0.8s, padding 0.8s;
| |
| − | opacity: 0.9;
| |
| − | }
| |
| − | #ua-navbar .dropdown-menu {
| |
| − | background-color: #444;
| |
| − | }
| |
| − | #ua-navbar .dropdown-menu > li > a {
| |
| − | color: #fff;
| |
| − | }
| |
| − | #ua-navbar .dropdown-menu > li > a:hover,
| |
| − | #ua-navbar .dropdown-menu > li > a:focus {
| |
| − | color: #222;
| |
| − | background-color: #fff;
| |
| − | }
| |
| − | #ua-navbar.navbar-default {
| |
| − | background-color: transparent;
| |
| − | border-color: transparent;
| |
| − | }
| |
| − | #ua-navbar .navbar-brand {
| |
| − | padding: 0 15px;
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-brand {
| |
| − | color: transparent;
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-brand:hover,
| |
| − | #ua-navbar.navbar-default .navbar-brand:focus {
| |
| − | color: transparent;
| |
| − | background-color: transparent;
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-nav > li > a {
| |
| − | color: #fff;
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-nav > li > a:after {
| |
| − | content: "";
| |
| − | display: block;
| |
| − | position: absolute;
| |
| − | width: 100%;
| |
| − | height: 2px;
| |
| − | bottom: 0;
| |
| − | left: 0;
| |
| − | background: linear-gradient(to left, #3e5bd9 0%, #56b6e6 50%, #31d4ea 100%);
| |
| − | transform-origin: center;
| |
| − | transform: scaleX(0);
| |
| − | transition: transform .4s ease-out;
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-nav > li > a:hover:after,
| |
| − | #ua-navbar.navbar-default .navbar-nav > li > a:focus:after {
| |
| − | transform: scaleX(1);
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-nav > li > a:hover,
| |
| − | #ua-navbar.navbar-default .navbar-nav > li > a:focus {
| |
| − | color: #fff;
| |
| − | background-color: transparent;
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-toggle {
| |
| − | background-color: #222;
| |
| − | border-color: #fff;
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-toggle:hover,
| |
| − | #ua-navbar.navbar-default .navbar-toggle:focus {
| |
| − | background-color: #444;
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-toggle .icon-bar {
| |
| − | background-color: #fff;
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-collapse,
| |
| − | #ua-navbar.navbar-default .navbar-form {
| |
| − | border-color: #fff;
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-nav > .open > a,
| |
| − | #ua-navbar.navbar-default .navbar-nav > .open > a:hover,
| |
| − | #ua-navbar.navbar-default .navbar-nav > .open > a:focus {
| |
| − | color: #222;
| |
| − | background-color: #fff;
| |
| − | }
| |
| − | @media (max-width: 767px) {
| |
| − | #ua-navbar.navbar-default .navbar-nav .open .dropdown-menu > li > a {
| |
| − | color: #fff;
| |
| − | background-color: #444;
| |
| − | }
| |
| − | #ua-navbar.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
| |
| − | #ua-navbar.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
| |
| − | color: #222;
| |
| − | background-color: #fff;
| |
| − | }
| |
| − | }
| |
| − | #ua-navbar .navbar-right {
| |
| − | font-size: 16px;
| |
| − | }
| |
| − | #ua-navbar.active {
| |
| − | background-color: #222222;
| |
| − | padding: 10px;
| |
| − | }
| |
| − | #ua-navbar:hover,
| |
| − | #ua-navbar:focus {
| |
| − | background-color: #222222;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | #ua-background {
| |
| − | margin-top: -18px; /*iGEM*/
| |
| − | }
| |
| − | #ua-background.carousel-fade .carousel-inner > .item {
| |
| − | opacity: 0;
| |
| − | transition-property: opacity;
| |
| − | }
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.active {
| |
| − | opacity: 1;
| |
| − | }
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.active.left,
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.active.right {
| |
| − | opacity: 0;
| |
| − | }
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.next.left,
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.prev.right {
| |
| − | opacity: 1;
| |
| − | }
| |
| − | @media all and (transform-3d), (-webkit-transform-3d) {
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.next,
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.active.right {
| |
| − | opacity: 0;
| |
| − | -webkit-transform: translate3d(0, 0, 0);
| |
| − | transform: translate3d(0, 0, 0);
| |
| − | }
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.prev,
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.active.left {
| |
| − | opacity: 0;
| |
| − | -webkit-transform: translate3d(0, 0, 0);
| |
| − | transform: translate3d(0, 0, 0);
| |
| − | }
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.next.left,
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.prev.right,
| |
| − | #ua-background.carousel-fade .carousel-inner > .item.active {
| |
| − | opacity: 1;
| |
| − | -webkit-transform: translate3d(0, 0, 0);
| |
| − | transform: translate3d(0, 0, 0);
| |
| − | }
| |
| − | }
| |
| − | #ua-background .item {
| |
| − | background: no-repeat center center fixed;
| |
| − | -webkit-background-size: cover;
| |
| − | -moz-background-size: cover;
| |
| − | -o-background-size: cover;
| |
| − | background-size: cover;
| |
| − | }
| |
| − | #ua-background .item:nth-child(1) {
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/b/b4/T--UAlberta--Home-Slider-1.jpg");
| |
| − | }
| |
| − | #ua-background .item:nth-child(2) {
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/5/5b/T--UAlberta--Home-Slider-2.jpg");
| |
| − | background-position: top;
| |
| − | }
| |
| − | #ua-background .item:nth-child(3) {
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/d/d8/T--UAlberta--TEM.png");
| |
| − | }
| |
| − | #ua-background.carousel .item {
| |
| − | position: fixed;
| |
| − | z-index: -1;
| |
| − | width: 100%; /*iGEM*/
| |
| − | height: 100%; /*iGEM*/
| |
| − | }
| |
| − | #ua-home .overlay {
| |
| − | background: -webkit-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: -moz-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: -o-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background-attachment: fixed;
| |
| − | width: 100%; /*iGEM*/
| |
| − | height: 100vh; /*iGEM*/
| |
| − | }
| |
| − | #ua-home .container-fluid {
| |
| − | padding-left: 0;
| |
| − | padding-right: 0;
| |
| − | width: inherit;
| |
| − | height: inherit;
| |
| − | }
| |
| − | #ua-home .row {
| |
| − | margin-left: 0;
| |
| − | margin-right: 0;
| |
| − | width: inherit;
| |
| − | height: inherit;
| |
| − | }
| |
| − | #ua-home .row > div {
| |
| − | height: inherit;
| |
| − | }
| |
| − | #ua-home .carousel-control {
| |
| − | width: 50%;
| |
| − | }
| |
| − | #ua-home .carousel-indicators {
| |
| − | opacity: 0.5;
| |
| − | margin-left: -30%; /*iGEM*/
| |
| − | }
| |
| − | #ua-home #ua-header {
| |
| − | position: absolute;
| |
| − | top: 50%;
| |
| − | left: 50%;
| |
| − | transform: translate(-50%, -50%);
| |
| − | }
| |
| − | #ua-home #ua-header h1 {
| |
| − | font-weight: 700;
| |
| − | font-size: 48px;
| |
| − | color: #fff;
| |
| − | }
| |
| − | #ua-home #ua-header h1 strong {
| |
| − | color: #56b6e6;
| |
| − | }
| |
| − | #ua-home #ua-header p {
| |
| − | color: #fff;
| |
| − | font-size: 18px;
| |
| − | margin-bottom: 40px;
| |
| − | text-align: center;
| |
| − | }
| |
| − | #ua-home a:visited {
| |
| − | color:#fff; /*iGEM*/
| |
| − | }
| |
| − | #ua-home .fa.fa-angle-down {
| |
| − | position: absolute;
| |
| − | bottom: 80px;
| |
| − | margin-top: 200px;
| |
| − | margin-left: -25px;
| |
| − | font-size: 24px;
| |
| − | padding: 10px 15px;
| |
| − | color: #fff;
| |
| − | border: 2px solid #b4b4b4;
| |
| − | border-radius: 50%;
| |
| − | }
| |
| − | #ua-home .fa.fa-angle-down:hover {
| |
| − | background-color: #007bb8;
| |
| − | text-decoration: none;
| |
| − | }
| |
| − | #ua-home .fa.fa-angle-down:focus {
| |
| − | background-color: transparent;
| |
| − | text-decoration: none;
| |
| − | }
| |
| − | #ua-home-abstract {
| |
| − | background-color: #fff;
| |
| − | }
| |
| − | #ua-home-abstract .container {
| |
| − | padding-top: 70px;
| |
| − | padding-bottom: 50px;
| |
| − | }
| |
| − | #ua-home-abstract h2 {
| |
| − | text-transform: uppercase;
| |
| − | color: #007bb8;
| |
| − | font-size: 48px;
| |
| − | margin-bottom: 50px;
| |
| − | }
| |
| − | #ua-home-abstract p {
| |
| − | font-size: 18px;
| |
| − | font-family: 'Roboto', sans-serif;
| |
| − | margin-bottom: 80px;
| |
| − | text-align: justify;
| |
| − | }
| |
| − | #ua-home-abstract span {
| |
| − | color: #007bb8;
| |
| − | }
| |
| − | #ua-home-project {
| |
| − | background: url("https://static.igem.org/mediawiki/2017/7/7a/T--UAlberta--Home-002.png") no-repeat center center fixed;
| |
| − | -webkit-background-size: cover;
| |
| − | -moz-background-size: cover;
| |
| − | -o-background-size: cover;
| |
| − | background-size: cover;
| |
| − | color: #fff;
| |
| − | }
| |
| − | #ua-home-project .overlay {
| |
| − | background: -webkit-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: -moz-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: -o-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background-attachment: fixed;
| |
| − | height: auto;
| |
| − | padding: 125px 0;
| |
| − | }
| |
| − | #ua-home-project h2 {
| |
| − | text-transform: uppercase;
| |
| − | font-size: 48px;
| |
| − | margin-bottom: 50px;
| |
| − | }
| |
| − | #ua-carousel-project .item {
| |
| − | margin: 10px 15px;
| |
| − | border-radius: 16px;
| |
| − | background-color: #007bb8;
| |
| − | transition: transform 0.3s ease-in-out
| |
| − | }
| |
| − | #ua-carousel-project .item a {
| |
| − | display: block;
| |
| − | padding: 20px 0;
| |
| − | font-size: 32px;
| |
| − | color: #fff;
| |
| − | }
| |
| − | #ua-carousel-project .item span {
| |
| − | margin-right: 20px;
| |
| − | }
| |
| − | #ua-carousel-project .item a:hover,
| |
| − | #ua-carousel-project .item a:focus {
| |
| − | text-decoration: none;
| |
| − | }
| |
| − | #ua-carousel-project .item:hover {
| |
| − | transform: scale(1.1);
| |
| − | }
| |
| − | #ua-home-info {
| |
| − | background-color: #fff;
| |
| − | }
| |
| − | #ua-home-info .container {
| |
| − | padding-top: 70px;
| |
| − | padding-bottom: 50px;
| |
| − | }
| |
| − | #ua-home-info .information-tabs {
| |
| − | height: 300px;
| |
| − | width: auto;
| |
| − | position: relative;
| |
| − | }
| |
| − | #ua-home-info .info-tab {
| |
| − | transition: opacity 0.5s ease-in-out;
| |
| − | opacity: 0;
| |
| − | }
| |
| − | #ua-home-info .info-tab h2 {
| |
| − | position: absolute;
| |
| − | left: 50%;
| |
| − | transform: translate(-50%, 0);
| |
| − | color: #007bb8;
| |
| − | font-size: 48px;
| |
| − | text-transform: uppercase;
| |
| − | margin-bottom: 50px;
| |
| − | }
| |
| − | #ua-home-info .info-tab p {
| |
| − | position: absolute;
| |
| − | left: 0;
| |
| − | top: 80px;
| |
| − | padding: 40px;
| |
| − | font-size: 18px;
| |
| − | }
| |
| − | #ua-home-info .info-tab.active {
| |
| − | transition: opacity 0.5s ease-in-out 0.3s;
| |
| − | opacity: 1;
| |
| − | }
| |
| − | #ua-home-info a {
| |
| − | background-color: #007bb8;
| |
| − | border-color: #007bb8;
| |
| − | color: #fff;
| |
| − | font-size: 18px;
| |
| − | padding: 16px;
| |
| − | border-radius: 16px;
| |
| − | }
| |
| − | #ua-home-aesthetic {
| |
| − | background: url("https://static.igem.org/mediawiki/2017/7/7a/T--UAlberta--Home-002.png") no-repeat center center fixed;
| |
| − | -webkit-background-size: cover;
| |
| − | -moz-background-size: cover;
| |
| − | -o-background-size: cover;
| |
| − | background-size: cover;
| |
| − | color: #fff;
| |
| − | }
| |
| − | #ua-home-aesthetic .overlay {
| |
| − | background: -webkit-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: -moz-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: -o-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background-attachment: fixed;
| |
| − | height: 500px;
| |
| − | padding: 200px 0;
| |
| − | }
| |
| − | #ua-home-aesthetic h2 {
| |
| − | font-size: 48px;
| |
| − | text-transform: uppercase;
| |
| − | margin-bottom: 50px;
| |
| − | }
| |
| − | /* #ua-home-links {
| |
| − | background-color: #fff;
| |
| − | }
| |
| − | #ua-home-links .container {
| |
| − | padding-top: 70px;
| |
| − | padding-bottom: 50px;
| |
| − | }
| |
| − | #ua-home-links h2 {
| |
| − | text-transform: uppercase;
| |
| − | color: #007bb8;
| |
| − | font-size: 40px;
| |
| − | margin-bottom: 50px;
| |
| − | } */
| |
| − | .background {
| |
| − | background: no-repeat center top fixed;
| |
| − | -webkit-background-size: cover;
| |
| − | -moz-background-size: cover;
| |
| − | -o-background-size: cover;
| |
| − | background-size: cover;
| |
| − | }
| |
| − | .background .overlay {
| |
| − | background: -webkit-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: -moz-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: -o-linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background: linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.2) 60%,rgba(0,0,0,0.1) 100%);
| |
| − | background-attachment: fixed;
| |
| − | width: 100%;
| |
| − | height: 90vh; /*iGEM*/
| |
| − | position: relative;
| |
| − | }
| |
| − | .panel-heading {
| |
| − | border: unset;
| |
| − | border-radius: 8px;
| |
| − | }
| |
| − | .panel-default {
| |
| − | border-color: transparent;
| |
| − | }
| |
| − | .panel-default>.panel-heading {
| |
| − | color: #fff;
| |
| − | background-color: #56b6e6;
| |
| − | }
| |
| − | .panel-title a {
| |
| − | font-size: 24px;
| |
| − | }
| |
| | </style> | | </style> |
| | </html> | | </html> |
