You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

350 lines
3.8 KiB

  1. @charset "utf-8";
  2. /* CSS Document */
  3. /******************************
  4. [Table of Contents]
  5. 1. 1600px
  6. 2. 1440px
  7. 3. 1280px
  8. 4. 1199px
  9. 5. 1024px
  10. 6. 991px
  11. 7. 959px
  12. 8. 880px
  13. 9. 768px
  14. 10. 767px
  15. 11. 539px
  16. 12. 479px
  17. 13. 400px
  18. ******************************/
  19. @media only screen and (max-width: 1600px)
  20. {
  21. }
  22. /************
  23. 2. 1440px
  24. ************/
  25. @media only screen and (max-width: 1440px)
  26. {
  27. }
  28. /************
  29. 3. 1380px
  30. ************/
  31. @media only screen and (max-width: 1380px)
  32. {
  33. }
  34. /************
  35. 3. 1280px
  36. ************/
  37. @media only screen and (max-width: 1280px)
  38. {
  39. .super_container
  40. {
  41. padding-left: 0px;
  42. padding-right: 0px;
  43. }
  44. }
  45. /************
  46. 4. 1199px
  47. ************/
  48. @media only screen and (max-width: 1199px)
  49. {
  50. }
  51. /************
  52. 4. 1100px
  53. ************/
  54. @media only screen and (max-width: 1100px)
  55. {
  56. }
  57. /************
  58. 5. 1024px
  59. ************/
  60. @media only screen and (max-width: 1024px)
  61. {
  62. }
  63. /************
  64. 6. 991px
  65. ************/
  66. @media only screen and (max-width: 991px)
  67. {
  68. h1{font-size: 48px;}
  69. .main_nav
  70. {
  71. display: none;
  72. }
  73. .hamburger_container
  74. {
  75. display: block;
  76. }
  77. .discover_button
  78. {
  79. margin-top: 37px;
  80. }
  81. .home_social_container
  82. {
  83. right: 0;
  84. }
  85. .blog_sidebar
  86. {
  87. margin-top: 120px;
  88. }
  89. .sidebar_slider
  90. {
  91. height: 450px;
  92. }
  93. }
  94. /************
  95. 7. 959px
  96. ************/
  97. @media only screen and (max-width: 959px)
  98. {
  99. }
  100. /************
  101. 8. 880px
  102. ************/
  103. @media only screen and (max-width: 880px)
  104. {
  105. }
  106. /************
  107. 9. 768px
  108. ************/
  109. @media only screen and (max-width: 768px)
  110. {
  111. }
  112. /************
  113. 10. 767px
  114. ************/
  115. @media only screen and (max-width: 767px)
  116. {
  117. .footer_social li
  118. {
  119. margin-left: 4px;
  120. }
  121. .footer_social li i
  122. {
  123. font-size: 13px;
  124. }
  125. .sidebar_slider
  126. {
  127. height: 333px;
  128. }
  129. .reply_form_name,
  130. .reply_form_email
  131. {
  132. display: block;
  133. width: 100%;
  134. }
  135. .reply_form_name
  136. {
  137. margin-right: 0px;
  138. }
  139. .reply_form_email
  140. {
  141. margin-left: 0px;
  142. }
  143. }
  144. /************
  145. 11. 575px
  146. ************/
  147. @media only screen and (max-width: 575px)
  148. {
  149. h2{font-size:24px;}
  150. p{font-size:14px;}
  151. .header
  152. {
  153. padding-left: 15px;
  154. padding-right: 15px;
  155. }
  156. .logo
  157. {
  158. margin-left: 4px;
  159. }
  160. .fs_menu_shapes
  161. {
  162. width: 30%;
  163. bottom: 35px;
  164. left: -30px;
  165. }
  166. .fs_menu_list li a
  167. {
  168. font-size: 48px;
  169. }
  170. .fs_menu_container
  171. {
  172. padding-right: 30px;
  173. }
  174. .fs_social_container
  175. {
  176. right: 20px;
  177. }
  178. .home_social_container
  179. {
  180. display: none !important;
  181. }
  182. .sidebar_slider
  183. {
  184. height: calc((100vw - 30px) / 1.42);
  185. }
  186. .footer
  187. {
  188. padding-top: 30px;
  189. padding-bottom: 30px;
  190. }
  191. .footer_content
  192. {
  193. height: auto;
  194. }
  195. .cr p
  196. {
  197. font-size: 13px;
  198. margin-bottom: 15px;
  199. }
  200. }
  201. /************
  202. 11. 539px
  203. ************/
  204. @media only screen and (max-width: 539px)
  205. {
  206. }
  207. /************
  208. 12. 480px
  209. ************/
  210. @media only screen and (max-width: 480px)
  211. {
  212. }
  213. /************
  214. 13. 479px
  215. ************/
  216. @media only screen and (max-width: 479px)
  217. {
  218. h1{font-size: 24px;}
  219. h2{font-size: 16px;}
  220. h3{font-size: 16px;}
  221. p{font-size: 13px;}
  222. .fs_menu_container.active
  223. {
  224. padding-top: 100px;
  225. }
  226. .fs_menu_list li a
  227. {
  228. font-size: 24px;
  229. }
  230. .fs_menu_list li a > span::after
  231. {
  232. bottom: 0px;
  233. height: 2px;
  234. }
  235. .fs_menu_list li a span span
  236. {
  237. top: 0;
  238. left: -2px;
  239. }
  240. .fs_social li
  241. {
  242. margin-left: 5px;
  243. }
  244. .main_slider_content p
  245. {
  246. font-size: 13px;
  247. }
  248. .button
  249. {
  250. width: 170px;
  251. height: 50px;
  252. }
  253. .button a
  254. {
  255. font-size: 9px;
  256. line-height: 50px;
  257. }
  258. .discover_button
  259. {
  260. margin-top: 28px;
  261. }
  262. .home
  263. {
  264. height: 266px;
  265. }
  266. .home_content
  267. {
  268. margin-top: 114px;
  269. }
  270. .home_content h1
  271. {
  272. margin-bottom: 0px;
  273. }
  274. .home_content span
  275. {
  276. font-size: 10px;
  277. letter-spacing: 0.5em;
  278. }
  279. .header
  280. {
  281. height: 90px;
  282. }
  283. .section_title h2::before
  284. {
  285. bottom: 51px;
  286. }
  287. .icon_container
  288. {
  289. margin-bottom: 25px;
  290. }
  291. .contact_button
  292. {
  293. margin-top: 45px;
  294. }
  295. }
  296. /************
  297. 14. 400px
  298. ************/
  299. @media only screen and (max-width: 400px)
  300. {
  301. }