123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990 |
- #start{
- section{
- position: relative;
- margin-top: -10px;
- margin-bottom: 100px;
- padding-top: 5px;
- & > h2, & > h3{
- text-align: center;
- }
- h3{
- width: 100%;
- }
- }
- h2{
- text-align: center;
- width: 350px;
- background: white;
- z-index: 1;
- margin: auto;
- margin-top: -35px;
- }
- .filet{
- z-index: -1;
- width: auto;
- height: 2px;
- background: black;
- }
- #home{
- width: 60%;
- margin: 0 auto 100px auto;
- }
- #metier{
- background: #bd9a8428;
- display: inline-flex;
- flex-wrap: wrap;
- justify-content: space-around;
- .block{
- width: 35%;
- min-width: 350px;
- &:nth-of-type(n+3){
- position: relative;
- .title{
- position: absolute;
- z-index: 1;
- transform: rotate(-35deg);
- background: red;
- }
- .img{
- height: auto;
- position: relative;
- .content{
- position: absolute;
- top: 0;
- left: 0;
- display: none;
- height: 100%;
- background: #0f265cff;
- opacity: 0.9;
- p,ul,li{
- color: white;
- }
- }
- &:hover{
- .content{
- display: block;
- }
- }
- }
- }
- }
- }
- #référence{
- background: #fff59b8c;
- }
- #contact{
- display: inline-flex;
- width: 100%;
- p{
- &:nth-of-type(1){
- width: 60%;
- }
- &:nth-of-type(2){
- width: 40%;
- }
- }
- .block{
- display: none;
- }
- }
- }
|