stylesPavel.css 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. .about-us{
  2. background-image: url(../images/block_2.jpg);
  3. background-size:cover;
  4. z-index: -1;
  5. height: 100%;
  6. top:100px;
  7. background-attachment:fixed;
  8. min-width: 100%;
  9. }
  10. .about-us-main {
  11. background-image: url(../images/about_fullscreen_bg.jpg);
  12. background-position: center center;
  13. background-repeat: no-repeat;
  14. background-size: cover;
  15. width: 100%;
  16. height: 100vh;
  17. padding-top: 130px;
  18. position: relative;
  19. }
  20. .about-us-main h3{
  21. max-width: 500px;
  22. width: 100%;
  23. font-weight: 700;
  24. margin: 0;
  25. padding: 60px 0;
  26. color: #fff;
  27. font-size: 72px;
  28. letter-spacing: .72px;
  29. line-height: 80px;
  30. text-align: center;
  31. margin: 0 auto;
  32. z-index: 0;
  33. position: absolute;
  34. left: 50%;
  35. top: calc(50% - 65px);
  36. -webkit-transform: translate(-50%,-50%);
  37. transform: translate(-50%,-50%);
  38. }
  39. .about-us-counter{
  40. background: #fff;
  41. padding: 20px;
  42. max-width: 900px;
  43. text-align: center;
  44. position: absolute;
  45. top: 100vh;
  46. left: 50%;
  47. z-index: 1;
  48. /* -webkit-transform: translate(-50%,-50%);*/
  49. transform: translate(-50%,-50%);
  50. box-shadow: 0 1px 1px 0 rgba(84,84,84,.3);
  51. }
  52. .about-us-description{
  53. font-weight: 300;
  54. color: #676767;
  55. font-size: 16px;
  56. letter-spacing: .16px;
  57. line-height: 24px;
  58. text-align: center;
  59. max-width: 560px;
  60. margin: 0 auto 10px;
  61. }
  62. .about-us-timer-left{
  63. width: 50%;
  64. float: left;
  65. }
  66. .about-us-timer-brend{
  67. margin: 0 auto;
  68. font-weight: 700;
  69. color: #e4ca87;
  70. font-size: 110px;
  71. }
  72. .about-us-timer-right{
  73. width: 50%;
  74. float: right;
  75. }
  76. .about-us-timer-restaurant{
  77. margin: 0 auto;
  78. font-weight: 700;
  79. color: #e4ca87;
  80. font-size: 110px;
  81. }
  82. .about-us-block_1{
  83. background-image: url(../images/block_1.png);
  84. background-repeat: no-repeat;
  85. background-position: center calc(100% + 140px);
  86. background-color: #f3f3f3;
  87. padding-top: 420px;
  88. padding-bottom: 140px;
  89. }
  90. .about-us-block_2{
  91. padding: 100px 20px;
  92. border: solid 1px;
  93. position: relative;
  94. overflow: hidden;
  95. }
  96. .about-us-block_2 h2{
  97. letter-spacing: .3px;
  98. font-weight: 700;
  99. font-size: 48px;
  100. color: #fff;
  101. text-align: center;
  102. z-index: 1;
  103. position: relative;
  104. display: block;
  105. }
  106. .about-us-block_3{
  107. background: white;
  108. }
  109. .about-us-block_3 h2{
  110. font-size: 30px;
  111. text-align: center;
  112. padding-top: 25px;
  113. padding-bottom: 25px;
  114. color: #4d4d4d;
  115. font-weight: 700;
  116. }
  117. .about-us-block_4{
  118. background: white;
  119. }
  120. .about-us-block_4{
  121. text-align: center;
  122. padding-top: 15px;
  123. padding-bottom: 15px;
  124. color: #4d4d4d;
  125. }
  126. .slick-container {
  127. text-align: center;
  128. background: lightgrey;
  129. width: 100%;
  130. margin: auto;
  131. padding: 15px;
  132. }
  133. .slick-item {}
  134. .slick-dots li button{
  135. font-size: 0 !important;
  136. border: 1px solid gray !important;
  137. border-radius: 50%;
  138. background: #606060 !important;
  139. }
  140. .slick-dots li button:hover{
  141. background: white !important;
  142. }
  143. .slick-dots li button:before{
  144. content: none !important;
  145. }
  146. .slick-prev:before,.slick-next:before {
  147. font-size: 20px!important;
  148. content:''!important;
  149. }
  150. .slick-item img {
  151. width: 250px;
  152. height: 200px;
  153. margin: auto;
  154. }
  155. .slick-arrow {
  156. background: green;
  157. }