Difference between revisions of "Team:Exeter/Integrated Practices"

Line 228: Line 228:
 
font-size:150%;
 
font-size:150%;
 
}
 
}
−
/*horizontal rule stying*/
+
.container ul, .container ol{
−
hr{
+
font-size:140%;
−
border-color:#339499;
+
padding-right:40px;
−
margin-left:3%;
+
padding-left:60px;
−
margin-right:3%;
+
padding-top:10px;
 
}
 
}
 
/*Heading styles*/
 
/*Heading styles*/
Line 241: Line 241:
 
     padding-left: 40px;
 
     padding-left: 40px;
 
     padding-right: 40px;
 
     padding-right: 40px;
 +
padding-top: 40px;
 +
padding-bottom:0;
 
}
 
}
 
h1{font-size:340%;}
 
h1{font-size:340%;}
Line 252: Line 254:
 
font-size:200%;
 
font-size:200%;
 
padding-left:40px;
 
padding-left:40px;
 +
padding-top: 20px;
 +
padding-bottom:-10px;
 
}
 
}
−
 
+
/*Italics for Quotes using i tag*/
 
q{
 
q{
 
text-align:center;
 
text-align:center;
Line 261: Line 265:
 
font-size:120%;
 
font-size:120%;
 
font-style: italic;
 
font-style: italic;
−
}
 
−
#afQuote{
 
−
/*Keeping quote styling without italics for names after quotes*/
 
−
text-align: center;
 
−
color: #339499;
 
−
padding-left: 32%;
 
−
padding-right: 10%;
 
−
font-size: 100%;
 
 
}
 
}
 
/*Styling for links*/
 
/*Styling for links*/
Line 283: Line 279:
 
         border-style:none;
 
         border-style:none;
 
}
 
}
−
#Section_link
+
#Section_Link, #Section_Link:visited{
−
color:#828282;
+
display:block;
−
opacity:0.6;
+
margin:0 auto 10px auto;
−
position:absolute;
+
width:14px;
−
bottom:20px;
+
 
}
 
}
−
#Section_link:hover{
+
#Section_Link:hover{
−
color:#4e4e4e;
+
 
−
border-radius:10px;
+
−
border-color:#eeeeee;
+
 
}
 
}
 
#sectionGap, #sectionGap:focus, #contentTitle{
 
#sectionGap, #sectionGap:focus, #contentTitle{
Line 314: Line 307:
 
padding:0;
 
padding:0;
 
}
 
}
−
.div_content{
+
.div_vl{
−
padding:0;
+
padding-top:2%;
−
min-height:100vh;
+
height:35vw;
 +
width:95vw;
 +
display:block;
 +
margin-left:auto;
 +
margin-right:auto;
 +
}
 +
.div_vl.backgroundimage{
 +
background-image: url('https://static.igem.org/mediawiki/2016/9/93/T--Exeter--Home_Background1.png');
 +
background-repeat:no-repeat;
 +
background-size: 100% auto;
 
width:100%;
 
width:100%;
−
background:#eeeeee;
+
height:88vh;
 
}
 
}
 
#title{
 
#title{
Line 327: Line 329:
 
font-size:400%;
 
font-size:400%;
 
}
 
}
−
.link_fix{
+
.div_content{
−
position:relative;
+
padding:0;
−
height:1px;
+
min-height:100vh;
−
top:-15px;
+
width:100%;
 +
background:#eeeeee;
 
}
 
}
−
/*Mobile and small screen css*/
+
 
−
@media (max-width: 767px){
+
/*div_banner contains to links at the top of each page to link to*/
−
#title{
+
/*each section of the page*/
−
font-size:150%;
+
.div_banner{
−
}
+
max-width:90vw;
 +
margin:12vh auto 5vh auto;
 +
display:block;
 +
height:8vh;
 
}
 
}
−
</style>
+
 
