Difference between revisions of "Template:Main2017"

 
(7 intermediate revisions by the same user not shown)
Line 376: Line 376:
 
background-color:white;  
 
background-color:white;  
 
}
 
}
 +
 +
 +
 +
/* subwrapper to center content */
 +
.igem_column_wrapper {
 +
margin:auto;
 +
max-width: 1400px;
 +
width:90%;
 +
}
 +
 +
  
 
/* class for when the menu is not shown and the content occupies the whole screen */
 
/* class for when the menu is not shown and the content occupies the whole screen */
Line 390: Line 401:
  
  
−
 
+
/*main layout class */
−
.full_size {
+
.column  {  
−
width:100%;  
+
float:left;
 +
margin: 1% 2%;
 +
padding: 0px;
 
}
 
}
  
−
.full_size img {  
+
/* 100% */
−
padding: 10px 15px;
+
.full_size { width:96%; }
−
width:97.5%;  
+
/* 66% */
−
}
+
.two_thirds_size { width: 62.6%; }
 +
/* 33% */
 +
.third_size { width: 29.3%; }
 +
/* 75% */
 +
.three_quarter_size {  width: 71%; }
 +
/* 50% */
 +
.half_size {  width: 46%; }
 +
/* 25% */
 +
.fourth_size { width: 21%; }
  
−
.half_size {
+
/*styling for all images*/
−
width: 50%;
+
.full_size img,
−
}
+
.half_size img,
−
 
+
.two_thirds_size img,
−
.half_size img {
+
.third_size img, 
−
padding: 10px 15px;
+
.three_quarters_size img,
−
width: 93%;
+
−
}
+
−
 
+
−
 
+
−
.third_size {
+
−
width: 33.3%;
+
−
}
+
−
.third_size img {
+
−
padding: 10px 15px;
+
−
width: 92%;
+
−
}
+
−
 
+
−
 
+
−
 
+
−
.fourth_size {
+
−
width: 25%;
+
−
}
+
 
.fourth_size img {  
 
.fourth_size img {  
−
padding: 10px 15px;
+
margin-bottom: 15px;
−
width: 92%;  
+
width: 100%;  
 
}
 
}
−
 
−
 
  
  
Line 846: Line 848:
  
  
−
.full_size_image { margin-top:-55px; width:85%; }  
+
.full_size_image { margin-top:-55px; width: calc(100% - 270px); }  
  
  
Line 853: Line 855:
  
 
/********************************* RESPONSIVE STYLING ********************************/
 
/********************************* RESPONSIVE STYLING ********************************/
 +
 +
 +
/* 1784px  */
 +
/************************************************/
 +
@media only screen and (max-width: 1784px) {
 +
.igem_content_wrapper { width:85%;}
 +
.full_size_image {  width:85%;}
 +
 +
 +
}
 +
 +
 +
  
 
/* IF THE SCREEN IS LESS THAN 1400PX */
 
/* IF THE SCREEN IS LESS THAN 1400PX */
Line 858: Line 873:
 
.long_menu_name { font-size: 10px;}
 
.long_menu_name { font-size: 10px;}
 
}
 
}
 +
 +
 +
 +
 +
 +
  
  
Line 955: Line 976:
 
<div class="igem_content_wrapper">
 
<div class="igem_content_wrapper">
  
 +
<div class=" igem_column_wrapper">
  
 
</html>
 
</html>

Latest revision as of 19:03, 5 September 2018

MENU
Loading...