Advertisement
dev_imran

Popup-css

Apr 5th, 2020
728
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 1.95 KB | None | 0 0
  1. /* Popup */
  2. #getQuot {
  3.   height: 100vh;
  4.   width: 100%;
  5.   z-index: 9999;
  6.   position: fixed;
  7.   display: -webkit-box;
  8.   display: -ms-flexbox;
  9.   display: flex;
  10.   -webkit-box-pack: center;
  11.       -ms-flex-pack: center;
  12.           justify-content: center;
  13.   -webkit-box-align: center;
  14.       -ms-flex-align: center;
  15.           align-items: center;
  16.   top: 0;
  17.   left: 0;
  18.   background: #00173C;
  19.   overflow: auto;
  20.   -webkit-transform: scale(0);
  21.           transform: scale(0);
  22.   -webkit-transition: all linear 0.3s;
  23.   transition: all linear 0.3s;
  24. }
  25.  
  26. #getQuot #popupClose {
  27.   color: #F26722;
  28.   font-size: 35px;
  29.   position: absolute;
  30.   top: 20px;
  31.   right: 30px;
  32.   cursor: pointer;
  33.   z-index: 999999;
  34. }
  35.  
  36. #getQuot h2 {
  37.   font-family: "Do Hyeon", sans-serif;
  38.   font-size: 35px;
  39.   margin-bottom: 30px;
  40.   color: #ffffffff;
  41.   position: relative;
  42.   display: inline-block;
  43. }
  44.  
  45. #getQuot h2::before {
  46.   position: absolute;
  47.   content: '';
  48.   padding: 10px 20px;
  49.   top: 0;
  50.   left: 0;
  51.   -webkit-transform-origin: center;
  52.           transform-origin: center;
  53.   border: 2px solid #F26722;
  54.   -webkit-animation: borderAmin 4s linear infinite;
  55.           animation: borderAmin 4s linear infinite;
  56. }
  57.  
  58. #getQuot form .input-group-text {
  59.   background: #00173C;
  60. }
  61.  
  62. #getQuot form i {
  63.   color: #F26722;
  64. }
  65.  
  66. #getQuot form .btn-primary {
  67.   padding: 10px 30px !important;
  68.   background: #F26722;
  69.   font-family: "Do Hyeon", sans-serif;
  70.   border: 0;
  71.   -webkit-transition: all linear 0.4s;
  72.   transition: all linear 0.4s;
  73. }
  74.  
  75. #getQuot form .btn-primary:hover {
  76.   background: #F8F8F8;
  77.   color: #00173C;
  78. }
  79.  
  80. #getQuot form .btn-primary:hover i {
  81.   -webkit-transform: translateX(10px);
  82.           transform: translateX(10px);
  83.   color: #F26722;
  84. }
  85.  
  86. #getQuot form .btn-primary i {
  87.   color: #ffffffff;
  88.   -webkit-transition: all linear 0.3s;
  89.   transition: all linear 0.3s;
  90. }
  91. .activePopup {
  92.   -webkit-transform: scale(1) !important;
  93.           transform: scale(1) !important;
  94. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement