API tools faq
paste
Advertisement
AdamBB

Auction template 2

AdamBB
Dec 8th, 2020
2,188
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 4.38 KB | None | 0 0
raw download clone embed print report
  1. <head>
  2.   <style>
  3.     * {
  4.       box-sizing: border-box;
  5.     }
  6.     .main-content {
  7.       background-color: #F70000;
  8.       font-family: Arial, Helvetica, sans-serif;
  9.       display: flex;
  10.       flex-wrap: wrap;
  11.       color: #670200;
  12.       width: 700px;
  13.       margin: 0 auto;
  14.     }
  15.  
  16.     .tile {
  17.       flex: 1 0 auto;
  18.       height: auto;
  19.       width: 50%;
  20.       text-align: center;
  21.       padding: 20px;
  22.       overflow: hidden;
  23.       position: relative;
  24.     }
  25.  
  26.     .tile:before {
  27.       content: '';
  28.       float: left;
  29.       padding-top: 100%;
  30.     }
  31.  
  32.     .p-0 {
  33.       padding: 0 !important;
  34.     }
  35.  
  36.     .h1 {
  37.       color: #fff;
  38.       font-weight: 600;
  39.       font-size: 30px;
  40.     }
  41.  
  42.     .bold {
  43.       font-weight: 600;
  44.     }
  45.  
  46.     .white {
  47.       color: #fff;
  48.     }
  49.  
  50.     .bg-white {
  51.       background-color: #fff;
  52.     }
  53.  
  54.     .flex {
  55.       display: flex;
  56.       align-items: center;
  57.     }
  58.  
  59.     .circle {
  60.       border-radius: 50%;
  61.       width: 50px;
  62.       height: 50px;
  63.     }
  64.  
  65.     .full-size {
  66.       width: 100%;
  67.       overflow: hidden;
  68.       background-color: #fff;
  69.     }
  70.  
  71.     .inpost-car {
  72.       position: absolute;
  73.       right: 15px;
  74.       top: 25px;
  75.       width: 60px;
  76.     }
  77.  
  78.     .payment {
  79.       background-color: #9B120F;
  80.       padding: 12px 0;
  81.       position: absolute;
  82.       left: 0;
  83.       bottom: 0;
  84.       width: 100%;
  85.     }
  86.  
  87.     .payment img {
  88.       border-radius: 50%;
  89.       width: 50px;
  90.       height: 50px;
  91.       margin: 0 4px;
  92.     }
  93.  
  94.     .post {
  95.       position: absolute;
  96.       transform: rotate(20deg);
  97.       width: 50px;
  98.       top: 15px;
  99.       right: 30px
  100.     }
  101.  
  102.     .mt-2 {
  103.       margin-top: 20px;
  104.     }
  105.  
  106.     .mt-5 {
  107.       margin-top: 50px;
  108.     }
  109.  
  110.     .footer {
  111.       text-align: center;
  112.       background-color: #262424;
  113.       color: #8D9292;
  114.       padding: 4px;
  115.       width: 700px;
  116.       margin: 0 auto;
  117.     }
  118.   </style>
  119. </head>
  120. <div class="main-content">
  121.   <div class="tile">
  122.     <div class="h1">does it fit my turbocharger?</div>
  123.     <p>Please check your <strong>Part number</strong> and <strong>OEM number</strong> which are located on your turbocharger aluminium housing to make sure that they match the ones which you can find in our part description</p>
  124.     <p>If you are unsure or can't find your part number please don't hesitate to <strong>contact us</strong></p>
  125.     <p>
  126.       <div class="flex">
  127.         <img src="https://redlif.e-kei.pl/assets/photos/icons/finder.png" class="circle">
  128.         <div>You can also use our <strong>FINDER</strong> to match it with your car</div>
  129.       </div>
  130.     </p>
  131.   </div>
  132.   <div class="tile p-0 bg-white flex">
  133.     <img src="https://redlif.e-kei.pl/assets/photos/gaskets/KT100005E.jpg" class="full-size">
  134.   </div>
  135.  
  136.   <div class="tile p-0 bg-white flex">
  137.     <img src="https://redlif.e-kei.pl/assets/photos/icons/car.png" class="full-size">
  138.   </div>
  139.   <div class="tile">
  140.     <div class="h1">
  141.       <span>worldwide<br>delivery</span>
  142.       <img src="https://redlif.e-kei.pl/assets/photos/icons/inpostcar.png" class="inpost-car">
  143.     </div>
  144.     <p>
  145.       <div class="bold white">Dispatched on the same day</div>
  146.       <div>We dispatch your products on the same day and delivery lasts 1-3 working days. Prices depend on destination you are ordering to</div>
  147.     </p>
  148.     <p>
  149.       <div class="bold white">Patment method</div>
  150.       <div>We accept credit and debit cards. PayPal, Bank transfers</div>
  151.     </p>
  152.     <div class="payment">
  153.       <img src="https://redlif.e-kei.pl/assets/photos/icons/visa.png">
  154.       <img src="https://redlif.e-kei.pl/assets/photos/icons/mastercard.png">
  155.       <img src="https://redlif.e-kei.pl/assets/photos/icons/maestro.png">
  156.       <img src="https://redlif.e-kei.pl/assets/photos/icons/paypal.png">
  157.       <img src="https://redlif.e-kei.pl/assets/photos/icons/cash.png">
  158.     </div>
  159.   </div>
  160.  
  161.   <div class="tile">
  162.     <div class="h1 mt-2">contact details<img src="./icons/post.png" class="post"></div>
  163.     <p>
  164.       <div class="bold white mt-5">Phone</div>
  165.       <div>+48 531 883 003</div>
  166.     </p>
  167.    
  168.     <p>
  169.       <div class="bold white mt-5">Email</div>
  170.       <div>gasker.shop@gmail.com</div>
  171.     </p>
  172.   </div>
  173.   <div class="tile p-0 bg-white flex">
  174.     <img src="https://redlif.e-kei.pl/assets/photos/gasker_logo2.png" class="full-size">
  175.   </div>
  176. </div>
  177.  
  178. <div class="footer">+48 531 883 003 gasker.shop@gmail.com ebay @gasker
  179.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!