−
<!--Style for Home page-->
+
/*Contains styling for the left and right pictures of the banner*/
−
<style type="text/css">
+
.subdiv_banner{
−
/*Contains all three link panels*/
+
height:8vh;
−
.div_l{
+
−
height:16.4vw;
+
−
width:100%;
+
−
background:rgba(238,238,238,0.6);
+
−
}
+
−
/*Div styling*/
+
−
.div_overlay{
+
−
position:absolute;
+
−
top:0;
+
−
left:0;
+
−
min-height:100%;
+
 
padding:0;
 
padding:0;
−
margin:0;
+
margin:auto;
−
font-size:3.4vw;
+
position:relative;
−
color:black;
+
bottom:0;
−
text-align: center;
+
right:0;
−
background:rgba(238,238,238,0.4);
+
−
display:none;
+
 
}
 
}
−
#logo_Banner{
+
.subdiv_banner.left{
 +
float:left;
 
display:block;
 
display:block;
−
margin:2vh auto 6vh auto;
 
−
max-width:100%;
 
 
}
 
}
−
.div_vl{
+
.subdiv_banner.right{
−
padding-top:2%;
+
float:right;
−
height:35vw;
+
−
width:95vw;
+
 
display:block;
 
display:block;
−
margin-left:auto;
 
−
margin-right:auto;
 
 
}
 
}
−
.div_vl.backgroundimage{
+
.subdiv_banner.middle{
−
background-image: url('https://static.igem.org/mediawiki/2016/9/93/T--Exeter--Home_Background1.png');
+
height:100%;
−
background-repeat:no-repeat;
+
}
−
background-size: 100% auto;
+
/*Positions the images in correct place in the divs*/
 +
.subdiv_banner.left img, .subdiv_banner.right img{
 
width:100%;
 
width:100%;
−
height:94vh;
+
position: relative;
 +
top: 38%;
 +
-ms-transform: translateY(-50%) /* IE 9 */
 +
    -webkit-transform: translateY(-50%) /* Chrome, Safari, Opera */
 +
    transform: translateY(-50%);
 
}
 
}
−
.div_m{
+
.banner_link,.banner_link:visited{
−
margin:0;
+
position: relative;
−
padding:0.5vw;
+
height:100%;
−
cursor:pointer;
+
padding:0, 2px!important;
 +
color:#47BCC2;
 +
text-align:center;
 +
font-size:1.5vw;
 +
/*Max font size where "section" and "1" don't appear on*/
 +
}
 +
.banner_link span.oneline{
 +
position: relative;
 +
top: 34.5%;
 +
-ms-transform: translateY(-50%) /* IE 9 */
 +
    -webkit-transform: translateY(-50%) /* Chrome, Safari, Opera */
 +
    transform: translateY(-50%);
 +
}
 +
.banner_link span.twoline{
 +
position: relative;
 +
top: 7.5%;
 +
-ms-transform: translateY(-50%) /* IE 9 */
 +
    -webkit-transform: translateY(-50%) /* Chrome, Safari, Opera */
 +
    transform: translateY(-50%);
 +
}
 +
.banner_link:hover{
 +
text-decoration:none;
 +
color:#339499;
 +
}
 +
.link_fix{
 +
display:block;
 +
position:relative;
 +
height:1px;
 +
top:-15px;
 
}
 
}
 
/*Mobile and small screen css*/
 
/*Mobile and small screen css*/
 
@media (max-width: 767px){
 
@media (max-width: 767px){
 +
.link_fix{
 +
display:none;
 +
}
 
.div_vl.backgroundimage{
 
.div_vl.backgroundimage{
−
height:37vh;
+
background-image: url('#');
 +
background:#ddd;
 +
}
 +
#title{
 +
font-size:150%;
 +
}
 +
/*Makes side pictures on banner invisible on small screens*/
 +
/*as it clutters screen*/
 +
.subdiv_banner.left, .subdiv_banner.right{
 +
display:none;
 
}
 
}
−
.div_l{
 
−
display:none;
 
−
}
 
 
}
 
}
 
</style>
 
</style>

Revision as of 13:30, 5 October 2016