Difference between revisions of "Team:AUC-EGYPT"

Line 1: Line 1:
 
{{IGEM_TopBar}}
 
{{IGEM_TopBar}}
 
{{AUC-EGYPT}}
 
{{AUC-EGYPT}}
 +
 +
<head>
 +
<style>
 +
@import url('https://fonts.googleapis.com/css?family=Amatic+SC&display=swap');
 +
 +
* {
 +
margin: 0;
 +
padding: 0;
 +
}
 +
body {
 +
  /*background-image: linear-gradient(to bottom right, #436B95, #001F46);*/
 +
  background-color: #080727;
 +
}
 +
html {
 +
    height: 100%;
 +
}
 +
body {
 +
    height: 100%;
 +
    margin: 0;
 +
    background-repeat: no-repeat;
 +
    background-attachment: fixed;
 +
}
 +
#gif {
 +
  width: 80%;
 +
}
 +
 +
.page {
 +
margin: 0;
 +
padding:50px;
 +
text-align: center;
 +
 +
}
 +
 +
 +
.title {
 +
margin: 12px;
 +
font-size: 1.5em;
 +
font-family: 'Amatic SC', cursive;
 +
  color: white;
 +
}
 +
 +
.slideshow-container {
 +
/*max-width: 645px;
 +
max-height: 380px;*/
 +
 +
position:relative;
 +
margin: auto;
 +
/*border: 5px solid #001f3f;
 +
box-shadow: 0 0 10px #001f3f;
 +
border-radius: 10px;*/
 +
}
 +
 +
.slide-container {
 +
display: none;
 +
}
 +
 +
.prev, .next {
 +
cursor: pointer;
 +
position: absolute;
 +
  top: 50%;
 +
  width: auto;
 +
  padding: 16px;
 +
  color: white;
 +
  font-weight: bold;
 +
  font-size: 20px;
 +
  transition: 0.6s ease;
 +
  border-radius: 0 3px 3px 0;
 +
  user-select: none;
 +
}
 +
 +
.prev {
 +
  left: 0;
 +
  border-radius: 3px 0 0 3px;
 +
}
 +
 +
.next {
 +
  right: 0;
 +
  border-radius: 3px 0 0 3px;
 +
}
 +
 +
.prev:hover, .next:hover {
 +
  background-color: rgba(0,0,0,0.6);
 +
}
 +
 +
.slide-number {
 +
  color: #f2f2f2;
 +
background-color: rgba(0,0,0,0.6);
 +
  font-size: 12px;
 +
  padding: 8px 12px;
 +
  position: absolute;
 +
top: 0;
 +
}
 +
 +
.slide-img {
 +
width: 100%;
 +
}
 +
 +
.slide-caption {
 +
color: #f2f2f2;
 +
background-color: #001f3f;
 +
opacity: 0.7;
 +
border-radius: 0 15px 15px 0;
 +
  font-size: 15px;
 +
  padding: 8px 12px;
 +
  position: absolute;
 +
  bottom: 8px;
 +
  width: 90%;
 +
text-align: left;
 +
}
 +
 +
.slide-selector {
 +
padding: 10px;
 +
}
 +
</style>
 +
</head>
 
<html>
 
<html>
  
Line 6: Line 121:
 
<div class="page">
 
<div class="page">
 
    
 
    
−
 
+
 
−
  <!-- remove above  if needed -->
+
 
<div class="slideshow-container">
 
<div class="slideshow-container">
  

Revision as of 22:01, 24 October 2020

<head> <style> @import url('https://fonts.googleapis.com/css?family=Amatic+SC&display=swap');

  • {

margin: 0; padding: 0; } body { 

 /*background-image: linear-gradient(to bottom right, #436B95, #001F46);*/
 background-color: #080727;

} html { 

   height: 100%;

} body { 

   height: 100%;
   margin: 0;
   background-repeat: no-repeat;
   background-attachment: fixed;

}

  1. gif {
 width: 80%;

}

.page { margin: 0; padding:50px; text-align: center;

}


.title { margin: 12px; font-size: 1.5em; font-family: 'Amatic SC', cursive; 

 color: white;

}

.slideshow-container { /*max-width: 645px; max-height: 380px;*/

position:relative; margin: auto; /*border: 5px solid #001f3f; box-shadow: 0 0 10px #001f3f; border-radius: 10px;*/ }

.slide-container { display: none; }

.prev, .next { cursor: pointer; position: absolute; 

  top: 50%;
  width: auto;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;

}

.prev { 

 left: 0;
 border-radius: 3px 0 0 3px;

}

.next { 

 right: 0;
 border-radius: 3px 0 0 3px;

}

.prev:hover, .next:hover { 

 background-color: rgba(0,0,0,0.6);

}

.slide-number { 

  color: #f2f2f2;

background-color: rgba(0,0,0,0.6); 

  font-size: 12px;
  padding: 8px 12px;
  position: absolute;

top: 0; }

.slide-img { width: 100%; }

.slide-caption { color: #f2f2f2; background-color: #001f3f; opacity: 0.7; border-radius: 0 15px 15px 0; 

  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 90%;

text-align: left; }

.slide-selector { padding: 10px; } </style> </head>