Difference between revisions of "Template:Wageningen UR/OverviewCSS"

 
(52 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
 
<style>
 
<style>
 +
 +
p { 
 +
  text-align:left!important;
 +
}
 +
 +
.Overview {
 +
    display:table;
 +
}
  
 
.Overview-Top {
 
.Overview-Top {
−
width:100%;
+
    text-align:center !important;
−
margin-top:2rem;
+
    width:100%;
−
     margin-bottom:2rem;
+
    margin-top:0rem;
 +
     margin-bottom:2rem;
 +
    padding-left:2rem;
 +
    padding-right:2rem;
 
}
 
}
 +
  
 
.Overview-Left-Arrow {
 
.Overview-Left-Arrow {
−
     width:10%;
+
    padding-top:1.75rem;
−
float:left;
+
     width:15%;
−
margin:0;
+
    float:left;
 +
    margin:0;
 +
    padding-top:2.5rem;
 +
    padding-left:1rem;
 +
}
  
 +
.Overview-Left-Arrow a {
 +
    position:relative;
 +
    width:100%;
 +
    height:100%;
 +
    display:block;
 
}
 
}
  
 
.Overview-Left-Arrow img {
 
.Overview-Left-Arrow img {
 
     width:100%;
 
     width:100%;
 +
    margin:0;   
 
}
 
}
 +
 +
.Overview-Left-Arrow a img:hover {
 +
    background-color:#66bc47;
 +
}
 +
  
 
.Overview-Center {
 
.Overview-Center {
−
width:80%;
+
width:70%;
 
float:left;
 
float:left;
 
margin:0;
 
margin:0;
 
}
 
}
 +
 +
Overview-Center h1 {
 +
    margin-top:0rem;
 +
    }
 +
 +
  
 
.Overview-Right-Arrow {
 
.Overview-Right-Arrow {
−
     width:10%;
+
    padding-top:1.75rem;
−
float:right;
+
     width:15%;
−
margin:0;
+
    float:right;
 +
    margin:0;
 +
    padding-top:2.5rem;
 +
    padding-left:1rem;
 +
}
  
 +
.Overview-Right-Arrow a {
 +
    position:relative;
 +
    width:100%;
 +
    height:100%;
 +
    display:block;
 
}
 
}
  
Line 35: Line 77:
 
.Overview-Right-Arrow img {
 
.Overview-Right-Arrow img {
 
     width:100%;
 
     width:100%;
 +
    margin:0rem;
 +
}
 +
 +
.Overview-Right-Arrow a img:hover {
 +
    background-color:#66bc47;
 +
}
 +
 +
.Overviewbox-Left {
 +
    width:50%;
 +
margin-top: 4px;
 +
margin-bottom: 4px;
 +
font-size: 1.0rem;
 +
    float: left;   
 +
}
 +
 +
.Overviewbox-Right {
 +
    width:50%;
 +
margin-top: 4px;
 +
margin-bottom: 4px;
 +
font-size: 1.0rem;
 +
    float: right; 
 +
 +
}
 +
 +
.Overviewbox {
 +
    width:100%;
 +
margin: 0 auto;
 +
    text-align: center;
 +
    padding:2%;
 +
}
 +
 +
.overview-figure {
 +
    width:100%;
 +
    margin:auto;
 +
}
 +
 +
.Overviewbox:hover {
 +
    -moz-transform: scale(1.05);
 +
    -webkit-transform: scale(1.05);
 +
    -o-transform: scale(1.05);
 +
    transform: scale(1.05); 
 +
}
 +
 +
 +
 +
 +
/*Mobile devices*/   
 +
    @media screen and (max-width: 860px) {
 +
    .Overview-Top {
 +
      margin-top:0;
 +
      margin-bottom:0;
 +
      padding-left:0;
 +
      padding-right:0;
 +
  }
 +
 +
  .Overview-Desc h1 {
 +
      font-size:20px;
 +
  }
 +
 
 +
  .Overview-Left-Arrow img {
 +
      padding-left:4px;
 +
  }   
 +
 +
 +
  .Overview-Right-Arrow img {
 +
      padding-right:4px;
 +
  }
 +
 
}
 
}
  
 
</style>
 
</style>
−
</htmk>
+
</html>

Latest revision as of 16:34, 1 November 2017