_layout.scss 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. $header-height : 110px;
  2. $width-menu-slidedown : 550px;
  3. .layout-container {
  4. position: relative;
  5. width: 100vw;
  6. background-color: $background-home;
  7. font-family: $font-family-default;
  8. font-weight: 400;
  9. font-style: normal;
  10. top: 0%;
  11. left: 0%;
  12. // width: 100%;
  13. overflow: hidden;
  14. display: flex;
  15. flex-flow: row wrap;
  16. header{
  17. flex: 0 0 100%;
  18. }
  19. // main{
  20. // // position: relative;
  21. // // top: -7rem;
  22. // }
  23. footer{
  24. flex: 0 0 100%;
  25. }
  26. }
  27. .layout-content{
  28. position: relative;
  29. top: $header-height;
  30. order: 2;
  31. padding-top: 3rem;
  32. padding-bottom: 6rem;
  33. width: 80%;
  34. margin: auto;
  35. @media(max-width: 891px){
  36. width: 90%;
  37. }
  38. @media (max-width:500px) {
  39. padding-top: 0;
  40. }
  41. .layout__region--first{
  42. flex: 0 1 25%;
  43. }
  44. .layout__region--second{
  45. flex: 0 1 75%;
  46. &.view-id-home{
  47. margin: 0;
  48. }
  49. }
  50. }
  51. aside.layout-sidebar-first{
  52. width: 20%;
  53. order: 1;
  54. margin-top: 5rem;
  55. margin-left: 10%;
  56. margin-right: 1rem;
  57. @media(max-width:891px){
  58. margin-left: 5%;
  59. margin-top: 9rem;
  60. }
  61. @media (max-width:500px) {
  62. width: 80%;
  63. margin-top: 3rem;
  64. }
  65. }
  66. aside.layout-sidebar-second{
  67. position: fixed;
  68. top:0;
  69. right:0;
  70. background-color: #fff;
  71. height: 100vh;
  72. padding: 1em;
  73. z-index: 100;
  74. }
  75. main{
  76. width: 100%;
  77. display: flex;
  78. flex-direction: row;
  79. position: relative;
  80. @media (max-width:500px) {
  81. flex-direction: column;
  82. }
  83. }
  84. .main-content{
  85. margin-top: 7rem;
  86. }
  87. #block-reha-titredepage{
  88. // display: none;
  89. }
  90. p{
  91. background-color: transparent;
  92. }