Advertisement
Guest User

Untitled

a guest
May 14th, 2017
29
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 14.44 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang=en>
  3.    <head>
  4.     <script src=" https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js "></script>
  5.  
  6.       <meta charset="utf-8"/>
  7.       <link href="style.css" type="text/css" rel="stylesheet"/>
  8.       <link href="reset.css" type="text/css" rel="stylesheet" />
  9.       <title>House of Metal</title>
  10.       <script src="jquery.js"></script>
  11.    </head>
  12.    <body>
  13.       <div id="menu">
  14.         <ul>
  15.             <li><a href="#newsA">News</a></li>
  16.             <li><a href="#informationA">Information</a></li>
  17.             <li><a href="#ticketsA">Tickets</a></li>
  18.             <li><a href="#scheduleA">Schedule</a></li>
  19.             <li><a href="#historyA">History</a></li>
  20.             <li><a href="#volunteerA">Volunteer</a></li>
  21.             <li><a href="#contactA">Contact</a></li>
  22.          </ul>
  23.       </div>
  24.       <div id="wrapper">
  25.          <div id="main">
  26.             <img src="media/Logo.png" alt="Logo">
  27.             <table>
  28.                <tr>
  29.                </tr>
  30.                <tr>    
  31.                </tr>
  32.             </table>
  33.          </div>
  34.          <a class="anchor" id="newsA"></a>
  35.          <div id="news">
  36.             <p class="title">News</p>
  37.             <div id="expand" onclick="submit"></div>
  38.          </div>
  39.          <a class="anchor" id="informationA"></a>
  40.          <div id="information">
  41.             <div id="infLeft">
  42.                <h1 class="title">Information</h1>
  43.                <p>House of Metal is a two day indoor festival dedicated to various kinds of metal. The festival premiered at Umeå Folkets Hus in February 2007.</p>
  44.                <p>The festival has a capacity of 2700 visitors per night and enforces an age limit of 18.</p>
  45.                <p>HoM has three stages and every year app. 25 bands, Swedish and international, crowd these stages. The festival also spots a market area selling CDs and candy etc.</p>  
  46.                <p>The goal is to become the best metal festival in Sweden and that goal is not too far off. Exceptional acts have visited the festival over the years, among others Lamb of God, Behemoth, Meshuggah, Soilwork, Satyricon, Pain, Nocturnal Rites, Entombed, Opeth, Samael, just to mention a few.</p>
  47.                <p>Please see the “tickets” area for more information on how to buy your ticket for the festival.</p>
  48.                 <p>You can travel to Umeå by flight, train, boat or bus, or drive your own car. There are numerous hotels to choose from in the city. Please visit <a href="http://www.visitumea.se/">VisitUmea</a> for more information.</p>
  49.             </div>
  50.             <div id="infRight">
  51.                <h1 class="title">Rules of Conduct</h1>
  52.                <p>In order to offer a festival as safe and enjoyable for everyone, we summarize some rules for the festival below. </p>
  53.                <p><span class="bold">We would like to draw your attention to the following:</span></p>
  54.                <p>- You can not bring your own food or drinks to the festival.</p>
  55.                <p>- Tickets are only refunded if the festival would not take place, not on individual bands cancelling.</p>
  56.                <p>- You will be denied access if you arrive drunk.</p>
  57.                <p>- You must have identification with you when you pick up your festival wristband, if we are unsure of your age, we can not put an “over-18-year-band” on you.</p>
  58.                <p>- Due to the artists demands all forms of video cameras and audio recording devices are prohibited. If your caught with such, you risk losing your festival-wristband. Cameras with standard equipment (with fixed lens, up to 55 mm zoom) are allowed for festival visitors, but only for private use. It is not allowed to bring extra equipment such as tri-pods, telephoto lenses, removable flash, battery grip etc. Of course a mobile camera or your regular pocket camera is ok.</p>
  59.                <p>- Crowd surfing and stage diving is not allowed to to safety issues.</p>
  60.                 <p><b>Other things to keep in mind is that you leave the following items at home:</b></p>
  61.                <p>- Knives and other weapons.</p>
  62.                <p>- Drugs</p>
  63.                <p>- Bad mood.</p>
  64.                <p>Upon failure to comply to these rules, we reserve the right to cut your festival wristband and escort you from the festival area. The different stages has a maximum limitation when it comes to audience capacity. If it is important for you to see an artist – Be on time! If you arrive late and the doors are closed – have patience. You are likely to come in after a while (as people tend to come and go during shows).</p>
  65.             </div>
  66.          </div>
  67.          <a class="anchor" id="ticketsA"></a>
  68.          <div id="tickets">
  69.             <h1 class="title">Tickets</h1>
  70.             <p>Tickets are sold through Tickster and Biljettcentrum.</p>
  71.             <br/>
  72.             <p>1-day – 380 SEK + service charge</p>
  73.             <p>2-day – 700 SEK + service charge</p>
  74.             <br/>
  75.             <p>You need to be at least 18 years old to attend.</p>
  76.             <p>Visitors under age of 18 can only enter accompanied by a parent.</p>
  77.             <p>Children under the age of 13 cannot enter the festival due to loud music volumes.</p>
  78.             <p>Don’t forget to bring a valid photographic ID.</p>
  79.             <br/>
  80.             <p><b>Buy your tickets at:</b></p>
  81.             <a href="http://www.tickster.com/sv/events/search?q=house+of+metal">Tickster</a>
  82.             <br/>
  83.             <a href="http://biljettcentrum.com/evenemang/house-of-metal-2017/">Biljettcentrum</a>
  84.             <br/>
  85.             <p>Tickets can also be bought at the front desk of Biljettcentrum, Umeå Folkets Hus</p>
  86.             <p>Tickets will only be refunded if the festival is cancelled, not if individual artists cancel.</p>
  87.          </div>
  88.          <a class="anchor" id="scheduleA"></a>
  89.          <div id="schedule">
  90.             <h1 class="title">Schedule</h1>
  91.             <table width="100%">
  92.                <tbody>
  93.                   <tr>
  94.                      <th colspan="4" bgcolor="#ff0000"><span style="color: #000000;">IDUN</span></th>
  95.                   </tr>
  96.                   <tr>
  97.                      <td colspan="2" width="50%">
  98.                      <p class="bold">FRIDAY</p></td>
  99.                      <td colspan="2" width="50%">
  100.                      <p class="bold">SATURDAY</p></td>
  101.                   </tr>
  102.                   <tr>
  103.                      <td>23.45</td>
  104.                      <td>Anthrax</td>
  105.                      <td>23.45</td>
  106.                      <td>Dark Tranquillity</td>
  107.                   </tr>
  108.                   <tr>
  109.                      <td>21.30</td>
  110.                      <td>Pain</td>
  111.                      <td>21.45</td>
  112.                      <td>Krisiun</td>
  113.                   </tr>
  114.                   <tr>
  115.                      <td width="15%">19.30</td>
  116.                      <td>Scar Symmetry</td>
  117.                      <td width="15%">19.45</td>
  118.                      <td>Gloryhammer</td>
  119.                   </tr>
  120.                </tbody>
  121.             </table>
  122.             <p>&nbsp;</p>
  123.             <table width="100%">
  124.                <tbody>
  125.                   <tr>
  126.                      <th colspan="4" bgcolor="#ff0000"><span style="color: #000000;">STUDION</span></th>
  127.                   </tr>
  128.                   <tr>
  129.                      <td colspan="2" width="50%">
  130.                      <p class="bold">FRIDAY</p></td>
  131.                      <td colspan="2" width="50%">
  132.                      <p class="bold">SATURDAY</p></td>
  133.                   </tr>
  134.                   <tr>
  135.                      <td>00.30</td>
  136.                      <td>Grid</td>
  137.                      <td>00.30</td>
  138.                      <td>Asphyx</td>
  139.                   </tr>
  140.                   <tr>
  141.                      <td>22.45</td>
  142.                      <td>Vintersorg</td>
  143.                      <td>22.45</td>
  144.                      <td>Wolf</td>
  145.                   </tr>
  146.                   <tr>
  147.                      <td>21.00</td>
  148.                      <td>Grave</td>
  149.                      <td>21.00</td>
  150.                      <td>Ereb Altor</td>
  151.                   </tr>
  152.                   <tr>
  153.                      <td width="15%">19.30</td>
  154.                      <td>The Raven Age</td>
  155.                      <td width="15%">19.30</td>
  156.                      <td>Purgatorium</td>
  157.                   </tr>
  158.                </tbody>
  159.             </table>
  160.             <p>&nbsp;</p>
  161.             <table width="100%">
  162.                <tbody>
  163.                   <tr>
  164.                      <th colspan="4" bgcolor="#ff0000"><span style="color: #000000;">ÄPPLET &#8211; SENSUS / THE TUBE<br />
  165.                         </span>
  166.                      </th>
  167.                   </tr>
  168.                   <tr>
  169.                      <td colspan="2" width="50%">
  170.                      <p class ="bold">FRIDAY</p></td>
  171.                      <td colspan="2" width="50%">
  172.                      <p class="bold">SATURDAY</p></td>
  173.                   </tr>
  174.                   <tr>
  175.                      <td>23.00</td>
  176.                      <td>Gluttony</td>
  177.                      <td>23.00</td>
  178.                      <td>Mesolimbic</td>
  179.                   </tr>
  180.                   <tr>
  181.                      <td>21.15</td>
  182.                      <td>Hyperion</td>
  183.                      <td>21.15</td>
  184.                      <td>Tragederia</td>
  185.                   </tr>
  186.                   <tr>
  187.                      <td width="15%">19.15</td>
  188.                      <td>Nekrodelirium</td>
  189.                      <td width="15%">19.15</td>
  190.                      <td>A Lethal Smile</td>
  191.                   </tr>
  192.                   <tr>
  193.                      <td>18.30</td>
  194.                      <td>Pop&amp;Rockkören</td>
  195.                      <td>18.00</td>
  196.                      <td>Preparty</td>
  197.                   </tr>
  198.                   <tr>
  199.                      <td>18.00</td>
  200.                      <td>Preparty</td>
  201.                      <td></td>
  202.                      <td></td>
  203.                   </tr>
  204.                </tbody>
  205.             </table>
  206.          </div>
  207.          <a class="anchor" id="historyA"></a>
  208.          <div id="history">
  209.              <div class="hisTop">
  210.                  <h1 class="title">History</h1>
  211.                  <a id="focusMe" onclick='his2017()' >2017</a>
  212.                  <a onclick='his2016()'>2016</a>
  213.                  <a onclick='his2015()'>2015</a>
  214.                  <a onclick='his2014()'>2014</a>
  215.                  <a onclick='his2013()'>2013</a>
  216.              </div>
  217.                  <div id="Span1">
  218.                      <p>A Lethal Smile</p>
  219.                      <p>Anthrax</p>
  220.                      <p>Asphyx</p>
  221.                      <p>Dark Tranquility</p>
  222.                      <p>Ereb Altor</p>
  223.                      <p>Gloryhammer</p>
  224.                      <p>Gluttony</p>
  225.                      <p>Grave</p>
  226.                      <p>Grid</p>
  227.                      <p>Hyperion</p>
  228.                      <p>Kristiun</p>
  229.                      <p></p>
  230.                      <p></p>
  231.                      <p></p>
  232.                      <p></p>
  233.                      <p></p>
  234.                  </div>
  235.                  <div id="Span2">
  236.                     <p>Mesolimbic</p>
  237.                     <p>Nekrodelirium</p>
  238.                     <p>Pain</p>
  239.                     <p>Purgatorium</p>
  240.                     <p>The Raven Age</p>
  241.                     <p>Svar Symmetry</p>
  242.                     <p>Tragederia</p>
  243.                     <p>Umeå Pop-& Rockkör</p>
  244.                    <p>Vintersorg</p>
  245.                    <p>Wolf</p>
  246.                    <p></p>
  247.                    <p></p>
  248.                    <p></p>
  249.                    <p></p>
  250.                    <p></p>
  251.                </div>
  252.         </div>
  253.         <a class="anchor" id="volunteerA"></a>
  254.         <div id="volunteer">
  255.             <h1 class="title">Volunteers</h1>
  256.             <p class="center">We, like other festivals, need a few helping hands and we therefor need more hard-working volunteers. As a volunteer you will help us and work in various areas during the festival and we need extra hands before as well as during the weekend. Your job ranges from stagehands to entrance-keepers and while you work you are one of the festival’s public faces, which makes it important that you keep a dedicated mind!</p>
  257.             <br/>
  258.             <p>We are also looking for Street Teams to cover the following communities:</p>
  259.             <p><span class="pentagram">&#9959</span>Skellefteå</p>
  260.             <p> <span class="pentagram">&#9959</span>Lycksele</p>
  261.             <p> <span class="pentagram">&#9959</span>Piteå</p>
  262.             <p> <span class="pentagram">&#9959</span>Östersund</p>
  263.             <br/>
  264.             <p class="center">Are you interested and want to know more? Don’t hesitate to send an e-mail to lisa@houseofmetal.se with your name , age and mobile number. Also, please provide some additional information about yourself, like previous experience and general interests.</p>
  265.         </div>
  266.         <a class="anchor" id="contactA"></a>
  267.         <div id="contact">
  268.             <h1 class="title">Contact</h1>
  269.             <div class="contactLeft">
  270.                 <p class="bold">FESTIVAL GENERAL</p>
  271.                 <p>Petra Edström</p>
  272.                 <p>petra@houseofmetal.se</p>
  273.                 <br/>
  274.                 <p class="bold">ARTISTS</p>
  275.                 <p>Tommi Konu</p>
  276.                 <p>tommi@houseofmetal.se</p>
  277.                 <br/>
  278.                 <p>Mats Björklund</p>
  279.                 <p>mats@houseofmetal.se</p>
  280.                 <br/>
  281.                 <p class="bold">ARTISTS/ PARTNERS</p>
  282.                 <p>Lisa Magnusson</p>
  283.                 <p>lisa@houseofmetal.se</p>
  284.             </div>
  285.             <div class="contactRight">
  286.                 <br>
  287.                 <p>Got a question? Feel free to send a mail to our support team.</p><br>
  288.                 <form action="mailto:help@houseofmetal.se" method="post" enctype="text/plain">
  289.                     Name:<br>
  290.                     <input type="text" name="name"><br>
  291.                     E-mail:<br>
  292.                     <input type="text" name="mail"><br>
  293.                     Comment:<br>
  294.                     <textarea name="comments" cols="40" rows="10"></textarea><br>
  295.                     <input type="submit" value="Send">
  296.                     <input type="reset" value="Reset">
  297.                 </form>
  298.             </div>
  299.         </div>
  300.      </div>
  301.      
  302.   </body>
  303. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement