_section.scss 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. body{
  2. overflow: hidden;
  3. background:rgb(230, 230, 230);
  4. }
  5. #page{
  6. height: 100%;
  7. margin: 0 20px;
  8. .navbar{
  9. width: 100%;
  10. height: 50px;
  11. }
  12. #start{
  13. width: 100%;
  14. height: calc(100% - 50px);
  15. position: relative;
  16. .handler{
  17. width: 50px;
  18. height: 50px;
  19. border-radius: 25px;
  20. position: absolute;
  21. top: 50%;
  22. z-index: 999;
  23. cursor: grab;
  24. }
  25. .hand1{
  26. left : calc((100%/3));
  27. margin-left: -26px;
  28. margin-top: -24px;
  29. }
  30. .hand2{
  31. left: calc((100%/3) * 2);
  32. margin-left: -25px;
  33. margin-top: -24px;
  34. img{
  35. margin-left: 1px;
  36. }
  37. }
  38. .mouseDown{
  39. cursor: grabbing;
  40. }
  41. .blocs{
  42. position: absolute;
  43. overflow-y: hidden;
  44. margin: 0;
  45. width: $W33;
  46. // min-width: 200px;
  47. height: $H50-25;
  48. z-index: 998;
  49. &:nth-child(3n+2){
  50. left: -2px;
  51. }
  52. &:nth-of-type(2){
  53. background: rgb(150, 150, 150);
  54. }
  55. &:nth-child(-n+3){
  56. padding: 0px 20px;
  57. }
  58. &:nth-child(3n+3){
  59. background: white;
  60. left: $L33;
  61. }
  62. &:nth-child(3n+4){
  63. background: white;
  64. right: -2px;
  65. }
  66. &:nth-child(n+5){
  67. top: $T50-25;
  68. margin-top: 2px;
  69. }
  70. &:nth-of-type(-n+3){
  71. & > div:nth-child(n+1){
  72. overflow: hidden;
  73. }
  74. .mCSB_container > div:last-child{
  75. margin-bottom: 25px;
  76. }
  77. }
  78. }
  79. #reseaux-sociaux{
  80. canvas[resize] {
  81. width: 100vw;
  82. height: 100vh;
  83. }
  84. }
  85. #images{
  86. img{
  87. }
  88. }
  89. #links{
  90. z-index: 997!important;
  91. display: flex;
  92. #mCSB_5{
  93. width: 100%;
  94. #mCSB_5_container{
  95. width: 100%;
  96. height: 100%;
  97. position: fixed!important;
  98. top: 50px!important;
  99. }
  100. }
  101. svg{
  102. position: absolute;
  103. // top: 50px;
  104. left: 0;
  105. }
  106. }
  107. #streetmap{
  108. #mCSB_4_container{
  109. width: 100%;
  110. height: 100%;
  111. }
  112. & > div:nth-of-type(1){
  113. height: 100%;
  114. }
  115. #mapid {
  116. width: 100%;
  117. height: 100%;
  118. filter: grayscale(100%) contrast(1);
  119. }
  120. }
  121. }
  122. }