additional.css (17565B)
1 body { 2 font-family: Arial, Helvetica, sans-serif; 3 } 4 .display-1 { 5 font-family: Arial, Helvetica, sans-serif; 6 font-size: 4.6rem; 7 line-height: 1.1; 8 } 9 .display-1 > .iconfont { 10 font-size: 7.36rem; 11 } 12 .display-2 { 13 font-family: Arial, Helvetica, sans-serif; 14 font-size: 3rem; 15 line-height: 1.1; 16 } 17 .display-2 > .iconfont { 18 font-size: 4.8rem; 19 } 20 .display-4 { 21 font-family: Arial, Helvetica, sans-serif; 22 font-size: 1.1rem; 23 line-height: 1.5; 24 } 25 .display-4 > .iconfont { 26 font-size: 1.76rem; 27 } 28 .display-5 { 29 font-family: Arial, Helvetica, sans-serif; 30 font-size: 2.2rem; 31 line-height: 1.5; 32 } 33 .display-5 > .iconfont { 34 font-size: 3.52rem; 35 } 36 .display-7 { 37 font-family: 'Courier New', Courier, monospace; 38 font-size: 1.2rem; 39 line-height: 1.5; 40 } 41 .display-7 > .iconfont { 42 font-size: 1.92rem; 43 } 44 /* ---- Fluid typography for mobile devices ---- */ 45 /* 1.4 - font scale ratio ( bootstrap == 1.42857 ) */ 46 /* 100vw - current viewport width */ 47 /* (48 - 20) 48 == 48rem == 768px, 20 == 20rem == 320px(minimal supported viewport) */ 48 /* 0.65 - min scale variable, may vary */ 49 @media (max-width: 992px) { 50 .display-1 { 51 font-size: 3.68rem; 52 } 53 } 54 @media (max-width: 768px) { 55 .display-1 { 56 font-size: 3.22rem; 57 font-size: calc( 2.26rem + (4.6 - 2.26) * ((100vw - 20rem) / (48 - 20))); 58 line-height: calc( 1.1 * (2.26rem + (4.6 - 2.26) * ((100vw - 20rem) / (48 - 20)))); 59 } 60 .display-2 { 61 font-size: 2.4rem; 62 font-size: calc( 1.7rem + (3 - 1.7) * ((100vw - 20rem) / (48 - 20))); 63 line-height: calc( 1.3 * (1.7rem + (3 - 1.7) * ((100vw - 20rem) / (48 - 20)))); 64 } 65 .display-4 { 66 font-size: 0.88rem; 67 font-size: calc( 1.0350000000000001rem + (1.1 - 1.0350000000000001) * ((100vw - 20rem) / (48 - 20))); 68 line-height: calc( 1.4 * (1.0350000000000001rem + (1.1 - 1.0350000000000001) * ((100vw - 20rem) / (48 - 20)))); 69 } 70 .display-5 { 71 font-size: 1.76rem; 72 font-size: calc( 1.42rem + (2.2 - 1.42) * ((100vw - 20rem) / (48 - 20))); 73 line-height: calc( 1.4 * (1.42rem + (2.2 - 1.42) * ((100vw - 20rem) / (48 - 20)))); 74 } 75 .display-7 { 76 font-size: 0.96rem; 77 font-size: calc( 1.07rem + (1.2 - 1.07) * ((100vw - 20rem) / (48 - 20))); 78 line-height: calc( 1.4 * (1.07rem + (1.2 - 1.07) * ((100vw - 20rem) / (48 - 20)))); 79 } 80 } 81 /* Buttons */ 82 .btn { 83 padding: 0.6rem 1.2rem; 84 border-radius: 4px; 85 } 86 .btn-sm { 87 padding: 0.6rem 1.2rem; 88 border-radius: 4px; 89 } 90 .btn-md { 91 padding: 0.6rem 1.2rem; 92 border-radius: 4px; 93 } 94 .btn-lg { 95 padding: 1rem 2.6rem; 96 border-radius: 4px; 97 } 98 .bg-primary { 99 background-color: #00bfe8 !important; 100 } 101 .bg-success { 102 background-color: #40b0bf !important; 103 } 104 .bg-info { 105 background-color: #47b5ed !important; 106 } 107 .bg-warning { 108 background-color: #ffe161 !important; 109 } 110 .bg-danger { 111 background-color: #ff9966 !important; 112 } 113 .btn-primary, 114 .btn-primary:active { 115 background-color: #00bfe8 !important; 116 border-color: #00bfe8 !important; 117 color: #ffffff !important; 118 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); 119 } 120 .btn-primary:hover, 121 .btn-primary:focus, 122 .btn-primary.focus, 123 .btn-primary.active { 124 color: #ffffff !important; 125 background-color: #0095b5 !important; 126 border-color: #0095b5 !important; 127 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); 128 } 129 .btn-primary.disabled, 130 .btn-primary:disabled { 131 color: #ffffff !important; 132 background-color: #0095b5 !important; 133 border-color: #0095b5 !important; 134 } 135 .btn-secondary, 136 .btn-secondary:active { 137 background-color: #ff6666 !important; 138 border-color: #ff6666 !important; 139 color: #ffffff !important; 140 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); 141 } 142 .btn-secondary:hover, 143 .btn-secondary:focus, 144 .btn-secondary.focus, 145 .btn-secondary.active { 146 color: #ffffff !important; 147 background-color: #ff3333 !important; 148 border-color: #ff3333 !important; 149 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); 150 } 151 .btn-secondary.disabled, 152 .btn-secondary:disabled { 153 color: #ffffff !important; 154 background-color: #ff3333 !important; 155 border-color: #ff3333 !important; 156 } 157 .btn-info, 158 .btn-info:active { 159 background-color: #47b5ed !important; 160 border-color: #47b5ed !important; 161 color: #ffffff !important; 162 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); 163 } 164 .btn-info:hover, 165 .btn-info:focus, 166 .btn-info.focus, 167 .btn-info.active { 168 color: #ffffff !important; 169 background-color: #19a2e8 !important; 170 border-color: #19a2e8 !important; 171 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); 172 } 173 .btn-info.disabled, 174 .btn-info:disabled { 175 color: #ffffff !important; 176 background-color: #19a2e8 !important; 177 border-color: #19a2e8 !important; 178 } 179 .btn-success, 180 .btn-success:active { 181 background-color: #40b0bf !important; 182 border-color: #40b0bf !important; 183 color: #ffffff !important; 184 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); 185 } 186 .btn-success:hover, 187 .btn-success:focus, 188 .btn-success.focus, 189 .btn-success.active { 190 color: #ffffff !important; 191 background-color: #338d99 !important; 192 border-color: #338d99 !important; 193 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); 194 } 195 .btn-success.disabled, 196 .btn-success:disabled { 197 color: #ffffff !important; 198 background-color: #338d99 !important; 199 border-color: #338d99 !important; 200 } 201 .btn-warning, 202 .btn-warning:active { 203 background-color: #ffe161 !important; 204 border-color: #ffe161 !important; 205 color: #614f00 !important; 206 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); 207 } 208 .btn-warning:hover, 209 .btn-warning:focus, 210 .btn-warning.focus, 211 .btn-warning.active { 212 color: #2e2500 !important; 213 background-color: #ffd72e !important; 214 border-color: #ffd72e !important; 215 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); 216 } 217 .btn-warning.disabled, 218 .btn-warning:disabled { 219 color: #614f00 !important; 220 background-color: #ffd72e !important; 221 border-color: #ffd72e !important; 222 } 223 .btn-danger, 224 .btn-danger:active { 225 background-color: #ff9966 !important; 226 border-color: #ff9966 !important; 227 color: #ffffff !important; 228 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); 229 } 230 .btn-danger:hover, 231 .btn-danger:focus, 232 .btn-danger.focus, 233 .btn-danger.active { 234 color: #ffffff !important; 235 background-color: #ff7733 !important; 236 border-color: #ff7733 !important; 237 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); 238 } 239 .btn-danger.disabled, 240 .btn-danger:disabled { 241 color: #ffffff !important; 242 background-color: #ff7733 !important; 243 border-color: #ff7733 !important; 244 } 245 .btn-white { 246 color: #333333 !important; 247 } 248 .btn-white, 249 .btn-white:active { 250 background-color: #fafafa !important; 251 border-color: #fafafa !important; 252 color: #7a7a7a !important; 253 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); 254 } 255 .btn-white:hover, 256 .btn-white:focus, 257 .btn-white.focus, 258 .btn-white.active { 259 color: #616161 !important; 260 background-color: #e1e1e1 !important; 261 border-color: #e1e1e1 !important; 262 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); 263 } 264 .btn-white.disabled, 265 .btn-white:disabled { 266 color: #7a7a7a !important; 267 background-color: #e1e1e1 !important; 268 border-color: #e1e1e1 !important; 269 } 270 .btn-white:hover { 271 color: #fafafa !important; 272 } 273 .btn-white:hover, 274 .btn-white:hover:active { 275 background-color: #333333 !important; 276 border-color: #333333 !important; 277 color: #ffffff !important; 278 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); 279 } 280 .btn-white:hover:hover, 281 .btn-white:hover:focus, 282 .btn-white:hover.focus, 283 .btn-white:hover.active { 284 color: #ffffff !important; 285 background-color: #1a1a1a !important; 286 border-color: #1a1a1a !important; 287 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); 288 } 289 .btn-white:hover.disabled, 290 .btn-white:hover:disabled { 291 color: #ffffff !important; 292 background-color: #1a1a1a !important; 293 border-color: #1a1a1a !important; 294 } 295 .btn-black { 296 color: #fafafa !important; 297 } 298 .btn-black, 299 .btn-black:active { 300 background-color: #333333 !important; 301 border-color: #333333 !important; 302 color: #ffffff !important; 303 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); 304 } 305 .btn-black:hover, 306 .btn-black:focus, 307 .btn-black.focus, 308 .btn-black.active { 309 color: #ffffff !important; 310 background-color: #1a1a1a !important; 311 border-color: #1a1a1a !important; 312 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); 313 } 314 .btn-black.disabled, 315 .btn-black:disabled { 316 color: #ffffff !important; 317 background-color: #1a1a1a !important; 318 border-color: #1a1a1a !important; 319 } 320 .btn-black:hover { 321 color: #333333 !important; 322 } 323 .btn-black:hover, 324 .btn-black:hover:active { 325 background-color: #fafafa !important; 326 border-color: #fafafa !important; 327 color: #7a7a7a !important; 328 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); 329 } 330 .btn-black:hover:hover, 331 .btn-black:hover:focus, 332 .btn-black:hover.focus, 333 .btn-black:hover.active { 334 color: #616161 !important; 335 background-color: #e1e1e1 !important; 336 border-color: #e1e1e1 !important; 337 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); 338 } 339 .btn-black:hover.disabled, 340 .btn-black:hover:disabled { 341 color: #7a7a7a !important; 342 background-color: #e1e1e1 !important; 343 border-color: #e1e1e1 !important; 344 } 345 .btn-primary-outline, 346 .btn-primary-outline:active { 347 background-color: transparent !important; 348 border-color: transparent; 349 color: #00bfe8; 350 } 351 .btn-primary-outline:hover, 352 .btn-primary-outline:focus, 353 .btn-primary-outline.focus, 354 .btn-primary-outline.active { 355 color: #0095b5 !important; 356 background-color: transparent!important; 357 border-color: transparent!important; 358 box-shadow: none!important; 359 } 360 .btn-primary-outline.disabled, 361 .btn-primary-outline:disabled { 362 color: #ffffff !important; 363 background-color: #00bfe8 !important; 364 border-color: #00bfe8 !important; 365 } 366 .btn-secondary-outline, 367 .btn-secondary-outline:active { 368 background-color: transparent !important; 369 border-color: transparent; 370 color: #ff6666; 371 } 372 .btn-secondary-outline:hover, 373 .btn-secondary-outline:focus, 374 .btn-secondary-outline.focus, 375 .btn-secondary-outline.active { 376 color: #ff3333 !important; 377 background-color: transparent!important; 378 border-color: transparent!important; 379 box-shadow: none!important; 380 } 381 .btn-secondary-outline.disabled, 382 .btn-secondary-outline:disabled { 383 color: #ffffff !important; 384 background-color: #ff6666 !important; 385 border-color: #ff6666 !important; 386 } 387 .btn-info-outline, 388 .btn-info-outline:active { 389 background-color: transparent !important; 390 border-color: transparent; 391 color: #47b5ed; 392 } 393 .btn-info-outline:hover, 394 .btn-info-outline:focus, 395 .btn-info-outline.focus, 396 .btn-info-outline.active { 397 color: #19a2e8 !important; 398 background-color: transparent!important; 399 border-color: transparent!important; 400 box-shadow: none!important; 401 } 402 .btn-info-outline.disabled, 403 .btn-info-outline:disabled { 404 color: #ffffff !important; 405 background-color: #47b5ed !important; 406 border-color: #47b5ed !important; 407 } 408 .btn-success-outline, 409 .btn-success-outline:active { 410 background-color: transparent !important; 411 border-color: transparent; 412 color: #40b0bf; 413 } 414 .btn-success-outline:hover, 415 .btn-success-outline:focus, 416 .btn-success-outline.focus, 417 .btn-success-outline.active { 418 color: #338d99 !important; 419 background-color: transparent!important; 420 border-color: transparent!important; 421 box-shadow: none!important; 422 } 423 .btn-success-outline.disabled, 424 .btn-success-outline:disabled { 425 color: #ffffff !important; 426 background-color: #40b0bf !important; 427 border-color: #40b0bf !important; 428 } 429 .btn-warning-outline, 430 .btn-warning-outline:active { 431 background-color: transparent !important; 432 border-color: transparent; 433 color: #ffe161; 434 } 435 .btn-warning-outline:hover, 436 .btn-warning-outline:focus, 437 .btn-warning-outline.focus, 438 .btn-warning-outline.active { 439 color: #ffd72e !important; 440 background-color: transparent!important; 441 border-color: transparent!important; 442 box-shadow: none!important; 443 } 444 .btn-warning-outline.disabled, 445 .btn-warning-outline:disabled { 446 color: #614f00 !important; 447 background-color: #ffe161 !important; 448 border-color: #ffe161 !important; 449 } 450 .btn-danger-outline, 451 .btn-danger-outline:active { 452 background-color: transparent !important; 453 border-color: transparent; 454 color: #ff9966; 455 } 456 .btn-danger-outline:hover, 457 .btn-danger-outline:focus, 458 .btn-danger-outline.focus, 459 .btn-danger-outline.active { 460 color: #ff7733 !important; 461 background-color: transparent!important; 462 border-color: transparent!important; 463 box-shadow: none!important; 464 } 465 .btn-danger-outline.disabled, 466 .btn-danger-outline:disabled { 467 color: #ffffff !important; 468 background-color: #ff9966 !important; 469 border-color: #ff9966 !important; 470 } 471 .btn-black-outline, 472 .btn-black-outline:active, 473 .btn-black-outline.active { 474 background-color: transparent; 475 border-color: transparent; 476 color: #333333; 477 } 478 .btn-black-outline:hover, 479 .btn-black-outline:focus, 480 .btn-black-outline.focus { 481 color: #fafafa; 482 background-color: transparent; 483 border-color: transparent; 484 } 485 .btn-white-outline, 486 .btn-white-outline:active, 487 .btn-white-outline.active { 488 background-color: transparent; 489 border-color: transparent; 490 color: #fafafa; 491 } 492 .btn-white-outline:hover, 493 .btn-white-outline:focus, 494 .btn-white-outline.focus { 495 color: #333333; 496 background-color: transparent; 497 border-color: transparent; 498 } 499 .text-primary { 500 color: #00bfe8 !important; 501 } 502 .text-secondary { 503 color: #ff6666 !important; 504 } 505 .text-success { 506 color: #40b0bf !important; 507 } 508 .text-info { 509 color: #47b5ed !important; 510 } 511 .text-warning { 512 color: #ffe161 !important; 513 } 514 .text-danger { 515 color: #ff9966 !important; 516 } 517 .text-white { 518 color: #fafafa !important; 519 } 520 .text-black { 521 color: #333333 !important; 522 } 523 a.text-primary:hover, 524 a.text-primary:focus, 525 a.text-primary.active { 526 color: #0095b5 !important; 527 } 528 a.text-secondary:hover, 529 a.text-secondary:focus, 530 a.text-secondary.active { 531 color: #ff3333 !important; 532 } 533 a.text-success:hover, 534 a.text-success:focus, 535 a.text-success.active { 536 color: #338d99 !important; 537 } 538 a.text-info:hover, 539 a.text-info:focus, 540 a.text-info.active { 541 color: #19a2e8 !important; 542 } 543 a.text-warning:hover, 544 a.text-warning:focus, 545 a.text-warning.active { 546 color: #ffd72e !important; 547 } 548 a.text-danger:hover, 549 a.text-danger:focus, 550 a.text-danger.active { 551 color: #ff7733 !important; 552 } 553 a.text-white:hover, 554 a.text-white:focus, 555 a.text-white.active { 556 color: #e1e1e1 !important; 557 } 558 a.text-black:hover, 559 a.text-black:focus, 560 a.text-black.active { 561 color: #4d4d4d !important; 562 } 563 .nav-tabs .nav-link.active { 564 color: #00bfe8; 565 } 566 .nav-tabs .nav-link:not(.active) { 567 color: #333333; 568 } 569 .alert-success { 570 background-color: #70c770; 571 } 572 .alert-info { 573 background-color: #47b5ed; 574 } 575 .alert-warning { 576 background-color: #ffe161; 577 } 578 .alert-danger { 579 background-color: #ff9966; 580 } 581 .gallery-filter li.active .btn { 582 background-color: #00bfe8; 583 border-color: #00bfe8; 584 color: #ffffff; 585 } 586 .gallery-filter li.active .btn:focus { 587 box-shadow: none; 588 } 589 a, 590 a:hover { 591 color: #00bfe8; 592 } 593 .plan-header.bg-primary .plan-subtitle, 594 .plan-header.bg-primary .plan-price-desc { 595 color: #b5f2ff; 596 } 597 .plan-header.bg-success .plan-subtitle, 598 .plan-header.bg-success .plan-price-desc { 599 color: #a0d8df; 600 } 601 .plan-header.bg-info .plan-subtitle, 602 .plan-header.bg-info .plan-price-desc { 603 color: #ffffff; 604 } 605 .plan-header.bg-warning .plan-subtitle, 606 .plan-header.bg-warning .plan-price-desc { 607 color: #ffffff; 608 } 609 .plan-header.bg-danger .plan-subtitle, 610 .plan-header.bg-danger .plan-price-desc { 611 color: #ffffff; 612 } 613 /* Scroll to top button*/ 614 .scrollToTop_wraper { 615 display: none; 616 } 617 .form-control { 618 font-family: Arial, Helvetica, sans-serif; 619 font-size: 1.1rem; 620 line-height: 1.5; 621 font-weight: 400; 622 } 623 .form-control > .iconfont { 624 font-size: 1.76rem; 625 } 626 .form-control:hover, 627 .form-control:focus { 628 box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px 0px, rgba(0, 0, 0, 0.07) 0px 1px 3px 0px, rgba(0, 0, 0, 0.03) 0px 0px 0px 1px; 629 border-color: #00bfe8 !important; 630 } 631 .form-control:-webkit-input-placeholder { 632 font-family: Arial, Helvetica, sans-serif; 633 font-size: 1.1rem; 634 line-height: 1.5; 635 font-weight: 400; 636 } 637 .form-control:-webkit-input-placeholder > .iconfont { 638 font-size: 1.76rem; 639 } 640 blockquote { 641 border-color: #00bfe8; 642 } 643 /* Forms */ 644 .jq-selectbox li:hover, 645 .jq-selectbox li.selected { 646 background-color: #00bfe8; 647 color: #ffffff; 648 } 649 .jq-number__spin { 650 transition: 0.25s ease; 651 } 652 .jq-number__spin:hover { 653 border-color: #00bfe8; 654 } 655 .jq-selectbox .jq-selectbox__trigger-arrow, 656 .jq-number__spin.minus:after, 657 .jq-number__spin.plus:after { 658 transition: 0.4s; 659 border-top-color: #777d74; 660 border-bottom-color: #777d74; 661 } 662 .jq-selectbox:hover .jq-selectbox__trigger-arrow, 663 .jq-number__spin.minus:hover:after, 664 .jq-number__spin.plus:hover:after { 665 border-top-color: #00bfe8; 666 border-bottom-color: #00bfe8; 667 } 668 .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_default, 669 .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current, 670 .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current { 671 color: #000000 !important; 672 background-color: #00bfe8 !important; 673 box-shadow: none !important; 674 } 675 .xdsoft_datetimepicker .xdsoft_calendar td:hover, 676 .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:hover { 677 color: #000000 !important; 678 background: #ff6666 !important; 679 box-shadow: none !important; 680 } 681 .lazy-bg { 682 background-image: none !important; 683 } 684 .lazy-placeholder:not(section), 685 .lazy-none { 686 display: block; 687 position: relative; 688 padding-bottom: 56.25%; 689 width: 100%; 690 height: auto; 691 } 692 iframe.lazy-placeholder, 693 .lazy-placeholder:after { 694 content: ''; 695 position: absolute; 696 width: 200px; 697 height: 200px; 698 background: transparent no-repeat center; 699 background-size: contain; 700 top: 50%; 701 left: 50%; 702 transform: translateX(-50%) translateY(-50%); 703 } 704 section.lazy-placeholder:after { 705 opacity: 0.5; 706 } 707 body { 708 overflow-x: hidden; 709 } 710 a { 711 transition: color 0.6s; 712 } 713 .cid-s6drOxE3Wa { 714 background-color: #121416; 715 } 716 .cid-s6drOxE3Wa .text, 717 .cid-s6drOxE3Wa .section-btn { 718 color: #58be56; 719 } 720 .cid-s6drOxE3Wa .section-title { 721 color: #00bfe8; 722 }