Advertisement
Guest User

Untitled

a guest
Jul 24th, 2017
60
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.40 KB | None | 0 0
  1. @charset "utf-8";
  2. body {
  3. background-image: url(Images/Webpage.jpg);
  4. background-size: cover;
  5. background-clip: padding-box;
  6. margin: 0;
  7. padding: 0;
  8. overflow: hidden;
  9. }
  10. .form {
  11. margin: 0 auto;
  12. position: absolute;
  13. top: 5px;
  14. right: 0px;
  15. width: 300px;
  16. }
  17. .toggle {
  18. background: url("http://i.imgur.com/ePNPopY.png") no-repeat scroll center center #333333;
  19. border: medium none;
  20. color: #FFFFFF;
  21. cursor: pointer;
  22. display: block;
  23. height: 40px;
  24. position: absolute;
  25. right: 0;
  26. width: 50px;
  27. }
  28. #searchform {
  29. float: right;
  30. height: 40px;
  31. margin: 0;
  32. opacity: 0;
  33. padding: 0;
  34. transition: all 0.2s ease-in-out 0s;
  35. visibility: hidden;
  36. width: 10px;
  37. -webkit-transition: all 0.2s ease-in-out;
  38. -moz-transition: all 0.2s ease-in-out;
  39. -o-transition: all 0.2s ease-in-out;
  40. }
  41. .form:hover #searchform {
  42. display: block;
  43. opacity: 1;
  44. -webkit-transition: all 0.2s ease-in-out;
  45. -moz-transition: all 0.2s ease-in-out;
  46. -o-transition: all 0.2s ease-in-out;
  47. visibility: visible;
  48. width: 450px;
  49. }
  50. #searchform #s {
  51. background: none repeat scroll 0 0 #DFDFDF;
  52. border: medium none;
  53. color: #FFFFFF;
  54. float: right;
  55. outline: none;
  56. font-family: helvetica, verdana, arial, sans-serif;
  57. font-size: 12px;
  58. height: 100%;
  59. padding: 0 15px;
  60. width: 100%;
  61. }
  62. #searchform #searchsubmit {
  63. background: url("http://i.imgur.com/ePNPopY.png") no-repeat scroll center center #7A7A7A;
  64. border: medium none;
  65. color: #FFFFFF;
  66. cursor: pointer;
  67. display: block;
  68. height: 40px;
  69. position: absolute;
  70. right: 0;
  71. width: 50px;
  72. }
  73. .wrapper {
  74. text-align: center;
  75. }
  76. button:hover span.text-content {
  77. opacity: 1;
  78. }
  79. span.text-content {
  80. background: transparent;
  81. color: white;
  82. cursor: curson;
  83. text-align: center;
  84. margin: 0 auto;
  85. position: absolute;
  86. top: 80%;
  87. right: 36%;
  88. display: inline;
  89. opacity: 0;
  90. -webkit-transition: opacity 500ms;
  91. -moz-transition: opacity 500ms;
  92. -o-transition: opacity 500ms;
  93. transition: opacity 500ms;
  94. }
  95. .button1 {
  96. background-color: Transparent;
  97. text-align: center;
  98. background-repeat: no-repeat;
  99. border: none;
  100. position: relative;
  101. margin: auto;
  102. top: 0;
  103. left: 0;
  104. right: 0;
  105. bottom: 0;
  106. cursor: pointer;
  107. overflow: hidden;
  108. -webkit-transition-duration: 0.8s;
  109. -moz-transition-duration: 0.8s;
  110. -o-transition-duration: 0.8s;
  111. transition-duration: 0.8s;
  112. -webkit-transition-property: -webkit-transform;
  113. -moz-transition-property: -moz-transform;
  114. -o-transition-property: -o-transform;
  115. transition-property: transform;
  116. }
  117. .button1:hover {
  118. -webkit-transform: rotate(720deg);
  119. -moz-transform: rotate(720deg);
  120. -o-transform: rotate(720deg);
  121. transform: rotate(720deg);
  122. }
  123. .button {
  124. background-color: Transparent;
  125. background-repeat: no-repeat;
  126. border: none;
  127. cursor: pointer;
  128. overflow: hidden;
  129. outline: none;
  130. position: relative;
  131. -webkit-transition-duration: 0.8s;
  132. -moz-transition-duration: 0.8s;
  133. -o-transition-duration: 0.8s;
  134. transition-duration: 0.8s;
  135. -webkit-transition-property: -webkit-transform;
  136. -moz-transition-property: -moz-transform;
  137. -o-transition-property: -o-transform;
  138. transition-property: transform;
  139. overflow: hidden;
  140. }
  141. .button:hover {
  142. -webkit-transform: rotate(720deg);
  143. -moz-transform: rotate(720deg);
  144. -o-transform: rotate(720deg);
  145. transform: rotate(720deg);
  146. }
  147. .footer {
  148. clear: both;
  149. right: 0px;
  150. width: 100%;
  151. padding: 1rem;
  152. background-color: #000000;
  153. text-align: center;
  154. background-image: none;
  155. background-repeat: repeat;
  156. background-attachment: scroll;
  157. background-position: 0% 0%;
  158. position: fixed;
  159. bottom: 0pt;
  160. left: 0pt;
  161. }
  162. .imgContainer {
  163. display: block;
  164. margin-left: 5px;
  165. margin-right: 5px;
  166. }
  167. .image123 {
  168. display: inline-flex;
  169. justify-content: center;
  170. text-align: center;
  171. position: relative;
  172. right: 42px;
  173. }
  174. .dropbtn {
  175. background-color: black;
  176. color: white;
  177. font-size: 16px;
  178. border: none;
  179. cursor: pointer;
  180. }
  181. .dropdown {
  182. position: relative;
  183. display: inline-block;
  184. float: left;
  185. margin: 12px 12px;
  186. }
  187. .dropdown-content {
  188. display: none;
  189. position: absolute;
  190. background-color: grey;
  191. min-width: 160px;
  192. box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  193. z-index: 1;
  194. }
  195. .dropdown-content a {
  196. color: white;
  197. padding: 8px 8px;
  198. text-decoration: none;
  199. display: block;
  200. }
  201. .dropdown-content a:hover {
  202. background-color: white;
  203. }
  204. .dropdown:hover .dropdown-content {
  205. display: block;
  206. bottom: 100%;
  207. }
  208. .dropdown:hover .dropbtn {
  209. background-color: grey;
  210. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement