contact.html 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. <!DOCTYPE html>
  2. <html lang="ro">
  3. <head>
  4. <title>My first website</title>
  5. <meta charset="UTF-8">
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  8. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  9. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  10. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  11. </head>
  12. <style>
  13. body {
  14. background: #555;
  15. }
  16. .content {
  17. max-width: 1300px;
  18. margin: auto;
  19. background: white;
  20. padding: 30px;
  21. }
  22. /* Remove the navbar's default margin-bottom and rounded borders */
  23. .navbar {
  24. margin-bottom: 0;
  25. border-radius: 0;
  26. }
  27. /* Set height of the grid so .sidenav can be 100% (adjust as needed) */
  28. .row.content {
  29. height: 450px;
  30. }
  31. /* Set gray background color and 100% height */
  32. .sidenav {
  33. padding-top: 20px;
  34. background-color: #f1f1f1;
  35. height: 100%;
  36. }
  37. /* On small screens, set height to 'auto' for sidenav and grid */
  38. @media screen and (max-width: 767px) {
  39. .sidenav {
  40. height: auto;
  41. padding: 15px;
  42. }
  43. row.content {
  44. height: auto;
  45. }
  46. }
  47. .top-space {
  48. margin-top: 50px;
  49. }
  50. .top-space2 {
  51. margin-top: 30px;
  52. }
  53. </style>
  54. <body style="height: 500px">
  55. <div class="content">
  56. <nav class="navbar navbar-inverse navbar-fixed-top">
  57. <div class="container-fluid">
  58. <div class="navbar-header">
  59. <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
  60. <span class="icon-bar"></span>
  61. <span class="icon-bar"></span>
  62. <span class="icon-bar"></span>
  63. </button>
  64. </div>
  65. <div class="collapse navbar-collapse" id="myNavbar">
  66. <ul class="nav navbar-nav">
  67. <li><a href="index.html">Acasă</a></li>
  68. <li><a href="about.html">Despre proiect</a></li>
  69. <li><a href="objects.html">Obiective</a></li>
  70. <li><a href="steps.html">Etape de realizare</a></li>
  71. <li><a href="results.html">Rezultate</a></li>
  72. <li><a href="news.html">Noutăți</a></li>
  73. <li class="active"><a href="contact.html">Contact</a></li>
  74. </ul>
  75. <ul class="nav navbar-nav navbar-right">
  76. <li>
  77. <form class="navbar-form navbar-left" action="/action_page.php">
  78. <div class="input-group">
  79. <input type="text" class="form-control" placeholder="Căutare" name="search">
  80. <div class="input-group-btn">
  81. <button type="submit" class="btn btn-default">
  82. <i class="glyphicon glyphicon-search"></i>
  83. </button>
  84. </div>
  85. </div>
  86. </form>
  87. </li>
  88. </ul>
  89. </div>
  90. </div>
  91. </nav>
  92. <!-- Container (Contact Section) -->
  93. <div class="top-space">
  94. <div class="container">
  95. <h1>Contact</h1>
  96. </div>
  97. </div>
  98. <div class="container">
  99. <hr>
  100. <img src="img\contact-us.jpg" class="img-rounded" style="width:100%">
  101. <div class="top-space2">
  102. <div class="container">
  103. <div class="row">
  104. <div class="col-lg-6">
  105. <form action="/action_page.php">
  106. <div class="form-group">
  107. <label for="usr">Nume și prenume:</label>
  108. <input type="text" class="form-control" id="usr" placeholder="Enter your name" name="usr">
  109. </div>
  110. <div class="form-group">
  111. <label for="email">Email:</label>
  112. <input type="email" class="form-control" id="email" placeholder="Enter your email" name="email">
  113. </div>
  114. <div class="form-group">
  115. <label for="subject">Subiect:</label>
  116. <input type="text" class="form-control" id="subject" placeholder="Enter your subject" name="subject">
  117. </div>
  118. <div class="form-group">
  119. <label for="message">Mesaj:</label>
  120. <textarea class="form-control" rows="5" id="message" placeholder="Enter your message" name="message"></textarea>
  121. </div>
  122. <button type="submit" class="btn btn-primary">TRIMITE</button>
  123. </form>
  124. </div>
  125. <div class="col-lg-6 ">
  126. <p><i class="fa fa-envelope" style="color:#444444; font-size: 21px;"></i>&nbsp&nbspoffice@ici.ro</p><br>
  127. <p><i class="fa fa-map-marker" style="color:#444444; font-size: 22px;"></i>&nbsp&nbsp&nbsp&nbspB-dul Maresal Al. Averescu, 8-10 sector 1, 011455 Bucureşti</p><br>
  128. <p><i class="fa fa-phone" style="color:#444444; font-size: 22px;"></i>&nbsp&nbsp&nbsp&nbsp+40 21 316 07 36</p><br>
  129. <p><i class="fa fa-fax" style="color:#444444; font-size: 22px;"></i>&nbsp&nbsp&nbsp&nbsp+40 21 316 10 30</p><br>
  130. <p><i class="fa fa-clock-o" style="color:#444444; font-size: 24px;"></i>&nbsp&nbsp&nbsp&nbsp&nbspLuni - Vineri: 08:30 - 16:00</p>
  131. </div>
  132. </div>
  133. </div>
  134. </div>
  135. </body>
  136. </html>