Advertisement
Guest User

Untitled

a guest
Dec 10th, 2018
71
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 4.41 KB | None | 0 0
  1. *{
  2.     margin: 0;
  3.     padding: 0;
  4. }
  5.  
  6. .dws{
  7.     width: 100%;
  8. }
  9.  
  10. .dws-image{
  11.     width: 1349px;
  12.     height: 720px;
  13.     background-image: url(img.png);
  14.     background-repeat: no-repeat;
  15.     background-position: center;
  16.     background-size: cover;
  17.     position: absolute;
  18.     -webkit-clip-path: polygon(100% 0, 100% 100%, 0 60%, 0 0);
  19.     clip-path: polygon(100% 0, 100% 100%, 0 60%, 0 0);
  20.     -webkit-filter: grayscale(85%); /* Safari 6.0 - 9.0 */
  21.     filter: grayscale(100%);
  22. }
  23.  
  24. .container{
  25.     width: 1120px;
  26.     margin: auto;
  27. }
  28.  
  29. .dws-block{
  30.     width: 100%;
  31.     display: grid;
  32.     grid-template-columns: 1fr 1fr;
  33. }
  34.  
  35. .item{
  36.     width: 100%;
  37.     margin-left: 100px;
  38. }
  39.  
  40. .item-list{
  41.     width: 400px;
  42.     height: 520px;
  43.     -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 80%);
  44.     clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 80%);
  45.     background-color: #2d2b2a;
  46.     opacity: .8;
  47.     padding-top: 10px;
  48. }
  49.  
  50. .bottom{
  51.     width: 400px;
  52.     height: 520px;
  53.     background-color: #f6ce30;
  54.     position: relative;
  55.     padding-top: 70px;
  56.     top: -11%;
  57.     -webkit-clip-path: polygon(0 0, 100% 20%, 100% 100%, 0% 100%);
  58.     clip-path: polygon(0 0, 100% 20%, 100% 100%, 0% 100%);
  59. }
  60.  
  61. .bottom-text{
  62.     width: 400px;
  63.     margin-top: -70px;
  64. }
  65.  
  66. .shape{
  67.     width: 200px;
  68.     height: 200px;
  69.     background-image: url(shape.png);
  70.     margin-left: auto;
  71.     margin-right: auto;
  72.     background-size: 100%;
  73.     background-position: center;
  74.     background-repeat: no-repeat;
  75.     margin-top: 10px;
  76.     margin-bottom: 10px;
  77. }
  78.  
  79. .bottom-text > p{
  80.     text-align: center;
  81.     font-size: 30px;
  82.     font-family: arial;
  83. }
  84.  
  85. .dws-dws{
  86.     width: 400px;
  87.     background-color: #dd5b35;
  88.     margin-top: 50px;
  89. }
  90.  
  91. .final > p{
  92.     font-size: 18px;
  93.     padding-top: 40px;
  94.     padding-bottom: 40px;
  95.     padding-left: 20px;
  96.     color: white;
  97. }
  98.  
  99. .contact{
  100.     width: 100%;
  101.     margin-left: 20px;
  102. }
  103.  
  104. .contact-list{
  105.     width: 400px;
  106.     height: 500px;
  107.     position: relative;
  108.     -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 80%);
  109.     clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 80%);
  110.     background-color: #cf502f;
  111.     opacity: .8;
  112. }
  113.  
  114. .logo{
  115.     background-image: url(logo.png);
  116.     width: 100px;
  117.     padding-top: 100px;
  118.     padding-bottom: 100px;
  119.     background-position: center;
  120.     background-size: 100%;
  121.     background-repeat: no-repeat;
  122.     margin-left: auto;
  123.     margin-right: auto;
  124. }
  125.  
  126. .brand{
  127.     font-size: 33px;
  128.     text-align: center;
  129.     color: white;
  130.     font-family: arial;
  131. }
  132.  
  133. .partner{
  134.     font-size: 14px;
  135.     text-align: center;
  136.     color: white;
  137.     font-family: arial;
  138. }
  139.  
  140. .big{
  141.     font-family: arial;
  142.     font-size: 80px;
  143.     letter-spacing: 20px;
  144.     color: white;
  145.     text-align: center;
  146.     padding-top: 5px;
  147. }
  148.  
  149. .top{
  150.     border-top: 10px solid white;
  151.     margin-left: 60px;
  152.     margin-right: 60px;
  153. }
  154.  
  155. .down{
  156.     border-bottom: 10px solid white;
  157.     margin-left: 60px;
  158.     margin-right: 60px;
  159.     letter-spacing: 31px;
  160. }
  161.  
  162. .small{
  163.     font-size: 18px;
  164.     font-family: arial;
  165.     color: white;
  166.     text-align: center;
  167.     padding-top: 20px;
  168. }
  169.  
  170. .medium{
  171.     font-size: 60px;
  172.     font-family: arial;
  173.     color: #1b1b1b;
  174.     padding-left: 40px;
  175.     padding-top: 10px;
  176. }
  177.  
  178. .title{
  179.     padding-left: 40px;
  180.     padding-top: 20px;
  181.     font-size: 18px;
  182.     font-family: arial;
  183. }
  184.  
  185. .white{
  186.     color: white;
  187. }
  188.  
  189. .text{
  190.     width: 100%;
  191.     top: 20%;
  192.     position: relative;
  193.     height: 200px;
  194. }
  195.  
  196. .giant{
  197.     color: #1b1b1b;
  198.     font-size: 60px;
  199.     font-family: arial;
  200.     border-bottom: 5px solid #d1d1d2;
  201. }
  202.  
  203. .ipsum{
  204.     color: #1b1b1b;
  205.     font-size: 30px;
  206.     font-family: arial;
  207.     padding-top: 40px;
  208. }
  209.  
  210. .dolor{
  211.     color: #1b1b1b;
  212.     font-size: 18px;
  213.     font-family: arial;
  214.     padding-top: 5px;
  215. }
  216.  
  217. .por{
  218.     padding-top: 80px;
  219.     padding-bottom: 40px;
  220. }
  221.  
  222. .mail{
  223.     color: #1b1b1b;
  224.     font-size: 30px;
  225.     font-family: arial;
  226.     float: right;
  227.     padding-top: 5px;
  228. }
  229.  
  230. .border{
  231.     width: 100%;
  232.     height: 5px;
  233.     margin-bottom: 20px;
  234.     background-color: #d1d1d2;
  235. }
  236.  
  237. .example{
  238.     width: 100%;
  239. }
  240.  
  241. .phone{
  242.     width: 100%;
  243.     display: flex;
  244.     justify-content: flex-end;
  245.     padding-top: 15px;
  246. }
  247.  
  248. .street{
  249.     font-size: 18px;
  250.     font-family: arial;
  251.     padding-right: 40px;
  252.     padding-top: 3px;
  253. }
  254.  
  255. .address{
  256.     font-size: 21px;
  257.     font-family: arial;
  258. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement