Advertisement
Guest User

bude.html

a guest
Oct 21st, 2016
73
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 3.85 KB | None | 0 0
  1. <html>
  2.  <head>
  3.   <style>
  4.     #container {
  5.       background-image: url(bg.png);
  6.       background-repeat: no-repeat;
  7.       background-size: contain;
  8.       background-position: center;
  9.     }
  10.  
  11.     #top {
  12.       height: 75px;
  13.       background-color: white;
  14.       text-align: center;
  15.       font-size: 36px;
  16.       font-weight: bold;
  17.       padding-top: 25px;
  18.     }
  19.  
  20.     #body {
  21.       height: 606px;
  22.     }
  23.  
  24.     #body-left {
  25.       float: left;
  26.       margin-top: 10px;
  27.       margin-bottom: 10px;
  28.       border: 2px solid #00b6d8;
  29.       border-radius: 3px;
  30.       margin-left: 15px;
  31.       background-color: white;
  32.     }
  33.  
  34.     #body-left-top {
  35.       height: 30px;
  36.       background-color: #00b6d8;
  37.     }
  38.  
  39.     .body-left-wrong-right {
  40.       color: white;
  41.       border-radius: 5px;
  42.       margin: 15px 10px;
  43.       padding: 10px 15px;
  44.       text-align: center;
  45.       font-size: 20px;
  46.     }
  47.  
  48.     #body-left-wrong {
  49.       background-color: red;
  50.     }
  51.  
  52.     #body-left-right {
  53.       background-color: #2fcc71;
  54.     }
  55.  
  56.     #body-left-round {
  57.       margin-top: 20px;
  58.     }
  59.  
  60.     .body-left-round-val {
  61.       width: 60px;
  62.       height: 60px;
  63.       border-radius: 50%;
  64.       border: 10px solid #eeba55;
  65.       background: #cea24f;
  66.       margin: 15px 10px;
  67.       color: white;
  68.       font-size: 24px;
  69.       text-align: center;
  70.     }
  71.  
  72.     .body-left-round-val-center {
  73.       padding-top: 15px;
  74.     }
  75.  
  76.     #body-left-cancel {
  77.       border-radius: 5px;
  78.       margin: 15px 10px;
  79.       padding: 10px 15px;
  80.       text-align: center;
  81.       font-size: 20px;
  82.       background-color: #cdcdcd;
  83.     }
  84.  
  85.     #footer {
  86.       background-color: #e93d31;
  87.       height: 80px;
  88.       text-align: center;
  89.       padding-top: 25px;
  90.     }
  91.  
  92.     #footer-item {
  93.       display: inline-block;
  94.       border-top: 2px solid white;
  95.       border-radius: 3px;
  96.       color: white;
  97.       margin-right: 15px;
  98.     }
  99.    
  100.     .footer-item-title {
  101.       float: left;
  102.       background-color: #00a1c3;
  103.       font-size: 18px;
  104.       padding: 15px 10px;
  105.     }
  106.  
  107.     .footer-item-text {
  108.       float: left;
  109.       background-color: #008aa6;
  110.       padding: 15px 10px;
  111.       font-size: 18px;
  112.     }
  113.   </style>
  114.  </head>
  115.  <body>
  116.   <div id="container">
  117.    <div id="top">
  118.     Betting Dashboard
  119.    </div>
  120.    <div id="body">
  121.     <div id="body-left">
  122.       <div id="body-left-top">
  123.       </div>
  124.       <div id="body-left-wrong" class="body-left-wrong-right">
  125.         Wrong
  126.       </div>
  127.       <div id="body-left-right" class="body-left-wrong-right">
  128.         Right
  129.       </div>
  130.       <div id="body-left-round">
  131.         <div class="body-left-round-val">
  132.           <div class="body-left-round-val-center">
  133.             +10
  134.           </div>
  135.         </div>
  136.         <div class="body-left-round-val">
  137.           <div class="body-left-round-val-center">
  138.             -10
  139.           </div>
  140.         </div>
  141.       </div>
  142.       <div id="body-left-cancel">
  143.         Cancel
  144.       </div>
  145.     </div>
  146.     <div id="body-right">
  147.  
  148.     </div>
  149.    </div>
  150.    <div id="footer">
  151.       <div id="footer-item">
  152.         <div class="footer-item-title">
  153.           Total Time
  154.         </div>
  155.         <div class="footer-item-text">
  156.           01 h 30 min
  157.         </div>
  158.       </div>
  159.       <div id="footer-item">
  160.         <div class="footer-item-title">
  161.           Answer & Bet Time
  162.        </div>
  163.        <div class="footer-item-text">
  164.          60 sec
  165.        </div>
  166.      </div>
  167.      <div id="footer-item">
  168.        <div class="footer-item-title">
  169.          Your Amount
  170.        </div>
  171.        <div class="footer-item-text">
  172.          $100
  173.        </div>
  174.      </div>
  175.      <div id="footer-item">
  176.        <div class="footer-item-title">
  177.          Richest Team
  178.        </div>
  179.        <div class="footer-item-text">
  180.          XXXX
  181.        </div>
  182.      </div>
  183.   </div>
  184.  </div>
  185. </body>
  186. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement