|
|
Line 1: |
Line 1: |
| | | |
| + | {{KU_Leuven}} |
| <html> | | <html> |
| <style type="text/css"> | | <style type="text/css"> |
− | body {
| + | |
− | background: #000;
| + | h4 { |
− | overflow: hidden;
| + | margin-bottom: 10px; |
− | } | + | } |
| + | .background{ |
| + | background:url(https://static.igem.org/mediawiki/2017/c/cb/KU_Leuven_Homepage2.png); |
| + | position: initial; |
| + | background-size: 100%; |
| + | padding: 0 10px 0 10px; |
| + | } |
| | | |
− | #showcase { | + | #grad { |
− | display: flex;
| + | background: -webkit-linear-gradient(#C17952,#ffd4a6,#edf2f4); /* Safari 5.1-6.0 */ |
− | justify-content: center;
| + | background: -o-linear-gradient(#C17952,#ffd4a6,#edf2f4); /* Opera 11.1-12.0 */ |
− | align-items: center;
| + | background: -moz-linear-gradient(#C17952,#ffd4a6,#edf2f4); /* Firefox 3.6-15 */ |
− | margin: 0 auto;
| + | background: linear-gradient(#C17952,#ffd4a6,#edf2f4); /* Standard syntax */ |
− | width: 1000px;
| + | } |
− | height: 700px;
| + | p.head::first-letter { |
− | } | + | color: #cc3333; |
| + | font-size: 40px; |
| + | } |
| + | |
| + | p { |
| + | text-align:justify; |
| + | font-size: 20px; |
| + | } |
| + | </style> |
| + | |
| + | <div id="grad"> |
| + | |
| + | <br> |
| + | |
| + | <div class="background"> |
| + | <h1 style="text-align:center; padding: 30px; font-size:50px; color: white;">Entrepreneurship</h1> |
| + | <p class="head" style="text-align:center;color: white; padding: 10px 10px 60px 10px; font-size:15px;">.... </p> |
| + | |
| + | </div> |
| + | <br> |
| + | <div class="container"> |
| + | |
| + | <p class="head" style="text-align:justify; padding: 0px 50px 0px 50px;"> |
| + | Booo!</p> |
| | | |
− | section {
| + | </div> |
− | display: inline-block;
| + | |
− | position: relative;
| + | |
− | width: 25%;
| + | |
− | height: 100%;
| + | |
− | background-size: cover;
| + | |
− | }
| + | |
− | section:after {
| + | |
− | content: '';
| + | |
− | position: absolute;
| + | |
− | top: 0;
| + | |
− | width: 100%;
| + | |
− | height: 100%;
| + | |
− | -moz-transition: all 0.5s;
| + | |
− | -o-transition: all 0.5s;
| + | |
− | -webkit-transition: all 0.5s;
| + | |
− | transition: all 0.5s;
| + | |
− | }
| + | |
| | | |
− | section:nth-child(1) {
| |
− | -moz-animation: section-1 8s both infinite;
| |
− | -webkit-animation: section-1 8s both infinite;
| |
− | animation: section-1 8s both infinite;
| |
− | }
| |
| | | |
− | @-moz-keyframes section-1 {
| |
− | 0%, 20%, 100% {
| |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(23% 18%, 95% 13%, 100% 91%, 55% 87%);
| |
− | }
| |
− | 25%, 45% {
| |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(95% 10%, 100% 80%, 62% 77%, 45% 12%);
| |
− | }
| |
− | 50%, 70% {
| |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(100% 67%, 48% 63%, 28% 9%, 95% 3%);
| |
− | }
| |
− | 75%, 95% {
| |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(78% 72%, 58% 34%, 95% 27%, 100% 73%);
| |
− | }
| |
− | }
| |
− | @-webkit-keyframes section-1 {
| |
− | 0%, 20%, 100% {
| |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(23% 18%, 95% 13%, 100% 91%, 55% 87%);
| |
− | }
| |
− | 25%, 45% {
| |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(95% 10%, 100% 80%, 62% 77%, 45% 12%);
| |
− | }
| |
− | 50%, 70% {
| |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(100% 67%, 48% 63%, 28% 9%, 95% 3%);
| |
− | }
| |
− | 75%, 95% {
| |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(78% 72%, 58% 34%, 95% 27%, 100% 73%);
| |
− | }
| |
− | }
| |
− | @keyframes section-1 {
| |
− | 0%, 20%, 100% {
| |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(23% 18%, 95% 13%, 100% 91%, 55% 87%);
| |
− | }
| |
− | 25%, 45% {
| |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(95% 10%, 100% 80%, 62% 77%, 45% 12%);
| |
− | }
| |
− | 50%, 70% {
| |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(100% 67%, 48% 63%, 28% 9%, 95% 3%);
| |
− | }
| |
− | 75%, 95% {
| |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 0% 0%;
| |
− | -webkit-clip-path: polygon(78% 72%, 58% 34%, 95% 27%, 100% 73%);
| |
− | }
| |
− | }
| |
− | section:nth-child(2) {
| |
− | -moz-animation: section-2 8s both infinite;
| |
− | -webkit-animation: section-2 8s both infinite;
| |
− | animation: section-2 8s both infinite;
| |
− | }
| |
| | | |
− | @-moz-keyframes section-2 {
| + | |
− | 0%, 20%, 100% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(0% 7%, 100% 9%, 95% 93%, 5% 95%);
| + | |
− | }
| + | |
− | 25%, 45% {
| + | |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(100% 3%, 95% 95%, 5% 90%, 0% 5%);
| + | |
− | }
| + | |
− | 50%, 70% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(95% 83%, 5% 78%, 0% 6%, 100% 11%);
| + | |
− | }
| + | |
− | 75%, 95% {
| + | |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(5% 79%, 0% 21%, 100% 16%, 95% 83%);
| + | |
− | }
| + | |
− | }
| + | |
− | @-webkit-keyframes section-2 {
| + | |
− | 0%, 20%, 100% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(0% 7%, 100% 9%, 95% 93%, 5% 95%);
| + | |
− | }
| + | |
− | 25%, 45% {
| + | |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(100% 3%, 95% 95%, 5% 90%, 0% 5%);
| + | |
− | }
| + | |
− | 50%, 70% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(95% 83%, 5% 78%, 0% 6%, 100% 11%);
| + | |
− | }
| + | |
− | 75%, 95% {
| + | |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(5% 79%, 0% 21%, 100% 16%, 95% 83%);
| + | |
− | }
| + | |
− | }
| + | |
− | @keyframes section-2 {
| + | |
− | 0%, 20%, 100% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(0% 7%, 100% 9%, 95% 93%, 5% 95%);
| + | |
− | }
| + | |
− | 25%, 45% {
| + | |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(100% 3%, 95% 95%, 5% 90%, 0% 5%);
| + | |
− | }
| + | |
− | 50%, 70% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(95% 83%, 5% 78%, 0% 6%, 100% 11%);
| + | |
− | }
| + | |
− | 75%, 95% {
| + | |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 33.33333% 0%;
| + | |
− | -webkit-clip-path: polygon(5% 79%, 0% 21%, 100% 16%, 95% 83%);
| + | |
− | }
| + | |
− | }
| + | |
− | section:nth-child(3) {
| + | |
− | -moz-animation: section-3 8s both infinite;
| + | |
− | -webkit-animation: section-3 8s both infinite;
| + | |
− | animation: section-3 8s both infinite;
| + | |
− | }
| + | |
− | | + | |
− | @-moz-keyframes section-3 {
| + | |
− | 0%, 20%, 100% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(5% 11%, 100% 14%, 95% 88%, 0% 91%);
| + | |
− | }
| + | |
− | 25%, 45% {
| + | |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(100% 14%, 95% 84%, 0% 91%, 5% 7%);
| + | |
− | }
| + | |
− | 50%, 70% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(95% 79%, 0% 86%, 5% 7%, 100% 3%);
| + | |
− | }
| + | |
− | 75%, 95% {
| + | |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(0% 85%, 5% 14%, 100% 3%, 95% 95%);
| + | |
− | }
| + | |
− | }
| + | |
− | @-webkit-keyframes section-3 {
| + | |
− | 0%, 20%, 100% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(5% 11%, 100% 14%, 95% 88%, 0% 91%);
| + | |
− | }
| + | |
− | 25%, 45% {
| + | |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(100% 14%, 95% 84%, 0% 91%, 5% 7%);
| + | |
− | }
| + | |
− | 50%, 70% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(95% 79%, 0% 86%, 5% 7%, 100% 3%);
| + | |
− | }
| + | |
− | 75%, 95% {
| + | |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(0% 85%, 5% 14%, 100% 3%, 95% 95%);
| + | |
− | }
| + | |
− | }
| + | |
− | @keyframes section-3 {
| + | |
− | 0%, 20%, 100% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(5% 11%, 100% 14%, 95% 88%, 0% 91%);
| + | |
− | }
| + | |
− | 25%, 45% {
| + | |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(100% 14%, 95% 84%, 0% 91%, 5% 7%);
| + | |
− | }
| + | |
− | 50%, 70% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(95% 79%, 0% 86%, 5% 7%, 100% 3%);
| + | |
− | }
| + | |
− | 75%, 95% {
| + | |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 66.66666% 0%;
| + | |
− | -webkit-clip-path: polygon(0% 85%, 5% 14%, 100% 3%, 95% 95%);
| + | |
− | }
| + | |
− | }
| + | |
− | section:nth-child(4) {
| + | |
− | -moz-animation: section-4 8s both infinite;
| + | |
− | -webkit-animation: section-4 8s both infinite;
| + | |
− | animation: section-4 8s both infinite;
| + | |
− | }
| + | |
− | | + | |
− | @-moz-keyframes section-4 {
| + | |
− | 0%, 20%, 100% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(5% 18%, 89% 21%, 62% 73%, 0% 83%);
| + | |
− | }
| + | |
− | 25%, 45% {
| + | |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(57% 31%, 45% 67%, 0% 77%, 5% 18%);
| + | |
− | }
| + | |
− | 50%, 70% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(45% 57%, 0% 67%, 5% 8%, 72% 12%);
| + | |
− | }
| + | |
− | 75%, 95% {
| + | |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(0% 77%, 5% 18%, 47% 21%, 32% 67%);
| + | |
− | }
| + | |
− | }
| + | |
− | @-webkit-keyframes section-4 {
| + | |
− | 0%, 20%, 100% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(5% 18%, 89% 21%, 62% 73%, 0% 83%);
| + | |
− | }
| + | |
− | 25%, 45% {
| + | |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(57% 31%, 45% 67%, 0% 77%, 5% 18%);
| + | |
− | }
| + | |
− | 50%, 70% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(45% 57%, 0% 67%, 5% 8%, 72% 12%);
| + | |
− | }
| + | |
− | 75%, 95% {
| + | |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(0% 77%, 5% 18%, 47% 21%, 32% 67%);
| + | |
− | }
| + | |
− | }
| + | |
− | @keyframes section-4 {
| + | |
− | 0%, 20%, 100% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1414924347000-9823c338079b?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(5% 18%, 89% 21%, 62% 73%, 0% 83%);
| + | |
− | }
| + | |
− | 25%, 45% {
| + | |
− | background: url("https://unsplash.imgix.net/30/skater.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(57% 31%, 45% 67%, 0% 77%, 5% 18%);
| + | |
− | }
| + | |
− | 50%, 70% {
| + | |
− | background: url("https://unsplash.imgix.net/photo-1415226581130-91cb7f52f078?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(45% 57%, 0% 67%, 5% 8%, 72% 12%);
| + | |
− | }
| + | |
− | 75%, 95% {
| + | |
− | background: url("https://ununsplash.imgix.net/40/lUUnN7VGSoWZ3noefeH7_Baker%20Beach-12.jpg?fit=crop&fm=jpg&h=700&q=75&w=1050") 99.99999% 0%;
| + | |
− | -webkit-clip-path: polygon(0% 77%, 5% 18%, 47% 21%, 32% 67%);
| + | |
− | }
| + | |
− | }
| + | |
− | @media (max-width: 1000px) {
| + | |
− | #showcase {
| + | |
− | position: absolute;
| + | |
− | top: -115px;
| + | |
− | left: -200px;
| + | |
− | margin: 0;
| + | |
− | -moz-transform: scale(0.65, 0.65);
| + | |
− | -ms-transform: scale(0.65, 0.65);
| + | |
− | -webkit-transform: scale(0.65, 0.65);
| + | |
− | transform: scale(0.65, 0.65);
| + | |
− | }
| + | |
− | }
| + | |
− | </style>
| + | |
− | <figure id="showcase">
| + | |
− | <section></section>
| + | |
− | <section></section>
| + | |
− | <section></section>
| + | |
− | <section></section>
| + | |
− | </figure>
| + | |
| </html> | | </html> |
| {{KU_Leuven_footer}} | | {{KU_Leuven_footer}} |