SHARE
TWEET

CSS code

a guest Jul 5th, 2017 59 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. @import url(https://fonts.googleapis.com/css?family=Lato);
  2. @import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css);
  3. body {
  4.     background-image: url("../img/background_image.jpg");
  5.     background-size: 100%;
  6.     font-family: Moon Light;
  7.     width: 100%;
  8.     height: 100%;
  9.     overflow-x: hidden;
  10. }
  11. .leaf_icon{
  12.     width: 100%;
  13.     display: block;
  14.     height:0;
  15.     margin-left: 250px;
  16.     margin-right: 1600px;
  17.     margin-bottom: 50px;
  18.     margin-top: 50px;
  19. }
  20. img{width:100%;}
  21. #nav_bar_text ul{
  22.     display: block;
  23.     margin-left: 1080px;
  24.     margin-right: 300px;
  25.     list-style-type: none;/* Eemaldab sõnade ees olevad sümbolid.*/
  26.     text-align: right;
  27. }
  28. #nav_bar_text li{
  29.     display: inline; /* Inline - kõrvutab kõik sõnad, mis on vastaval nav_baril. */
  30.     padding: 15px; /* Muudab navigation baril olevate sõnade vahesid. */
  31.     vertical-align: middle;
  32. }
  33. #nav_bar_text a{
  34.     text-decoration: none;/* Eemaldab s]nade alt joone või muu kriipsu.*/
  35.     color: white;
  36.     font-size: 1.3vw;
  37.     text-transform: uppercase;
  38. }
  39. #nav_bar_text a:hover {
  40.     color: #d9d9d9;
  41. }
  42. .mySlides{
  43.     list-style: none;
  44.     margin: 0;
  45.     padding: 0;
  46.     position: relative;
  47. }
  48. .slide_picture{
  49.     position: absolute;
  50.     margin-left: 0px;
  51.     margin-top: 0px;
  52.     width: 100%;
  53.  
  54. }
  55. .slide_picture:nth-child(4) {
  56.     animation: xfade 16s 0s infinite;
  57. }
  58. .slide_picture:nth-child(3) {
  59.     animation: xfade 16s 4s infinite;
  60. }
  61. .slide_picture:nth-child(2) {
  62.     animation: xfade 16s 8s infinite;  
  63. }
  64. .slide_picture:nth-child(1) {
  65.     animation: xfade 16s 12s infinite;
  66. }
  67. @keyframes xfade{
  68.   17% {
  69.     opacity:1;
  70.   }
  71.   25% {
  72.     opacity:0;
  73.   }
  74.   92% {
  75.     opacity:0;
  76.   }
  77. }
  78. .slideshow_gradient{
  79.     display: inline;
  80.     position:absolute;
  81.     width: 1456px;
  82.     height: 700px;
  83.     z-index: 1;
  84.     -webkit-box-shadow: inset 0px -200px 262px -27px rgba(0,0,0,1);
  85.     -moz-box-shadow: inset 0px -200px 262px -27px rgba(0,0,0,1);
  86.     box-shadow: inset 0px -200px 262px -27px rgba(0,0,0,1);
  87. }
  88. .slideshow_gradient_text{
  89.     display: block;
  90.     position: absolute;
  91.     color: white;
  92.     margin-left: 30px;
  93.     font-size: 2vw;
  94.     margin-top: 550px;
  95. }
  96. .slideshow_gradient_text2{
  97.     display: block;
  98.     position: absolute;
  99.     color: white;
  100.     text-align: left;
  101.     margin-left: 30px;
  102.     font-size: 1.2vw;
  103.     margin-top: 610px;
  104. }
  105. /* Alates siit algab keskmise sektsiooni kujundamine */
  106. .background_color {
  107.     background-size: cover;
  108.     background-repeat: no-repeat;
  109.     display: flex;
  110.     position:absolute;
  111.     margin-top: 700px;
  112.     background-color: #bfafa1;
  113.     padding-top:0px;
  114.     width: 1456px;
  115.     height: 800px;
  116.     text-align: center;
  117.     -webkit-box-shadow: inset 0px 54px 68px -21px rgba(0,0,0,0.52);
  118.     -moz-box-shadow: inset 0px 54px 68px -21px rgba(0,0,0,0.52);
  119.     box-shadow: inset 0px 54px 68px -21px rgba(0,0,0,0.52);
  120. }
  121. h3,p {
  122.     display: block;
  123.     font-family: Nexa Light;
  124. }
  125. h3 {
  126.     font-size: 1vw;
  127.     text-transform: uppercase;
  128. }
  129. p {
  130.     margin-left:40px;
  131.     margin-right:40px;
  132.     text-align: justify;
  133.     font-size: 0.8vmax;
  134. }
  135. #category-1{
  136.     margin-top: 80px;
  137.     margin-left: 60px;
  138.     margin-bottom: 300px;
  139. }
  140. .jussijarve_image{
  141.     display: inline;
  142.     width: 100%;
  143.     height: auto;
  144. }
  145. #category-2{
  146.     display: block;
  147.     margin-top: 80px;
  148.     margin-left: 80px;
  149.     margin-bottom: 300px;
  150. }
  151. .kakerdaja_image{
  152.     display: inline;
  153.     width: 100%;
  154.     height: auto;
  155. }
  156. #category-3{
  157.     display: block;
  158.     margin-top: 80px;
  159.     margin-left: 80px;
  160.     margin-right: 60px;
  161.     margin-bottom: 300px;
  162. }
  163. .paukjarve_image{
  164.     display: inline;
  165.     width: 100%;
  166.     height: auto;
  167. }
  168. .button {
  169.     display: block;
  170.     background: #3c7500;
  171.     background: -webkit-gradient(linear, left top, left bottom, from(#3c7004), to(#3c7500));
  172.     background: -webkit-linear-gradient(top, #3c7004, #3c7500);
  173.     background: -moz-linear-gradient(top, #3c7004, #3c7500);
  174.     background: -ms-linear-gradient(top, #3c7004, #3c7500);
  175.     background: -o-linear-gradient(top, #3c7004, #3c7500);
  176.     background-image: -ms-linear-gradient(top, #3c7004 0%, #3c7500 100%);
  177.     padding: 5px 4vw;
  178.     -webkit-border-radius: 0px;
  179.     -moz-border-radius: 0px;
  180.     -webkit-box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 0px 0;
  181.     -moz-box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 0px 0;
  182.     box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 0px 0;
  183.     color: #ffffff;
  184.     font-size: 24px;
  185.     font-family: Josefin sans;
  186.     text-decoration: none;
  187.     vertical-align: middle;
  188.     }
  189. .button:hover {
  190.     display: block;
  191.     border: 0px solid #1c400e;
  192.     background: #3b7002;
  193.     background: -webkit-gradient(linear, left top, left bottom, from(#3b7002), to(#3b7002));
  194.     background: -webkit-linear-gradient(top, #3b7002, #3b7002);
  195.     background: -moz-linear-gradient(top, #3b7002, #3b7002);
  196.     background: -ms-linear-gradient(top, #3b7002, #3b7002);
  197.     background: -o-linear-gradient(top, #3b7002, #3b7002);
  198.     background-image: -ms-linear-gradient(top, #3b7002 0%, #3b7002 100%);
  199.     color: #d1d1d1;
  200.     }
  201. .button:active {
  202.     display: block;
  203.     border: 0px solid #1c400e;
  204.     background: #3b7002;
  205.     background: -webkit-gradient(linear, left top, left bottom, from(#3b7002), to(#3b7002));
  206.     background: -webkit-linear-gradient(top, #3b7002, #3b7002);
  207.     background: -moz-linear-gradient(top, #3b7002, #3b7002);
  208.     background: -ms-linear-gradient(top, #3b7002, #3b7002);
  209.     background: -o-linear-gradient(top, #3b7002, #3b7002);
  210.     background-image: -ms-linear-gradient(top, #3b7002 0%, #3b7002 100%);
  211.     color: #d1d1d1;
  212.     }
  213. .button1{
  214.     display: block;
  215.     margin-top: 30px;
  216.     margin-left: 40px;
  217.     margin-right: 30px;
  218. }
  219. .button2{
  220.     display: block;
  221.     margin-top: 30px;
  222.     margin-left: 40px;
  223.     margin-right: 30px;
  224. }
  225. .button3{
  226.     display: block;
  227.     margin-top: 30px;
  228.     margin-left: 40px;
  229.     margin-right: 30px;
  230. }
  231. #map{
  232.     display: block;
  233.     position: absolute;
  234.     margin-top: 790px;
  235.     width: 1456px;
  236.     height: 670px;
  237.     z-index: 1; /* -1 = kõige all | 0 = normaalasukoht | 1 = kõige peal*/
  238. }
  239. .GoogleMaps_Shadow{
  240.     display: block;
  241.     position: absolute;
  242.     width: 1456px;
  243.     height: 200px;
  244.     margin-top: 790px;
  245.     -webkit-box-shadow: inset 0px 178px 89px -75px rgba(0,0,0,1);
  246.     -moz-box-shadow: inset 0px 178px 89px -75px rgba(0,0,0,1);
  247.     box-shadow: inset 0px 178px 89px -75px rgba(0,0,0,1);
  248.     opacity: 1;
  249.     z-index: 1;
  250.     }
  251. .GoogleMaps_text{
  252.     display: block;
  253.     position: absolute;
  254.     margin-top: 1510px;
  255.     font-size: 30px;
  256.     color: white;
  257.     z-index: 1;
  258.     }
  259. .bottom_page{
  260.     display: block;
  261.     position:absolute;
  262.     margin-top: 2160px;
  263.     background-color: #bfafa1;
  264.     padding-top:0px;
  265.     width: 1456px;
  266.     height: 201px;
  267.     z-index: 1;
  268. }
  269.  
  270. .footer-social-icons {
  271.     display: block;
  272.     width: 350px;
  273.     margin-top: 140px;
  274.     margin-left: 1250px;
  275. }
  276. .social-icon {
  277.     display: inline;
  278.     color: #fff;
  279. }
  280. ul.social-icons {
  281.     margin-top: 10px;
  282. }
  283. .social-icons li {
  284.     vertical-align: top;
  285.     display: inline;
  286.     height: 100px;
  287. }
  288. .social-icons a {
  289.     color: #fff;
  290.     text-decoration: none;
  291. }
  292. .fa-facebook {
  293.     padding:10px 14px;
  294.     -o-transition:.5s;
  295.     -ms-transition:.5s;
  296.     -moz-transition:.5s;
  297.     -webkit-transition:.5s;
  298.     transition: .5s;
  299.     background-color: #322f30;
  300. }
  301. .fa-facebook:hover {
  302.     background-color: #3d5b99;
  303. }
  304. .fa-twitter {
  305.     padding:10px 12px;
  306.     -o-transition:.5s;
  307.     -ms-transition:.5s;
  308.     -moz-transition:.5s;
  309.     -webkit-transition:.5s;
  310.     transition: .5s;
  311.     background-color: #322f30;
  312. }
  313. .fa-twitter:hover {
  314.     background-color: #00aced;
  315. }
  316. .fa-youtube {
  317.     padding:10px 14px;
  318.     -o-transition:.5s;
  319.     -ms-transition:.5s;
  320.     -moz-transition:.5s;
  321.     -webkit-transition:.5s;
  322.     transition: .5s;
  323.     background-color: #322f30;
  324. }
  325. .fa-youtube:hover {
  326.     background-color: #e64a41;
  327. }
  328. .bot_page_inf{
  329.     display: block;
  330.     position: absolute;
  331.     font-size: 20px;
  332.     margin-left: 20px;
  333.     margin-top: 20px;
  334.  }
  335. .bot_page_inf2{
  336.     display: block;
  337.     position: absolute;
  338.     font-size: 18px;
  339.     margin-top: 50px;
  340.     margin-left: 20px;
  341. }
  342. .bot_page_inf3{
  343.     display: block;
  344.     position: absolute;
  345.     font-size: 18px;
  346.     margin-top: 80px;
  347.     margin-left: 20px;
  348. }
  349. .bot_page_inf4{
  350.     display: block;
  351.     position: absolute;
  352.     font-size: 18px;
  353.     margin-top: 110px;
  354.     margin-left: 20px;
  355. }
  356. .bot_page_inf5{
  357.     display: block;
  358.     position: absolute;
  359.     font-size: 18px;
  360.     margin-top: 140px;
  361.     margin-left: 20px;
  362. }
  363. #top_image {
  364.     margin-top: 25px;
  365.     margin-left: 228px;
  366.     margin-right: 219px;
  367.     margin-bottom: 0px;
  368.     padding-bottom: 200px;
  369.     box-shadow: 10px 10px 5px #000000;
  370.     -webkit-box-shadow: -1px 3px 22px 14px rgba(0,0,0,0.88);
  371.     -moz-box-shadow: -1px 3px 22px 14px rgba(0,0,0,0.88);
  372.     box-shadow: -1px 3px 22px 14px rgba(0,0,0,0.88);
  373. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top