Difference between revisions of "Team:Pasteur Paris/Project"

(Undo revision 101580 by ThomasStarck (talk))
Line 1: Line 1:
 +
{{Pasteur_Paris/MenuBlockProject}}
 +
{{Pasteur_Paris/Content}}
 
<html>
 
<html>
−
    <style>      
+
<div id="GeneralContent">
−
            /* BEGIN : Block Settings */
+
<div id="MainContent">
−
                #GeneralContent {
+
<a href="">
−
                    position:relative;
+
<div class="block half onglet">
−
                    width: 100%;
+
<div class="imgOnglet">
−
                    background-color: #fffafc;
+
<img src="http://selection.readersdigest.ca/wp-content/uploads/2016/03/dites-je-t-aime-avec-fleurs.jpg">
−
                }
+
</div>
−
                #MainContent {
+
<div class= "textOnglet">
−
                    max-width: 1100px;
+
<h1>DescriptionW</h1>
−
                    margin: auto;
+
</div>
−
                    padding-top: 10%;
+
</div>
−
                    padding-bottom: 10%;
+
</a>
−
                    text-align: center;
+
<a href="">
−
                }
+
<div class="block half onglet">
−
                footer {
+
<div class="imgOnglet">
−
                    background-color: #303E91;
+
<img src="http://selection.readersdigest.ca/wp-content/uploads/2016/03/dites-je-t-aime-avec-fleurs.jpg">
−
                    height: 70px;
+
</div>
−
                    width: 100%;
+
<div class= "textOnglet">
−
                    bottom: 0%;
+
<h1>Infection</h1>
−
                    left: 0%;
+
</div>
−
                }
+
</div>
−
                .block {
+
<a href="">
−
                    display: inline-block;
+
</a>
−
                    vertical-align: middle;
+
<div class="block half onglet">
−
                    margin: auto;
+
<div class="imgOnglet">
−
                    margin-top: 2%;
+
<img src="http://selection.readersdigest.ca/wp-content/uploads/2016/03/dites-je-t-aime-avec-fleurs.jpg">
−
                    margin-bottom: 2%;
+
</div>
−
                    margin-left: 1%;
+
<div class= "textOnglet">
−
                    margin-right: 1%;
+
<h1>Conductivity</h1>
−
                }
+
</div>
−
                .block.title {
+
</div>
−
                    width: 94%;
+
<a href="">
−
                    margin-bottom: 10%;
+
<div class="block half onglet">
−
                }
+
<div class="banner">
−
                .block.two-third {
+
</div>
−
                    width: 60%;
+
<div class= "textOnglet">
−
                }
+
<h1>Design</h1>
−
                .block.two-third.center {
+
</div>
−
                    width: 60%;
+
</div>
−
                }
+
</a>
−
                .block.one-third {
+
</div>
−
                    width: 30%;
+
</div>
−
                }
+
−
                .block.full {
+
−
                    width: 90%;
+
−
                }
+
−
                .block.half {
+
−
                    width: 45%;
+
−
                }
+
−
                .block.separator {
+
−
                    height: 1px;
+
−
                    width: 90%;
+
−
                    margin-top: 3%;
+
−
                    margin-bottom: 3%;
+
−
                }
+
−
                .block.separator-invisible {
+
−
                    height: 1px;
+
−
                    width: 90%;
+
−
                }
+
−
                .block.separator-mark {
+
−
                    height: 2px;
+
−
                    width: 70%;
+
−
                    margin-top: 15%;
+
−
                    margin-bottom: 20%;
+
−
                    background-color: black;
+
−
                    opacity: 0.3;
+
−
                }
+
−
                .onglet{
+
−
                    position: relative;
+
−
                    border-radius: 20px;
+
−
                    background-color: red;
+
−
                    width: 43%;
+
−
                    box-shadow: 5px 5px 30px grey;
+
−
                    background-color: #fffafc;
+
−
                }
+
−
                .onglet:hover{
+
−
                    opacity: .8;
+
−
                    transform: scale(1.05,1.05);
+
−
                }
+
−
                .onglet img{
+
−
                    border-top-left-radius: 20px;
+
−
                    border-top-right-radius: 20px;
+
−
                    height: 300px;
+
−
                    width: 100%;
+
−
                }
+
−
                .textOnglet{
+
−
                    height: 50px;
+
−
                }
+
−
                .imgOnglet{
+
−
                    width: 100%
+
−
                    padding-top: 30%;
+
−
                }
+
−
                .legend p {
+
−
                    text-indent: 0px;
+
−
                    font-size: 0.8em;
+
−
                }
+
−
                p {
+
−
                    text-align: justify;
+
−
                    text-indent: 30px;
+
−
                }
+
−
                img {
+
−
                    width: 100%;
+
−
                }
+
−
                a img:hover {
+
−
                    opacity: 0.4;
+
−
                }
+
−
                @media only screen and (max-width: 950px) {
+
−
                    .block.two-third, .block.one-third, .block.half {width: 44%; margin-left: 2%; margin-right: 2%;}
+
−
                    .block.two-third.center, .block.full, .block.separator, .block.title {width: 92%; margin-left: 4%; margin-right: 4%;}
+
−
                    body {padding-top: 40px;}
+
−
                }
+
−
                @media only screen and (max-width: 760px) {
+
−
                    .block.two-third, .block.one-third, .block.two-third.center, .block.full, .block.separator, .block.title, .block.half {width: 96%; margin-left: 2%; margin-right: 2%; max-width: 495px;}
+
−
                    #Menu {display:none;}
+
−
                    body {padding-top: 40px;}
+
−
                }
+
−
            /* END : Block Settings */
+
−
    </style>
+
 
</html>
 
</html>

Revision as of 16:43, 20 August 2018

""

""