Team:Manchester/Projecttest
From 2013.igem.org
Abramov denn (Talk | contribs) |
Abramov denn (Talk | contribs) |
||
Line 190: | Line 190: | ||
margin-left:50px; | margin-left:50px; | ||
} | } | ||
+ | |||
+ | .wrapper | ||
+ | { | ||
+ | position:absolute; | ||
+ | clear:both; | ||
+ | width:1000px; | ||
+ | top:110px; | ||
+ | left:0; | ||
+ | padding:10px; | ||
+ | background-color:#ccc; | ||
+ | |||
+ | -webkit-border-radius: 10px; | ||
+ | border-radius: 10px; | ||
+ | |||
+ | -webkit-box-shadow: 0px 0px 10px 2px rgba(102,0,153,1); | ||
+ | -moz-box-shadow: 0px 0px 10px 2px rgba(102,0,153,1); | ||
+ | box-shadow: 0px 0px 10px 2px rgba(102,0,153,1); | ||
+ | |||
+ | /*-webkit-box-shadow: 10px 10px 15px 0px rgba(102,0,153,0.71); | ||
+ | -moz-box-shadow: 10px 10px 15px 0px rgba(102,0,153,0.71); | ||
+ | box-shadow: 10px 10px 15px 0px rgba(102,0,153,0.71);*/ | ||
+ | } | ||
+ | |||
+ | .text1, .text2, .text3, .text4 | ||
+ | { | ||
+ | width:600px; | ||
+ | margin:35px auto; | ||
+ | padding:10px; | ||
+ | background-color:#F2F2F2; | ||
+ | |||
+ | -webkit-border-radius: 10px; | ||
+ | border-radius: 10px; | ||
+ | |||
+ | /*-webkit-box-shadow: 10px 10px 15px 0px rgba(102,0,153,0.71); | ||
+ | -moz-box-shadow: 10px 10px 15px 0px rgba(102,0,153,0.71); | ||
+ | box-shadow: 10px 10px 15px 0px rgba(102,0,153,0.71);*/ | ||
+ | } | ||
+ | |||
+ | #content1, #content2, #content3,#content4, #content5, #content6 | ||
+ | { | ||
+ | float:left; | ||
+ | margin:0; | ||
+ | width:500px; | ||
+ | } | ||
+ | |||
+ | #content1 p, #content2 p,#content3 p, #content4 p, #content5 p, #content6 p | ||
+ | { | ||
+ | margin:10px 20px 10px 20px; | ||
+ | width:300px; | ||
+ | float:left; | ||
+ | float:left; | ||
+ | font-family: Cambria, Georgia, serif; | ||
+ | font-style: italic; | ||
+ | font-size:15px; | ||
+ | } | ||
+ | |||
+ | #content1 img,#content2 img,#content3 img,#content4 img,#content5 img, #content6 img | ||
+ | { | ||
+ | position:relative; | ||
+ | top:5px; | ||
+ | -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); | ||
+ | -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); | ||
+ | box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); | ||
+ | } | ||
+ | |||
+ | #content1 .myButton, #content2 .myButton, #content3 .myButton,#content4 .myButton,#content5 .myButton, #content6 .myButton | ||
+ | { | ||
+ | margin:10px 0 10px 20px; | ||
+ | -moz-box-shadow:inset 0px 1px 0px 0px #e184f3; | ||
+ | -webkit-box-shadow:inset 0px 1px 0px 0px #e184f3; | ||
+ | box-shadow:inset 0px 1px 0px 0px #e184f3; | ||
+ | |||
+ | background-color:#c123de; | ||
+ | |||
+ | -moz-border-radius:6px; | ||
+ | -webkit-border-radius:6px; | ||
+ | border-radius:6px; | ||
+ | |||
+ | border:1px solid #a511c0; | ||
+ | |||
+ | display:inline-block; | ||
+ | color:#ffffff; | ||
+ | font-family:Trebuchet MS; | ||
+ | font-size:15px; | ||
+ | font-weight:bold; | ||
+ | padding:6px 24px; | ||
+ | text-decoration:none; | ||
+ | |||
+ | text-shadow:0px 1px 0px #9b14b3; | ||
+ | |||
+ | } | ||
+ | |||
+ | #content1 .myButton:hover, #content2 .myButton:hover, #content3 .myButton:hover, #content4 .myButton:hover, #content5 .myButton:hover, #content6 .myButton:hover | ||
+ | { | ||
+ | background-color:#a20dbd; | ||
+ | } | ||
+ | |||
+ | #content1 .myButton:active, #content2 .myButton:active, #content3 .myButton:active, #content4 .myButton:active, #content5 .myButton:active, #content6 .myButton:active | ||
+ | { | ||
+ | position:relative; | ||
+ | top:1px; | ||
+ | } | ||
.container | .container | ||
Line 201: | Line 303: | ||
left:200px; | left:200px; | ||
z-index:100; | z-index:100; | ||
- | |||
} | } | ||
Line 284: | Line 385: | ||
{ | { | ||
display:block; | display:block; | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
} | } | ||
Line 316: | Line 398: | ||
width:950px; | width:950px; | ||
height:1600px; | height:1600px; | ||
- | + | ||
} | } | ||
Line 404: | Line 486: | ||
</div> | </div> | ||
- | <div | + | <div class="wrapper" > |
- | + | <div id="content1"> | |
- | + | ||
<p> | <p> | ||
Lorem ipsum dolor sit amet, consectetur adipisicing | Lorem ipsum dolor sit amet, consectetur adipisicing | ||
Line 417: | Line 498: | ||
<a href="#" class="myButton" > READ </a> | <a href="#" class="myButton" > READ </a> | ||
</p> | </p> | ||
- | <img src=" | + | <img src="https://static.igem.org/mediawiki/2013/8/8d/Logoscaled.jpg" height="200" width="150"/> |
- | </div | + | </div> |
- | </div> | + | <div id="content2"> |
+ | <img src="https://static.igem.org/mediawiki/2013/8/8d/Logoscaled.jpg" height="200" width="150"/> | ||
+ | <p> | ||
+ | Lorem ipsum dolor sit amet, consectetur adipisicing | ||
+ | elit, sed do eiusmod tempor incididunt ut labore et dolore | ||
+ | magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation | ||
+ | ullamco laboris nisi ut aliquip ex ea commodo consequat. | ||
+ | Duis aute irure dolor in reprehenderit in voluptate velit | ||
+ | esse cillum dolore eu fugiat nulla pariatur. | ||
+ | </p> | ||
+ | <a href="#" class="myButton" > READ </a> | ||
+ | </div> | ||
+ | <hr> </hr> | ||
+ | <div id="content3"> | ||
+ | <p> | ||
+ | Lorem ipsum dolor sit amet, consectetur adipisicing | ||
+ | elit, sed do eiusmod tempor incididunt ut labore et dolore | ||
+ | magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation | ||
+ | ullamco laboris nisi ut aliquip ex ea commodo consequat. | ||
+ | Duis aute irure dolor in reprehenderit in voluptate velit | ||
+ | esse cillum dolore eu fugiat nulla pariatur. | ||
+ | |||
+ | <a href="#" class="myButton" > READ </a> | ||
+ | </p> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/8/8d/Logoscaled.jpg" height="200" width="150"/> | ||
+ | </div> | ||
+ | |||
+ | <div id="content4"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/8/8d/Logoscaled.jpg" height="200" width="150"/> | ||
+ | <p> | ||
+ | Lorem ipsum dolor sit amet, consectetur adipisicing | ||
+ | elit, sed do eiusmod tempor incididunt ut labore et dolore | ||
+ | magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation | ||
+ | ullamco laboris nisi ut aliquip ex ea commodo consequat. | ||
+ | Duis aute irure dolor in reprehenderit in voluptate velit | ||
+ | esse cillum dolore eu fugiat nulla pariatur. | ||
+ | </p> | ||
+ | <a href="#" class="myButton" > READ </a> | ||
+ | </div> | ||
+ | <hr> </hr> | ||
+ | <div id="content5"> | ||
+ | <p> | ||
+ | Lorem ipsum dolor sit amet, consectetur adipisicing | ||
+ | elit, sed do eiusmod tempor incididunt ut labore et dolore | ||
+ | magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation | ||
+ | ullamco laboris nisi ut aliquip ex ea commodo consequat. | ||
+ | Duis aute irure dolor in reprehenderit in voluptate velit | ||
+ | esse cillum dolore eu fugiat nulla pariatur. | ||
+ | |||
+ | <a href="#" class="myButton" > READ </a> | ||
+ | </p> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/8/8d/Logoscaled.jpg" height="200" width="150"/> | ||
+ | </div> | ||
+ | |||
+ | <div id="content6"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/8/8d/Logoscaled.jpg" height="200" width="150"/> | ||
+ | <p> | ||
+ | Lorem ipsum dolor sit amet, consectetur adipisicing | ||
+ | elit, sed do eiusmod tempor incididunt ut labore et dolore | ||
+ | magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation | ||
+ | ullamco laboris nisi ut aliquip ex ea commodo consequat. | ||
+ | Duis aute irure dolor in reprehenderit in voluptate velit | ||
+ | esse cillum dolore eu fugiat nulla pariatur. | ||
+ | </p> | ||
+ | <a href="#" class="myButton" > READ </a> | ||
+ | </div> | ||
+ | |||
</div> | </div> | ||
</div> | </div> |
Revision as of 15:26, 23 July 2013
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. READ
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
READLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. READ
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
READLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. READ
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
READ