Advertisement
Guest User

Untitled

a guest
Jul 17th, 2019
82
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 3.99 KB | None | 0 0
  1. /* Калькулятор */
  2.  
  3. .calc_brand_wrap {
  4.     margin-bottom: 15px;
  5. }
  6.  
  7. p.calc_brand_title,
  8. p.calc_count_title,
  9. p.calc_full_title,
  10. p.calc_ion_title,
  11. p.calc_type_title{
  12.     font-size: 24px;
  13.     line-height: 28px;
  14. }
  15.  
  16. .calc_brand_line {
  17.     text-align: center;
  18. }
  19.  
  20. .calc_brand_item {
  21.     display: inline-block;
  22.     vertical-align: middle;
  23.     padding: 5px 10px;
  24.     background: #fff;
  25.     border: 1px solid #CDCDCD;
  26.     font-size: 18px;
  27.     line-height: 21px;
  28.     font-weight: 300;
  29.     color: #000;
  30.     margin-right: 20px;
  31.     cursor: pointer;
  32.     transition: .2s all;
  33. }
  34.  
  35. .calc_brand_item.active {
  36.     background: #4B9127;
  37.     box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.25);
  38.     border: none;
  39.     color: #fff;
  40.     border-color: #4B9127;
  41. }
  42.  
  43. .calc_type_wrap {
  44.     margin-bottom: 15px;
  45. }
  46.  
  47. .calc_type_line {
  48.     text-align: center;
  49. }
  50.  
  51. .calc_type_item {
  52.     display: inline-block;
  53.     vertical-align: middle;
  54.     padding: 5px 10px;
  55.     background: #fff;
  56.     border: 1px solid #CDCDCD;
  57.     font-size: 18px;
  58.     line-height: 21px;
  59.     font-weight: 300;
  60.     color: #000;
  61.     margin-right: 20px;
  62.     cursor: pointer;
  63.     transition: .2s all;
  64. }
  65.  
  66. .calc_type_item.active {
  67.     background: #4B9127;
  68.     box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.25);
  69.     border: none;
  70.     color: #fff;
  71.     border-color: #4B9127;
  72. }
  73.  
  74. .calc_count_wrap {
  75.     margin-bottom: 30px;
  76. }
  77.  
  78. .calc_count_form {
  79.     display: inline-block;
  80.     vertical-align: middle;
  81.     margin-right: 20px;
  82. }
  83.  
  84. .calc_count_form_button {
  85.     background: #fff;
  86.     border: 1px solid #D6D6D6;
  87.     color: #000;
  88.     width: 40px;
  89.     height: 40px;
  90.     line-height: 40px;
  91.     text-align: center;
  92.     display: inline-block;
  93.     vertical-align: middle;
  94.     transition: .2s all;
  95.     cursor: pointer;
  96. }
  97.  
  98. .calc_count_form_button:hover {
  99.     box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.25);
  100. }
  101.  
  102. .calc_count_form_input {
  103.     width: 30px;
  104.     height: 40px;
  105.     text-align: right;
  106.     font-size: 24px;
  107.     line-height: 40px;
  108.     display: inline-block;
  109.     vertical-align: middle;
  110.     color: #000;
  111.     border: none;
  112.     margin-left: 10px;
  113. }
  114.  
  115. .calc_count_form_input:focus {
  116.     outline: none;
  117. }
  118.  
  119. .calc_count_form_label {
  120.     font-weight: 300;
  121.     font-size: 18px;
  122.     display: inline-block;
  123.     vertical-align: middle;
  124.     line-height: 40px;
  125.     height: 40px;
  126.     padding-top: 2px;
  127.     color: #000;
  128.     margin: 0 20px 0 5px;
  129. }
  130.  
  131. .calc_count_text {
  132.     display: inline-block;
  133.     vertical-align: middle;
  134.     margin-left: 20px;
  135. }
  136.  
  137. .calc_count_text_one {
  138.     font-weight: 300;
  139.     font-size: 24px;
  140.     line-height: 28px;
  141.     color: #000;
  142. }
  143.  
  144. .calc_count_text_one span {
  145.     font-weight: 500;
  146. }
  147.  
  148. .calc_count_wrap sup {
  149.     font-size: 50%;
  150.     top: -7px;
  151. }
  152.  
  153. .calc_ion_wrap {
  154.     margin-bottom: 60px;
  155. }
  156.  
  157. .calc_full {
  158.     margin-top: 30px;
  159.     text-align: center;
  160. }
  161.  
  162. .calc_full_title {
  163.     border-top: 1px solid #DFDFDF;
  164. }
  165.  
  166. .calc_full_title span {
  167.     background-color: #F8F8F8;
  168.     padding: 5px 20px;
  169.     display: inline-block;
  170.     vertical-align: middle;
  171.     margin-top: -30px;
  172. }
  173.  
  174. p.calc_full_values {
  175.     font-weight: bold;
  176.     font-size: 36px;
  177.     line-height: 49px;
  178.     text-align: center;
  179.     color: #000;
  180. }
  181.  
  182. .calc_form {
  183.     text-align: center;
  184.     margin-top: 40px;
  185. }
  186.  
  187. .calc_form_input {
  188.     background: #FFFFFF;
  189.     border: 1px solid #4B9127;
  190.     font-weight: 200;
  191.     font-size: 18px;
  192.     line-height: 21px;
  193.     text-align: center;
  194.     color: #656565;
  195.     display: block;
  196.     width: 339px;
  197.     height: 22px;
  198.     margin: 0 auto 15px;
  199.     padding: 20px 0;
  200.     -webkit-box-sizing: border-box;
  201.     -moz-box-sizing: border-box;
  202.     box-sizing: border-box;
  203. }
  204.  
  205. .calc_form_input:focus {
  206.     outline: none;
  207. }
  208.  
  209. .calc_form_button {
  210.     width: 339px;
  211.     height: 48px;
  212.     margin: 0 auto 15px;
  213.     line-height: 21px;
  214.     display: block;
  215.     background-color: #4B9127;
  216.     color: #fff;
  217.     font-size: 24px;
  218.     line-height: 28px;
  219.     text-align: center;
  220.     color: #FFFFFF;
  221.     cursor: pointer;
  222. }
  223.  
  224. .calc_form_button:focus {
  225.     outline: none;
  226. }
  227.  
  228. .irs--flat .irs-from, .irs--flat .irs-to, .irs--flat .irs-single,
  229. .irs--flat .irs-bar,
  230. .irs--flat .irs-handle>i:first-child{
  231.     background-color: #4B9127 !important;
  232. }
  233.  
  234. .irs--flat .irs-from:before, .irs--flat .irs-to:before, .irs--flat .irs-single:before {
  235.     border-top-color: #4B9127 !important;
  236. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement