CSS   89

default template v2 css

Guest on 5th May 2022 02:14:14 AM

  1. .clear {clear:both}
  2. .red {color:#ee3b33}
  3. .form-group, .form-control {margin:0;padding:0}
  4.  
  5. #top-area {}
  6. #top-area .mbl-top {display:none}
  7. #top-area .flex {display:flex;align-items:center;justify-content:space-between}
  8. #top-search {
  9.     background-image: url('/img/consumer/bg-num-blkp.gif');
  10.     font-family:AvenirLTPro-Medium,Sans-Serif;
  11.     color: #fff;font-size:15px;
  12.     padding:10px;
  13. }
  14. #top-search .left {width:30%;padding-left:20px}
  15. #top-search .left img {width:250px}
  16. #top-search .right {
  17.     width:70%;
  18.     display:flex;align-items:center;justify-content:flex-end;
  19.     padding-right:20px
  20. }
  21. #top-search .c1 {padding-right:20px}
  22. #top-search .c2 {text-align:center}
  23. #top-search .c2 .search {position:relative;border:2px solid #c6c6c6;width:205px}
  24. #top-search .c2 input {
  25.     font-family:AvenirLT-Black,Sans-Serif;z-index:200;text-align:center;width:190px;
  26.     background-color:transparent;font-size:23px;color:#fff;border:none;
  27. }
  28. #top-search .c2 label {position:absolute;top:0;left:0;z-index:100;font-size:15px;line-height:37px;width:177px;}
  29. #top-search .c2 img {position:absolute;top:5px;right:5px;z-index:100;width:22px}
  30. #top-search .red {font-family:AvenirLT-Black,Sans-Serif;}
  31.  
  32. #top-menu {position:relative;height:80px}
  33. #top-menu .cltm {width:260px;position:absolute;top:25px;left:20px;z-index:999}
  34. #top-menu .menu {position:absolute;top:20px;right:10px;background-color:#fff}
  35. #top-menu .menu .navbar-nav > li {}
  36. #top-menu .menu .navbar-nav > li > a {padding:10px 7px;font-family:AvenirLT-Black;text-shadow:none;font-size:15px}
  37. #top-menu .menu .navbar-nav > li:last-child > a {border:none}
  38. #top-menu .active {background:none}
  39. #top-menu .menu .navbar-nav > li > a:hover {
  40.     color:#000;
  41.     text-shadow: 0 0 10px #ff0;
  42. }
  43. #top-menu .menu .nav .open > a {border-color:#eee}
  44. #top-menu .onl-tut {color:#ed3d35}
  45. #top-menu .menu .navbar-nav > li > a.onl-tut:hover {
  46.     color:#ed3d35;
  47.     text-shadow: 0 0 10px #ff0;
  48. }
  49. #top-menu .dropdown-menu>li>a {font-family:AvenirLTStd-Medium}
  50. #top-menu .navbar-collapse {padding:0}
  51.  
  52. @media (max-width: 1160px) {
  53.     #top-search {background-size:63vw}
  54.     #top-menu .cltm {width:280px;top:5px;left:5px}
  55.     #top-menu .menu {margin-top:15px;}
  56. }
  57. @media (max-width: 992px) {
  58.     #top-menu {z-index:999;top:1vw}
  59.     #top-menu .cltm {display:none}
  60.     #top-menu .menu {top:0;margin:1vw;right:auto;left:auto;width:auto}
  61. }
  62. @media (max-width: 900px) {
  63.     #top-search .c1 {text-align:center;padding:0 2vw}
  64.     #top-search .c2 .search {width:180px}
  65.     #top-search .c2 input {font-size:24px;width:166px}
  66.     #top-search .c2 label {font-size:13px;line-height:35px;width:150px}
  67.     #top-search .c2 img {top:5px;right:5px;width:24px}
  68.  
  69.     #top-menu .menu {top:0.5vw}
  70.     #top-menu .menu .navbar-nav > li > a {font-size:1.7vw;padding:0.89vw 0.62vw}
  71.     #top-menu .loc-ctr {display:block}
  72. }
  73.  
  74. @media (min-width: 768px) {
  75.     .menu .navbar-nav > li > a {font-size:14px}
  76. }
  77.  
  78. @media (max-width: 767px) {
  79.     #top-search {background-size:110vw}
  80.     #top-area .mbl-top {display:block;text-align:center}
  81.     #top-search .c1 {display:none}
  82.     #top-search .left {width:50%;padding-left:10%}
  83.     #top-search .right {width:50%;padding:2vw 4vw 0 0}
  84.     #top-search .c2 .search {width:212px}
  85.     #top-search .c2 input {font-size:19px;width:193px}
  86.     #top-search .c2 label {font-size:16px;line-height:36px;width:179px}
  87.     #top-search .c2 img {top:4px;right:4px;width:26px}
  88.  
  89.     #top-menu {height:auto;padding:0;top:0}
  90.     #top-menu .cltm {display:block;top:1.3vw;left:3vw}
  91.     #top-menu .menu {position:relative;margin:0;padding:0;top:auto;right:auto;left:auto;bottom:auto}
  92.     #top-menu .navbar-nav {margin:0}
  93.     #top-menu .navbar-collapse.in {overflow:visible}
  94.     #top-menu .menu .navbar-nav > li > a {font-size:2.2vw;border:none;padding-left:2vw}
  95. }
  96. @media (max-width: 560px) {
  97.     #top-search .left {width:45%;padding-left:2vw}
  98.     #top-search .right {padding-right:1vw}
  99. }
  100.  
  101. @media (max-width: 479px) {
  102.     #top-area .flex {align-items:flex-end}
  103.  
  104.     #top-search {font-size:3.8vw;padding:3vw}
  105.     #top-search .mbl-top {margin-bottom:2vw}
  106.  
  107.     #top-search .left {width:45%;padding:0}
  108.     #top-search .left img {width:100%}
  109.     #top-search .right {width:50%;padding:1vw 0 0 0}
  110.     #top-search .c2 .search {width:170px;height:30px}
  111.     #top-search .c2 input {font-size:19px;width:143px;height:28px}
  112.     #top-search .c2 label {font-size:13px;line-height:30px;width:146px}
  113.     #top-search .c2 img {top:4px;right:2px;width:19px}
  114.  
  115.     #top-menu .cltm {width:54vw;top:4vw;left:4vw}
  116.     #top-menu .menu .navbar-nav > li > a {font-size:17px;padding:2vw}
  117.     #top-menu .dropdown-menu {padding:0 0 2vw 0;margin:0}
  118. }

Raw Paste


Login or Register to edit or fork this paste. It's free.