Advertisement
Guest User

Untitled

a guest
Apr 8th, 2020
159
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 3.81 KB | None | 0 0
  1. html #x13-counter-container #counter-3{
  2.     float: left;
  3.         width: 100%;
  4.     display: flex;
  5.     align-items: center;
  6.     justify-content: center;
  7.     margin-top: 15px;
  8. }
  9. html #x13-counter-container em{
  10.     float: left;
  11.     width: 50%;
  12.     display: flex;
  13.     flex-flow: row wrap;
  14.     justify-content: space-between;
  15.     align-items: center;
  16. }
  17. html #x13-counter-container em strong.code{
  18.         border: 2px dashed #FFF;
  19.     padding: 17px;
  20.     font-size: 20px;
  21.     font-weight: 300;
  22.     position:relative;
  23.         margin-top: 6px;
  24. }
  25. html #x13-counter-container em strong.code:before{
  26.     content: 'KOD';
  27.     position: absolute;
  28.     top: -13px;
  29.     left: 50%;
  30.     width: auto;
  31.     font-size: 12px;
  32.     transform: translateX(-50%);
  33.     background: #b16721;
  34.     padding-left: 10px;
  35.     padding-right: 10px;
  36.     border-radius: 50px;
  37. }
  38. html #x13-counter-container .code-info{
  39.         padding-top: 8px;
  40. }
  41. html #x13-counter-container .code-info p{
  42.         font-size: 14px;
  43.     padding-top: 7px;
  44.     text-transform: uppercase;
  45. }
  46. html #x13-counter-container .x13-js-counter{
  47.     position:relative;
  48. }
  49. html #x13-counter-container .code-info-header{
  50.         font-size: 19px;
  51.     text-transform: uppercase;
  52.     letter-spacing: 6px;
  53.     border-bottom: 2px solid #e29333;
  54.     padding-bottom: 3px;
  55. }
  56. html #x13-counter-container .x13-js-counter:before{
  57. content: 'Do końca promocji zostało';
  58.     position: absolute;
  59.     top: -39px;
  60.     left: 0;
  61.     width: 100%;
  62.     text-align: center;
  63.     text-transform: uppercase;
  64.     font-size: 12px;
  65.     padding-right: 20px;
  66. }
  67. html #x13-counter-container .x13-js-counter .counter-item span.number {
  68.     color: #ffffff;
  69.     border-radius: 5px;
  70.     font-size: 40px;
  71.     border: none !important;
  72.     font-weight: 700;
  73. }
  74. html #x13-counter-container .counter-item{
  75.     float:left;
  76.  
  77. }
  78. html #x13-counter-container .counter-item .counter-label{
  79.     position:relative;
  80.     color: transparent !important;
  81.     overflow: hidden;
  82.     width: 20px;
  83.     margin: 0;
  84.     padding: 0;
  85. }
  86. html #x13-counter-container .counter-item:nth-child(1) .counter-label:before{
  87.     content: ':';
  88.     position: absolute;
  89.     top: -4px;
  90.     left: -4px;
  91.     color: #FFF;
  92.     z-index: 999;
  93.     font-size: 29px;
  94.     display: block;
  95.     width: 30px;
  96.     height: 30px;
  97. }
  98. html #x13-counter-container .counter-item:nth-child(2) .counter-label:before{
  99.     content: ':';
  100.     position: absolute;
  101.     top: -4px;
  102.     left: -4px;
  103.     color: #FFF;
  104.     z-index: 999;
  105.     font-size: 29px;
  106.     display: block;
  107.     width: 30px;
  108.     height: 30px;
  109. }
  110. html #x13-counter-container .counter-text >p > em > span{
  111.         margin-top: 10px;
  112.     float: left;
  113.     width: 100%;
  114. }
  115. html #x13-counter-container .counter-text{
  116.     width: 100%;
  117.     float: left;
  118.     display: flex;
  119.     flex-flow: row wrap;
  120.     justify-content: space-between;
  121.     margin-right: 0;
  122.     padding-right: 0;
  123. }
  124. html #x13-counter-container .counter-text > .code-info{
  125.     width:33%;
  126. }
  127. html #x13-counter-container .counter-text > p:nth-child(1){
  128.     width: 33%;
  129.     display: flex;
  130.     justify-content: center;
  131. }
  132. html #x13-counter-container .counter-text > p:nth-child(2){
  133.     width: 33%;
  134.     display: flex;
  135.     flex-flow: row wrap;
  136.     align-items: center;
  137.     justify-content: center;
  138.     padding-top: 20px;
  139. }
  140. @media screen and (max-width: 991px){
  141.     html #x13-counter-container em{
  142.         width:100%;
  143.     }
  144.     html #x13-counter-container #counter-3{
  145.         width:100%;
  146.        
  147.     }
  148.     html #x13-counter-container{
  149.          margin-top: -15px;
  150.          margin-bottom: 40px;
  151.     }
  152. }
  153. @media screen and (max-width: 768px){
  154.     html #x13-counter-container #counter-3{
  155.         width: 100% !important;
  156.         margin-left: 10px;
  157.     }
  158.     html #x13-counter-container em strong.code{
  159.         margin-top: 16px;
  160.         width: 100%;
  161.         margin-bottom: 10px;
  162.     }
  163.     html #x13-counter-container .code-info{
  164.         width:100%!important;
  165.     }
  166. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement