webtask/b4.html at main · yashikaa2005/webtask · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<html>
<head>
    <title> my page !!!! </title>
    <style>
        body {
    background:white;
    color: rgb(21, 2, 2);
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
  }

  header {
    background-color: rgb(244, 237, 237);
    background-image: url("china.jpg");
    background-size: 100%;
    background-position: center;
    height: 200px;
    padding: 20px;
    text-align: center;
    background-repeat: no-repeat;
  }

  header a {
    text-decoration: none;
    color:black;
    -webkit-text-stroke-color: rgb(18, 1, 1);
    -webkit-text-stroke-width: 1px;
    text-shadow: 2px 4px 4px;
    text-transform: uppercase;
    margin-right:200px;
  }

  header .mobile {
    display: none;
  }

  header .logo a {
    background-size: 300px;
    background-repeat: no-repeat;
    display: inline-block;
    height: 80px;
    position: relative;
    text-indent: -9999999px;
    top: -30px;
    width: 300px;
  }

  nav ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
  }

  nav li {
    display: inline-block;
    margin-right: 20px;
  }

  /* RESPONSIVE RULES */

  @media screen and (max-width: 700px) {
    header {
      height: 150px;
      background-position: 0 -30px;
    }
    header a{
    color:rgb(2, 0, 0);
     margin:0 0 0 0px;
    -webkit-text-stroke-color:rgb(25, 1, 1);
    -webkit-text-stroke-width: 1px;
    }
    header .mobile {
      display: inline-block;
    }
    header .desktop {
      display: none;
    }
  }

  @media screen and (max-width: 500px) {
    header {
      height: 10px;
      position: 0 -0px;
    }
  }
  section{
    margin: 50px;
    text-align:justify;
  }
  h1{
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    text-decoration: underline;
    font-size:30px;
  }
  h2{
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
  }
  p{
    font-family: Arial, Helvetica, sans-serif;
    text-align: justify;
    font-size:18px;
  }
  /* FOOTER */

  footer {
    background: black;
    color: gray;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    padding: 20px 20px;
    text-align: center;
    height:20px;
    text-transform: uppercase;
  }

    </style>
</head>
<body>
<header>
    <nav>
      <ul>
        <li><a href="index.html">Home</a></li>
        <li><a href="index.html">About</a></li>
        <li class="mobile"><a href="index.html">Our Blogs</a></li>
        <li class="mobile"><a href="index.html">Contact</a></li>
        <li class="desktop"><a href="index.html">Our Blogs</a></li>
        <li class="desktop"><a href="index.html">Contact</a></li>
        <li class="logo"><a href="index.html"></a></li>
      </ul>
    </nav>
  </header>
</body>
<section>
    <h1><strong>A Rookie Mistake in China</strong></h1>
    <h2>by Talek from Travels With Talek blog</h2>
    <p>Ah…cultural confusion. One weekend I was in a part of Beijing I was not familiar with and decided to get a massage.  I remembered what appeared to be a massage spa nearby. The location didn’t look exactly like a typical spa, but I went in anyway.</p>
    <p>The inside of the location had all the spa-like features which reassured me.  However, when the hostess approached me, she appeared apprehensive and asked me something in Chinese. I pantomimed a massage.  She disappeared into a dark room behind a beaded curtain. I could hear her and another woman speaking animatedly. I could barely understand what they were talking.</p>
    <p>After some uncomfortable moments, the woman returned and lead me to a dimly lit, rectangular room with a massage table in the middle. I positioned myself as I normally would. A different woman came in and gave me a lackadaisical massage for about an hour. I paid and went back to my hotel.</p>
    <p>The next day my colleagues and I discussed our weekend. I mentioned my massage at a location next to the Wanda department store. “Oh! That’s a high-end brothel” they said. They’re probably still laughing.</p>
  </section>
  <footer>
    Contact: For blog submission, mail on bloggers.hub@gmail.com
  </footer>