Advertisement
agir

Untitled

Dec 7th, 2018
429
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 2.72 KB | None | 0 0
  1. .loader,
  2. .spinner {
  3.     width: 150px;
  4.     margin-left: auto;
  5.     margin-right: auto;
  6. }
  7.  
  8. .dslogo {
  9.     display: block;
  10.     margin-left: auto;
  11.     margin-right: auto;
  12.     width: 30%;
  13.     padding-top: 15px
  14. }
  15.  
  16. .clientlogo {
  17.    display: unset;
  18.     margin-left: auto;
  19.     margin-right: 30px;
  20.     height: 130px;
  21.     padding-top: 66px;
  22.     float: right;
  23. }
  24. /*.panel-body { min-height: 1200px;}/*
  25. /*h5 {
  26.     color:red;
  27. }*/
  28.  
  29.  
  30. /*Google translator: https://translate.google.com/manager/website/add*/
  31.  
  32. /*Code for progress bar steps*/
  33.  
  34.  
  35. * {
  36.   margin: 0;
  37.   padding: 0;
  38.   box-sizing: border-box;
  39. }
  40.  
  41. html, body {
  42.   height: 100%;
  43.   background-color: #333;
  44. }
  45.  
  46. .container {
  47.   display: flex;
  48.   flex-direction: column;
  49.   height: 100%;
  50.   width: 100%;
  51.   min-width: 480px;
  52.   padding: 0 40px;
  53. }
  54.  
  55. .breadcrumb {
  56.   display: flex;
  57.   border-radius: 6px;
  58.   overflow: hidden;
  59.   margin: auto;
  60.   text-align: center;
  61.   top: 50%;
  62.   width: 100%;
  63.   height: 57px;
  64.   -webkit-transform: translateY(-50%);
  65.           transform: translateY(-50%);
  66.   box-shadow: 0 1px 1px ccc, 0 4px 2px rgba(0, 0, 0, 0.7);
  67.   z-index: 1;
  68.   background-color: #ddd;
  69.   font-size: 12px;
  70. }
  71.  
  72. .breadcrumb a {
  73.   position: relative;
  74.   display: flex;
  75.   flex-grow: 1;
  76.   text-decoration: none;
  77.   margin: auto;
  78.   height: 100%;
  79.   padding-left: 38px;
  80.   padding-right: 0;
  81.   color: #666;
  82. }
  83.  
  84. .breadcrumb a:first-child {
  85.   padding-left: 15.2px;
  86. }
  87.  
  88. .breadcrumb a:last-child {
  89.   padding-right: 15.2px;
  90. }
  91.  
  92. .breadcrumb a:after {
  93.   content: "";
  94.   position: absolute;
  95.   display: inline-block;
  96.   width: 57px;
  97.   height: 57px;
  98.   top: 0;
  99.   right: -28.1481481481px;
  100.   background-color: #ddd;
  101.   border-top-right-radius: 5px;
  102.   -webkit-transform: scale(0.707) rotate(45deg);
  103.           transform: scale(0.707) rotate(45deg);
  104.   box-shadow: 1px -1px rgba(0, 0, 0, 0.25);
  105.   z-index: 1;
  106. }
  107.  
  108. .breadcrumb a:last-child:after {
  109.   content: none;
  110. }
  111.  
  112. .breadcrumb__inner {
  113.   display: flex;
  114.   flex-direction: column;
  115.   margin: auto;
  116.   z-index: 2;
  117. }
  118.  
  119. .breadcrumb__title {
  120.   font-weight: bold;
  121. }
  122.  
  123. .breadcrumb a.active, .breadcrumb a:hover {
  124.   background: #E25D5D;
  125.   color: white;
  126. }
  127.  
  128. .breadcrumb a.active:after, .breadcrumb a:hover:after {
  129.   background: #E25D5D;
  130.   color: white;
  131. }
  132.  
  133. @media all and (max-width: 1000px) {
  134.   .breadcrumb {
  135.     font-size: 12px;
  136.   }
  137. }
  138. @media all and (max-width: 710px) {
  139.   .breadcrumb__desc {
  140.     display: none;
  141.   }
  142.  
  143.   .breadcrumb {
  144.     height: 38px;
  145.   }
  146.  
  147.   .breadcrumb a {
  148.     padding-left: 25.3333333333px;
  149.   }
  150.  
  151.   .breadcrumb a:after {
  152.     content: "";
  153.     width: 38px;
  154.     height: 38px;
  155.     right: -19px;
  156.     -webkit-transform: scale(0.707) rotate(45deg);
  157.             transform: scale(0.707) rotate(45deg);
  158.   }
  159. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement