/* Table of Contents I. Generic -------------------------------------- 01. Reset ------------------------------------ 02. Base ------------------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 03. Fonts ------------------------------------ 04. Helpers ---------------------------------- Clear ------------------------------------ Notext ----------------------------------- Hidden ----------------------------------- Alignleft -------------------------------- Alignright ------------------------------- Disabled --------------------------------- Grid ------------------------------------- Grid&IE11Test ---------------------------- Mobile ----------------------------------- Old IE fallback -------------------------- Responsive Helpers ----------------------- Mobile ----------------------------------- 05. Mobile Content --------------------------- 06. col--size-m ------------------------------ II. Regions -------------------------------------- 01. Container -------------------------------- 02. Container Compare ------------------------ 03. Container--coupon ------------------------ 04. Container Hostlookup --------------------- 05. Container Hostreview --------------------- 06. Container Resources ---------------------- 07. Container Tophost ------------------------ 08. Content ---------------------------------- 09. Footer ----------------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 10. Header ----------------------------------- Small Desktop ---------------------------- Mobile ----------------------------------- 11. Main ------------------------------------- 12. Shell ------------------------------------ 13. Sidebar ---------------------------------- 14. Wrapper ---------------------------------- Mobile ----------------------------------- III. Modules -------------------------------------- 01. Accordion -------------------------------- 02. Media ------------------------------------ 03. Article ---------------------------------- 04. Article How ------------------------------ 05. Article Heading -------------------------- 06. Article Box ------------------------------ 07. Article About ---------------------------- 08. Article Blue ----------------------------- 09. Article Text ----------------------------- 10. Article Autor ---------------------------- 11. Article What ----------------------------- 12. Article Featured ------------------------- 13. Article Secondary ------------------------ 14. Article Discount ------------------------- 15. Article Ico ------------------------------ 16. Article Mark ----------------------------- 17. Article Offer ---------------------------- 18. Article Big ------------------------------ 19. Article Jump ----------------------------- 20. Article Gray ----------------------------- 21. Article Features ------------------------- 22. Article Forms ---------------------------- 23. Bar -------------------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 24. Blockquote ------------------------------- 25. Box -------------------------------------- 26. Box Accordion ---------------------------- 27. Box--accordion-big ----------------------- 28. Button ----------------------------------- Button Block ----------------------------- 29. Btn Offer -------------------------------- 30. Btn Table -------------------------------- 31. Btn--small ------------------------------- 32. Btn Table -------------------------------- 33. Btn Green -------------------------------- 34. btn--green-big --------------------------- 35. Card ------------------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 36. Comment ---------------------------------- 37. Filter ----------------------------------- 38. Filters ---------------------------------- 39. Form Elements ---------------------------- 40. Form ------------------------------------- 41. Form Privacy ----------------------------- 42. Form Sort -------------------------------- 43. Form Search ------------------------------ 44. Hamburger -------------------------------- 45. Label ------------------------------------ 46. Lang-switcher ---------------------------- Tablet Portrait -------------------------- 47. Link-more -------------------------------- 48. List ------------------------------------- 49. Logos ------------------------------------ Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 50. Hosts ------------------------------------ Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 51. Label ------------------------------------ Tablet Portrait -------------------------- Mobile ----------------------------------- 52. List-arrows ------------------------------ Mobile ----------------------------------- 53. List Tags -------------------------------- 54. List Links ------------------------------- 55. List Order ------------------------------- 56. List Support ----------------------------- 57. List Gray ------------------------------- 58. List Blue -------------------------------- 59. List Checked ----------------------------- 60. list--flex ------------------------------- 61. List Big --------------------------------- 62. List Black ------------------------------- 63. Logo ------------------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 64. Nav -------------------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 65. Nav Breadcrumbs -------------------------- 66. Outro ------------------------------------ Tablet Portrait -------------------------- Mobile ----------------------------------- 67. Rating ----------------------------------- 68. Review ----------------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 69. Search ----------------------------------- Tablet Portrait -------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 70. Search Aside ----------------------------- 71. Section ---------------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- Section utility classes ------------------ Mobile ----------------------------------- 72. Section--Darker -------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 73. Intro ------------------------------------ Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 74. Section--divided ------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 75. Search ----------------------------------- Mobile ----------------------------------- 76. Section--testimonials -------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 77. Section--reviews ------------------------- Mobile ----------------------------------- 78. Section--featured ------------------------ 79. Section Posts ---------------------------- 80. Section Subscribe ------------------------ 81. Section Intro ---------------------------- 82. Section Articles ------------------------ 83. section--primary ------------------------- 84. Section Subscribe Big -------------------- 85. Section Comments ------------------------- 86. Section Related -------------------------- 87. Section Mobile Content ------------------- 88. Section Secondary ------------------------ 89. Section Hosting Plans -------------------- 90. Section Gray ----------------------------- 91. Section Intro Search --------------------- 92. Section Services ------------------------- 93. Section Safe ----------------------------- 94. Section--posts-big ----------------------- 95. Section Reviews -------------------------- 96. Section Table ---------------------------- 97. Section Questions ------------------------ 98. Slider ----------------------------------- 99. Slider-testimonials ---------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 100. Socials --------------------------------- 101. Socials--blue --------------------------- 102. Summary --------------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 103. Table ----------------------------------- 104. Table Hostings -------------------------- 105. Table Small ----------------------------- 106. Table Company --------------------------- 107. Table--hosts ---------------------------- 108. Testimonial ----------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 109. Testimonial List ------------------------ 110. Testimonial--big ------------------------ 111. Testimonial Slider ---------------------- 112. Time ------------------------------------ 113. Widget ---------------------------------- */ .arrow-left-blue { background-image: url(images/sprite.png); background-position: 99.11347517730496% 80.79331941544885%; background-size: 7150% 3521.4285714285716%; width: 8px; height: 14px; display: inline-block; vertical-align: middle; font-size: 0; } .arrow-right-blue { background-image: url(images/sprite.png); background-position: 99.64539007092199% 62.839248434237994%; background-size: 7150% 3521.4285714285716%; width: 8px; height: 14px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-ahosting { background-image: url(images/sprite.png); background-position: 73.64532019704434% 19.340659340659343%; background-size: 344.5783132530121% 1297.3684210526314%; width: 166px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-down-small { background-image: url(images/sprite.png); background-position: 99.28952042628775% 85.86065573770492%; background-size: 6355.555555555556% 9860%; width: 9px; height: 5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-down { background-image: url(images/sprite.png); background-position: 99.82142857142857% 83.9506172839506%; background-size: 4766.666666666666% 7042.857142857143%; width: 12px; height: 7px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-gray { background-image: url(images/sprite.png); background-position: 96.94793536804309% 92.97520661157024%; background-size: 3813.3333333333335% 5477.777777777778%; width: 15px; height: 9px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-right { background-image: url(images/sprite.png); background-position: 100% 41.821946169772254%; background-size: 9533.333333333332% 4930%; width: 6px; height: 10px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-best { background-image: url(images/sprite.png); background-position: 46.449136276391556% 16.435185185185187%; background-size: 1121.5686274509803% 808.1967213114755%; width: 51px; height: 61px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-bluehost-2 { background-image: url(images/sprite.png); background-position: 0% 35.9375%; background-size: 232.52032520325204% 1095.5555555555557%; width: 246px; height: 45px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-bluehost { background-image: url(images/sprite.png); background-position: 47.81491002570694% 57.57575757575758%; background-size: 312.56830601092895% 1590.3225806451612%; width: 183px; height: 31px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-chat-big { background-image: url(images/sprite.png); background-position: 98.72029250457038% 54.008438818565395%; background-size: 2288% 2594.736842105263%; width: 25px; height: 19px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-chat-small-grey { background-image: url(images/sprite.png); background-position: 96.94793536804309% 90.12605042016807%; background-size: 3813.3333333333335% 2900%; width: 15px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-chat-small { background-image: url(images/sprite.png); background-position: 96.94793536804309% 85.71428571428571%; background-size: 3813.3333333333335% 2900%; width: 15px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-chat { background-image: url(images/sprite.png); background-position: 91.73076923076923% 41.950113378684804%; background-size: 1100% 948.076923076923%; width: 52px; height: 52px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-check-green { background-image: url(images/sprite.png); background-position: 39.77485928705441% 80.83700440528634%; background-size: 1466.6666666666665% 1264.102564102564%; width: 39px; height: 39px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-check-white { background-image: url(images/sprite.png); background-position: 55.61797752808989% 80.65934065934066%; background-size: 1505.2631578947369% 1297.3684210526314%; width: 38px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-check { background-image: url(images/sprite.png); background-position: 100% 76.14107883817427%; background-size: 4766.666666666666% 4481.818181818182%; width: 12px; height: 11px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-clock { background-image: url(images/sprite.png); background-position: 98.54014598540147% 37.10021321961621%; background-size: 2383.333333333333% 2054.166666666667%; width: 24px; height: 24px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-console { background-image: url(images/sprite.png); background-position: 91.90751445086705% 69.14414414414415%; background-size: 1079.245283018868% 1006.1224489795918%; width: 53px; height: 49px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook-white { background-image: url(images/sprite.png); background-position: 23.49624060150376% 81.01545253863135%; background-size: 1430% 1232.5%; width: 40px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook { background-image: url(images/sprite.png); background-position: 16.387337057728118% 94.32314410480349%; background-size: 1634.2857142857142% 1408.5714285714284%; width: 35px; height: 35px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-forbes { background-image: url(images/sprite.png); background-position: 35.3448275862069% 45.16129032258064%; background-size: 529.6296296296297% 1760.7142857142858%; width: 108px; height: 28px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-globus { background-image: url(images/sprite.png); background-position: 8.270676691729323% 97.73755656108597%; background-size: 1430% 966.6666666666666%; width: 40px; height: 51px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-google { background-image: url(images/sprite.png); background-position: 63.24626865671642% 80.30634573304157%; background-size: 1588.888888888889% 1369.4444444444446%; width: 36px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-greengeeks { background-image: url(images/sprite.png); background-position: 0% 17.444717444717444%; background-size: 330.63583815028903% 573.2558139534884%; width: 173px; height: 86px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-hostgator { background-image: url(images/sprite.png); background-position: 0% 0%; background-size: 193.89830508474577% 735.8208955223881%; width: 295px; height: 67px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-law { background-image: url(images/sprite.png); background-position: 0% 100%; background-size: 1430% 808.1967213114755%; width: 40px; height: 61px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-lifehacker { background-image: url(images/sprite.png); background-position: 68.73563218390805% 40.08810572687225%; background-size: 417.51824817518246% 1264.102564102564%; width: 137px; height: 39px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-like-blue { background-image: url(images/sprite.png); background-position: 99.26470588235294% 31.27659574468085%; background-size: 2042.8571428571427% 2143.478260869565%; width: 28px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-like { background-image: url(images/sprite.png); background-position: 99.26470588235294% 25.53191489361702%; background-size: 2042.8571428571427% 2143.478260869565%; width: 28px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-linkedin-white { background-image: url(images/sprite.png); background-position: 79.88721804511279% 28.697571743929362%; background-size: 1430% 1232.5%; width: 40px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-linkedin { background-image: url(images/sprite.png); background-position: 77.83985102420856% 80.30634573304157%; background-size: 1634.2857142857142% 1369.4444444444446%; width: 35px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-lock { background-image: url(images/sprite.png); background-position: 96.94793536804309% 81.30252100840336%; background-size: 3813.3333333333335% 2900%; width: 15px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-mashable { background-image: url(images/sprite.png); background-position: 0% 72.1030042918455%; background-size: 400% 1825.9259259259259%; width: 143px; height: 27px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-maxcdn-grey { background-image: url(images/sprite.png); background-position: 75.12562814070351% 0%; background-size: 328.7356321839081% 1232.5%; width: 174px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-maxcdn { background-image: url(images/sprite.png); background-position: 75.12562814070351% 9.713024282560706%; background-size: 328.7356321839081% 1232.5%; width: 174px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-medal { background-image: url(images/sprite.png); background-position: 90% 55.91647331786543%; background-size: 1361.904761904762% 795.1612903225806%; width: 42px; height: 62px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-message { background-image: url(images/sprite.png); background-position: 31.70731707317073% 80.83700440528634%; background-size: 1466.6666666666665% 1264.102564102564%; width: 39px; height: 39px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-page { background-image: url(images/sprite.png); background-position: 66.44444444444444% 29.213483146067414%; background-size: 468.8524590163935% 1027.0833333333335%; width: 122px; height: 48px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-pen-grey { background-image: url(images/sprite.png); background-position: 96.94793536804309% 72.63157894736842%; background-size: 3813.3333333333335% 2738.888888888889%; width: 15px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-pen { background-image: url(images/sprite.png); background-position: 96.94793536804309% 68%; background-size: 3813.3333333333335% 2738.888888888889%; width: 15px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-plus-slim { background-image: url(images/sprite.png); background-position: 97.12230215827337% 76.93920335429769%; background-size: 3575% 3081.25%; width: 16px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-plus { background-image: url(images/sprite.png); background-position: 99.64349376114082% 71.72557172557173%; background-size: 5200% 4108.333333333334%; width: 11px; height: 12px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-privacy { background-image: url(images/sprite.png); background-position: 0% 84.95370370370371%; background-size: 1144% 808.1967213114755%; width: 50px; height: 61px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-remove { background-image: url(images/sprite.png); background-position: 99.64349376114082% 67.15176715176715%; background-size: 5200% 4108.333333333334%; width: 11px; height: 12px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-remove-2-x { background-image: url(images/sprite.png); background-position: 98.18181818181819% 43.070362473347544%; background-size: 2600% 2054.166666666667%; width: 22px; height: 24px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-reply { background-image: url(images/sprite.png); background-position: 98.9010989010989% 58.73684210526315%; background-size: 2200% 2738.888888888889%; width: 26px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-rochet-2 { background-image: url(images/sprite.png); background-position: 100% 0%; background-size: 1787.5% 912.9629629629629%; width: 32px; height: 54px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-rocket { background-image: url(images/sprite.png); background-position: 89.66165413533834% 26.41509433962264%; background-size: 1430% 714.4927536231884%; width: 40px; height: 69px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-search-form { background-image: url(images/sprite.png); background-position: 97.47292418772562% 63.368421052631575%; background-size: 3177.777777777778% 2738.888888888889%; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-siteground-small { background-image: url(images/sprite.png); background-position: 0% 47.61904761904761%; background-size: 357.5% 948.076923076923%; width: 160px; height: 52px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-siteground { background-image: url(images/sprite.png); background-position: 0% 58.333333333333336%; background-size: 314.2857142857143% 1332.4324324324325%; width: 182px; height: 37px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-star-gray { background-image: url(images/sprite.png); background-position: 99.4475138121547% 12.446351931330472%; background-size: 1972.4137931034484% 1825.9259259259259%; width: 29px; height: 27px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-star { background-image: url(images/sprite.png); background-position: 98.36065573770492% 48.832271762208066%; background-size: 2486.9565217391305% 2240.909090909091%; width: 23px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-stat-big { background-image: url(images/sprite.png); background-position: 99.4475138121547% 19.098712446351932%; background-size: 1972.4137931034484% 1825.9259259259259%; width: 29px; height: 27px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-store { background-image: url(images/sprite.png); background-position: 92.98245614035088% 0%; background-size: 969.491525423729% 986%; width: 59px; height: 50px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-times { background-image: url(images/sprite.png); background-position: 76.59137577002053% 56.837606837606835%; background-size: 672.9411764705883% 1972%; width: 85px; height: 25px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter-white { background-image: url(images/sprite.png); background-position: 46.99248120300752% 35.54083885209713%; background-size: 1430% 1232.5%; width: 40px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter { background-image: url(images/sprite.png); background-position: 70.57728119180634% 80.30634573304157%; background-size: 1634.2857142857142% 1369.4444444444446%; width: 35px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-venture { background-image: url(images/sprite.png); background-position: 0% 65.5982905982906%; background-size: 284.5771144278607% 1972%; width: 201px; height: 25px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-web-2 { background-image: url(images/sprite.png); background-position: 10.693069306930694% 81.91964285714286%; background-size: 853.7313432835822% 1095.5555555555557%; width: 67px; height: 45px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-web { background-image: url(images/sprite.png); background-position: 91.90751445086705% 81.08108108108108%; background-size: 1079.245283018868% 1006.1224489795918%; width: 53px; height: 49px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-wired { background-image: url(images/sprite.png); background-position: 70.85308056872039% 48.59611231101512%; background-size: 381.33333333333337% 1643.3333333333333%; width: 150px; height: 30px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-wordpress { background-image: url(images/sprite.png); background-position: 34.63796477495107% 16.435185185185187%; background-size: 937.704918032787% 808.1967213114755%; width: 61px; height: 61px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-wordpress-2 { background-image: url(images/sprite.png); background-position: 92.08494208494209% 12.300683371298406%; background-size: 1059.2592592592594% 912.9629629629629%; width: 54px; height: 54px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-y { background-image: url(images/sprite.png); background-position: 47.752808988764045% 80.83700440528634%; background-size: 1505.2631578947369% 1264.102564102564%; width: 38px; height: 39px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-dubchev { background-image: url(images/ico-dubchev.svg); background-size:15px 17px; width: 15px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-dubchev-w { background-image: url(images/ico-dubchev-w.svg); background-size:10px 12px; background-repeat:no-repeat;background-position:right;width: 15px; height: 12px; display: inline-block; vertical-align: middle; font-size: 0; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .arrow-left-blue { background-image: url(images/sprite.@2x.png); background-position: 99.10554561717353% 64.02439024390245%; background-size: 7087.5% 3614.2857142857147%; width: 8px; height: 14px; display: inline-block; vertical-align: middle; font-size: 0; } .arrow-right-blue { background-image: url(images/sprite.@2x.png); background-position: 99.6422182468694% 55.487804878048784%; background-size: 7087.5% 3614.2857142857147%; width: 8px; height: 14px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-ahosting { background-image: url(images/sprite.@2x.png); background-position: 74.56359102244389% 9.401709401709402%; background-size: 341.56626506024094% 1331.578947368421%; width: 166px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-down-small { background-image: url(images/sprite.@2x.png); background-position: 99.19354838709677% 71.25748502994011%; background-size: 6300% 10120%; width: 9px; height: 5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-gray { background-image: url(images/sprite.@2x.png); background-position: 96.92028985507247% 76.05633802816901%; background-size: 3779.9999999999995% 5622.222222222222%; width: 15px; height: 9px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-right { background-image: url(images/sprite.@2x.png); background-position: 98.66429207479965% 67.6056338028169%; background-size: 10309.09090909091% 5622.222222222222%; width: 5.5px; height: 9px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-best-3 { background-image: url(images/sprite.@2x.png); background-position: 46.89922480620155% 15.955056179775282%; background-size: 1111.764705882353% 829.5081967213115%; width: 51px; height: 61px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-bluehost-2 { background-image: url(images/sprite.@2x.png); background-position: 0% 34.924078091106296%; background-size: 230.48780487804876% 1124.4444444444443%; width: 246px; height: 45px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-bluehost { background-image: url(images/sprite.@2x.png); background-position: 48.4375% 56.00000000000001%; background-size: 309.8360655737705% 1632.2580645161293%; width: 183px; height: 31px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-chat-big { background-image: url(images/sprite.@2x.png); background-position: 98.70848708487084% 46.81724845995893%; background-size: 2268% 2663.157894736842%; width: 25px; height: 19px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-chat-small-grey { background-image: url(images/sprite.@2x.png); background-position: 96.92028985507247% 64.41717791411043%; background-size: 3779.9999999999995% 2976.470588235294%; width: 15px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-chat-small { background-image: url(images/sprite.@2x.png); background-position: 96.92028985507247% 68.71165644171779%; background-size: 3779.9999999999995% 2976.470588235294%; width: 15px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-chat { background-image: url(images/sprite.@2x.png); background-position: 92.62135922330097% 28.854625550660796%; background-size: 1090.3846153846152% 973.076923076923%; width: 52px; height: 52px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-check-green { background-image: url(images/sprite.@2x.png); background-position: 40.15151515151515% 71.94860813704497%; background-size: 1453.8461538461538% 1297.4358974358975%; width: 39px; height: 39px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-check-white { background-image: url(images/sprite.@2x.png); background-position: 56.14366729678639% 71.7948717948718%; background-size: 1492.1052631578948% 1331.578947368421%; width: 38px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-check { background-image: url(images/sprite.@2x.png); background-position: 100% 59.59595959595959%; background-size: 4725% 4600%; width: 12px; height: 11px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-clock { background-image: url(images/sprite.@2x.png); background-position: 98.52670349907919% 36.09958506224066%; background-size: 2362.5% 2108.333333333333%; width: 24px; height: 24px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-console { background-image: url(images/sprite.@2x.png); background-position: 92.80155642023347% 66.95842450765865%; background-size: 1069.811320754717% 1032.6530612244899%; width: 53px; height: 49px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook-white { background-image: url(images/sprite.@2x.png); background-position: 23.719165085388994% 72.1030042918455%; background-size: 1417.5% 1265%; width: 40px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook { background-image: url(images/sprite.@2x.png); background-position: 11.842105263157894% 85.13800424628451%; background-size: 1620% 1445.7142857142858%; width: 35px; height: 35px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-forbes { background-image: url(images/sprite.@2x.png); background-position: 35.72984749455338% 43.93305439330544%; background-size: 525% 1807.1428571428573%; width: 108px; height: 28px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-globus { background-image: url(images/sprite.@2x.png); background-position: 0% 100%; background-size: 1417.5% 992.1568627450981%; width: 40px; height: 51px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-google { background-image: url(images/sprite.@2x.png); background-position: 63.84180790960452% 71.48936170212767%; background-size: 1575% 1405.5555555555554%; width: 36px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-greengeeks { background-image: url(images/sprite.@2x.png); background-position: 0% 16.904761904761905%; background-size: 327.7456647398844% 588.3720930232558%; width: 173px; height: 86px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-hostgator { background-image: url(images/sprite.@2x.png); background-position: 0% 0%; background-size: 192.20338983050846% 755.223880597015%; width: 295px; height: 67px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-law { background-image: url(images/sprite.@2x.png); background-position: 90.5123339658444% 80.67415730337079%; background-size: 1417.5% 829.5081967213115%; width: 40px; height: 61px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-lifehacker { background-image: url(images/sprite.@2x.png); background-position: 69.53488372093022% 29.550321199143468%; background-size: 413.8686131386861% 1297.4358974358975%; width: 137px; height: 39px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-like-blue { background-image: url(images/sprite.@2x.png); background-position: 99.25788497217069% 24.84472049689441%; background-size: 2025% 2200%; width: 28px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-like { background-image: url(images/sprite.@2x.png); background-position: 99.25788497217069% 30.434782608695656%; background-size: 2025% 2200%; width: 28px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-linkedin-white { background-image: url(images/sprite.@2x.png); background-position: 47.43833017077799% 34.54935622317596%; background-size: 1417.5% 1265%; width: 40px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-linkedin { background-image: url(images/sprite.@2x.png); background-position: 78.57142857142857% 71.48936170212767%; background-size: 1620% 1405.5555555555554%; width: 35px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-lock { background-image: url(images/sprite.@2x.png); background-position: 96.83257918552036% 73.00613496932516%; background-size: 3910.344827586207% 2976.470588235294%; width: 14.5px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-mashable { background-image: url(images/sprite.@2x.png); background-position: 70.51886792452831% 44.88517745302714%; background-size: 396.5034965034965% 1874.0740740740741%; width: 143px; height: 27px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-maxcdn { background-image: url(images/sprite.@2x.png); background-position: 76.08142493638677% 0%; background-size: 325.86206896551727% 1265%; width: 174px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-medal { background-image: url(images/sprite.@2x.png); background-position: 90.85714285714286% 42.11711711711711%; background-size: 1350% 816.1290322580646%; width: 42px; height: 62px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-message { background-image: url(images/sprite.@2x.png); background-position: 32.00757575757576% 71.94860813704497%; background-size: 1453.8461538461538% 1297.4358974358975%; width: 39px; height: 39px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-page { background-image: url(images/sprite.@2x.png); background-position: 67.19101123595506% 18.777292576419214%; background-size: 464.75409836065575% 1054.1666666666665%; width: 122px; height: 48px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-plus-slim { background-image: url(images/sprite.@2x.png); background-position: 97.09618874773139% 60.204081632653065%; background-size: 3543.75% 3162.5%; width: 16px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-privacy { background-image: url(images/sprite.@2x.png); background-position: 0% 75.50561797752809%; background-size: 1134% 829.5081967213115%; width: 50px; height: 61px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-reply { background-image: url(images/sprite.@2x.png); background-position: 98.8909426987061% 51.434426229508205%; background-size: 2180.7692307692305% 2811.111111111111%; width: 26px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-rochet-2 { background-image: url(images/sprite.@2x.png); background-position: 100% 0%; background-size: 1771.875% 937.0370370370371%; width: 32px; height: 54px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-rocket { background-image: url(images/sprite.@2x.png); background-position: 90.5123339658444% 13.272311212814644%; background-size: 1417.5% 733.3333333333333%; width: 40px; height: 69px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-search-form { background-image: url(images/sprite.@2x.png); background-position: 97.44990892531877% 55.942622950819676%; background-size: 3150% 2811.111111111111%; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-siteground-small { background-image: url(images/sprite.@2x.png); background-position: 0% 46.25550660792951%; background-size: 354.375% 973.076923076923%; width: 160px; height: 52px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-siteground { background-image: url(images/sprite.@2x.png); background-position: 0% 56.71641791044776%; background-size: 311.53846153846155% 1367.5675675675675%; width: 182px; height: 37px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-star-gray { background-image: url(images/sprite.@2x.png); background-position: 99.44237918215613% 12.10855949895616%; background-size: 1955.1724137931035% 1874.0740740740741%; width: 29px; height: 27px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-star { background-image: url(images/sprite.@2x.png); background-position: 98.34558823529412% 41.735537190082646%; background-size: 2465.2173913043475% 2300%; width: 23px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-stat-big { background-image: url(images/sprite.@2x.png); background-position: 99.44237918215613% 18.580375782881003%; background-size: 1955.1724137931035% 1874.0740740740741%; width: 29px; height: 27px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-store { background-image: url(images/sprite.@2x.png); background-position: 0% 87.93859649122807%; background-size: 961.0169491525423% 1011.9999999999999%; width: 59px; height: 50px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-times { background-image: url(images/sprite.@2x.png); background-position: 77.38589211618257% 55.301455301455306%; background-size: 667.0588235294118% 2023.9999999999998%; width: 85px; height: 25px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter-white { background-image: url(images/sprite.@2x.png); background-position: 80.64516129032258% 18.4549356223176%; background-size: 1417.5% 1265%; width: 40px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter { background-image: url(images/sprite.@2x.png); background-position: 71.2406015037594% 71.48936170212767%; background-size: 1620% 1405.5555555555554%; width: 35px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-venture { background-image: url(images/sprite.@2x.png); background-position: 0% 63.82536382536382%; background-size: 282.08955223880594% 2023.9999999999998%; width: 201px; height: 25px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-web-2 { background-image: url(images/sprite.@2x.png); background-position: 10.8% 72.88503253796095%; background-size: 846.2686567164178% 1124.4444444444443%; width: 67px; height: 45px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-web { background-image: url(images/sprite.@2x.png); background-position: 92.80155642023347% 55.36105032822757%; background-size: 1069.811320754717% 1032.6530612244899%; width: 53px; height: 49px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-wired { background-image: url(images/sprite.@2x.png); background-position: 71.70263788968825% 38.02521008403361%; background-size: 378% 1686.6666666666667%; width: 150px; height: 30px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-wordpress-2 { background-image: url(images/sprite.@2x.png); background-position: 92.98245614035088% 0%; background-size: 1050% 937.0370370370371%; width: 54px; height: 54px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-wordpress { background-image: url(images/sprite.@2x.png); background-position: 34.980237154150196% 15.955056179775282%; background-size: 929.5081967213115% 829.5081967213115%; width: 61px; height: 61px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-y { background-image: url(images/sprite.@2x.png); background-position: 48.20415879017013% 71.94860813704497%; background-size: 1492.1052631578948% 1297.4358974358975%; width: 38px; height: 39px; display: inline-block; vertical-align: middle; font-size: 0; }} .cols:after { content: ''; line-height: 0; display: table; clear: both; } /* ------------------------------------------------------------ *\ I. Generic \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Reset \* ------------------------------------------------------------ */ *, *:before, *:after { padding: 0; margin: 0; outline: 0; box-sizing: border-box; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, main { display: block; } html { tap-highlight-color: rgba(0,0,0,0); } body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; } img, iframe, video, audio, object { max-width: 100%; } img, iframe { border: 0 none; } img { height: auto; display: inline-block; vertical-align: middle; } b, strong { font-weight: bold; } address { font-style: normal; } svg:not(:root) { overflow: hidden; } a, button, input[type="submit"], input[type="button"], input[type="reset"], input[type="file"], input[type="image"], label[for] { cursor: pointer; } a[href^="tel"], button[disabled], input[disabled], textarea[disabled], select[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea, a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } textarea { overflow: auto; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; font-size: inherit; color: inherit; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; } button, select { text-transform: none; } table { width: 100%; border-collapse: collapse; border-spacing: 0; } nav ul, nav ol { list-style: none outside none; } pre {max-width:600px;overflow-x:auto;} /* ------------------------------------------------------------ *\ Base \* ------------------------------------------------------------ */ body { min-width: 320px; background: #f5f6f7; font-family: 'EnzoOT', sans-serif; font-size: 16px; line-height: 1.56; color: #6a7b93; font-weight: 500; letter-spacing: 0.02em; } a { color: inherit; text-decoration: underline; } a:hover { text-decoration: none; } a[href^="tel"] { text-decoration: none; } h1, h2, h3, h4, h5, h6 { margin-bottom: 0.78em; line-height: 1; } h1 { font-size: 45px; } /* 45px; */ h2 { font-size: 40px; } /* 40px; */ h3 { font-size: 21px; } /* 21px; */ h4 { font-size: 18px; } /* 18px; */ h5 { font-size: 15px; } /* 15px; */ h6 { font-size: 14px; } /* 14px; */ /* Tablet Portrait */ @media (max-width: 1023px) { h1 { font-size: 40px; } h2 { font-size: 35px; } } /* Mobile */ @media (max-width: 767px) { h1 { font-size: 45px; } h2 { font-size: 40px; } } p, ul, ol, dl, table, blockquote { margin-bottom: 1.56em; } h1[class], h2[class], h3[class], h4[class], h5[class], h6[class], h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, p:last-child, ul:last-child, ol:last-child, dl:last-child, table:last-child, blockquote:last-child { margin-bottom: 0; } /* ------------------------------------------------------------ *\ Fonts \* ------------------------------------------------------------ */ @font-face { font-family: 'EnzoOT'; src: url('fonts/EnzoOTBold.woff2') format('woff2'), url('fonts/EnzoOTBold.woff') format('woff'); font-weight: bold; font-style: normal; } @font-face { font-family: 'EnzoOT'; src: url('fonts/EnzoOT-Medi.woff2') format('woff2'), url('fonts/EnzoOT-Medi.woff') format('woff'); font-weight: 500; font-style: normal; } /* ------------------------------------------------------------ *\ Helpers \* ------------------------------------------------------------ */ /* Clear */ .clear:after { content: ''; line-height: 0; display: table; clear: both; } /* Notext */ .notext { white-space: nowrap; text-indent: 100%; text-shadow: none; overflow: hidden; } .notext-old { font-size: 0; line-height: 0; text-indent: -4000px; } /* Hidden */ [hidden], .hidden { display: none; } /* Alignleft */ .alignleft { float: left; } /* Alignright */ .alignright { float: right; } /* Disabled */ [disabled], .disabled { cursor: default; } /* Grid */ .cols { margin: 0 -15px; } .cols:after { } .col { float: left; width: 100%; padding: 0 15px; } .col-1of2 { width: 50%; } .grid { display: -ms-grid; display: grid; -ms-grid-columns: 1fr 1fr; grid-template-columns: 1fr 1fr; } .grid > .grid-cell:nth-of-type(1) { -ms-grid-column: 1; grid-column: 1; } .grid > .grid-cell:nth-of-type(2) { -ms-grid-column: 2; grid-column: 2; } .grid > .grid-cell:nth-of-type(3) { -ms-grid-column: 3; grid-column: 3; } .grid > .grid-cell:nth-of-type(4) { -ms-grid-column: 4; grid-column: 4; } .grid > .grid-cell:nth-of-type(5) { -ms-grid-column: 5; grid-column: 5; } .grid--3s { -ms-grid-columns: (1fr)[3]; grid-template-columns: repeat(3, 1fr); } .grid--5s { -ms-grid-columns: (1fr)[5]; grid-template-columns: repeat(5, 1fr); } .grid-container{ display: -ms-grid; display: grid; -ms-grid-columns: 1fr 3.3fr; grid-template-columns: 1fr 3.3fr; -ms-grid-rows: auto auto auto; grid-template-rows: auto auto auto; } /*Grid&IE11Test*/ .grid-title { -ms-grid-column: 2; grid-column: 2; -ms-grid-row: 1; grid-row: 1; } .grid-aside { -ms-grid-column: 1; grid-column: 1; -ms-grid-row: 2; grid-row: 2;} .grid-content { -ms-grid-column: 2; grid-column: 2; -ms-grid-row: 2; grid-row: 2; } .grid-actions { -ms-grid-column: 2; grid-column: 2; -ms-grid-row: 3; grid-row: 3; } @media (max-width: 1023px){ .grid-title, .grid-aside, .grid-content, .grid-actions{ -ms-grid-column: auto; grid-column: auto; -ms-grid-row: auto; grid-row: auto; } .grid-title { grid-area: title; } .grid-aside { grid-area: aside; } .grid-content { grid-area: content; } .grid-actions { grid-area: actions; } .grid-container { -ms-grid-columns: 23% auto auto auto; grid-template-columns: 23% auto auto auto; -ms-grid-rows: auto; grid-template-rows: auto; grid-template-areas: 'title title title title' 'aside aside aside aside' 'content content content content' 'actions actions actions actions'; } } /* Mobile */ @media (max-width: 767px) { .grid { display: block; } } /* Old IE fallback */ .browsehappy { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; margin: 0; padding-top: 50px; background: #e0e0e0; text-align: center; } /* Responsive Helpers */ .visible-xs-block, .visible-xs-inline, .visible-xs-inline-block, .visible-sm-block, .visible-sm-inline, .visible-sm-inline-block, .visible-md-block, .visible-md-inline, .visible-md-inline-block, .visible-lg-block, .visible-lg-inline, .visible-lg-inline-block { display: none !important; } @media (max-width: 767px) { .hidden-xs { display: none !important; } .visible-xs-block { display: block !important; } .visible-xs-inline { display: inline !important; } .visible-xs-inline-block { display: inline-block !important; } } @media (min-width: 768px) and (max-width: 1023px) { .hidden-sm { display: none !important; } .visible-sm-block { display: block !important; } .visible-sm-inline { display: inline !important; } .visible-sm-inline-block { display: inline-block !important; } } @media (min-width: 1024px) and (max-width: 1200px) { .hidden-md { display: none !important; } .visible-md-block { display: block !important; } .visible-md-inline { display: inline !important; } .visible-md-inline-block { display: inline-block !important; } } @media (min-width: 1201px) { .hidden-lg { display: none !important; } .visible-lg-block { display: block !important; } .visible-lg-inline { display: inline !important; } .visible-lg-inline-block { display: inline-block !important; } } .ico-arrow-bottom { position: relative; display: inline-block; border: .5em solid; border-color: currentColor transparent transparent transparent; } .js-cloned-element { display: none; } /* Mobile */ @media (max-width: 767px) { [data-append-to] { display: none; } .js-cloned-element { display: inline-block; } } .lock-screen { position: relative; height: 100%; overflow: hidden; } .figure { position: relative; } .figure:after { content: ''; top: -8px; height: 110px; width: 30px; background-color: #00a4e6; position: absolute; left: -91px; -ms-transform: skewY(16deg); transform: skewY(16deg); } .figure--gray:after { background-color: #8898aa; } .figure--small:after { top: -29px; height: 63px } @media (max-width: 767px){ .figure:after { left: -22px; top: -11px; width: 20px; height: 65px; } } /* ------------------------------------------------------------ *\ Mobile Content \* ------------------------------------------------------------ */ .mobile-content { display: none; } @media (max-width: 767px) { .hidden-mobile { display: none!important; } .mobile-content { display: block; } } .box-shadow { position: relative; } .box-shadow:after { z-index: 1; position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: ""; box-shadow: 0 45px 30px -40px rgba(0,0,0, .2); border-radius: 20%; } .box-shadow .box__inner { z-index: 2; background-color: #fff; position: relative; } .border-bottom { position: relative; padding-bottom: 20px; } .border-bottom:after { content: ""; position: absolute; left: -107px; right: 22px; bottom: 17px; background-color: #b4bdc9; height: 1px; } /* ------------------------------------------------------------ *\ col--size-m \* ------------------------------------------------------------ */ .col--size-m { max-width: 80%; } @media (max-width: 767px){ .col--size-m { max-width: 100%; } } /* ------------------------------------------------------------ *\ II. Regions \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Container \* ------------------------------------------------------------ */ .container { margin-top: 20px; } .container-white { background-color: #fff; } /* ------------------------------------------------------------ *\ Container Compare \* ------------------------------------------------------------ */ .container--compare .section-articles .shell { padding: 65px 77px 108px 86px; } .container--compare .section-articles .section__body {-ms-grid-columns:7.6fr 4.8fr;grid-template-columns:7.6fr 4.8fr; } .container--compare .section-articles .section__aside { padding-left: 44px; } .container--compare .section-articles .article + .article { margin-top: 69px; } .container--compare .section-articles .article h1 { max-width: 550px; margin-bottom: 28px; } .container--compare .section-articles .article--what + .article--what { margin-top: 62px; } .container--compare .section-articles .section__aside .btn--content { margin-bottom: 28px; } .container--compare .section--secondary .shell { padding: 56px 77px 108px 86px } .container--compare .section--secondary .article h1 { max-width: 600px; margin-bottom: 25px; } .container--compare .section--secondary .section__content .article + .article { margin-top: 133px; } .container--compare .section--secondary .section__content .article:nth-child(2) { margin-top: 62px; } .container--compare .section-hosting-plans { margin-bottom: 60px; } .container--compare .section-hosting-plans + .section-articles { margin-top: 64px; } @media (max-width: 1023px){ .container--compare { margin-top: 10px; } .container--compare .section-articles .shell { padding: 40px 20px; } } @media (max-width: 767px){ .container--compare { margin-top: 60px; } .container--compare .section-articles .shell { padding: 43px 11px; max-width: 92%; } .container--compare .section-articles .section__body {-ms-grid-columns:100% 100%;grid-template-columns:100% 100%; } .container--compare .section-articles .article h1 { margin-bottom: 39px; } .container--compare .section-articles .article-author { -ms-flex-align: start; -ms-grid-row-align: flex-start; align-items: flex-start; margin-bottom: 28px; } .container--compare .section-articles .article + .article { margin-top: 40px; } .container--compare .section-articles + .section-articles .article + .article { margin-top: 39px; } .container--compare .section-articles .shell { padding: 15px 0; } } /* ------------------------------------------------------------ *\ Container--coupon \* ------------------------------------------------------------ */ .container--coupon { margin-top: 40px; } .container--coupon .section-articles .shell { padding: 56px 73px 97px 92px; } .container--coupon .section-articles .article h1 { max-width: 600px; margin-left: -5px; } .container--coupon .section-articles .article h2 { margin-bottom: 40px; } .container--coupon .section-articles .article-author { margin-left: -6px; margin-bottom: 28px; } .container--coupon .article + .article { margin-top: 58px; } .container--coupon .section-articles .list-links>li>i { margin-left: 0; } .container--coupon .section-articles .article-about { margin-left: -19px; } .container--coupon .section-articles .section__aside .article--blue { margin-bottom: 35px; } .container--coupon .section-articles .section__aside .article__logo { -ms-transform: scale(0.82); transform: scale(0.82); } @media (max-width: 1023px){ .container--coupon { margin-top: 10px; padding: 0 10px; } .container--coupon .section-articles .shell { padding: 20px 20px 30px 40px; } } @media (max-width: 767px){ .container--coupon { margin-top: 60px; padding: 0 10px; } .container--coupon .section-articles .shell { max-width: 93%; padding: 38px 10px; } .container--coupon .section-articles .article h1 { margin-left: 0; } .container--coupon .article-author .article__head { -ms-transform: translateX(0); transform: translateX(0); } .container--coupon .section-articles .list-links i { margin-right: 16%; } .container--coupon .section-articles .article-about { margin-left: 0; } } /* ------------------------------------------------------------ *\ Container Hostlookup \* ------------------------------------------------------------ */ .container--hostlookup { padding: 140px 0 25px 0; background-color: #f5f6f7; margin-top: 0; } .container--hostlookup .shell { max-width: 1043px; } .container--hostlookup .section--search { margin-bottom: 33px; } .container--hostlookup .article-about { margin-bottom: 90px; } .container--hostlookup .box--accordion { max-width: 650px; margin: 0 auto 57px; } @media (max-width: 767px){ .container--hostlookup { padding-top: 157px; } .container--hostlookup .section--search { margin-bottom: 48px; } .container--hostlookup .box--accordion { max-width: 320px; } } /* ------------------------------------------------------------ *\ Container Hostreview \* ------------------------------------------------------------ */ .container--hostreview { } .container--hostreview .section-articles .shell { padding: 65px 73px 100px 93px; } .container--hostreview .section-articles h1 { max-width: calc(100% + 5px); margin-bottom: 25px; margin-left: -6px; margin-right: -10px; } .container--hostreview .section-articles .article-author { margin-left: -8px; } .container--hostreview .section--primary .section__body { -ms-grid-columns: 60.4% 35% ; grid-template-columns: 60.4% 35% ; } .container--hostreview .section--primary .article > p { width: 96%; } .container--hostreview .section__content .article + .article { margin-top: 50px; } .container--hostreview .article__cols--3cols { margin-bottom: -36px; } .container--hostreview .section-articles .section__body .box--accordion { margin-top: 77px; margin-left: -24px; margin-right: -20px; } .container--hostreview .section-articles .article-about { padding-top: 0; } .container--hostreview .btn--content { margin-bottom: 56px; } .container--hostreview .section__aside .article__inner { margin: 0; } @media (max-width: 1023px){ .container--hostreview .section-articles .shell { padding: 40px 35px 50px 75px; } } @media (max-width: 767px){ .container--hostreview { margin-top: 198px; } .container--hostreview .section-articles .shell { padding: 52px 13px 24px 13px; overflow: visible; } .container--hostreview .section--primary .section__body { -ms-grid-columns: 100% 0% ; grid-template-columns: 100% 0% ; } .container--hostreview .section-articles h1 { padding: 0; margin: 0; margin-left: 0px; padding-left: 15px; margin-bottom: 16px; } .container--hostreview .section-articles .article-author { margin-left: 4px; margin-bottom: 30px; } .container--hostreview .article-author .article__head { -ms-transform: translate(0); transform: translate(0); } .container--hostreview .article.mobile-content { margin-top: 0!important; } .container--hostreview .article.mobile-content .btn { margin-bottom: 16px; } .container--hostreview .section-articles .section__body .box--accordion { margin: 50px 0 60px 0 ; } } @media (max-width: 479px){ .container--hostreview { margin-top: 60px; } .container--hostreview .section-articles .shell { max-width:100%; margin: 0px 10px 50px; padding: 40px 10px 24px 12px; } .container--hostreview .article__logo i { -ms-transform: scale(0.8)!important; transform: scale(0.8)!important; } .container--hostreview .section-articles .section__body .box--accordion { margin: 30px -10px ; } .container--hostreview .article-about .article__head:after { left: 0px; right: 0px; } } /* ------------------------------------------------------------ *\ Container Resources \* ------------------------------------------------------------ */ .container-resources{} .container-resources .section--featured .section__title h4 { width: 65%; } .container-resources .section--featured .form-privacy { max-width: 84%; margin-left: auto; margin-right: auto; } .container-resources .form-privacy .form__controls { max-width: 60%; } .container-resources .section--featured { margin-bottom: 0; } .container-resources>.section--posts:nth-child(3) .shell:before { opacity: 0; } .container-resources .section--posts + .section--posts { margin-bottom: 23px; padding-bottom: 53px; } .container-resources .section--posts .section__foot { padding-top: 31px; } .container-resources .section--posts .section__foot .btn { display: inline-block; } @media (max-width: 1023px){ .container-resources .section--featured { padding-top: 100px; } .container-resources .section--featured .form-privacy { max-width: 100%; } .container-resources .section--featured .form-privacy .form__row { -ms-flex-direction: column; flex-direction: column; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .container-resources .form-privacy .form__controls { padding-right: 20px; margin-left: 0; max-width: unset; width: auto; } .container-resources .section--featured .section__title h4 { width: 90%; } } @media (max-width: 767px){ .container-resources .section--featured { padding-top: 196px; } .container-resources .section--featured .section__title { margin-bottom: 54px; } .container-resources .section--featured .form-privacy { margin-bottom: 29px; } } /* ------------------------------------------------------------ *\ Container Tophost \* ------------------------------------------------------------ */ .container-tophost{} .container-tophost h1 {text-align:center;} .container-tophost .section--featured { margin-bottom: 70px; } .container-tophost .section--featured .socials { -ms-flex-pack: center; justify-content: center; } .container-tophost .section--featured .section__title { margin-bottom: 25px; } .container-tophost .section--featured .section__title h4 { width: 71%; margin-bottom: 26px; } .container-tophost .section--featured .search { -ms-transform: translateY(0); transform: translateY(0); } .container-tophost .article-features + .article-gray { margin-top: 148px; } .container-tophost .article-features + .btn-pink { margin: 20px auto; text-align: center; } .container-tophost .section-articles { margin-top: 60px; } .container-tophost .article .article__cols { margin-left: 0; padding-top: 30px; margin-bottom: 71px; } .container-tophost .section-articles .shell { padding: 102px 73px 80px 173px; } .container-tophost .article .article__cols { -ms-grid-columns: 1.28fr 1fr; grid-template-columns: 1.28fr 1fr; } .container-tophost .article h1 { max-width: 620px; } .container-tophost .article>p { max-width: 85%; } .container-tophost .section-articles .article-author { padding-top: 12px; margin-bottom: 30px; } .container-tophost .article-author .article__head { -ms-transform: translate(0); transform: translate(0); margin-right: 24px; } .container-tophost .article-author h5 { margin-bottom: 5px; } .container-tophost .section-articles .article:nth-child(3) { margin-top: 142px; } .container-tophost .section-articles .article h3 { margin-top: 64px; } .container-tophost .section-articles .list-order { margin-top: 32px; margin-left: 21px; margin-bottom: 19px; } .container-tophost .section-articles .blockquote { margin-left: -5px; } .container-tophost .description ul {margin:30px 0;padding-left:2rem;list-style:url('images/ico-arrow-right.png');} .container-tophost .description ul > li {padding-left:40px;margin-bottom:1em;} .container-tophost .article__list ul {margin-bottom:20px;padding-left:1rem;list-style:url('images/ico-arrow-right.png');} .container-tophost .article__list ul > li {margin-bottom:5px;padding-left:20px;} @media (max-width: 1200px){ .container-tophost .section-articles .shell { padding: 60px 70px; } } @media (max-width: 1023px){ .container-tophost .article-features + .article-gray { margin-top: 50px; } .container-tophost .section-articles .article:nth-child(3) { margin-top: 50px; } } @media (max-width: 767px){ .container-tophost .section--featured .section__title { margin-bottom: 44px; } .container-tophost .section--featured .section__title h2 { max-width: 320px; width: 100%; } .container-tophost .section--featured .section__title h4 { width: 100%; max-width: 350px; margin-bottom: 37px; } .container-tophost .section--featured { margin-bottom: 65px; } .container-tophost .section--featured .search { padding: 0; } .container-tophost .article-gray { margin-bottom: 20px; } .container-tophost .article-gray .shell { padding: 0 20px; } .container-tophost .article-features + .article-features { margin-top: 40px; } .container-tophost .section-articles .shell { padding: 60px 22px; } .container-tophost .section-articles .article__cols { padding-top: 0; display: block; margin-bottom: 46px; } .container-tophost .section-articles .article__col:after { display: none; } .container-tophost .article__col + .article__col { margin:0!important; padding: 0!important; } .container-tophost .section-articles .article-author { margin-bottom: 0; } .container-tophost .section-articles .article-box { margin-left: -22px; margin-right: -22px; } .container-tophost .section-articles .article-box .article__inner { border-radius: 0px; } .container-tophost .article>p { max-width: 96%; } .container-tophost .section-articles .article:nth-child(3) { margin-top: 63px; } .container-tophost .section-articles .list-links { margin-bottom: 19px; } .container-tophost .section-articles .list-links>li>i { margin-right: 45px; margin-left: 6px; } .container-tophost .section-articles .article h3 { margin-top: 45px; } .container-tophost .section-articles .list-order { margin-top: 25px; margin-left: 0; margin-bottom: 50px; } } /* ------------------------------------------------------------ *\ Content \* ------------------------------------------------------------ */ .content {color:#4a5666;} .content li {margin:10px 0;} /* ------------------------------------------------------------ *\ Footer \* ------------------------------------------------------------ */ footer.footer {padding-bottom:80px;} .footer {} .footer .shell-lg { max-width: 1250px; } .footer .footer__header { padding: 73px 0 72px; background: #00a4e6; color: #fff; text-align: center; } .footer .footer__header h2 { font-weight: 500; max-width: 45%; margin-left: auto; margin-right: auto; line-height: 1.2; } .footer .footer__content { padding-top: 66px; padding-bottom: 105px; } .footer .footer__content-inner { display: -ms-flexbox; display: flex; } .footer .footer__column { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: justify; justify-content: space-between; -ms-flex: 0 0 296px; flex: 0 0 296px; max-width: 296px; min-height: 295px; } .footer .footer__column + .footer__column { margin-left: 33px; } .footer .footer__column--md { -ms-flex: 0 0 315px; flex: 0 0 315px; max-width: 315px; } .footer .footer__column--lg { -ms-flex: 0 0 443px; flex: 0 0 443px; max-width: 443px; } .footer .footer__partner-logo { margin-left: 23px; opacity: .3; transition: opacity .3s; } .footer .footer__partner-logo:hover { opacity: 1; } .footer .footer__nav { padding-top: 25px; font-weight: 500; font-size: 18px; } .footer .footer__nav > ul { margin-bottom: 0; } .footer .footer__nav > ul > li + li { margin-top: 17px; } .footer .socials { padding-top: 7px; } .footer .outro { padding-top: 25px; } .footer .footer__links { list-style: none; margin-top: 15px; margin-bottom: 10px; } .footer .footer__links li { display: inline-block; } .footer .footer__links li + li { margin-left: 36px; } .footer .footer__copyright { margin-bottom: 20px; line-height: 1.75; } .footer .footer__copyright p { padding-left: 26px; max-width: 69%; font-size: 14px; } .footer .footer__bar {position:fixed;bottom:0;left:0;width:100%;padding: 7px 80px 7px 25px;z-index:5;line-height:1.5;background: #eee; border: 2px solid #dde2ea; border-left: 0; border-right: 0; text-align: center; font-size: 14px; color: #303030; } .footer .footer__bar a { text-decoration: none; } .footer .footer__bar a:hover { text-decoration: underline; } /* Small Desktop */ @media (max-width: 1200px) { .footer .footer__content { padding-bottom: 40px; } .footer .footer__header h2 { max-width: 80%; } .footer .footer__column { -ms-flex:0 1 auto; flex:0 1 auto; max-width: none; } .footer .footer__column--md { -ms-flex: 0 1 55%; flex: 0 1 55%; max-width: 45%; } .footer .footer__column--lg { -ms-flex: 0 1 100%; flex: 0 1 100%; max-width: 100%; } } /* Tablet Portrait */ @media (max-width: 1023px) { .footer .footer__content { padding-top: 30px; padding-bottom: 45px; } .footer .footer__column { min-height: auto; } .footer .footer__column + .footer__column { margin-left: 20px; } .footer .footer__header { padding: 35px 0; } .footer .footer__nav { padding-top: 0; } .footer .footer__nav > ul > li + li { margin-top: 10px; } .footer .socials { padding-top: 0; } .footer .footer__partner-logo { margin-left: 0; } .footer .footer__links { margin-bottom: 0; } .footer .footer__partner-logo { margin-bottom: 0; } .footer .outro { padding-top: 0; } .footer .footer__copyright p { max-width: 95%; padding-left: 0; } } /* Mobile */ @media (max-width: 767px) { .footer { background: #fff; } .footer .footer__content { padding: 50px 0 0 25px; } .footer .footer__content-inner { -ms-flex-direction: column; flex-direction: column; } .footer .footer__header { padding: 33px 10px 36px; } .footer .footer__header h2 { font-size: 32px; line-height: 1.22; } .footer .footer__column { -ms-flex-order: -2; order: -2; width: 100%; max-width: 100%; } .footer .footer__column--md { -ms-flex-order: 0; order: 0; } .footer .footer__column--lg { -ms-flex-order: -1; order: -1; } .footer .footer__column + .footer__column { margin-left: 0; } .footer .logo { margin-bottom: 41px; } .footer .socials { padding-top: 17px; padding-left: 3px; } .footer .footer__partner-logo { position: absolute; right: 15px; bottom: 73px; } .footer .footer__nav { position: relative; margin-top: 45px; margin-bottom: 29px; } .footer .footer__nav > ul > li + li { margin-top: 17px; } .footer .footer__links { margin-top: 29px; } .footer .footer__copyright { margin-top: 8px; margin-bottom: 46px; padding-left: 11px; } .footer .footer__copyright p { margin-right: 0; max-width: 100%; } .footer .footer__bar { padding: 12px 75px 8px 10px; line-height: 1.71; color: #6a7b93;text-align:left; } } @media (max-width: 375px) { .footer .footer__content { padding-left: 0; } .footer .footer__copyright { padding-left: 0; } } /* ------------------------------------------------------------ *\ Header \* ------------------------------------------------------------ */ .header { padding: 29px 0 0; } .header .header__inner { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; } .header .header__nav { margin-left: auto; } .header .lang-switcher { margin-left: 34px; } .header .hamburger { display: none; } /* Small Desktop */ @media (max-width: 1200px) { .header { padding-top: 20px; } .header .lang-switcher { margin-left: 15px; } } /* Mobile */ @media (max-width: 767px) { .header { padding: 46px 17px 0 9px; } .header .hamburger { position: relative; display: -ms-inline-flexbox; display: inline-flex; margin-top: -16px; z-index: 25; } } @media (max-width: 375px) { .header { padding-top: 25px; padding-left: 0; padding-right: 0; } .header .lang-switcher { margin-left: 0; } } /* ------------------------------------------------------------ *\ Main \* ------------------------------------------------------------ */ .main {} /* ------------------------------------------------------------ *\ Shell \* ------------------------------------------------------------ */ .shell { max-width: 1220px; padding-left: 10px; padding-right: 10px; margin: auto; } .shell-lg { max-width: 1332px; padding-left: 15px; padding-right: 15px; margin-left: auto; margin-right: auto; } .shell-md { max-width: 1242px; padding-left: 10px; padding-right: 10px; margin: auto; } .shell-sm { max-width: 1179px; padding-left: 10px; padding-right: 10px; margin: auto; } .shell-fluid { max-width: none; padding-left: 10px; padding-right: 10px; } /* ------------------------------------------------------------ *\ Sidebar \* ------------------------------------------------------------ */ .sidebar {} /* ------------------------------------------------------------ *\ Wrapper \* ------------------------------------------------------------ */ .wrapper { position: relative; min-height: 100vh; overflow-x: hidden; } /* Mobile */ @media (max-width: 767px) { .wrapper { background: #f5f6f7; } } /* ------------------------------------------------------------ *\ III. Modules \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Accordion \* ------------------------------------------------------------ */ .accordion{} .accordion .ui-accordion-header-icon { display: none; } .accordion .accordion__title { display: -ms-flexbox!important; display: flex!important; -ms-flex-align: center; align-items: center; background-color: transparent!important; border: none!important; padding: 19px 28px!important; border-top: 1px solid #d3d8df!important; border-radius: 0px; } .accordion .accordion__title i { margin-right: 13px; transition: transform 0.3s; } .accordion .accordion__title.ui-state-active i { -ms-transform: rotate(90deg); transform: rotate(90deg); } .accordion .accordion__title p { font-size: 16px; color: #6a7b93; letter-spacing: -0.4px; } .accordion .accordion__title:first-child { border-top: 0!important; } .accordion .accordion__content { border: none; } .accordion .accordion--holder { padding-left: 77px!important; padding-right: 10px!important; padding-bottom: 24px!important; border-top: 1px solid #d3d8df!important; } .accordion .accordion--inner { margin-top: -13px; margin-left: -52px; } .accordion .accordion--inner .accordion__content { margin-top: -25px; padding-left: 77px!important; } .accordion .accordion--inner i { margin-right: 20px; } .accordion .accordion__link { margin-top: 2px; color: #6a7b93; letter-spacing: -0.4px; display: inline-block; text-decoration: none; } .accordion .accordion__link:hover { text-decoration: underline; } .accordion .accordion__link + .accordion__link { margin-top: 20px; } /* ------------------------------------------------------------ *\ Media \* ------------------------------------------------------------ */ @media (max-width: 767px){ .accordion .accordion__title { padding: 19px 17px!important; } } /* ------------------------------------------------------------ *\ Article \* ------------------------------------------------------------ */ .article {position:relative;} .article p { color: #2b2b2b; font-size: 18px; letter-spacing: 0.35px; margin-bottom: 14px; } .article .link-more { font-size: inherit; } .article h1 { letter-spacing: 0px; max-width: 500px; line-height: 1.2; margin-bottom: 20px; } .article h2 { font-size: 28px; color: #6a7b93; letter-spacing: 0.7px; margin: 30px 0 20px; } .article h2:first-child {margin-top:0;} .article h2 span { font-weight: 500; line-height: 1.5; display: inline-block; } .article h3 { font-size: 22px; color: #2b2b2b; margin-top:35px;margin-bottom: 23px; } .article h4 {margin:20px 0 10px;} .article .article__img { margin-top: 92px; margin-bottom: 43px; border-radius: 10px; overflow: hidden; border: 1px solid #b4bdc9; } .article .article__img img { width: 100%; } .article__img--text { position: relative; } .article .article__img .article-text{ position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); color: #fff; text-align: center; } .article .article__img .article-text h5 { text-transform: uppercase; margin-bottom: 0; font-size: 16px; letter-spacing: 3px } .article .article__img .article-text h1 { margin: 16px 0 22px; font-size: 50px; } .article .article__pagging { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; } .article .article__body + .article__pagging { margin-top: 54px; } .article .article__cols { margin-left: -71px; padding-top: 62px; -ms-grid-columns: 1.08fr 1fr; grid-template-columns: 1.08fr 1fr; margin-bottom: 36px; } .article .article__cols .article__col + .article__col { padding: 5px 0 0 27px; } .article .article__cols .article__col h2 { margin-bottom: 7px; } .article .article__cols .article__col p { margin-bottom: 10px; } .article .article__cols .article-box { margin-bottom: 0; } .article .article__cols .article-box .article__inner { padding-top: 48px; } .article .article__cols--3cols { margin-left: -43px; padding-top: 30px; -ms-grid-columns: (33%)[3]; grid-template-columns: repeat(3, 33%); -ms-flex-pack: justify; justify-content: space-between; } .article .article__cols--3cols .article__col + .article__col { padding: 0; padding-left: 4px; } .article .article__cols--3cols .article--secondary .article__inner { padding-top: 38px; padding-bottom: 10px; } .article .article__cols--3cols .article__logo { height: 41px; } .article .article__cols--3cols .rating { -ms-transform: scale(0.82); transform: scale(0.82); } .article .article__cols--3cols .article__col .list-links { padding-left: 10px; margin-bottom: 31px; } .article .article__cols--3cols .article--featured .btn--read { padding: 7px 0; font-size: 16px; } .article .article__actions { text-align: center; } .article .article__btn--left { max-width: 175px; width: 100%; -ms-flex-pack: center; justify-content: center; margin-left: -45px; } @media (max-width: 1200px){ .article .article__cols--3cols .article__logo { -ms-transform: scale(0.8); transform: scale(0.8); } .article .article__cols--3cols .article--secondary .article__inner { padding: 30px 4px 10px; } .article .article__cols--3cols .article__logo { margin-bottom: 15px; } .article .article__cols--3cols .article__col .list-links { padding-left: 5px; } } @media (max-width: 1023px){ .article .article__cols--3cols { margin-left: -60px; margin-right: -30px; } } @media (max-width: 767px) { .article .article__img { margin-top: 30px; margin-bottom: 33px; } .article .article__head { margin-bottom: 23px; } .article h2.figure { padding-left: 27px; line-height: 1.2; margin-bottom: 20px; } .article .article-box.mobile-content { margin-top: 69px; } .article__cols { margin-left: 0px; padding-top: 40px; -ms-grid-columns: 100%; grid-template-columns: 100%; margin-bottom: 36px; } .article__cols .article__col + .article__col { padding: 0; margin-top: 43px; } .article .article__cols--3cols { margin-left: -5px; padding-top: 14px; margin-right: -5px; margin-bottom: 30px; } .article .article__cols--3cols .article__col + .article__col { padding-left: 0; margin-top: -10px; } .article .article__cols--3cols .article__logo { -ms-transform: scale(1.2); transform: scale(1.2); margin-bottom: 20px!important; } .article .article__cols--3cols .article--secondary .article__inner { padding: 40px 4px 37px; } .article .article__cols--3cols .article--secondary .list-links { text-align: center; max-width: 100%; padding-left: 0; } .article .article__cols--3cols .article--secondary .btn { max-width: 188px; } .article .article__btn--left { margin-left: 0; } } .container--article .article ul {margin:30px 0;padding-left:2rem;list-style:url('images/ico-arrow-right.png');} .container--article .article ul > li {padding-left:40px;color:#2b2b2b;font-size:18px;} /* ------------------------------------------------------------ *\ Article How \* ------------------------------------------------------------ */ .article--how { margin-bottom: 78px; } .article--how .article__head { margin-left: -4px; } .article--how .list-tags { margin-bottom: 33px; } .article--how .socials { max-width: 402px; margin-bottom: 23px; } @media (max-width: 767px){ .article--how { margin-bottom: 57px; } .article--how .list-tags { margin-bottom: 28px; } .article--how .socials { max-width: 402px; margin-bottom: 11px; } } /* ------------------------------------------------------------ *\ Article Heading \* ------------------------------------------------------------ */ .article--heading { margin-left: 1px; } .article--heading h2.figure:after { background-color: #8898aa; } .article--heading .list-links { margin-top: 29px; margin-bottom: 71px; } .article--heading p { margin-left: 1px; } .article--heading .list-order { margin-top: 24px; margin-bottom: 60px; } @media (max-width: 767px){ .article--heading h2 { font-size: 30px; padding: 0 23px;} .article--heading h2.figure:after { left: -27px; top: 0px; } .article--heading .list-links { margin-bottom: 44px; } .article--heading .list-order { margin-bottom: 50px; } } /* ------------------------------------------------------------ *\ Article Box \* ------------------------------------------------------------ */ .article-box { position: relative; margin-bottom: 58px; } .article-box:after { z-index: 1; position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: ""; box-shadow: 0 45px 30px -40px rgba(0,0,0, .2); border-radius: 20%; } .article-box .article__inner{ border: 1px solid #d3d8df; border-radius: 15px; overflow: hidden; margin: 0 3px 0; position: relative; z-index: 2; background-color: #fff; } .article-box .article__title { z-index: 3; } .article-box .article__head { background-color: #8898aa; color: #fff; padding: 19px 29px; font-size: 18px; } .article-box .article__head p { margin-bottom: 0; } .article-box .article__body { padding: 3px 0 19px; } .article-box .list-support { margin-bottom: 54px; } .article-box .article--blue .article__head { background-color: #00a4e6; } .article-box.article--white .article__inner {border:1px solid #00a4e6;} @media (max-width: 767px){ .article-box { margin-bottom: 24px; } .article-box .article__inner{ margin: 0; } .article-box .article__head { padding: 21px 22px; font-size: 18px; } .article-box .article__body { padding: 3px 0; } .article-box .list-support { padding: 0; } } /* ------------------------------------------------------------ *\ Article About \* ------------------------------------------------------------ */ .article-about { text-align: center; max-width: 605px; margin: auto; } .article-about h4 { color: #6a7b93; margin-bottom: 19px; } .article-about .article__head { position: relative; margin-bottom: 11px; } .article-about .article__head:after { content: ''; height: 1px; left: 0; right: 0; background-color: #b4bdc9; top: 44%; z-index: 1; position: absolute; } .article-about figure { height: 109px; width: 109px; border-radius: 50%; overflow: hidden; position: relative; z-index: 2; display: inline-block; } .article-about figure img { width: 100%; } .article-about .article__body { margin-bottom: 25px; } .article-about .article__body p { font-size: 18px; color: #2b2b2b; } .article-about .article__foot h4 { margin-bottom: 28px; } .article-about .socials { -ms-flex-pack: center; justify-content: center; } @media (max-width: 767px){ .article-about .article__head:after { left: -30px; right: -30px; } .article-about .article__body { margin-bottom: 30px; } } /* ------------------------------------------------------------ *\ Article Blue \* ------------------------------------------------------------ */ .article--blue{} .article--blue .article__head { background-color: #00a4e6; } .article--blue .article__head p { color: #fff } /* ------------------------------------------------------------ *\ Article White \* ------------------------------------------------------------ */ .article--white{} .article--white .article__head {background-color:#fff;color:#00a4e6;} .article--white .article__head p { } /* ------------------------------------------------------------ *\ Article Text \* ------------------------------------------------------------ */ .article--text {} .article--text .article__body { padding: 33px 32px 47px; } /* ------------------------------------------------------------ *\ Article Autor \* ------------------------------------------------------------ */ .article-author { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: center; align-items: center; } .article-author .article__head { width: 80px; height: 80px; margin-right: 7px; -ms-transform: translateX(-16px); transform: translateX(-16px); } .article-author .article__head img { width: 100%; border-radius: 50%; } .article-author .article__body { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 1; flex-grow: 1; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: start; align-items: flex-start; } @media (max-width: 1023px){ .article-author .article__body { -ms-flex-direction: column; flex-direction: column; } .article-author .article__meta { margin-bottom: 5px; } .article-author .article__meta h5{ margin-bottom: 0px; } } @media (max-width: 767px){ .article-author .article__head { -ms-transform: translate(0, 0); transform: translate(0, 0); margin-right: 18px; } .article-author .article__body { padding-top: 20px; } .article-author .article__meta { margin-bottom: 15px; } .article-author .article__meta h5 { margin-bottom: 7px; font-size: 16px; } .article-author .article__meta span { font-size: 15px; } } /* ------------------------------------------------------------ *\ Article What \* ------------------------------------------------------------ */ .article--what { } .article--what h3 { margin-top: 44px; } .article--what .btn-pink { margin-top: 14px; } .article--what h4 { margin-top: 30px; margin-left: 6px; } .article--what .list-links i { margin-left: 8px; margin-right: 12px; } @media (max-width: 767px){ .article--what h3 { margin-top: 25px; line-height: 1.5; } .article--what .btn-pink { margin-top: 3px; } } /* ------------------------------------------------------------ *\ Article Featured \* ------------------------------------------------------------ */ .article--featured .article__inner { border: 1px solid #b4bdc9; border-radius: 15px; text-align: center; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: center; align-items: center; padding: 50px 10px 44px; } .article--featured h2 { margin-bottom: 24px; max-width: 320px; margin: 0 auto 24px; } .article--featured .article__text { max-width: 267px; font-size: 16px; line-height: 1.35; margin-bottom: 22px; } .article--featured .list-checked { margin-bottom: 18px; } .article--featured .article__logo { margin-bottom: 25px; } .article--featured .rating i + i { margin-left: 2px; } .article--featured .rating { margin-bottom: 9px; } .article--featured .link-more { margin-bottom: 20px; } .article--featured .btn--red { margin-bottom: 11px; } .article--featured .article__title { background-color: #00a4e6; width: 60px; height: 60px; border-radius: 50%; overflow: hidden; display:-ms-flexbox; display:flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; font-weight: 700; color: #fff; font-size: 25px; position: absolute; top: 0; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 3; } .article--featured .btn--read { max-width: 250px; width: 100%; padding: 16px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .article--featured .btn--read i { margin-left: 6px; } .article--featured .list-links { text-align: left; } .article--featured .article__hint { font-size: 12px; color: #6a7b93; } .article--featured .article-offer { margin-bottom: 15px; } .article--featured .btn-discount { margin-bottom: 5px; } .article--featured .article__hint { margin-top:10px;max-width: 89%; } @media (max-width: 1023px){ .article--featured .article__logo { -ms-transform: scale(0.8); transform: scale(0.8); margin-bottom: 10px!important; } } @media (max-width: 767px){ .article--featured.mobile-content { margin-left: -8px; margin-right: -8px; } .article--featured .article__logo { -ms-transform: scale(1); transform: scale(1); } .article--featured .logo-discount { max-width: 93%; margin: auto; } } /* ------------------------------------------------------------ *\ Article Secondary \* ------------------------------------------------------------ */ .article--secondary .article__inner { padding-top: 65px; } .article--secondary .article__logo { margin-bottom: 37px; } .article--secondary .article__inner .rating { margin-bottom: 7px; } .article--secondary .link-more { margin-bottom: 24px; } .article--secondary .list-links { text-align: left; max-width: 234px; width: 100%; margin-bottom: 40px; } .article--secondary .list-links>li>i { margin-left: 0px; margin-right: 11px; } /* ------------------------------------------------------------ *\ Article Discount \* ------------------------------------------------------------ */ .article-discount{ background-color: #00a4e6; text-align: center; border-radius: 15px; border: 1px solid #b4bdc9; padding: 44px 10px 47px; } .article-discount h3 { color: #fff; font-size: 28px; margin-bottom: 6px; } .article-discount p { color: #fff; font-size: 26px; margin-bottom: 17px; } .article-discount .logo-discount { position: relative; z-index: 2; } .article-discount .btn-discount { position: relative; } .article-discount .btn-discount:after { content: ''; box-shadow: 15px 10px 148px 0px rgba(0, 0, 0, 0.36); content: ''; position: absolute; left: 10px; right: 8px; bottom: 20px; top: 10px ; } @media (max-width: 767px){ .article-discount h3 { margin-bottom: 17px; } .article-discount p { line-height: 1.2; margin-bottom: 22px; } } /* ------------------------------------------------------------ *\ Article Ico \* ------------------------------------------------------------ */ .article-ico{ position: relative; } .article-ico:after { content: ''; position: absolute; right: 25px; top: 50%; width: 15px; height: 2px; background-color: #fff; margin-top: -1px; } /* ------------------------------------------------------------ *\ Article Mark \* ------------------------------------------------------------ */ .article-mark { background-color: #f5f6f7; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; width: calc(100% + 17px); -ms-flex-align: center; align-items: center; padding: 17px 0px; margin-bottom: -44px; -ms-flex-pack: center; justify-content: center; } .article-mark figure { margin-right: 14px; } .article-mark p { max-width: 170px; text-align: left; color: #6a7b93; font-size: 16px; margin-top: 11px; line-height: 1.3; padding-left: 4px; } @media (max-width: 767px){ .article-mark figure { margin-right: 4px; } .article-mark p { font-size: 15px; } } /* ------------------------------------------------------------ *\ Article Offer \* ------------------------------------------------------------ */ .article-offer {} .article-offer p { color: #6a7b93; font-size: 16px; margin-bottom: 0; } .article-offer h5 { color: #00a4e6; font-size: 33px; margin: 10px auto 7px; } /* ------------------------------------------------------------ *\ Article Big \* ------------------------------------------------------------ */ .article--big { max-width: 770px; margin: auto; } .article--big + .article--big {margin-top: 51px; margin-bottom: 86px; } .article--big .article__inner { background-color: #fff; padding: 70px 20px; } .article--big h1 { font-size: 55px; color: #00a4e6; font-weight: 500; letter-spacing: 1.1px; margin-top: -25px; margin-bottom: 13px; } .article--big h2 { font-size: 40px; font-weight: 500; max-width: 100%; margin-bottom: 17px; line-height: 1.2; } .article--big h4 { margin-bottom: 10px; } .article--big .article__text { font-size: 20px; max-width: 100%; color: #6a7b93; } .article--big .article__text--s { font-size: 17px; margin-bottom: 9px; } .article--big .article__text--xs { font-size: 16px; margin-bottom: 16px; } .article--big .article__logo { margin-bottom: 10px; } .article--big .article__img--big { margin-top: 0; border-radius: 21px; border-color: transparent; margin-bottom: 20px; } .article--big .list-checked { max-width: 366px; margin-bottom: 31px; } .article--big .list-checked i { -ms-transform: scale(1.4); transform: scale(1.4); } .article--big .link-more { margin-bottom: 23px; } .article--big .article__actions { padding-top: 15px; } .article--big .article__actions .btn--light-red { width: 301px; } .article--big .article__actions .btn--light-red i { margin-left: 9px; } @media (max-width: 767px){ .article--big { max-width: 89%; } .article--big .article__inner { padding: 35px 20px; } .article--big .article__inner h1 { font-size: 32px; margin-top: 0; font-weight: 700; margin-bottom: 22px; } .article--big .article__inner h2 { margin-bottom: 9px; } .article--big .article__inner h4 { margin-bottom: 18px; } .article--big .article__text { margin-bottom: 40px; } .article--big .article__text--s { font-size: 18px; margin-bottom: 14px; } .article--big .article__text--xs { margin-bottom: 22px; } .article--big .article__logo { margin-bottom: 44px!important; } .article--big .article__img--big { margin-left: -2px; margin-right: -2px; margin-bottom: 25px; } .article--big .rating { margin-bottom: 20px; } .article--big .list-checked { max-width: 95%; margin-bottom: 34px; } .article--big .btn-discount { max-width: 100%; } .article--big .logo-discount { max-width: 100%; } } @media (max-width: 479px){ .article--big .article__inner { padding: 25px 20px } .article--big .article__inner h2 { font-size: 35px; } .article--big .article__inner h1 { font-size: 25px; font-weight: 500; } .article--big .list-checked, .article--big .article__logo, .article--big .article__text { margin-bottom: 20px!important; } } /* ------------------------------------------------------------ *\ Article Jump \* ------------------------------------------------------------ */ .article-jump{ max-width: 1028px; width: 100%; margin: 0 auto 22px; } .article-jump h4 { margin-bottom: 18px; } .article-jump .list-support { -ms-grid-columns: 32% 32% 32%; grid-template-columns: 32% 32% 32%; grid-column-gap: 0; -ms-flex-pack: justify; justify-content: space-between; padding: 0; grid-row-gap: 23px; } .article-jump .list-support li { background-color: #fff; transition: background .3s; height: 134px; vertical-align: middle; display:-ms-flexbox; display:flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .article-jump .list-support li i { margin-bottom: 13px; } .article-jump .list-support li h4 { max-width: 300px; } .article-jump li:hover { background-color: rgba(0, 164, 230, 0.3); } .article-jump li.active { background-color: #00a4e6; border-color: #00a4e6; color: #fff; } .article-jump li.active:hover { background-color: rgba(0, 164, 230, 0.8); } .article-jump .article__summary { text-transform: capitalize; text-decoration: none; display: inline-block; float: right; margin-right: 25px; padding-top: 10px; } .article-jump .article__summary strong { -ms-transform: rotate(45deg); transform: rotate(45deg); display: inline-block; font-size: 18px; margin-left: 7px; } @media (max-width: 1023px){ .article-jump .list-support { -ms-grid-columns: 45% 45%; grid-template-columns: 45% 45%; -ms-flex-pack: distribute; justify-content: space-around; } .article-jump .list-support li { -ms-grid-column: auto; grid-column: auto; } } @media (max-width: 767px){ .article-jump { margin-bottom: 32px; } .article-jump h4 { margin-left: 4px; } .article-jump .list-support { display: block; } .article-jump .list-support li + li { margin-top: 17px; } .article-jump .article__summary { margin-right: 4px; } } /* ------------------------------------------------------------ *\ Article Gray \* ------------------------------------------------------------ */ .article-gray { margin-bottom: 40px; } .article-gray .shell { max-width: 1050px; } .article-gray h2 { margin-bottom: 35px; } .article-gray p { font-size: 18px; max-width: 950px; } /* ------------------------------------------------------------ *\ Article Features \* ------------------------------------------------------------ */ .article-features { max-width: 1170px; margin: auto; } .article-features .box__inner { border-radius: 15px; border: 1px solid #b4bdc9; overflow: hidden; } .article-features + .article-features { margin-top: 83px; } .article-features .list-links { margin-bottom: 20px; } .article-features .list-links li { position: relative; padding-left: 35px; } .article-features .list-links li i { position: absolute; top: 8px; left: -16px; } .article-features .list-links li + li { margin-top: 11px; } .article-features .article__body { -ms-grid-columns: 36% auto; grid-template-columns: 36% auto; } .article-features .article__aside { text-align: center; padding: 41px 0 17px; text-align: center; } .article-features .article__aside .article__img { margin-bottom: 21px; } .article-features .article__aside .article__img img { border-radius:20px;border:1px solid #eee; } .article-features .article__aside .btn-filter, .article-features .article__aside .btn { margin: 0 auto 4px; max-width: 251px; font-size: 18px; width: 100%; } .article-features .article__aside .btn + a { margin-bottom: 11px; display: block; } .article-features .article__aside .btn-filter { padding: 15px 0; -ms-flex-pack: center; justify-content: center; border-radius: 30px; } .article-features .article__content { padding: 35px 15px; } .article-features .article__content a { font-size: 16px; } .article-features .article__content h2 { font-weight: 500; margin-bottom: 15px; } .article-features .article__content h3 { font-weight: 500; font-size: 20px; margin-bottom: 19px; } .article-features .article__content .review-stars-link { display:flex; } .article-features .article__content .rating { margin-bottom: 21px;margin-right:30px; } .article-features .article__content .rating .stars { height:22px;width:125px; } .article-features .article__content .rating i + i { margin-left: 1px; } .article-features .group { display:flex;align-items:center; } .article-features .article__prices { margin-left:30px;text-align: center; } .article-features .article__prices h4 { font-size: 18px; font-weight: 500; margin-bottom: 10px; } .article-features .article__prices h3 { font-size: 24px; color: #00a4e6; margin-bottom: 4px; } .article-features .article__prices p { margin-bottom:5px;font-size: 18px; } .article-features .article__foot { -ms-grid-columns: 33% 33% 33%; grid-template-columns: 33% 33% 33%; border-top: 1px solid #b4bdc9; } .article-features .article__foot .list-links li + li { margin-top: 5px; } .article-features .article__col { display:-ms-flexbox; display:flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: start; align-items: flex-start; padding: 38px 0 15px; } .article-features .article__col + .article__col { border-left: 1px solid #b4bdc9; } .article-features .article__ico { margin-right: 25px; } .article-features--mobile { display: none; } @media (max-width: 1023px){ .article-features .article__prices { padding-top: 20px; padding-right: 10px; } } @media (max-width: 767px){ .article-features { display: none; } .article-features--mobile { display: block; text-align: center; border-radius: 15px; border: 1px solid #b4bdc9; overflow: hidden; background-color: #fff; margin: 0 20px; padding: 36px 20px 0; } .article-features--mobile .article__img { margin-bottom: 30px; } .article-features--mobile h2 { text-align: center; font-size: 35px; font-weight: 500; margin-bottom: 20px; } .article-features--mobile>p { text-align: center; font-size: 17px; line-height: 1.4; margin-bottom: 16px; } .article-features--mobile .rating { display: -ms-inline-flexbox; display: inline-flex; margin-left: 17px; -ms-transform: scale(.8); transform: scale(.8); -ms-transform-origin: left center; transform-origin: left center; margin-bottom: 20px; margin-left: auto; } .article-features--mobile .link--blue { vertical-align: top; margin-left: -12px; } .article-features--mobile .article__prices { text-align: center; padding: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; margin-bottom: 29px; } .article-features--mobile .article__prices h4 { margin-bottom: 0; } .article-features--mobile .article__prices h3 { margin: 0 10px; } .article-features--mobile .btn--green { max-width: 250px; margin: 0 auto 6px; } .article-features--mobile { text-align: center; } .article-features--mobile .btn-filter { max-width: 250px; display: block; text-align: center; margin: auto; padding: 14px 0; margin-top: 10px; border-radius: 30px; font-size: 18px; margin-bottom: 29px; } .article-features--mobile .description { text-align:left; } .article-features--mobile .description ul { padding-left:1rem; } .article-features--mobile .description ul > li { padding-left:5px; } .article-features--mobile .article__list { text-align:left; } } /* ------------------------------------------------------------ *\ Article Forms \* ------------------------------------------------------------ */ .article-forms { text-align: center; padding-top: 20px; margin-bottom: 70px; } .article-forms .btn-pink { margin-bottom: 45px; } @media (max-width: 767px){ .article-forms { padding-top: 60px; margin-bottom: 60px; } .article-forms .search { margin: 0 20px; width: auto; } } /* ------------------------------------------------------------ *\ Bar \* ------------------------------------------------------------ */ .bar { margin-bottom: 78px; } .bar .bar__content > ul { margin-left: -28px; } .bar .bar__title { display: block; padding-left: 74px; margin-bottom: 44px; font-size: 20px; } @media(max-width: 1400px){ .bar .bar__content > ul { margin-left: 0; } } /* Tablet Portrait */ @media (max-width: 1023px) { .bar { margin-bottom: 50px; } .bar .bar__title { margin-bottom: 25px; } } /* Mobile */ @media (max-width: 767px) { .bar { padding-top: 3px; margin-bottom: 81px; } .bar .bar__title { margin-bottom: 37px; padding-left: 47px; } } /* ------------------------------------------------------------ *\ Blockquote \* ------------------------------------------------------------ */ .blockquote { position: relative; padding: 62px 0 0 0; max-width: 330px; } .blockquote:before, .blockquote:after { position: absolute; content: ''; background-image: url(../css/images/ico-open-quotes.png); width: 54px; height: 42px; background-size: cover; background-position: center; background-repeat: no-repeat; top: 0px; left: 0px; } .blockquote:before { bottom: 5px; right: 72px; left: auto; top: auto; background-image: url(../css/images/ico-close-quotes.png); } .blockquote p { font-size: 32px; color: #8898aa; font-weight: 500; line-height: 1.44; letter-spacing: 0.6px; margin-bottom: 29px!important; } .blockquote a { color: #8898aa; display: inline-block; margin-left: 3px; font-size: 18px; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi){ .blockquote:before { background-image: url(../css/images/ico-open-quotes@2x.png); } .blockquote:after { background-image: url(../css/images/ico-close-quotes@2x.png); } } @media (max-width: 767px){ .blockquote { margin-top: 62px; } .blockquote p { font-size: 29px; line-height: 1.37; padding-left: 12px; } .blockquote:after { left: 16px; } .blockquote:before { right: 28px; } .blockquote:before, .blockquote:after { -ms-transform: scale(-1); transform: scale(-1); } } /* ------------------------------------------------------------ *\ Box \* ------------------------------------------------------------ */ .box { border-radius: 15px; border: 1px solid #b4bdc9; overflow: hidden; } .box__head { background-color: #00a4e6; padding: 21px 10px; } .box__head p, .box__head h2 { margin:0;color: #fff; font-size: 16px; font-weight: 500; text-align: center; } .box--gray .box__head { background-color: #8898aa; } /* ------------------------------------------------------------ *\ Box Accordion \* ------------------------------------------------------------ */ .box--accordion { margin-left: -16px; margin-right: -26px; padding-bottom: 7px; background-color: #fff; } .box--accordion .box__head { padding: 20px 35px; } .box--accordion .box__head p, .box--accordion .box__head h2 { text-align: left; } .box--accordion .box__body { padding: 50px 37px; } .box--accordion .box__body p { color: #2b2b2b; } .box--accordion h4 { color: #2b2b2b; margin-bottom: 22px; } .box--accordion p { font-size: 18px; } .box--accordion p + h4 { margin-top: 42px; } .box--accordion .accordion__title { position: relative; padding: 17px 36px !important; } .box--accordion .accordion__title i { position: absolute; top: 50%; right: 16px; -ms-transform: translate(0, -50%); transform: translate(0, -50%); -ms-transform-origin: center center; transform-origin: center center; } .box--accordion .accordion__title p { margin-bottom: 0; color: #6a7b93; font-size: 18px; } .box--accordion .accordion__content>p { color: #6a7b93; } @media (max-width: 767px){ .box--accordion { margin-left: 0; margin-right: 0; padding-bottom: 7px; } .box--accordion .box__head { padding: 17px 19px; } .box--accordion .box__body { padding: 34px 20px; } .box--accordion p + h4 { margin-top: 30px; } .box--accordion .accordion__title { padding: 17px 27px 17px 17px !important; } .box--accordion .accordion__title i { margin-right: 0; } } /* ------------------------------------------------------------ *\ Box--accordion-big \* ------------------------------------------------------------ */ .box--accordion-big { margin-left: 0; margin-right: 0; } .box--accordion-big p { letter-spacing: -0.1px; } .box--accordion-big .accordion__title { padding: 18px 68px 17px !important; } .box--accordion-big .accordion__content.ui-accordion-content { padding: 13px 68px 53px; } .box--accordion-big .accordion__content p { line-height: 1.5; } .box--accordion-big .accordion__title i { top: 50%; right: 73px; -ms-transform: translate(0, 0%) rotate(90deg) ; transform: translate(0, 0%) rotate(90deg) ; } .box--accordion-big .accordion__title i { } .box--accordion-big .accordion__title.ui-state-active i { -ms-transform: rotate(-90deg); transform: rotate(-90deg); } /* ------------------------------------------------------------ *\ Button \* ------------------------------------------------------------ */ .btn { position: relative; transform: perspective(1px); display: inline-block; padding: 16px 40px; color: #fff; text-decoration: none; border:none;border-radius: 50px; background: #2ed262; font-size: 18px; font-weight: 500; vertical-align: middle; text-align: center; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; overflow: hidden; transition: box-shadow .3s; } .btn:hover { box-shadow: 0 5px 15px -5px rgba(0,0,0, .2); } .btn:hover:after { -ms-transform: scale(2); transform: scale(2); } .btn:after { z-index: -1; position: absolute; top: 0; left: 0; right: 0; bottom: 0; -ms-transform: scale(0); transform: scale(0); background: rgb(88, 219, 129); content: ""; transition: transform .3s; border-radius: 50%; } .btn--small { font-size: 16px; padding: 9px 25px 10px!important; } .btn--xsmall { width:auto!important;font-size: 15px; padding: 5px 15px 5px!important; } .btn--light { background: #fff; border: 1px solid #dde2ea; color: #6a7b93; transition: color .3s, border-color .3s, box-shadow .3s; } .btn--light:hover { border-color: #2ed262; color:#fff; } /* Button Block */ .btn-block { display: block; padding-left: 0; padding-right: 0; } .btn--read { padding: 6px 38px; background-color: #00a4e6; } .btn--read:after { background-color: #395599; } .btn--gray { background-color: transparent; color: #6a7b93; border: 2px solid #b4bdc9; padding: 3px 26px; font-size: 20px; transition: color, 0.2s; } .btn--gray:after { background-color: #868e9b; } .btn--gray:hover { color: #fff; } .btn-comment { text-decoration: none; color: #818181; font-size: 18px; } .btn-comment i { margin-right: 4px; } .btn-comment i + i { display: none; } .btn-comment span { vertical-align: middle; } .btn-comment.active span { font-weight: 700; } .btn-comment.active { color: #00a4e6; } .btn-comment.active i { display: none; } .btn-comment.active i + i { display: inline-block; } .btn--big { padding: 15px 76px; } .btn--mobile { display: none; } .btn--content i { margin-left: auto; } @media (max-width: 767px){ .btn--mobile { display: -ms-flexbox; display: flex; padding: 0; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; padding: 19px 25px; margin-top: 30px; border-radius: 14px; } } .btn-pink { text-decoration: none; display: inline-block; background-color: #ff00ff; color: #fff; padding: 0px 17px; line-height: 1.4; } .btn-pink:hover { text-decoration: underline; } .btn-blue { background-color: #01a4e5; color: #fff; } .btn-blue:after {content:none;} .btn-white { background-color: #fff; color: #01a4e5;border:1px solid #01a4e5; } .btn-white:after {content:none;} .btn--content { padding: 20px 29px 20px 32px; width: 100%; border-radius: 11px; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; } .btn--red { background-color: #e41b13; max-width: 250px; padding: 16px 0px; width: 100%; } .btn--red:after { background-color: #b42823; } .btn-filter { display: -ms-inline-flexbox; display: inline-flex; -ms-flex-align: center; align-items: center; text-decoration: none; color: #6a7b93; font-size: 16px; border: 2px solid #b4bdc9; padding: 6px 15px; border-radius: 18px; font-weight: 500; transition: background-color .2s; } .btn-filter:hover { background-color: #ebebeb;text-decoration:none; } .btn-filter i { margin-right: 10px; } .btn-pagging { color: #00a4e6; font-weight: 500; text-decoration: none; font-size: 18px; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } .btn-pagging span { margin: 0 14px; } /* ------------------------------------------------------------ *\ Btn Offer \* ------------------------------------------------------------ */ .btn--offer { color: #fff; background-color: #00a4e6; -ms-flex-align: center; -ms-grid-row-align: center; align-items: center; padding: 19px 25px; -ms-flex-pack: start; justify-content: flex-start; } .btn--offer i { margin-left: 0; } .btn--offer h3 { color: #fff; margin-bottom: 0; margin-left: 14px; font-size: 20px; } .btn--offer p { color: #fff; margin-bottom: 0; margin-left: 9%; font-size: 19px; } @media (max-width: 1200px){ .btn--offer { padding: 18px 10px; -ms-flex-pack: justify; justify-content: space-between; } .btn--offer i, .btn--offer p { margin: 0; } .btn--offer h3 { margin: 0; font-size: 20px; } } @media (max-width: 1023px){ .btn--offer { padding: 12px 10px; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } .btn--offer h3 { margin-left: 15px; } .btn--offer p { width: 100%; } } @media (max-width: 767px){ .btn--offer { -ms-flex-direction: column; flex-direction: column; padding: 24px 10px; } .btn--offer i { margin-bottom: 12px; } .btn--offer h3 { margin-bottom: 5px; } } .btn-discount { display: inline-block; background-color: transparent; } /* ------------------------------------------------------------ *\ Btn Table \* ------------------------------------------------------------ */ .btn--light-red { background-color: #e60e6b; font-size: 18px; padding: 16px 22px; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } .btn--light-red:after { background-color: #bd0659; } .btn--light-red i { margin-left: 4px; } /* ------------------------------------------------------------ *\ Btn--small \* ------------------------------------------------------------ */ .btn--small { width:auto;padding:10px 3px; } /* ------------------------------------------------------------ *\ Btn Table \* ------------------------------------------------------------ */ .btn-table { color: #fff; font-size: 20px; border-radius: 30px; display: inline-block; text-decoration: none; max-width: 115px; width: 100%; text-align: center; padding: 6px 23px; } /* ------------------------------------------------------------ *\ Btn Green \* ------------------------------------------------------------ */ .btn--green { background-color: #2ed262; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; padding: 17px 5px; -ms-flex-pack: center; justify-content: center; } .btn--green i { margin-left: 7px; } .btn--green:after { background-color: #4baa58; } /* ------------------------------------------------------------ *\ btn--green-big \* ------------------------------------------------------------ */ .btn--green-big { padding: 20px 10px; color: #fff; width: 100%; max-width: 250px } .btn--green-big span { color: #fff!important; } .btn--green-big i { margin-right: 9px; } /* ------------------------------------------------------------ *\ Card \* ------------------------------------------------------------ */ .cards { margin: 0 -14px; list-style: none; margin-bottom: 0; } .cards > li { padding: 0 14px; } .card { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: center; align-items: center; min-height: 374px; height: 100%; padding: 15px 15px 48px; background: #fff; border-radius: 20px; text-align: center; } .card h4 { margin-top: 55px; font-size: 20px; font-weight: 500; } .card a { color: inherit; text-decoration: none; } .card a:hover { text-decoration: underline; } /* Tablet Portrait */ @media (max-width: 1023px) { .cards { margin: 0 -8px; } .cards > li { padding: 0 8px; } .card { min-height: auto; padding-top: 45px; padding-bottom: 45px; } } /* Mobile */ @media (max-width: 767px) { .cards { margin: 0; padding: 0 7px; } .cards > li { padding: 0; } .cards > li + li { margin-top: 16px; } .card { min-height: 374px; padding-bottom: 47px; } } /* ------------------------------------------------------------ *\ Comment \* ------------------------------------------------------------ */ .section-comments .comments{ padding: 57px 0; } .section-comments .comment-respond { padding: 0 100px; margin-bottom: 19px; } .section-comments .comment .comment-respond { padding: 0; margin:20px 0; } .section-comments .comment-respond textarea { width: 100%; background-color: #f5f6f7; border: 1px solid #b4bdc9; border-radius: 3px; resize: none; padding: 21px 28px; font-size: 18px; letter-spacing: 0.5px; height: 137px; } .section-comments .comment-respond .form__row { margin-bottom: 3px; } .section-comments .comment-respond .comment__actions { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: start; align-items: flex-start; } .section-comments .comment-respond .comment__btn { display: inline-block; height: 60px; line-height: 60px; padding: 0 25px; border: 0; color: #f6f9fc; background: #00a4e6; text-transform: uppercase; letter-spacing: 0.2em; vertical-align: top; border-radius: 9px; transition: background .3s; font-weight: 700; max-width: 293px; width: 100%; margin-top: 3px; } .section-comments .comment-respond .comment__btn:hover { background-color: rgb(0, 148, 207); } .section-comments .comment { display: -ms-flexbox; display: flex; margin-top: 52px;color: #818181; -ms-flex-wrap: wrap; flex-wrap: wrap; } .section-comments .comment-depth-2 { margin-left: 100px!important; } .section-comments .comment-depth-3 { margin-left: 150px!important; } .section-comments .comment-depth-4 { margin-left: 200px!important; } .section-comments .comment h3 { font-size: 20px; color: #818181; } .section-comments .comment .comment__img { width:72px; height: 72px; border-radius: 50%; overflow: hidden; } .section-comments .comment .comment__img img { width: 100%; } .section-comments .comment .comment__content { width: calc(100% - 72px); font-size: 18px; padding-left: 20px; } .section-comments .comment .comment__meta { margin-top: -5px; } .section-comments .comment .comment__head>div{ display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: start; align-items: flex-start; } .section-comments .comment .comment__body { max-width: 700px; letter-spacing: 1.25px; margin-bottom: 14px; } .section-comments .comment .btn-comment + .btn-comment { margin-left: 38px; } .section-comments .comments .comments__inner { padding: 56px 78px 52px 35px; border-bottom: 1px solid #b4bdc9; } .section-comments .comments .comments__inner:last-child { border-bottom: 0; padding-bottom: 42px; } .section-comments #pending-comment-notice {display:none;padding:10px;text-align:center;background:#fff8c4;} .section-comments.pending-comment #pending-comment-notice {display:block;} @media (max-width: 767px){ .section-comments .comments { padding: 23px 0; } .section-comments .comments .comments__inner { padding: 30px 0 40px; } .section-comments .comment .comment__content { width: 100%; padding: 0 20px; } .section-comments .comment-respond { padding: 0 15px; margin-bottom: 00px; } .section-comments .comment-respond .form__row { margin-bottom: 0px; } .section-comments .comment-respond .comment__actions { -ms-flex-direction: column-reverse; flex-direction: column-reverse; -ms-flex-align: end; -ms-grid-row-align: flex-end; align-items: flex-end; margin-top: -2px; } .section-comments .comment-respond textarea {padding: 13px 17px; } .section-comments .comment-respond .comment__btn { margin-top: 10px; max-width: 100%; } .section-comments .comment .comment__head { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; margin-bottom: 15px; } .section-comments .comment .comment__head >div { display: -ms-inline-flexbox; display: inline-flex; -ms-flex-direction: column; flex-direction: column; } .section-comments .comment .comment__head h3 { margin-bottom: 6px; } .section-comments .comment .comment__img--mobile { margin-right: 20px; display: block; } .section-comments .comment .comment__body { line-height: 1.7; margin-bottom: 18px; } .section-comments .comment .comment__actions { } .section-comments .comment .btn-comment + .btn-comment { margin-left: 26px; } .section-comments .comment + .comment { margin-left: 20px; margin-top: 20px; } } /* ------------------------------------------------------------ *\ Filter \* ------------------------------------------------------------ */ .filters-bar { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: end; align-items: flex-end; -ms-flex-wrap: wrap; flex-wrap: wrap; } .filters-bar .form-sort { max-width: 340px; } /* ------------------------------------------------------------ *\ Filters \* ------------------------------------------------------------ */ .filters {} .filter{} .filter + .filter { margin-top: 21px; } .filter .filter__title { margin-bottom: 13px; } .filter .filter__list { list-style-type: none; } .filter .filter__list li + li { margin-top: 3px; } .filter .filter__list--circles li + li { margin-top: 5px; } .filters .filter--search { margin-top: 41px; margin:41px -13px 0 -13px; } @media (max-width: 1200px){ .filters .filter--search { margin: 30px 0 0; } } @media (max-width: 1023px){ .filters{ display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex-wrap: wrap; flex-wrap: wrap; } .filter + .filter { margin-top: 0; } .filters .filter--search { width: 100%; margin-top: 20px; } } @media (max-width: 767px){ .filters { -ms-flex-direction: column; flex-direction: column; } .filter + .filter { margin-top: 20px; } } /* ------------------------------------------------------------ *\ Form Elements \* ------------------------------------------------------------ */ input::-webkit-input-placeholder { color: inherit; opacity: 1; } input:-ms-input-placeholder { color: inherit; opacity: 1; } input::placeholder { color: inherit; opacity: 1; } textarea::-webkit-input-placeholder { color: inherit; opacity: 1; } textarea:-ms-input-placeholder { color: inherit; opacity: 1; } textarea::placeholder { color: inherit; opacity: 1; } input:-webkit-autofill { -webkit-text-fill-color: inherit; -webkit-box-shadow: 0 0 0 1000px #fff inset; } select::-ms-expand { display: none; } select { -webkit-appearance: none; -moz-appearance: none; } input {-webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-appearance: none; -moz-appearance: none; appearance: none; } .field { background-color: #fff; border: 1px solid #b4bdc9; width: 100%; padding:16px 14px; } .field--white { background-color: #fff; } .textarea {} .select { background-color: transparent; border: none; -moz-appearance: none; -webkit-appearance: none; appearance: none; width: 100%; } .radio {} .checkbox { position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .checkbox input { width: 21px; height: 21px; opacity: 0; } .checkbox label{ padding-left: 18px; } .checkbox label:before, .checkbox label:after { content: ''; width: 21px; height: 21px; position: absolute; pointer-events: none; left: 0; top: 0; } .checkbox label:before { border: 2px solid #b4bdc9; } .checkbox label:after { background-image: url(../css/images/check.png); background-position: center center; background-repeat: no-repeat; opacity: 0; z-index: 2; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi){ .checkbox:after { background-image: url(../css/images/check@2x.png); } } .checkbox input:checked ~ :after { opacity: 1; } .checkbox--circle label:after { width: 24px; height: 24px; } .checkbox--circle label:before, .checkbox--circle label:after { border-radius: 50%; width: 24px; height: 24px; } /* ------------------------------------------------------------ *\ Form \* ------------------------------------------------------------ */ .form {} /* ------------------------------------------------------------ *\ Form Privacy \* ------------------------------------------------------------ */ .form-privacy { text-align: center; letter-spacing: 1.1px } .form-privacy .form__row { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } .form-privacy .form__label { font-size: 40px; color: #6a7b93; } .form-privacy .select { font-size: 40px; color: #00a4e6; } .form-privacy .form__controls { position: relative; margin-left: 30px; width: 100%; max-width: 300px; } .form-privacy .form__controls:before { content: ''; left: 0; right: 0; height: 2px; background-color: #a8a3a2; position: absolute; bottom: -13px; } .form-privacy .form__controls:after { content: ""; width: 17px; height: 7px; background-image: url(images/sprite/ico-arrow-down.png); position: absolute; top: 60%; -ms-transform: translateY(-50%); transform: translateY(-50%); right: -5px; background-size: content; background-position: center; background-repeat: no-repeat; pointer-events: none; } @media (max-width: 767px){ .form-privacy { letter-spacing: 0; } .form-privacy .form__label { margin-bottom: -7px; } .form-privacy .form__controls { margin-left: 0; } .form-privacy .form__controls:before { left: -30px; right: -30px; } } @media (max-width: 479px){ .form-privacy .form__controls:after { right: 10px; } .form-privacy .form__select { padding-right: 30px; } } /* ------------------------------------------------------------ *\ Form Sort \* ------------------------------------------------------------ */ .form-sort { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; } .form-sort .form__label { margin-right: 18px; font-size: 18px; font-weight: 500; } .form-sort .form__controls { -ms-flex-positive: 1; flex-grow: 1; } .form-sort .select { position: relative; width: 100%; } .form-sort .select select { border: 1px solid #b4bdc9; color: #6a7b93; font-size: 18px; padding: 17px 20px ; border-radius: 15px; width: 100%; } .form-sort i { position: absolute; top: 50%; -ms-transform: translate(-20px ,-3px); transform: translate(-20px ,-3px); right: 0; pointer-events: none; } /* ------------------------------------------------------------ *\ Form Search \* ------------------------------------------------------------ */ .form-search{} .form-search .form__controls { position: relative; } .form-search .form__controls i { position: absolute; right: 17px; top: 50%; -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .form-search .form__controls .field { font-size: 17px; color: #6a7b93; border-radius: 13px; padding-right: 40px; } /* ------------------------------------------------------------ *\ Hamburger \* ------------------------------------------------------------ */ .hamburger { display: -ms-inline-flexbox; display: inline-flex; -ms-flex-negative: 0; flex-shrink: 0; width: 67px; height: 67px; border-radius: 50%; background: #00a4e6; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .hamburger .hamburger__icon { position: relative; width: 17px; height: 14px; } .hamburger .hamburger__lines, .hamburger .hamburger__icon:before, .hamburger .hamburger__icon:after { position: absolute; left: 0; right: 0; height: 2px; background: #fff; content: ""; transition: transform .3s; -ms-transform-origin: 0 0; transform-origin: 0 0; } .hamburger .hamburger__lines { top: 50%; margin-top: -1px; } .hamburger .hamburger__icon:before { top: 0; } .hamburger .hamburger__icon:after { bottom: 0; } @media (max-width: 375px) { .hamburger { width: 50px; height: 50px; } } .hamburger.is-open .hamburger__lines { -ms-transform: scaleX(0); transform: scaleX(0); -ms-transform-origin: center; transform-origin: center; } .hamburger.is-open .hamburger__icon:before { -ms-transform: rotate(45deg) scaleX(1.25); transform: rotate(45deg) scaleX(1.25); } .hamburger.is-open .hamburger__icon:after { bottom: -3px; -ms-transform: rotate(-45deg) scaleX(1.25); transform: rotate(-45deg) scaleX(1.25); } /* ------------------------------------------------------------ *\ Label \* ------------------------------------------------------------ */ .label { display: inline-block; height: 21px; line-height: 21px; padding: 0 9px; text-transform: uppercase; color: #fff; background: #00a4e6; border-radius: 10px; font-size: 11px; } /* ------------------------------------------------------------ *\ Lang-switcher \* ------------------------------------------------------------ */ .lang-switcher { position: relative; width: 107px; } .lang-switcher i { position: absolute; top: 50%; right: 15px; margin-top: 2px; font-size: 10px; -ms-transform: translateY(-50%); transform: translateY(-50%); pointer-events: none; } .lang-switcher select { width: 100%; height: 40px; padding-left: 17px; border: 0; -moz-appearance: none; appearance: none; -webkit-appearance: none; background: #fff; border: 2px solid #dde2ea; border-radius: 40px; font-size: 15px; line-height: 37px; box-shadow: none; } .lang-switcher select::-ms-expand { display: none; } /* Tablet Portrait */ @media (max-width: 1023px) { .lang-switcher { width: 90px; } .lang-switcher select { font-size: 12px; padding-left: 12px; } .lang-switcher i { font-size: 10px; } } /* ------------------------------------------------------------ *\ Link-more \* ------------------------------------------------------------ */ .link-more { font-size: 15px; color: #4a4a4a; text-decoration: underline; transition: color .3s; } .link-more:hover { color: #1789b9; } .link--blue { color: #00a4e6; } .link--fsz16 { font-size: 16px; } /* ------------------------------------------------------------ *\ List \* ------------------------------------------------------------ */ [class^="list-"] { list-style: none outside none; margin: 0; } /* ------------------------------------------------------------ *\ Logos \* ------------------------------------------------------------ */ .list-logos { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .list-logos li + li { margin-left: 65px; } /* Small Desktop */ @media (max-width: 1200px) { .list-logos { -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } .list-logos li + li { margin-left: 30px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .list-logos { margin: 0 -15px -15px; } .list-logos li + li { margin-left: 0; } .list-logos li { padding: 0 15px 15px; } } /* Mobile */ @media (max-width: 767px) { .list-logos { -ms-flex-pack: justify; justify-content: space-between; margin: 0 -10px 32px; padding-left: 11px; padding-right: 22px; } .list-logos li { padding: 0 10px 32px; } } /* ------------------------------------------------------------ *\ Hosts \* ------------------------------------------------------------ */ .list-hosts { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; font-size: 20px; } .list-hosts ul { display: -ms-flexbox; display: flex; list-style: none; margin-bottom: 0; font-weight: 500; } .list-hosts li + li { margin-left: 5px; } .list-hosts span {margin-right:0;} .list-hosts > span { margin-right: 34px; color: #c8c8c8; } .list-hosts a { display: block; padding: 0 20px; border: 2px solid transparent; color: inherit; border-radius: 24px; transition: border .3s; } .list-hosts a:hover { border-color: #dde2ea; } /* Small Desktop */ @media (max-width: 1200px) { .list-hosts { -ms-flex-align: start; -ms-grid-row-align: flex-start; align-items: flex-start; } .list-hosts ul { -ms-flex-wrap: wrap; flex-wrap: wrap; } .list-hosts > span { margin-right: 20px; } .list-hosts a { padding: 0 10px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .list-hosts { font-size: 17px; } .list-hosts > span { margin-right: 10px; font-size: 17px; } .list-hosts ul { margin: 0 -2px -5px; } .list-hosts li { padding: 0 2px 5px; } .list-hosts li + li { margin-left: 0px; } .list-hosts a { padding: 0 5px; } } /* Mobile */ @media (max-width: 767px) { .list-hosts { display: block; text-align: center; font-size: 20px; } .list-hosts > span { display: block; font-size: 20px; margin-right: 0; margin-bottom: 8px; } .list-hosts ul { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; justify-content: center; } .list-hosts a { padding: 0 11px; } } @media (max-width: 375px) { .list-logos { -ms-flex-pack: center; justify-content: center; } } /* ------------------------------------------------------------ *\ Label \* ------------------------------------------------------------ */ .list-labels { font-size: 18px; } .list-labels .selected figure, .list-labels li:hover figure { background: #2ed262; } .list-labels .selected figure i, .list-labels li:hover figure i { opacity: 1; } .list-labels .selected figure i + i, .list-labels li:hover figure i + i { opacity: 0; } .list-labels .selected:after, .list-labels li:hover:after { box-shadow: 0 15px 30px -10px rgba(0,0,0, .2); } .list-labels li { position: relative; z-index: 1; } .list-labels li:after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: ""; border-radius: 35%; z-index: -1; transition: box-shadow .3s; } .list-labels li + li { margin-top: 18px; } .list-labels article { border: 1px solid #dde2ea; padding: 25px 35px 21px 102px; background: #fff; border-radius: 14px; } .list-labels h4 { margin-bottom: 11px; font-weight: 500; } .list-labels figure { position: absolute; top: 25px; left: 42px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; width: 39px; height: 39px; border-radius: 50%; background: #dde2ea; transition: background .3s; } .list-labels i { opacity: 0; transition: opacity .3s; } .list-labels i + i { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 1; } .list-labels p { font-size: 16px; line-height: 1.38; } .list-labels a { color: inherit; } /* Tablet Portrait */ @media (max-width: 1023px) { .list-labels article { padding: 20px 15px 20px 55px; } .list-labels figure { top: 20px; left: 10px; } } /* Mobile */ @media (max-width: 767px) { .list-labels article { padding: 30px 16px 40px 82px; } .list-labels figure { left: 24px; top: 25px; } .list-labels h4 { line-height: 1.28; } .list-labels li + li { margin-top: 23px; } } /* ------------------------------------------------------------ *\ List-arrows \* ------------------------------------------------------------ */ .list-arrows > li + li { margin-top: 14px; } .list-arrows a:not([class]) { position: relative; padding-left: 14px; text-decoration: none; transition: color .3s; font-size: 15px; } .list-arrows a:not([class]):before { position: absolute; left: -3px; top: 5px; width: 1em; height: 1em; border-top: 1px solid currentColor; border-right: 1px solid currentColor; -ms-transform: rotate(45deg); transform: rotate(45deg); display: inline-block; content: ""; color: #00a4e6; font-size: 7px; transition: color .3s; } .list-arrows a:not([class]):hover, .list-arrows a:not([class]):hover:before { color: #2ed262; } .list-arrows--lg a:not([class]) { padding-left: 23px; } .list-arrows--lg > li + li { margin-top: 6px; } /* Mobile */ @media (max-width: 767px) { .list-arrows > li + li { margin-top: 10px; } } /* ------------------------------------------------------------ *\ List Tags \* ------------------------------------------------------------ */ .list-tags { } .list-tags li { display: inline-block; } .list-tags li + li:before { content: '|'; display: inline-block; margin: 0 5px; } .list-tags li a { color: #6a7b93; font-size: 14px; text-transform: uppercase; } @media (max-width: 767px){ .list-tags { padding: 0 6px; display: -ms-flexbox; display: flex; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; } .list-tags li { margin-bottom: -7px; } .list-tags li a { font-size: 12px; } .list-tags li + li:before { margin: 0px 6px; font-size: 12px; } } /* ------------------------------------------------------------ *\ List Links \* ------------------------------------------------------------ */ .list-links{} .list-links>li { color: #00a4e6; font-size: 18px; } .list-links>li + li { margin-top: 5px; } .list-links>li>i { vertical-align: middle; margin-left: 20px; margin-right: 42px; } .list-links>li>a { vertical-align: middle; display: inline-block; } .list-links .rating { display: inline-block; } @media (max-width: 767px){ .list-links>li>i { margin-left: 5px; } } @media (max-width: 479px){ .list-links>li>i { vertical-align: middle; margin-left: 0px; margin-right: 15px; } } /* ------------------------------------------------------------ *\ List Order \* ------------------------------------------------------------ */ .list-order { list-style-type: decimal; padding-left: 22px; font-size: 18px; color: #2b2b2b; } .list-order li { padding-left: 37px; } .list-order li a { color: #00a4e6; } .list-order li + li { margin-top: 7px; } /* ------------------------------------------------------------ *\ List Support \* ------------------------------------------------------------ */ .list-support{ display: -ms-grid; display: grid; -ms-grid-columns: auto auto; grid-template-columns: auto auto; padding-top: 28px; -ms-flex-pack: center; justify-content: center; grid-row-gap: 38px; grid-column-gap: 40px; } .list-support li { text-align: center; text-decoration: none; display: -ms-flexbox; display: flex; -ms-flex-align: end; align-items: flex-end; -ms-flex-pack: center; justify-content: center; } .list-support li i { margin-bottom: 21px; } .list-support li a{ text-decoration: none; } .list-support li h4 { max-width: 150px; margin: auto; } @media (max-width: 1023px){ .list-support { grid-column-gap: normal ; } .list-support li { grid-column: 2/2; } } @media (max-width: 767px){ .list-support { -ms-grid-columns: 40% 40% ; grid-template-columns: 40% 40% ; -ms-flex-pack:; justify-content: } .list-support li:nth-child(odd) { -ms-grid-column: 1; grid-column: 1; } .list-support li:nth-child(even) { -ms-grid-column: 2; grid-column: 2; } } /* ------------------------------------------------------------ *\ List Gray \* ------------------------------------------------------------ */ .list--gray li { color: #6a7b93; font-size: 16px; } .list--gray li a { text-decoration: none; } /* ------------------------------------------------------------ *\ List Blue \* ------------------------------------------------------------ */ .list--blue{} .list--blue a { color: #00a4e6; } /* ------------------------------------------------------------ *\ List Checked \* ------------------------------------------------------------ */ .list-checked { text-align: left; max-width: 220px; width: 100%;list-style:url('images/check.png'); } .list-checked li + li { margin-top: 6px; } .list-checked a { text-decoration: none; } .list-checked i { margin-right: 13px; } @media (max-width: 767px){ .list-checked li { position: relative; padding-left: 26px; } .list-checked i { position: absolute; top: 5px; left: 0; } } /* ------------------------------------------------------------ *\ list--flex \* ------------------------------------------------------------ */ .list--flex { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; width: 100%; max-width: 232px; margin-bottom: 47px; } .list--flex>li { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; } .list--flex>li + li { margin-top: 10px; } .list--flex>li>:nth-child(2) { -ms-flex-positive: 1; flex-grow: 1; text-align: center; } .list--flex>li>i { margin-right: 0px; margin-left: -2px; } .list--flex li .link--blue { margin-bottom: 0; } .list--flex .rating { margin-bottom: 0!important; } .list--flex li + li { margin-left: 0; } .list--flex li:last-child { -ms-flex-align: start; -ms-grid-row-align: flex-start; align-items: flex-start; margin-top: 10px; } .list--flex li:last-child p { margin-bottom: 0; } .list--flex li .list__text { text-align: left; padding-left: 12px; } .list--flex .list__text p { color: #6a7b93; font-size: 16px; line-height: 0.9; } .list--flex .list__text p + p { margin-top: 14px; } .list--flex .link-more { text-decoration: underline; } /* ------------------------------------------------------------ *\ List Big \* ------------------------------------------------------------ */ .list--big{} .list--big a { font-size: 18px; color: #2b2b2b; } .list--big>li>i { margin-left: 9px; margin-right: 43px; } .list-asd a { font-size: 30px; } .list-asd li { position: relative; padding-left: 10px; } .list-asd li:before { font-size: 12px; position: absolute; top: 0; left: 0; content: ''; border: inset 1em ; border-right-width: 0; border-left-style: solid; border-color: transparent transparent transparent currentColor; } @media (max-width: 767px){ .list--big>li>i { margin-left: 3px; margin-right: 18px; vertical-align: top; margin-top: 7px; } .list--big>li>a { width: calc(100% - 100px); } } /* ------------------------------------------------------------ *\ List Black \* ------------------------------------------------------------ */ .list--black {} .list--black span { color: #2b2b2b; font-size: 18px; } /* ------------------------------------------------------------ *\ Logo \* ------------------------------------------------------------ */ header .logo { -ms-flex-negative: 0; flex-shrink: 0; display: inline-block; width: 248px; height: 82px; text-indent: -9999px; background-image: url(images/logo.png); background-size: cover; background-position: center; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { header .logo { background-image:url(images/logo@2x.png); } } /* Small Desktop */ @media (max-width: 1200px) { header .logo { width: 200px; height: 62px; } } /* Tablet Portrait */ @media (max-width: 1023px) { header .logo { width: 150px; height: 49px; } } /* Mobile */ @media (max-width: 767px) { header .logo { width: 248px; height: 82px; } } @media (max-width: 375px) { header .logo { width: 200px; height: 66px; } } /* ------------------------------------------------------------ *\ Nav \* ------------------------------------------------------------ */ .nav { position: relative; } .nav > ul { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .nav > ul > li { } .nav > ul > li + li { margin-left: 41px; } .nav > ul > li > a { position: relative; color: inherit; font-size: 18px; text-decoration: none; } .nav .has-dd > a:before { position: absolute; top: 33px; left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); border: 14px solid; border-color: transparent transparent #ddd transparent; content: ""; transition: opacity .3s; opacity: 0; } body.home .nav .has-dd > a:before { border-color: transparent transparent #fff transparent; } .nav li:hover > .nav__dropdown { opacity: 1; visibility: visible; } .nav .has-dd:hover > a:before { opacity: 1; } .nav .nav__dropdown { position: absolute; top: 100%; right: 105px; padding-top: 30px; width: 1168px; max-width: 100vw; transition: transform .3s, opacity .45s, visibility .3s; visibility: hidden; opacity: 0; border-radius: 9px; overflow: hidden; z-index: 10; } .nav .nav__dropdown-inner { position: relative; display: -ms-flexbox; display: flex; background: #fff; } .nav .nav__dropdown-content { padding: 36px 71px 87px 58px; -ms-flex: 1; flex: 1; } .nav .nav__dropdown-header { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 30px; } .nav .nav__dropdown-header .btn { margin-bottom: 2px; } .nav .nav__dropdown-header h6 { -ms-flex-item-align: end; align-self: flex-end; text-transform: uppercase; letter-spacing: 0.2em; margin-bottom: 0; } .nav .nav__intro { -ms-flex: 0 1 438px; flex: 0 1 438px; padding: 67px 53px 25px 65px; background: #f6f9fc; font-size: 15px; } .nav .nav__intro h3 { margin-bottom: 22px; } .nav .nav__intro ul { max-width: 224px; columns: 2; } .nav .nav__dropdown-lists { display: -ms-flexbox; display: flex; margin: 0 -31px -20px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .nav .nav__dropdown-lists > ul { padding: 0 31px 20px; } .nav .nav__dropdown-lists .label { vertical-align: middle; margin-left: 9px; margin-top: -1px; } .nav .list-arrows {margin-bottom:20px;} .nav .nav__dropdown {z-index:1337;} .nav .nav__dropdown-inner {border:1px solid #ddd;} .nav .nav__dropdown-lists .list-arrows {flex:1 0 50%;padding:0 0 0 20px;} .nav .nav__compare .nav__dropdown-lists ul.list-arrows {flex:1 0 50%;padding:0 0 0 20px;} .nav .list-arrows span { position: relative; padding-left: 14px; text-decoration: none; transition: color .3s; font-size: 15px; } .nav .list-arrows span:before { position: absolute; left: -3px; top: 5px; width: 1em; height: 1em; border-top: 1px solid currentColor; border-right: 1px solid currentColor; -ms-transform: rotate(45deg); transform: rotate(45deg); display: inline-block; content: ""; color: #00a4e6; font-size: 7px; transition: color .3s; } .nav .list-arrows--lg span { padding-left: 23px; } .nav .nav__dropdown-header {text-align:center;} .nav .nav__dropdown-header h6 {display:none;} .nav .nav__dropdown-header .btn {margin-left:auto;margin-right:auto;} .nav__compare .list-arrows > li + li {margin-top:5px;} .nav__compare .nav__intro ul {width:auto;columns:1;} .nav__resources .nav__intro ul {width:auto;columns:1;} .nav .nav__blog .nav__posts .post-info {margin-bottom:15px;font-size:14px;} .nav .nav__blog .nav__posts .post-info .blog-title {margin:10px 0;text-decoration:none;} .nav .nav__blog .nav__posts .post-info .view-more {padding:5px 10px;} .nav .nav__dropdown-lists ul.description {flex:none;padding:0 0 0 20px;font-size:14px;} .nav .nav__dropdown-lists ul.description li {padding-bottom:5px;} .nav .nav__dropdown-lists ul.description li a {display:block;font-weight:bold;} .nav .nav__dropdown-lists a.list-title {text-decoration:none;} @media(max-width: 1400px){ .nav > ul > li + li { margin-left: 30px; } .nav .has-dd > a:before { top: 38px; } .nav .nav__dropdown { width: 1000px; padding-top: 35px; -ms-transform: translateX(0); transform: translateX(0); } .nav .nav__dropdown-inner:before { margin-left: -70px; } .nav .nav__intro { padding: 55px 40px 25px; -ms-flex: 0 1 330px; flex: 0 1 330px; } .nav .nav__dropdown-content { padding: 55px 35px 70px; } .nav .nav__dropdown-lists { margin: 0 -20px; } .nav .nav__dropdown-lists > ul { padding: 0 20px; } } /* Small Desktop */ @media (max-width: 1200px) { .nav > ul > li + li { margin-left: 20px; } .nav > ul > li > a { font-size: 16px; } .nav .nav__dropdown { right: 0px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .nav { position: relative; z-index: 25; } .nav > ul > li + li { margin-left: 10px; } .nav > ul > li > a { font-size: 13px; } .nav .has-dd > a:before { top: 12px; border-color: transparent transparent #f6f9fc transparent; } .nav .nav__dropdown { width: 90vw; top: 45px; right: 0; padding-top: 0; } .nav .nav__dropdown-inner { display: block; } .nav .nav__intro { padding-top: 30px; } .nav .nav__dropdown-content { padding-bottom: 45px; padding-top: 35px; } } /* Mobile */ @media (max-width: 767px) { .nav { position: fixed; top: 0; left: 0; right: 0; bottom: 0; padding: 125px 10px 15px; -ms-transform: translateX(100%); transform: translateX(100%); background: #fff; overflow-y: auto; transition: transform .3s; } .nav.is-open { -ms-transform: none; transform: none; } .nav > ul { display: block; } .nav > ul > li { border-bottom: 1px solid #f5f6f7; } .nav > ul > li + li { margin-left: 0; } .nav > ul > li > a:after { display: none; } .nav > ul > li > a { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; width: 100%; padding: 6px 5px 6px 0; font-size: 16px; } .nav .has-dd > a:before { display: none; } .nav .has-dd > a:after { display: inline-block; width: 1em; height: 1em; border-right: 1px solid; border-bottom: 1px solid; -ms-transform: rotate(45deg); transform: rotate(45deg); content: ""; color: #00a4e6; font-size: 10px; margin-top: -7px; } .nav .nav__dropdown { position: static; margin: 0; padding-top: 15px; padding-bottom: 15px; width: 100%; -ms-transform: none; transform: none; opacity: 1; visibility: visible; border-radius: 0; } .nav .lang-switcher { border: 0 !important; margin: 15px auto 0; margin-left: auto; margin-right: auto; } .nav .nav__intro { display:none; } .nav .nav__dropdown-header { display: block; } .nav .nav__dropdown-header h6 { margin-bottom: 15px; } .nav .nav__dropdown-content { padding: 15px 10px; } .nav .nav__dropdown-lists { margin: 0 -10px -10px; -ms-flex-pack: justify; justify-content: space-between; } .nav .nav__dropdown-lists ul { padding: 0 10px 10px; } .nav .nav__blog .nav__posts .post-info .view-more {display:block;margin:0 auto;} } @media (max-width: 375px) { .nav { padding-top: 95px; } } @media (min-width: 1024px) { .nav .nav__dropdown-header {text-align:left;} .nav .nav__dropdown-header h6 {display:block;} .nav .nav__dropdown-header .btn {margin-left:0;margin-right:0;} .nav .nav__dropdown-lists .list-arrows {flex:1 0 20%;} .nav .nav__compare .nav__dropdown-lists ul.list-arrows {flex:0 0 30%;} .nav .nav__blog .nav__posts {display:flex;} .nav .nav__blog .nav__posts .post-info {flex:1 0 20%;padding-right:5px;} .nav .nav__dropdown-lists ul.description {flex:1 0 30%;} } /* ------------------------------------------------------------ *\ Nav Breadcrumbs \* ------------------------------------------------------------ */ .nav-breadcrumbs ul { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-left: 6px; } .nav-breadcrumbs i { margin: 0 12px; } .nav-breadcrumbs a { text-decoration: none; color: #6a7b93; } .nav-breadcrumbs li:last-child a { font-weight: 700; } @media (max-width: 767px){ .nav-breadcrumbs ul { padding: 0; } .nav-breadcrumbs i { margin: 0 10px; } .nav-breadcrumbs a { font-size: 14px; } } /* ------------------------------------------------------------ *\ Outro \* ------------------------------------------------------------ */ .outro {} .outro h6 { text-transform: uppercase; margin-bottom: 31px; letter-spacing: 0.2em; } /* Tablet Portrait */ @media (max-width: 1023px) { .outro { text-align: justify; } .outro h6 { margin-bottom: 20px; } } /* Mobile */ @media (max-width: 767px) { .outro { text-align: left; } .outro h6 { margin-bottom: 30px; } } /* ------------------------------------------------------------ *\ Rating \* ------------------------------------------------------------ */ .rating { display: -ms-flexbox; display: flex; } .rating i + i { margin-left: 4px; } /* ------------------------------------------------------------ *\ Review \* ------------------------------------------------------------ */ .section--reviews .reviews { list-style: none; margin-bottom: 0; } .section--reviews .reviews .review + .review { border-left: 1px solid #dde2ea; } .section--reviews .review { min-height: 215px; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; padding: 43px 50px 43px 45px; } .section--reviews .review > i { margin-bottom: 15px; } .section--reviews .review .review__rating {display:block;margin-top:10px;text-align:center;} .section--reviews .review .review__counter { font-size: 14px; } .section--reviews .review .stars {margin-top:10px;height:22px;width:125px;} /* Tablet Portrait */ @media (max-width: 1023px) { .section--reviews .review .review__rating { margin-bottom: 10px; } .section--reviews .review { min-height: 170px; padding: 35px 25px 15px; } } /* Mobile */ @media (max-width: 767px) { .section--reviews .reviews .review + .review { margin-top: 9px; border-left: 0; } .section--reviews .review { padding: 40px 10px 0; } .section--reviews .review > i { margin-bottom: 34px; } .section--reviews .review .review__rating { margin-bottom: 18px; } } /* ------------------------------------------------------------ *\ Search \* ------------------------------------------------------------ */ div.search { width: 622px; } div.search .search__inner { display: -ms-flexbox; display: flex; } div.search .search__field { -ms-flex: 1; flex: 1; padding: 0 25px; height: 60px; line-height: 60px; margin-right: 4px; background: #f6f9fc; border-top-left-radius: 9px; border-bottom-left-radius: 9px; font-size: 20px; border: 0; letter-spacing: 0.02em; transition: border .3s; border: 1px solid transparent; } div.search .search__field::placeholder {color: rgba(106, 123, 147, 0.5);} div.search .search__btn { display: inline-block; height: 60px; line-height: 60px; padding: 0 25px; border: 0; color: #f6f9fc; background: #00a4e6; text-transform: uppercase; letter-spacing: 0.2em; vertical-align: top; border-top-right-radius: 9px; border-bottom-right-radius: 9px; transition: background .3s; font-weight: 700; } div.search .search__btn:hover { background-color: rgb(0, 148, 207); } div.search--alt .search__field.field--white { background-color: #fff; } div.search .site-lookup .search__field:focus { border: 1px solid #00a4e6; } div.search .host-search .search__field:focus { border-color: #2ed262; } .host-search .picklist ul {padding:1em 2em;list-style:none;background:#fff;border:1px solid #2ed262;border-top:none;} .host-search .picklist ul li {padding:0.5em 0;} /* Tablet Portrait */ @media (max-width: 1023px) { div.search .search__field { height: 50px; line-height: 50px; font-size: 17px; } div.search .search__btn { height: 50px; line-height: 50px; font-size: 14px; } } div.search--alt { width: 860px; margin-left: auto; margin-right: auto; } div.search--alt .search__field { background: #f6f9fc; color: #6a7b93; padding: 0 22px; border-color: #dde2ea; } div.search--alt .search__btn { background: #2ed262; } div.search--alt .search__btn:hover { background-color: rgb(41, 189, 88); } /* Tablet Portrait */ @media (max-width: 1023px) { .search--alt { max-width: 100%; } .search--alt .search__field {} } /* Mobile */ @media (max-width: 767px) { div.search { width: 100%; } div.search .search__inner { display: block; } div.search .search__field { font-size: 20px; } div.search .search__btn { margin-top: 9px; font-size: 16px; } div.search .search__field, div.search .search__btn { height: 60px; line-height: 60px; border-radius: 10px; width: 100%; } } /* ------------------------------------------------------------ *\ Search Aside \* ------------------------------------------------------------ */ .search--aside{ width: 100%; max-width: 100%; } .search--aside .search__inner { -ms-flex-direction: column; flex-direction: column; } .search--aside .search__field { border-radius: 10px; border-color: #b4bdc9; } .search--aside .search__btn { border-radius: 10px; margin-top: 10px; } /* ------------------------------------------------------------ *\ Section \* ------------------------------------------------------------ */ .section { margin-bottom: 96px; } .section .section__head { text-align: center; margin-bottom: 67px; } .section .section__head p { font-size: 20px; } .section .section__title { font-weight: 500; line-height: 1.18; } .section .section__title span { color: #00a4e6; } .section .section__actions { text-align: center; } .section .section__meta { margin-top: 41px; padding-left: 20px; } .section .section__hint { text-align: right; font-size: 18px; line-height: 1.22; } .section .section__hint span { display: inline-block; margin-top: -6px; font-size: 18px; vertical-align: middle; font-weight: 700; line-height: 1.22; } .section .section__hint i { margin-left: 8px; } /* Small Desktop */ @media (max-width: 1200px) { .section .section__meta { padding-left: 0; } } /* Tablet Portrait */ @media (max-width: 1023px) { .section { margin-bottom: 60px; } } /* Mobile */ @media (max-width: 767px) { .section .section__head { padding: 0 15px; } .section .section__meta { margin-top: 49px; padding: 0 20px; } } /* Section utility classes */ .section.with-overline { position: relative; } .section.with-overline:before { position: absolute; bottom: 100%; left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); margin-bottom: 3px; height: 1px; width: 1170px; background: #dde2ea; content: ""; } /* Mobile */ @media (max-width: 767px) { .section.with-overline:before { display: none; } } /* ------------------------------------------------------------ *\ Section--Darker \* ------------------------------------------------------------ */ .section--darker { padding-top: 75px; padding-bottom: 57px; background-color: #f5f6f7; margin-bottom: 0; } .section--darker .section__head { max-width: 552px; margin-left: auto; margin-right: auto; margin-bottom: 47px; } .section--darker .section__meta { margin-top: 34px; } /* Tablet Portrait */ @media (max-width: 1023px) { .section--darker { padding-top: 50px; padding-bottom: 35px; } } /* Mobile */ @media (max-width: 767px) { .section--darker { padding-bottom: 50px; } .section--darker .section__head { margin-bottom: 25px; } .section--darker .section__meta { margin-top: 50px; } } /* ------------------------------------------------------------ *\ Intro \* ------------------------------------------------------------ */ .section--intro { margin-top:-110px;margin-bottom: -73px; height: 945px; background-image: url(images/intro.jpg); background-size: cover; background-position: center; } .section--intro + .section, .section--intro + .bar { position: relative; z-index: 1; } .section--intro .section__title { max-width:800px;margin-bottom: 29px; } .section--intro .section__content { position: absolute; padding-left: 76px; top: 185px; } .section--intro .section__content > p { max-width: 500px; margin-bottom: 28px; font-size: 20px; } .section--intro .section__search { margin-bottom: 21px; } /* Small Desktop */ @media (max-width: 1200px) { .section--intro { height: 100vh; min-height: 800px; margin-bottom: -30px; background-position: bottom; } .section--intro .section__title { margin-bottom: 15px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .section--intro { min-height: 750px; } .section--intro .section__search { margin-bottom: 15px; } .section--intro .section__content { top:100px;padding-left: 35px; } .section--intro .section__content > p { font-size: 18px; margin-bottom: 20px; } } /* Mobile */ @media (max-width: 767px) { .section--intro { padding-top: 161px; min-height: 975px; margin-bottom: 0; background-image: url(images/intro-mobile.jpg); } .section--intro .section__content { position: static; padding: 0 17px 0 12px; } .section--intro .section__title { padding-left: 21px; margin-bottom: 22px; } .section--intro .section__title br { display: none; } .section--intro .section__content > p { margin-bottom: 30px; font-size: 20px; padding-left: 19px; } .section--intro .section__search { margin-bottom: 21px; } } /* ------------------------------------------------------------ *\ Section--divided \* ------------------------------------------------------------ */ .section--divided { padding-bottom: 122px; } .section--divided .section__inner { margin: 0 -42px; } .section--divided .section__content { padding: 0 42px; } .section--divided .section__head { margin-bottom: 68px; } /* Small Desktop */ @media (max-width: 1200px) { .section--divided .section__inner { margin: 0 -25px; } .section--divided .section__content { padding: 0 25px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .section--divided { padding-bottom: 60px; } .section--divided .section__inner { margin: 0 -15px; } .section--divided .section__content { padding: 0 15px; } } /* Mobile */ @media (max-width: 767px) { .section--divided { padding-bottom: 45px; } .section--divided .section__head { margin-bottom: 59px; padding: 0 40px; } .section--divided .section__inner { margin: 0; } .section--divided .section__content { padding: 0; } .section--divided .section__content + .section__content { margin-top: 51px; } } @media (max-width: 375px) { .section--divided .section__head { padding: 0; } } /* ------------------------------------------------------------ *\ Search \* ------------------------------------------------------------ */ .section--search { margin:90px 0; } .home .section--search { margin-bottom: 0; } .section--search .section__head { margin-bottom: 18px; } .section--search .section__title { margin-bottom: 11px; } .section--search .section__actions { margin-top: 24px; } /* Mobile */ @media (max-width: 767px) { .section--search .section__head { margin-bottom: 30px; } .section--search .section__title { margin-bottom: 17px; } .section--search .section__body { padding: 0 16px 0 12px; } .section--search .section__actions { margin-top: 51px; } } @media (max-width: 375px) { .section--search .section__head { padding: 0; } } /* ------------------------------------------------------------ *\ Section--testimonials \* ------------------------------------------------------------ */ .section--testimonials { padding: 103px 0 107px; margin-bottom: 0; } .section--testimonials .section__body { position: relative; max-width: 1730px; margin-left: auto; margin-right: auto; } .section--testimonials .section__hint { position: absolute; right: 263px; bottom: 100%; margin-bottom: 27px; } /* Small Desktop */ @media (max-width: 1200px) { .section--testimonials { padding: 80px 0; } .section--testimonials .section__hint { margin-bottom: 15px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .section--testimonials .section__hint { position: static; margin-bottom: 0; text-align: center; margin-top: 30px; } .section--testimonials .section__hint span { text-align: right; } } /* Mobile */ @media (max-width: 767px) { .section--testimonials { padding: 115px 0 89px; } .section--testimonials .section__body { padding-left: 5px; } .section--testimonials .section__hint { margin-top: -6px; text-align: right; padding-right: 15px; } } @media (max-width: 375px) { .section--testimonials .section__body { padding-left: 0; } } /* ------------------------------------------------------------ *\ Section--reviews \* ------------------------------------------------------------ */ .section--reviews .section__body { margin: 0 9px; } .section--reviews .section__head { margin-bottom: 34px; } /* Mobile */ @media (max-width: 767px) { .section--reviews { margin-bottom: 74px; } .section--reviews .section__head { margin-bottom: 8px; } } /* ------------------------------------------------------------ *\ Section--featured \* ------------------------------------------------------------ */ .section--featured { padding-top: 30px; background-color: #f5f6f7; margin-bottom: 143px; } .section--featured .section__title { text-align: center; margin-bottom: 60px; } .section--featured .section__title h1 { margin-bottom:0.3em;font-size:40px;font-weight: 700; } .section--featured .section__title p { width: 70%; margin: auto; font-size:18px;font-weight: 500; line-height: 1.5; } .section--featured .testimonial-list { margin-bottom: 64px; } .section--featured .section__social-stats { text-align: center; margin-bottom: 78px; } .section--featured .form-privacy { margin-bottom: 50px; } .section--featured .search { -ms-transform: translateY(50%); transform: translateY(50%); } .section--featured .search--alt .search__field { background-color: #fff; } @media (max-width: 1023px){ .section--featured .section__title { margin-bottom: 30px; } } @media (max-width: 767px){ .section--featured { padding-top: 10px; margin-bottom: 152px; } .section--featured .section__title { margin-bottom: 41px; } .section--featured .section__title h2 { font-weight: 700; width: 70%; margin: auto; line-height: 1.2; margin-bottom: 24px; } .section--featured .section__title h4 { width: 90%; } .section--featured .testimonial-list { margin-bottom: 55px; padding: 0 10px; } .section--featured .section__social-stats { margin-bottom: 66px; } .section--featured .form-privacy { margin-bottom: 38px; } .section--featured .search { padding: 0 10px; } } /* ------------------------------------------------------------ *\ Section Posts \* ------------------------------------------------------------ */ .section--posts { padding-bottom: 151px; margin-bottom: 0; } .section--posts + .section--posts .shell:before { content: ''; display: block; width: 100%; height: 1px; background-color: #b4bdc9; margin-bottom: 79px; } .section--posts + .section--posts { margin-bottom: 61px; } .section--posts .shell { max-width: 1264px; } .section--posts .section__head { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: start; align-items: flex-start; margin-bottom: 35px; } .section--posts .section__head h2 { letter-spacing: 0.9px; margin-bottom: 0; } .section--posts .section__body>p { margin: -9px 0 42px 10px; font-size: 18px; } .section--posts .testimonial-list .testimonial + .testimonial { margin-left: 20px; } .section--posts .testimonial--big:after { display: none; } .section--posts .testimonial--big .testimonial__content { padding: 26px 33px; } .section--posts .testimonial--big .testimonial__content h4 { line-height: 1.1; margin-bottom: 24px; } .section--posts .testimonial--big figure { border-radius: 50%; margin-left: -3px; margin-right: 13px; } .section--posts .testimonial--big .btn { margin-left: auto; } .section--posts .testimonial--big .testimonial__actions { padding-top: 23px; } .section--posts .section__foot { text-align: center; } .section--posts .section__foot .btn { display: none; margin-top: 20px; } @media (max-width: 1023px){ .section--posts .slick-dots { position: absolute; top: -8px; left: 23px; right: 23px; } } @media (max-width: 767px){ .section--posts { padding-bottom: 143px; } .section--posts .shell { padding-left: -0px; padding-right: 0; } .section--posts .section__head { padding: 0 18px ; -ms-flex-pack: start; justify-content: flex-start; text-align: left; } .section--posts .section__head .btn { display: none; } .section--posts .section__head h2 { font-size: 35px; } .section--posts .section__body { position: relative; padding-top: 4px; margin-bottom: 20px; } .section--posts .section__foot .btn { display: inline-block; } .section--posts + .section--posts .shell:before { margin-bottom: 63px; } .section--posts + .section--posts { margin-bottom: 80px; } .section--posts + .footer { margin-top: 80px; } .section--posts .testimonial--big .testimonial__actions { padding-top: 22px; } } /* ------------------------------------------------------------ *\ Section Subscribe \* ------------------------------------------------------------ */ .section--subscribe { max-width: 830px; margin: auto; background-color: #6a7b93; border-radius: 13px; color: #fff; text-align: center; padding: 57px 100px; margin-bottom: 70px; box-shadow: 0px 30px 34px -36px rgba(0,0,0,0.75); } .section--subscribe h2 { font-weight: 500; margin-bottom: 35px; } .section--subscribe .form-subscribe { margin: 0 auto 30px; width: 100%; } .section--subscribe .form-subscribe input { color: #6a7b93; font-weight: 500; background-color: #fff; } .section--subscribe .form-subscribe .search__btn { padding: 0 20px 0 23px; } .section--subscribe p { font-size: 20px; } @media (max-width: 767px){ .section--subscribe { margin: 0 24px 82px; padding: 47px 22px 67px; } .section--subscribe h2 { line-height: 1.2; margin-bottom: 24px; } .section--subscribe .search { margin-bottom: 36px; } .section--subscribe .search .search__btn { margin-top: 15px; } } /* ------------------------------------------------------------ *\ Section Intro \* ------------------------------------------------------------ */ .section-intro { box-shadow: none; border-top: none; position: relative; z-index: 2; } .section-intro .section__img{ margin: 20px auto 0; } @media (max-width: 767px){ .section-intro .section__img { margin-top: 10px; } } /* ------------------------------------------------------------ *\ Section Articles \* ------------------------------------------------------------ */ .section-articles { margin-top: 20px; margin-bottom: 96px; } .section-articles .shell{ border-radius: 12px; border: 1px solid #b4bdc9; padding: 70px 73px 101px 90px; max-width: 1170px; overflow: hidden; background-color: #fff; } .section-articles .section__head { display: -ms-flexbox; display: flex; -ms-flex-align: end; align-items: flex-end; margin-bottom: 20px; margin-left: -4px; } .section-articles .testimonial__meta { display: -ms-flexbox; display: flex; -ms-flex-align: end; align-items: flex-end; margin-top:20px;} .section-articles .testimonial__meta figure { width: 80px; height: 80px; border-radius: 50%; overflow: hidden; position: relative; z-index: 2; margin-left: -16px; margin-top: 4px; margin-right: 23px; } .section-articles .testimonial__meta img { width: 100%; } .section-articles .testimonial__meta h5 { margin-bottom: 0; font-size: 16px; margin-right: 28px; } .section-articles .testimonial__meta div { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; margin-bottom: 4px; font-size: 15px; margin-right: 34px; } .section-articles .time { margin-bottom: 4px; } .section-articles .time i { margin-right: 2px; } .section-articles .article-about { padding-top: 41px;padding-bottom:40px; } .section-articles .section__aside { padding-top: 10px; } .section-articles .section__aside .article--blue { margin-bottom: 81px; } .section-articles .section__aside .search--aside { margin-bottom: 60px; } .section-articles .section--mobile { display: none; } .section-articles .article-author { margin-bottom: 21px; } .section-articles .article-author .social { min-width:150px; } .section-articles .nav-breadcrumbs { margin-bottom: 17px; } .section-articles .article__img--text { margin-top: 37px; margin-bottom: 0px; } .section-articles .section-gray { margin-top:40px;margin-left: -65px; margin-bottom: 58px; } .section-articles .box--accordion { margin-left: -45px; margin-right: 0px; margin-bottom: 55px; } .section-articles .article-discount { margin-left: -45px; margin-bottom: 49px; } .section-articles .list--big { padding-top: 15px; margin-bottom: 35px; } .section-articles .list-links { margin-bottom: 40px; padding-top: 12px; } .section-articles .article + .box--accordion { margin-top: 60px; } .section-articles .article + .section-gray { margin-top: 57px; } .section-articles .box--accordion + .nav-breadcrumbs { margin-top: 28px; } .section-articles .btn--offer { margin-top: 40px; margin-left: -24px; width: calc(100% + 24px); margin-bottom: 56px; } .section-articles .btn--content.mobile-content { display: none; } .section-articles .table-company { margin-top: 50px; margin-left: -25px; margin-right: -24px; } .section-articles .accordion .accordion__title p { margin-bottom: 0; } @media (max-width: 1023px){ .section-articles .shell{ padding: 0 40px 20px; } .section-articles .section-gray { margin-left: -35px; padding: 30px; } .section-articles .article-discount, .section-articles .box--accordion { margin-left: -35px; } } @media (max-width: 767px){ .section-articles { margin-top: -41px; margin-bottom: 46px; } .section-articles .shell { padding: 0 0 89px; max-width: 89%; background-color: #fff; } .section-articles .section__head { display: none; margin-bottom: 38px; } .section-articles .section--mobile { display: block; } .section-articles .testimonial__meta { -ms-flex-wrap: wrap; flex-wrap: wrap; padding-left: 30px; margin-bottom: 9px; } .section-articles .testimonial__meta figure { margin-left: 0; margin-right: 13px; } .section-articles .testimonial__meta div { margin-bottom: 15px; } .section-articles .time { text-align: center; } .section-articles .time span { margin-right: 0px; } .section-articles .time i { margin-left: 20px; } .section-articles h1 { font-size: 35px; padding: 0 14px; } .section-articles + .section-articles { margin-top: -7px; } .section-articles .btn--content.mobile-content { display: -ms-flexbox; display: flex; } .section-articles .article + .box--accordion { margin-top: 36px; } .section-articles .article-about { padding-top: 58px; } .section-articles .btn--offer { margin: 30px auto 20px -6px; width: auto; } .section-articles .section-gray { margin-left: -8px; margin-right: -5px; padding: 32px 25px; } .section-articles .article-discount, .section-articles .box--accordion { margin-left: 0px; } .section-articles .article + .section-gray { margin-bottom: 65px; padding-bottom: 74px; } .section-articles .box--accordion { margin-top: 10px; margin-bottom: 38px; } .section-articles .box--accordion p + h4 { margin-top: 31px; } .section-articles .ui-accordion-header { padding: 17px 25px 17px !important; } .section-articles .article-discount { margin-left: -5px; margin-right: -5px; margin-bottom: 0px; } .section-articles .table-company { margin-top: 37px; width: 100vw; overflow-x: scroll; margin-left: -47px; } .section-articles .table-company .table__overflow { position: relative; left: 37px; padding-right: 40px; width: 653px; } } @media (max-width: 479px){ .section-articles .time { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: start; align-items: flex-start; padding-left: 30px; } .section-articles .time i { margin-left: 0; } .section-articles .time span{ display: block; } .section-articles .testimonial__meta div { margin-right: 0; } } /* ------------------------------------------------------------ *\ section--primary \* ------------------------------------------------------------ */ .section--primary {} .section--primary .section__body { display: -ms-grid; display: grid; -ms-grid-columns: 60.7% 35% ; grid-template-columns: 60.7% 35% ; -ms-flex-pack: justify; justify-content: space-between; } .section--primary .section__content { -ms-grid-column: 1; grid-column: 1; } .section--primary .section__aside { -ms-grid-column: 2; grid-column: 2;margin-left:5px; } @media (max-width: 767px){ .section--primary .section__body { -ms-grid-columns: 100% 0% ; grid-template-columns: 100% 0% ; padding: 0 22px 0 26px; } .section--primary .section__aside { display: none; } } @media (max-width: 479px){ .section--primary .section__body { padding: 0 10px; } } /* ------------------------------------------------------------ *\ Section Subscribe Big \* ------------------------------------------------------------ */ .section--subscribe-big { padding: 57px 75px; margin-bottom: 79px; } .section--subscribe-big h2 { letter-spacing: 0.8px } .section--subscribe-big .form-subscribe { max-width: 638px; margin: 0 auto 30px; } @media (max-width: 767px){ .section--subscribe-big { margin: 0 24px 46px; padding:50px 22px 50px; } .section--subscribe-big h2 { margin-bottom: 39px; } } @media (max-width: 479px){ .section--subscribe-big { margin: 0 10px 46px; padding:30px 20px; } } /* ------------------------------------------------------------ *\ Section Comments \* ------------------------------------------------------------ */ .section-comments{ margin-top:50px;margin-bottom: 141px; } .section-comments .article-box:after { display: none; } .section-comments .article-box { max-width: 1020px; width: 100%; margin: auto; } @media (max-width: 767px){ .section-comments { margin-bottom: 50px; } .section-comments .shell { padding: 0px 22px ; } } @media (max-width: 479px){ .section-comments .shell { padding: 0px 10px; } } /* ------------------------------------------------------------ *\ Section Related \* ------------------------------------------------------------ */ .section-related { margin-bottom: 59px; } .section-related .shell { max-width: 1020px; } .section-related .section__head { text-align: left; margin-bottom: 34px; } .section-related .testimonial--big .testimonial__content { padding: 37px 29px 25px; } .section-related .testimonial--big .testimonial__content h4 { max-width: 320px; } .section-related .section__body { margin-bottom: 55px; } .section-related .section__foot { text-align: center; } @media (max-width: 767px){ .section-related { margin-bottom: 54px; } .section-related .shell { padding: 0 38px; } .section-related .section__body { max-width: 300px; margin: auto; } .section-related .testimonial-list .testimonial + .testimonial { margin-top: 35px; } .section-related .section__foot { padding-top: 38px; } } @media (max-width: 479px){ .section-related .shell { padding: 0 10px; } } /* ------------------------------------------------------------ *\ Section Mobile Content \* ------------------------------------------------------------ */ .section-mobile-content { padding: 0 20px; } .section-mobile-content .search { margin-bottom: 54px; } .section-mobile-content .list-support { grid-column-gap :40px; } .section-mobile-content .list-support li { grid-column: auto/auto; } .section-mobile-content .article-box { margin-bottom: 70px; } @media (max-width: 479px){ .section-mobile-content { padding: 0 10px; } } /* ------------------------------------------------------------ *\ Section Secondary \* ------------------------------------------------------------ */ .section--secondary { } .section--secondary .figure--small:after { top: -9px } .section--secondary .article p { margin-bottom: 28px; margin-left: 2px; } .section--secondary .section__aside { padding-top: 278px; } .section--secondary .section__aside .article--featured + .article--featured { margin-top: 118px; } /* ------------------------------------------------------------ *\ Section Hosting Plans \* ------------------------------------------------------------ */ .section-hosting-plans{} .section-hosting-plans .section__inner { width: 100%; padding: 0 17px; } .section-hosting-plans h2 { color: #6a7b93; font-weight: 500; margin-bottom: 17px; margin-left: 11px; letter-spacing: 0.9px; } .section-hosting-plans h2 span { color: #00a4e6; } .section-hosting-plans .section__title p { font-size: 20px; margin-bottom: 23px; margin-left: 7px; letter-spacing: 0.4px; } .section-hosting-plans .filters-bar { margin-bottom: 12px; } .section-hosting-plans .section__aside { padding-right: 36px; } .section-hosting-plans .box__body { padding: 26px 24px 20px 24px; } .section-hosting-plans .section__actions { text-align: center; padding-top: 25px; } .section-hosting-plans .filters-bar.mobile-content { display: none; } @media (max-width: 1200px){ .section-hosting-plans .section__aside { padding-right: 10px; } .section-hosting-plans .box__body { padding: 26px 15px; } } @media (max-width: 1023px){ .section-hosting-plans .section__inner { padding: 0; } .section-hosting-plans .section__aside { padding-left: 0; margin-bottom: 20px; } .section-hosting-plans .section__content { max-width: 100%; overflow: hidden; } .section-hosting-plans .section__content .box { overflow-x: scroll; } .section-hosting-plans .table-hostings { width: 1000px; } } @media (max-width: 767px){ .section-hosting-plans .section__title { text-align: center; padding-top: 14px; } .section-hosting-plans .section__title h2 { max-width: 330px; line-height: 1.2; margin: 0 auto 14px; } .section-hosting-plans .section__title p { margin-left: 0; max-width: 320px; margin: 0 auto 34px; } .section-hosting-plans .section__aside { padding-right: 0; } .section-hosting-plans .section__aside .box { max-width: 85%; margin: auto; margin-bottom: 21px; } .section-hosting-plans .section__aside .box__head { padding: 14px 30px; } .section-hosting-plans .section__aside .box__head p { text-align: left; font-size: 18px; } .section-hosting-plans .filters-bar { display: none; } .section-hosting-plans .filters-bar.mobile-content { display: -ms-flexbox; display: flex; -ms-flex-direction: column-reverse; flex-direction: column-reverse; -ms-flex-align: start; align-items: flex-start; } .section-hosting-plans .filters-bar { padding: 0 28px; margin-bottom: 2px; } .section-hosting-plans .filters-bar .form-sort { margin-bottom: 20px; } } /* ------------------------------------------------------------ *\ Section Gray \* ------------------------------------------------------------ */ .section-gray { border-radius: 15px; border: 1px solid #b4bdc9; background-color: #f5f6f7; padding: 60px 43px 80px 63px; } .section-gray .article h1 { max-width: 50%; margin-bottom: 36px; padding-left: 5px; } .section-gray .article h3 { margin-bottom: 31px; } .section-gray .article p + h3 { margin-top: 36px; } .section-gray .list-order { padding-top: 6px; margin-left: 14px; margin-bottom: 43px; } .section-gray .list-order li { padding-left: 23px; } .section-gray .list-order li p { margin-bottom: 0; } .section-gray .list-order li + li { margin-top: -1px; } .section-gray .article__img { margin-top: 37px; margin-left: -19px; margin-right: -19px; } @media (max-width: 767px) { .section-gray { padding: 32px 19px; } .section-gray .article h1 { font-size: 32px; margin-bottom: 17px; line-height: 1.3; padding-left: 0; } .section-gray .article h3 { line-height: 1.3; margin-bottom: 22px; } .section-gray .list-order { padding: 0 0 0 18px; margin-left: 0; margin-bottom: 38px; } .section-gray .list-order li { padding-left: 7px; } .section-gray .list-order li + li { margin-top: 15px; } .section-gray .article p + h3 { margin-top: 40px; } .section-gray .article__img { margin-left: -3px; margin-right: -3px; margin-bottom: 24px; } } /* ------------------------------------------------------------ *\ Section Intro Search \* ------------------------------------------------------------ */ .section--intro-search{} .section--intro-search .section__head { margin-bottom: 22px; } .section--intro-search .section__head h2 { font-weight: 700; margin-bottom: 17px; } .section--intro-search .section__head p { font-size: 18px; max-width: 600px; margin: 0 auto 10px; } .section--intro-search .socials { -ms-flex-pack: center; justify-content: center; margin-bottom: 15px; } .section--intro-search .search--alt { width: 100%; max-width: 820px; } @media (max-width: 767px){ .section--intro-search .section__head { margin-bottom: 10px; } .section--intro-search .section__head h2 { font-size: 35px; } .section--intro-search .section__head p { max-width: 90%; } .section--intro-search .search--alt { max-width: 90%; } } /* ------------------------------------------------------------ *\ Section Services \* ------------------------------------------------------------ */ .section-services { margin-bottom: 80px; } .section-services .section__inner { border-radius: 15px; border: 1px solid #b4bdc9; overflow: hidden; padding: 56px 0 95px; background-color: #fff; } .section-services .section__head { padding: 0 130px; text-align: center; } .section-services .section__head h2 { color: #00a4e6; font-size: 55px; font-weight: 500; margin-bottom: 8px; } .section-services .section__head h3 { color: #6a7b93; font-size: 20px; font-weight: 500; margin-bottom: 34px; } .section-services .section__head p { color: #6a7b93; font-size: 18px; text-align: left; margin-bottom: 10px; } .section-services .section__img { max-width: 400px; border-radius: 20px; overflow: hidden; margin: auto; margin-bottom: 44px;border:1px solid #eee; } .section-services .section__img img { width: 100%; } .section-services .section__body { padding-top: 13px; } .section-services .section__body p { margin-bottom: 0; line-height: 1.4; } .section-services .section__row { padding: 27px 130px; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .section-services .section__row>:first-child { width: 100%; max-width: 270px } .section-services .section__row + .section__row { border-top: 1px solid #b4bdc9; } .section-services .section__row .btn-filter { width: 100%; max-width: 275px; -ms-flex-pack: center; justify-content: center; margin: -10px 34px -10px 8px; } .section-services .section__foot { padding: 36px 130px 0 130px; font-size: 18px; } .section-services .section__foot p { margin-bottom: 43px; } .section-services .socials { margin: auto; max-width: 365px; } @media (max-width: 1023px){ .section-services .section__head { padding: 0 50px; } .section-services .section__row { padding: 27px 50px; } .section-services .section__foot { padding: 36px 50px 0 50px;; } } @media (max-width: 767px){ .section-services { margin-bottom: 50px; } .section-services .shell { padding: 0 23px; } .section-services .section__inner { padding: 63px 0 98px; } .section-services .section__head { padding: 0 20px; } .section-services .section__head h2 { font-size: 41px; margin-bottom: 20px; } .section-services .section__head h3 { line-height: 1.45; margin-bottom: 29px; } .section-services .section__img { margin-bottom: 33px; } .section-services .section__body { padding-top: 33px; } .section-services .section__row { padding: 12px 20px; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: center; align-items: center; text-align: center; } .section-services .section__row .btn-filter { margin: 10px 0 7px ; } .section-services .section__foot { padding: 22px 30px 0 30px; border-top: 1px solid #b4bdc9; } .section-services .section__foot p { margin-bottom: 20px; } .section-services .socials { margin-left: -10px; margin-right: -10px; } } @media (max-width: 479px){ .section-services .shell { padding: 0 10px; } .section-services .section__inner { padding: 20px 0 25px; } .section-services .section__head h2 { font-size: 35px; } } /* ------------------------------------------------------------ *\ Section Safe \* ------------------------------------------------------------ */ .section--safe { margin-bottom: 50px; } .section--safe .section__head { margin-bottom: 50px; } .section--safe .table--small { background-color: #fff; } @media (max-width: 767px){ .section--safe { margin-bottom: 22px; } .section--safe .section__head { margin-bottom: 40px; } .section--safe .section__title { font-size: 32px; } .section--safe .box { margin: 0 10px 20px; } } @media (max-width: 479px){ .section--safe .section__head { padding: 0; } .section--safe .section__title { font-size: 28px; } .section--safe .box { margin: 0; } } /* ------------------------------------------------------------ *\ Section--posts-big \* ------------------------------------------------------------ */ .section--posts-big{ background-color: #fff; padding: 160px 0 10px; } .section--posts-big .section__head { max-width: 1034px; margin: 0 auto 28px; } .section--posts-big .testimonial-list { margin-bottom: 80px; } .section--posts-big .testimonial--shadow .testimonial--big:after { display: block; } @media (max-width: 767px){ .section--posts-big .testimonial-list { padding: 0 20px; } .section--posts .testimonial-list .testimonial + .testimonial { margin-left: 0; } .section--posts-big .testimonial-list { margin-bottom: 0; } .section--posts-big .testimonial-list + .testimonial-list { margin-top: 60px; } } /* ------------------------------------------------------------ *\ Section Reviews \* ------------------------------------------------------------ */ .section-reviews { margin-bottom: 123px; } .section-reviews .shell { padding: 0 20px; } .section-reviews .article { border-radius: 15px; border: 1px solid #b4bdc9; overflow: hidden; background-color: #dce8ed; padding: 93px 178px 119px; } .section-reviews .article h1 { max-width: 100%; margin-bottom: 81px; } .section-reviews .article p { max-width: 100%; } .section-reviews .article h3 { margin-top: 43px; } @media (max-width: 1200px){ .section-reviews .article { padding: 50px 40px; } } @media (max-width: 767px){ .section-reviews { margin-bottom: 71px; } .section-reviews .article { padding: 65px 31px 82px; } .section-reviews .article h1 { font-size: 35px; margin-bottom: 33px; } .section-reviews .article h3 { margin-top: 33px; } } /* ------------------------------------------------------------ *\ Section Table \* ------------------------------------------------------------ */ .section--table { text-align: center; margin-bottom: 146px; } .section--table .shell { padding: 0 25px; } .section--table .section__title { margin-bottom: 43px; } .section--table .section__title h2 { font-weight: 500; } .section--table .section__title p { font-size: 20px; } @media (max-width: 767px){ .section--table { margin-bottom: 91px; } .section--table .shell { padding: 0 10px; } .section--table .section__title h2 { max-width: 280px; margin: 0 auto 20px; line-height: 1.1; } .section--table .table tr>:nth-child(2) { display: none; } .section--table .table tr>:nth-child(3) { display: none; } .section--table .table tr>:nth-child(5) { display: none; } } @media (max-width: 479px){ .section--table .table tr>:nth-child(1) { display: none; } .section--table .table tr>:nth-child(2) { display: table-cell; } } /* ------------------------------------------------------------ *\ Section Questions \* ------------------------------------------------------------ */ .section--questions { margin-bottom: 153px; } .section--questions .shell { padding: 0 25px; } .section--questions .section__title { text-align: center; margin-bottom: 40px; } .section--questions .section__title h2 { font-weight: 500; line-height: 1.2; margin-bottom: 22px; } .section--questions .section__title p { font-size: 20px; line-height: 1.5; margin-bottom: 24px; } .section--questions .section__content { text-align: left; } .section--questions .section__content>h3 { margin-left: 70px; margin-bottom: 21px; } @media (max-width: 1023px){ .section--questions { margin-bottom: 50px; } } @media (max-width: 767px){ .section--questions .section__title { margin-bottom: 46px; } .section--questions .section__title h2 { font-size: 35px; } .section--questions .section__content>h3 { margin-left: 25px; } .section--questions .box--accordion-big p { font-size: 16px!important; } .section--questions .box--accordion-big .accordion__title { padding: 17px 22px!important; } .section--questions .box--accordion-big .accordion__title i { right: 20px; } } /* ------------------------------------------------------------ *\ Slider \* ------------------------------------------------------------ */ .slider {} .slider .slick-dots { display: -ms-flexbox !important; display: flex !important; list-style: none; background: #dee3e9; border-radius: 50px; } .slider .slick-dots .slick-active button { background: #2ed262; } .slider .slick-dots li { -ms-flex: 1; flex: 1; } .slider .slick-dots button { display: block; width: 100%; font-size: 0; border: 0; height: 8px; border-radius: 50px; cursor: pointer; } .slider .slides { list-style: none outside none; } /* ------------------------------------------------------------ *\ Slider-testimonials \* ------------------------------------------------------------ */ .slider--testimonials .slider__slides { margin: 0 -10px; } .slider--testimonials .slider__slide { padding: 0 10px; } @media(max-width: 1400px){ .slider--testimonials .slider__slides { margin: 0 -6px; } .slider--testimonials .slider__slide { padding: 0 6px; } } /* Small Desktop */ @media (max-width: 1200px) { .slider--testimonials .slider__slides { margin: 0 -5px; } .slider--testimonials .slider__slide { padding: 0px 5px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .slider--testimonials .slider__slides { margin: 0 -15px; } .slider--testimonials .slider__slide { padding: 0 15px; } .slider--testimonials .slider__pagination { margin-bottom: 30px; } } /* Mobile */ @media (max-width: 767px) { .slider--testimonials .slider__pagination { max-width: 90%; margin-left: auto; margin-right: auto; margin-bottom: 20px; } .slider--testimonials .slider__slides { margin: 0 -10px; } .slider--testimonials .slider__slide { max-width: 350px; width: 350px; padding: 0 10px; } .slider--testimonials .testimonial { margin-bottom: 30px; } } @media (max-width: 375px) { .slider--testimonials .slider__slide { max-width: 100%; } } /* ------------------------------------------------------------ *\ Socials \* ------------------------------------------------------------ */ .socials { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; margin:0;padding:0;list-style: none!important; } .socials li + li { margin-left: 19px; } .socials a { display: block; opacity: .9; transition: opacity .3s, transform .3s; } .socials a:hover { opacity: 1; -ms-transform: translateY(-3px); transform: translateY(-3px); } /* ------------------------------------------------------------ *\ Socials--blue \* ------------------------------------------------------------ */ .socials--blue { } .socials--blue li + li { margin-left: 13px; } /* ------------------------------------------------------------ *\ Summary \* ------------------------------------------------------------ */ .summary { height: 100%; } .summary ul { margin-top: auto; } .summary h3 { margin-bottom: 26px; } .summary .summary__entry { padding-left: 28px; padding-right: 40px; } .summary .summary__entry p { margin-bottom: 50px; font-size: 18px; } .summary .summary__actions { margin-top: 38px; padding-right: 27px; text-align: right; } /* Tablet Portrait */ @media (max-width: 1023px) { .summary .summary__entry { padding-left: 0; padding-right: 0; } .summary .summary__entry p { margin-bottom: 30px; } .summary .summary__actions { padding-right: 0; margin-top: 20px; } } /* Mobile */ @media (max-width: 767px) { .summary .summary__entry { padding-left: 26px; } .summary .summary__actions { margin-top: 31px; padding: 0; text-align: center; } .summary--latest .summary__actions { margin-top: 79px; } } .section .summary__entry { padding-left: 28px; padding-right: 40px; } .section .summary__entry p { margin-bottom: 50px; font-size: 18px; } .section .summary__actions { margin-top: 38px; padding-right: 27px; text-align: right; } /* ------------------------------------------------------------ *\ Table \* ------------------------------------------------------------ */ .table {} .table th { font-size: 16px; color: #fff; font-weight: 500; } .table tr + tr { border-top: 1px solid #b4bdc9; } .table .rating { -ms-transform: scale(.8); transform: scale(.8); -ms-flex-pack: center; justify-content: center; -ms-transform-origin: center; transform-origin: center; } .table td { text-align: center; height: 80px; } .table .btn-filter { max-width: 120px; width: 100%; -ms-flex-pack: center; justify-content: center; } /* ------------------------------------------------------------ *\ Table Hostings \* ------------------------------------------------------------ */ .table-hostings { color: #fff; } .table-hostings .table__head { background-color: #00a4e6; } .table-hostings th { font-weight: 500; } .table-hostings th[data-sort]{cursor:pointer;background:url('images/sort-white.svg') no-repeat right center;} .table-hostings th.sorting-desc{background-image:url('images/sort-desc-white.svg');} .table-hostings th.sorting-asc{background-image:url('images/sort-asc-white.svg');} .table-hostings td { height: 151px; vertical-align: middle; text-align: center; color: #6a7b93; } .table-hostings tr + tr { border-top: 1px solid #b4bdc9; } .table-hostings tr td:nth-child(1) { width: 15%; } .table-hostings tr td:nth-child(2) { width: 22.7%; } .table-hostings tr td:nth-child(3) { vertical-align: middle; padding-top: 35px; width: 14%; } .table-hostings tr td:nth-child(4) { width: 16.6%; } .table-hostings tr td:nth-child(5) { padding-right: 25px; } .table-hostings tr h4 { margin-bottom: 9px; font-size: 17px; } .table-hostings p {margin-bottom:5px;} .table-hostings .table__img { position: relative; margin-left: 40px; max-width: 189px; max-height: 121px; overflow-y:hidden; border-radius:10px; } .table-hostings .table__img img { border-radius:10px; } .table-hostings .table__img p { position: absolute; width:100%; bottom: 0; color: #fff; background:#222; font-weight: 500; } .table-hostings .table__img p a {text-decoration:none;} .table-hostings .rating { -ms-flex-pack: center; justify-content: center; -ms-transform: scale(0.8) translateY(4px); transform: scale(0.8) translateY(4px); margin-bottom: 17px; } .table-hostings .link-more { font-weight: 500; color: #6a7b93; font-size: 16px; opacity: 1; } .table-hostings .small-text { font-size: 14px; line-height: 1.4; } .table-hostings .btn { font-size: 16px; padding: 8px 30px; margin-bottom: 10px; } @media (max-width: 1200px){ .table-hostings .table__img { margin-left: 0; margin: auto; } .table-hostings .btn { padding: 8px 5px; min-width: 100px; } } @media (max-width: 767px){ .table-hostings .box__head { padding: 18px 10px; } .table-hostings .table__img { max-width: 166px; } .table-hostings tr td:nth-child(1) { width: 13%; } .table-hostings tr td:nth-child(2) { width: 12%; } .table-hostings td { height: 132px; } } /* ------------------------------------------------------------ *\ Table Small \* ------------------------------------------------------------ */ .table--small{ padding-bottom: 20px; } .table--small tr th { padding: 19px 10px; } .table--small .text-big { font-size: 18px; } .table--small h3 { color: #818fa2; font-size: 25px; margin-bottom: 33px; } .table--small tr { border-top: 0; } .table--small tr + tr { border-top: 0; } .table--small .table__row td:nth-child(1) { width: 49%; text-align: left; padding-left: 8.1%; } .table--small .table__row td:nth-child(1) p { max-width: 375px; } .table--small .table__row td:nth-child(2), .table--small .table__row td:nth-child(3) { width: auto; padding: 20px 10px; } .table--small .table__row td:nth-child(3) { width: 36%; } .table--small .table__row:last-child td { vertical-align: top; padding-top: 26px; } .table--small .table__row td { height: auto; padding: 20px 10px; } .table--small .btn--light-red { font-size: 18px; padding: 16px 22px; margin: auto; } .table--small .btn--light-red span + span { display: none; } .table--small .table__row { border-top: 1px solid #b4bdc9; } @media (max-width: 767px){ .table--small { padding-bottom: 59px; } .table--small .box__head { padding: 10px 10px; } .table--small tr th { padding: 14px 10px; } .table--small .table__row { padding: 0; border: 0px; } .table--small .table__head th:nth-child(1), .table--small .table__row td:nth-child(1) { display: none; } .table--small tr td { padding: 0!important; height: auto; } .table--small tr { border-top: 0px; } .table--small .table__row td { width: 50%!important; padding: 19px 0 24px!important; border-bottom: 1px solid #b4bdc9; } .table--small .table__row-title { display: table-row; border: none; } .table--small .table__row-title td { width: 100%; padding-top: 21px!important; } .table--small .btn--light-red { padding: 17px 0px; max-width: 161px; } .table--small .btn--light-red span { display: none; } .table--small .btn--light-red span + span { display: block; } .table--small .table--foot td { border-bottom: 0; vertical-align: top; padding-top: 28px!important; padding-bottom: 0!important; } .table--small .table--foot td h3 { font-size: 21px; margin-bottom: 21px; } .table--small .table__row-title:last-child td { padding: 13px 32px!important; text-align: left; font-size: 18px; } } @media (max-width: 479px){ .table--small { padding-bottom: 0; } .table--small .table__row td { padding: 15px 0 !important; } .table--small .table--foot td h3 { margin-bottom: 10px; } .table--small .btn--light-red { padding: 5px 0px; max-width: 120px; margin: auto; } .table--small .table__row-title:last-child td { padding: 13px 20px!important; } } /* ------------------------------------------------------------ *\ Table Company \* ------------------------------------------------------------ */ .table-company{} .table-company th { color: #fff; font-size: 18px; font-weight: 500; } .table-company tr:nth-child(odd) { background-color: #f0f2f4; } .table-company tr:nth-child(even) { background-color: #fff; } .table-company tr:last-child td { padding-bottom: 38px; padding-top: 10px; } .table-company tr +tr { border-top: 1px solid #b4bdc9; } .table-company td { text-align: center; height: 62px; vertical-align: middle; } .table-company td:last-child { padding-right: 23px; } .table-company td:first-child { text-align: left; } .table-company h5 { width: 100%; width: 124px; margin-left: 34px; vertical-align: middle; position: relative; padding-left: 22px; } .table-company h5 span { position: absolute; top: 1px; left: 0px; margin-right: 14px; font-weight: 700; } .table-company .box__head { padding: 19px 0 ; } .table-company tr:first-child { background-color: #00a4e6; } @media (max-width: 767px){ .table-company .box__head { padding: 16px 0 ; } .table-company td { height: 56px; } } /* ------------------------------------------------------------ *\ Table--hosts \* ------------------------------------------------------------ */ .table--hosts {margin-bottom:40px;} .table--hosts tr>:last-child { padding-right: 60px; } @media (max-width: 1023px){ .table--hosts tr>:last-child { padding-right: 00px; } .table--hosts .btn-filter { min-width: 100px; } } @media (max-width: 767px){ .table--hosts .table.box {overflow-x:scroll;} } /* ------------------------------------------------------------ *\ Testimonial \* ------------------------------------------------------------ */ .testimonial { position: relative; padding: 31px 30px; border: 2px solid #dde2ea; border-radius: 30px; text-align: center; background: #fff; } .testimonial:after { z-index: -1; position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: ""; box-shadow: 0 45px 30px -40px rgba(0,0,0, .2); border-radius: 20%; } .testimonial figure { margin-bottom: 20px; } .testimonial figure img { max-width:70px;border-radius: 50%; display: inline-block !important; } .testimonial .testimonial__entry { margin-bottom: 2px; font-size: 17px; line-height: 1.4; vertical-align: top; } .testimonial .testimonial__entry:before { background-image: url(images/ico-quote.png); top: -12px; } .testimonial .testimonial__entry:after { background-image: url(images/ico-quote-right.png); top: -8px; } .testimonial .testimonial__entry:after, .testimonial .testimonial__entry:before { position: relative; display: inline-block; width: 10px; height: 8px; content: ""; } .testimonial .testimonial__link { display: inline-block; margin-top: 3px; } .testimonial .testimonial__meta { margin-top: 29px; font-size: 15px; } .testimonial .testimonial__meta h5 { margin-bottom: 2px; } @media(max-width: 1600px){ .testimonial { padding: 20px 15px; } } @media(max-width: 1400px) { .testimonial .testimonial__entry { font-size: 15px; } .testimonial .testimonial__meta { margin-top: 15px; } } /* Small Desktop */ @media (max-width: 1200px) { .testimonial { padding-left: 5px; padding-right: 5px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .testimonial { padding-left: 20px; padding-right: 20px; } } /* Mobile */ @media (max-width: 767px) { .testimonial { padding-top: 28px; padding-bottom: 30px; } .testimonial .testimonial__entry { font-size: 17px; } .testimonial .testimonial__meta { margin-top: 30px; } } /* ------------------------------------------------------------ *\ Testimonial List \* ------------------------------------------------------------ */ .testimonial-list{ display: -ms-flexbox; display: flex; } .testimonial-list .testimonial + .testimonial { margin-left: 30px; } @media (max-width: 1023px){ .testimonial-list { -ms-flex-direction: column; flex-direction: column; -ms-flex-align: center; -ms-grid-row-align: center; align-items: center; } .testimonial-list .testimonial + .testimonial { margin-left: 0px; margin-top: 20px; } .testimonial-list .slick-track .testimonial { margin-top: 20px; max-width: 75vw; } } @media (max-width: 767px){ .testimonial-list .testimonial + .testimonial { margin-top: 25px; } .testimonial-list .slick-list .testimonial { margin-top: 25px!important; } .testimonial-list .slick-list .testimonial + .testimonial { margin-left: 20px; } } @media (min-width: 1024px){ .testimonial-list {overflow-x:auto;} } /* ------------------------------------------------------------ *\ Testimonial--big \* ------------------------------------------------------------ */ .testimonial--big { display:flex;flex-direction:column;width:100%;min-width:250px;max-width: 500px; padding: 0; z-index: 1; border-radius: 15px; } .testimonial--big:after { border-radius: 0; } .testimonial--big figure { margin-bottom: 0; margin-right: 14px; } .testimonial--big .testimonial__media { max-height:28%;overflow:hidden;border-top-left-radius: 15px; border-top-right-radius: 15px; } .testimonial--big .testimonial__content { display:flex;flex-direction:column;flex:1;padding: 31px 39px 52px; text-align: left; } .testimonial--big .testimonial__content h3 { font-size: 28px; letter-spacing: 0.6px; line-height: 1.3; max-width: 340px; margin-bottom: 18px; } .testimonial--big .testimonial__content h4 { font-size: 20px; } .testimonial--big .testimonial__content p { margin-left: 2px; line-height: 1.4; margin-bottom: 16px; } .testimonial--big .testimonial__meta { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-align: center; align-items: center; -ms-flex-pack: start; justify-content: flex-start; margin-top: auto; } .testimonial--big .testimonial__actions { text-align: right; margin-right: -9px; margin-left: auto; } .testimonial--big .btn { margin-left: auto; font-size: 20px; } .testimonial--big .testimonial__media img { max-width: 100%; width: 100%;border-top-left-radius: 15px; border-top-right-radius: 15px; } @media (max-width: 767px){ .testimonial--big .testimonial__meta { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .testimonial--big .testimonial__actions { width: 100%; } .testimonial--big .testimonial__content { padding: 31px 29px ; } .testimonial--big .testimonial__content h3 { font-size: 23px } .testimonial--big .testimonial__actions { padding-top: 4px; } } /* ------------------------------------------------------------ *\ Testimonial Slider \* ------------------------------------------------------------ */ .testimonial-slider{} .testimonial-slider .slick-dots { display: -ms-flexbox!important; display: flex!important; -ms-flex-pack: center; justify-content: center; background-color: #dfe3ec; margin-top: 10px; list-style-type: none; border-radius: 4px; -ms-flex-align: center; align-items: center; } .testimonial-slider .slick-dots>li { -ms-flex-positive: 1; flex-grow: 1; border-radius: 4px; height: 8px; } .testimonial-slider .slick-dots>li.slick-active { background-color: #00a4e6; } .testimonial-slider .slick-dots button { display: none; } /* ------------------------------------------------------------ *\ Time \* ------------------------------------------------------------ */ .time{} /* ------------------------------------------------------------ *\ Widget \* ------------------------------------------------------------ */ .widgets { list-style: none outside none; } /* ------------------------------------------------------------ *\ FAQs \* ------------------------------------------------------------ */ .faqs {margin:60px;} .faqs > ul {list-style:none;} .content .faqs ul {padding-left:0;} .faq .question { cursor:pointer;position: relative; padding: 17px 36px;border-top:1px solid #d3d8df !important; } .faq .question p { margin-bottom: 0; color: #6a7b93; font-size: 18px; } .faq .answer {display:none;padding:1em 2.2em;} .faq .answer>p { color: #6a7b93; } .faq-expanded .answer {display:block;} .faq-expanded .question {font-weight:600;color:#2b2b2b;} @media (max-width: 767px){ .faq .question { padding: 17px 27px 17px 17px; } } @media (max-width: 1023px){ .faqs {margin:0;} } /* ------------------------------------------------------------ *\ Plans \* ------------------------------------------------------------ */ #plans div.plans {overflow-x:auto;} #plans table {width:100%;} #plans table span.price {font-weight:bold;} #plans table th, #plans table td {padding:15px;text-align:center;} #plans table thead th {font-weight:bold;text-align:center;} #plans table tbody tr {border-top:1px solid #b4bdc9;} #top-plans table tbody th {padding-left:30px;font-weight:normal;text-align:left;} #other-plans {display:none;} #other-plans table tbody td:first-child {padding-left:20px;text-align:left;} #other-plans table tbody td:first-child div {color:#bbb;} #other-plans .btn {display:block;margin-top:5px;} @media (max-width: 767px){ #plans table th, #plans table td {padding:15px 5px;} #top-plans table tbody th {padding-left:10px;} #other-plans table tbody td:first-child {padding-left:10px;} } /* ------------------------------------------------------------ *\ Alternatives \* ------------------------------------------------------------ */ #alternatives {padding-bottom:0;background:#fff;} #alternatives .alt-hosts {display:flex;} #alternatives .alt-host {flex:1;padding:20px 10px;text-align:center;border-right:1px solid #b4bdc9;} #alternatives .alt-host:last-child {border-right:none;} #alternatives .alt-host figure {margin-bottom:10px;} #alternatives .alt-host p {font-size:15px;} #alternatives .alt-host p.price {font-size:28px;font-weight:bold;color:#00a4e6;} #alternatives .alt-host .stars {margin:20px auto;height:22px;width:125px;} #alternatives .alt-host .btn {margin:10px 0;} @media (max-width: 767px){ #alternatives .alt-hosts {flex-direction:column;} #alternatives .alt-host {display:flex;border:none;border-bottom:1px solid #b4bdc9;} #alternatives .alt-host:last-child {border-bottom:none;} #alternatives .alt-host > div {flex:1;} }/* ------------------------------------------------------------ *\ Exit Alternatives \* ------------------------------------------------------------ */ #exit-alternatives {padding-bottom:0;background:#fff;} #exit-alternatives h2 {font-size:26px;} #exit-alternatives .decline {padding:5px 0;text-align:center;font-size:14px;color:#999;} #exit-alternatives .alt-hosts {display:flex;} #exit-alternatives .alt-host {flex:1;padding:20px 40px;text-align:center;} #exit-alternatives .alt-host figure {margin-bottom:10px;} #exit-alternatives .alt-host p {font-size:15px;} #exit-alternatives .alt-host p.price {font-size:28px;font-weight:bold;color:#00a4e6;} #exit-alternatives .alt-host .stars {margin:20px auto;height:22px;width:125px;} #exit-alternatives .alt-host .btn {margin:10px 0;} #exit-alternatives .alt-host .btn i {margin-left:5px;} @media (max-width: 767px){ #exit-alternatives .alt-hosts {flex-direction:column;} #exit-alternatives .alt-host {display:flex;border:none;border-bottom:1px solid #b4bdc9;} #exit-alternatives .alt-host:last-child {border-bottom:none;} #exit-alternatives .alt-host > div {flex:1;} #exit-alternatives .alt-host .btn {padding:10px 15px !important;} } /* ------------------------------------------------------------ *\ Reviews \* ------------------------------------------------------------ */ #reviews {margin:60px 0;margin-left:-40px;} #reviews .more-reviews {display:none;max-width:200px;margin:20px auto;} #reviews .more-reviews::after {content:none;} #reviews.has-more .more-reviews {display:block;} #reviews-summary, #reviews-content {border:1px solid #d3d8df;} #reviews-summary {padding:40px;background:#6b7b94;color:#fff;border-bottom:none;border-radius:15px 15px 0 0;} #reviews-summary h2, #reviews-summary p {color:#fff;text-align:center;} #reviews-summary h2 {font-size:30px;} #reviews-summary .overall-rating {text-align:center;} #reviews-summary .group {display:flex;justify-content:space-between;} #reviews-summary table.rating-breakdown {width:40%;margin-right:20px;} #reviews-summary table.rating-breakdown th {padding:0 0 4px 0;text-align:left;font-weight:normal;font-size:18px;} #reviews-summary table.rating-breakdown td {text-align:right;} #reviews-summary table.rating-breakdown svg.stars {height:22px;width:125px;} #reviews-summary form {width:200px;} #reviews-summary #reviews-filter {min-width:200px;margin-top:10px;padding:10px;background:#fff;color:#6a7b93;border-radius:10px;border:none;} #reviews-content {padding:40px;background:#f5f6f8;border-top:none;border-radius:0 0 15px 15px;} #reviews-content h3 {margin:0;color:#6e7b8e;} #reviews-content .review:last-child {margin-bottom:0;padding-bottom:0;border-bottom:none;} .review {margin:30px 0 40px 0;padding-bottom:20px;border-bottom:1px solid #d3d8df;} .modal-content .review {margin:0;padding:30px;max-width:500px;border-radius:10px;background:#fff;} .review .group {display:flex;justify-content:space-between;} .review .reviewer-name {display:block;} .review img.avatar {align-self:start;max-width:100px;margin-right:15px;border-radius:50%;} .review .socials {margin:5px 0;} .review .socials i {width:28px;height:28px;} .review svg.stars {display:block;height:22px;width:125px;margin-bottom:10px;} .review .star-date {text-align:center;font-size:14px;} .review .comment {margin:20px 0;} .review .comment p {font-size:15px;color:#6a7b93;} .review .comment em {font-style:normal;} .review .comment em.ask-t {text-decoration:underline;} /* asterisk */ .review .comment em.brk-t {font-style:italic;} /* brackets */ .review .comment em.quo-t {font-style:italic;} /* quotes */ .review .comment em.emp-t {text-decoration:underline;} /* emphasis term */ .review .comment em.sel-t {font-weight:bold;} /* selling term */ .review .comment em.url-t {font-style:italic;} /* url */ .review .comment em.brn-t {font-weight:bold;} /* brand */ .review .comment em.ftr-t {font-weight:bold;} /* feature */ .review .visit {text-align:center;} .recent-reviews-full {display:flex;flex-wrap:wrap;} .recent-reviews-full .review {margin:10px;width:45%;padding:2%;border:1px solid #b4bdc9;border-radius:10px;background:#fff;} @media (max-width: 1023px){ #reviews {margin:20px 0;} #reviews-summary .group {display:block;} #reviews-summary table.rating-breakdown {width:100%;} .review .group {display:block;} .review .group > div {margin:10px 0;} .recent-reviews-full .review {width:auto;} } /* ------------------------------------------------------------ *\ Static pages \* ------------------------------------------------------------ */ .container--page { max-width:1170px;margin:20px auto 40px auto;padding:65px 77px 108px 86px;border: 1px solid #d3d8df; border-radius: 15px; overflow: hidden; position: relative; z-index: 2; background-color: #fff; } .container--page h1 {position:relative;} .container--page h1:after { content: ''; top: -8px; height: 110px; width: 30px; background-color: #00a4e6; position: absolute; left: -91px; -ms-transform: skewY(16deg); transform: skewY(16deg); } @media (max-width: 767px){ .container--page {max-width:92%;padding:15px;} .container--page h1:after {content:none;} .container--page h1 {font-size:35px;padding:0;} } /* ------------------------------------------------------------ *\ Coupon \* ------------------------------------------------------------ */ .coupon {} .coupon.article h3 {margin:5px 0 10px 0;} .coupon .description {margin:5px 20px;text-align:left;} .coupon .logo-discount {margin-bottom:10px;padding:5px;border:1px dashed #ccc;} .coupon .article__inner {display:block;} .single-coupon .coupon-content {margin:5px 20px;text-align:left;} .single-coupon .coupon-content h3 {text-align:center;} .coupon-code .btn-discount {text-decoration:none;} .coupon-code .btn-discount img:hover {opacity:0.85;} .coupon-code div {display:none;margin:10px auto;min-height:61px;width:293px;border:3px dashed #00a4e6;border-radius:15px;font-size:26px;line-height:60px;} .coupon-code p {display:none;font-size:16px;} .coupon-code.clicked img {display:none;} .coupon-code.clicked p {display:block;} .coupon-code.clicked div {display:block;} /* ------------------------------------------------------------ *\ Table of contents \* ------------------------------------------------------------ */ .toc {margin-bottom:40px!important;} .toc ul {list-style:none;font-size:16px;color:#6a7b93;} .toc > ul > li > a {display:block;padding-bottom:10px;} .toc li {padding:19px 28px;border-top:1px solid #d3d8df;} .toc li:first-child {border-top:none;} .toc li > ul > li {padding:10px 0 10px 18px;border:none;} .content .toc ul {padding-left:0;} .toc .article__head {margin-bottom:0!important;} .toc .article__head a {text-decoration:none;} .toc .article__inner {border-radius:15px!important;} .toc .control {margin-left:auto;font-weight:bold;} .toc .toggle {display:flex;} .toc .toggle:hover {text-decoration:none;} .toc .toggle .expand {display:inline;} .toc .toggle .collapse {display:none;} .toc.expanded .toggle .expand {display:none;} .toc.expanded .toggle .collapse {display:inline;} .toc .article__body {display:none;} .toc.expanded .article__body {display:block;} @media (min-width: 1024px){ .toc.bottom-spacer {margin-bottom:100vh!important;} .toc.bottom-spacer.expanded {margin-bottom:50vh!important;} } /* ------------------------------------------------------------ *\ Modal \* ------------------------------------------------------------ */ #modal-container {display:none;flex-direction:column;align-items:center;justify-content:center;position:fixed;top:0;left:0;width:100%;height:100%;overflow:auto;background-color:rgba(0, 0, 0, 0.5);z-index:10001;} #modal-container .modal-inner {flex:0;-ms-flex:0 1 90%;max-height:90%;margin:5px;} #modal-container a.modal-close {display:block;width:40px;height:40px;margin-bottom:5px;margin-left:auto;padding:5px;background:#ddd;border-radius:50%;} #modal-container a.modal-close svg {display:block;} #modal-container a.modal-close .close-x {stroke:#888;fill:transparent;stroke-linecap:round;stroke-width:5;} #modal-container a.modal-close:hover .close-x {stroke:black;} #modal-container .modal-content {padding:0 30px;} @media (max-width: 1023px){ #modal-container .modal-content {padding:0;} } /* ------------------------------------------------------------ *\ Top hosts sidebar \* ------------------------------------------------------------ */ .top-hosts-sidebar {text-align:center;} .top-hosts-sidebar h2 {font-size:18px;} .top-hosts-sidebar ul {list-style:none;} .top-hosts-sidebar li {margin:20px 0;} .top-hosts-sidebar img.logo {max-width:120px;height:auto;border-radius:5px;} .top-hosts-sidebar .rating {max-width:120px;margin:5px auto;} /* ------------------------------------------------------------ *\ Popular Posts / Most Viewed wrapper \* ------------------------------------------------------------ */ .most-viewed-bars {margin:30px 10px;} .most-viewed-bars h2 {margin:10px 0;font-size:18px;} .most-viewed-bars .popular_posts_bars .popular_posts_bars_li {padding-top:10px;padding-bottom:10px;font-size:14px;} /* ------------------------------------------------------------ *\ User agent \* ------------------------------------------------------------ */ #user-agent-info {margin:20px 0;} #user-agent-info h2 {margin:20px 0;} #user-agent-info .info-box {padding:20px;border:1px solid #ccc;border-radius:15px;} #user-agent-info .browser tr {border-bottom:1px solid #eee;} #user-agent-info .browser th, #user-agent-info .browser td {padding:20px 10px;} #user-agent-info .browser th {text-align:left;} #user-agent-info .browser td {text-align:center;} /* ------------------------------------------------------------ *\ Add host review \* ------------------------------------------------------------ */ #add-host-review {min-height:600px;margin:20px 0;padding:30px 20px;background:#f5f6f7;text-align:center;} #add-host-review h2 {font-weight:normal;font-size:28px;line-height:1.5;} #add-host-review h3 {margin:20px 0;font-size:18px;} #add-host-review h3 span.number {margin-right:20px;font-size:34px;font-weight:normal;vertical-align:middle;} #add-host-review span.number {font-family:arial,sans-serif;} #add-host-review p {color:#6a7b93;} #add-host-review .btn {margin:20px 0;border-radius:20px;transform:none;} #add-host-review .error-message {display:none;color:red;} #add-host-review .step.error .error-message {display:block;} #add-host-review table.star-pickers {display:block;margin:20px auto;} #add-host-review table.star-pickers th {padding:10px;font-weight:normal;text-align:left;font-size:18px;} #add-host-review table.star-pickers img {padding-right:5px;} #add-host-review .step-comment textarea {width:100%;min-height:200px;margin:10px 0;padding:10px;border-radius:15px;border:1px solid #b4bdc9;} #add-host-review .step-info .fields {display:flex;flex-wrap:wrap;justify-content:space-between;} #add-host-review .step-info .field {margin:10px 0;border-radius:15px;border:1px solid #b4bdc9;} #add-host-review .step {display:none;} #add-host-review .step.current {display:block;} #add-host-review .done {display:none;} #add-host-review form.sent .done {display:block;} #review-tandc {padding:20px;overflow:auto;background:#fff;border-radius:15px;border:1px solid #b4bdc9;font-size:14px;} #review-tandc ol {padding-left:2em;} #add-host-review #review-tandc {display:none;} @media (min-width: 1024px){ #add-host-review table.star-pickers {width:60%;} #add-host-review table.star-pickers th {padding:10px 40px 10px 0;} #add-host-review .step-info input[name=first_name], #add-host-review .step-info input[name=last_name] {width:49%;} #add-host-review .step-info .checkbox {margin:10px 30px;} #add-host-review .step-info .checkbox i {padding-left:40px;} } /* ------------------------------------------------------------ *\ Host jump links \* ------------------------------------------------------------ */ .host-jump-links {margin-bottom:20px;padding:5px 10px;background:#f9f9f9;border-radius:5px;} .host-jump-links .jump-link {text-align:center;} .host-jump-links .jump-link a {display:block;padding:5px;background:#00a4e6;border:1px solid #d3d8df;border-radius:5px;text-decoration:none;color:#fff;font-size:15px;} .host-jump-links .jump-link p {font-size:13px;} @media (min-width: 1024px){ .host-jump-links .jump-links {display:flex;} .host-jump-links .jump-link {margin-right:10px;} .host-jump-links .jump-link:last-child {margin-right:0;} .host-jump-links .jump-link p {padding:5px;} } /* ------------------------------------------------------------ *\ Pros and cons \* ------------------------------------------------------------ */ .procons {display:flex;} .procons div {width:50%;} .procons p.title {font-weight:600;} .procons .pros ul {list-style-image:url('images/ico-plus-g.png');} .procons .cons ul {list-style-image:url('images/ico-minus-r.png');} /* ------------------------------------------------------------ *\ Pricing \* ------------------------------------------------------------ */ .currency-info {display:none;font-size:15px;color:#8f9cb0;} .currency-info a.tooltip {text-decoration:none;} .currency-info .tooltip-info {display:none;margin:10px;padding:10px;background:#f5f6f7;border:1px solid #ddd;border-radius:15px;font-size:14px;text-align:left;} .currency-info a:hover .tooltip-info {display:block;} .discount-info {display:none;margin:5px 0;font-size:15px;} /* ------------------------------------------------------------ *\ Misc \* ------------------------------------------------------------ */ body.home {background:#f5f6f7;} svg.stars {height:29px;width:165px;margin:0 auto;} .section__title em, h2 em {color:#00a4e6;font-style:normal;} .best-host-cta svg.stars, .host-cta svg.stars {height:27px;width:155px;} .article-box.is_stuck {z-index:5;} .host-cta .rating {margin:10px 0;} .host-cta .btn {margin-bottom:20px;} a.domain-link, a.offsite { padding-right:18px;background:transparent url('images/external-link.png') no-repeat;background-position:right center;text-decoration:underline; } #lookup-results {margin:10px 0 40px;} #lookup-results .status-message {text-align:center;} .content ul, .content ol {padding-left:1.5em;} .content ul.socials {margin:0;padding:0;} .content ul.socials li {padding:0;} .article.content > h2:first-child:after { content: ''; top: -8px; height: 110px; width: 30px; background-color: #8898aa; position: absolute; left: -91px; -ms-transform: skewY(16deg); transform: skewY(16deg); } .article.content .section-gray article h2:first-child:after {content:none;} body.search article {margin:20px 0;} body.search article header {margin-bottom:10px;} .grecaptcha-badge {visibility:collapse!important;} p.recaptcha-wording, div.recaptcha-wording {margin:5px;font-size:12px;color:#999;} #livechat-compact-container, #livechat-full {left:20px;right:auto;} .full-width h1 {margin-top:10px;margin-bottom:0.78em;line-height:1;font-size:40px;font-weight:700;text-align:center;} .full-width p.intro {width:60%;margin:auto;margin-bottom:60px;font-size:18px;font-weight:500;line-height:1.5;text-align:center;} .testimonial-list.featured { margin-bottom: 64px; } .testimonial .testimonial__meta .byline {display:block;margin-bottom:2px;font-size:15px;line-height:1;font-weight:700;} .prev-next {display:flex;justify-content:space-between;} .prev-next a {margin:10px;} .prev-next-posts div {display:inline-block;margin:10px 0;padding:5px 10px;background:#fff;border:1px solid #01a4e5;border-radius:15px;} .prev-next-posts div:hover {box-shadow:0 5px 10px -5px rgba(0,0,0, .2);} .prev-next-posts div a {padding:10px;text-decoration:none;} .prev-next-posts div.prev {text-align:left;} .prev-next-posts div.next {text-align:right;} p.no-reviews {font-size:14px;color:#777;} #lang-switcher {display:inline-block;background:#fff;border:1px solid #dde2ea;border-radius:40px;} #lang-switcher ul {display:flex;padding:0 8px;} #lang-switcher ul li {border-right:1px solid #dde2ea;} #lang-switcher ul li:last-child {border:none;} #lang-switcher a, #lang-switcher span {display:inline-block;padding:8px;text-decoration:none;} #lang-switcher a:hover {text-decoration:underline;} form.site-lookup .error {display:none;margin:10px 0;color:red;font-size:18px;} form.site-lookup.error .error {display:block;} picture.lazy-hidden {background:none!important;} .wp-block-pullquote blockquote {margin-left:auto;margin-right:auto;text-align:left;max-width:60%;} .wp-block-pullquote blockquote p {font-size:1.3em!important;font-style:italic;color:#696969;border-top:2px solid #696969;border-bottom:2px solid #696969;padding-top:1em;padding-bottom:1em;} @media (max-width: 767px){ #lang-switcher {margin-top:10px;} .prev-next {flex-direction:column;} .article-author .social {width:100%;} } /*--------------------------------------------------------------*\ Accessibility \*--------------------------------------------------------------*/ .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */ } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; clip-path: none; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } #content[tabindex="-1"]:focus { outline: 0; }