main-style.css (151852B)
1 2 /*-------------------------------------------------------------- 3 >>> TABLE OF CONTENTS: 4 ---------------------------------------------------------------- 5 # Global 6 # Accessibility 7 # Alignments 8 # Clearings 9 # Posts and pages 10 # Media 11 # Captions 12 # Galleries 13 # Unit test 14 # Breadcumb Area 15 # Preloader Css 16 # Navbar Area 17 # Header Area 18 # Featured Area 19 # Icon Box 20 # Video Area 21 # Counterup Area 22 # Why Choose Us 23 # How It Works Area 24 # Screenshort area 25 # Testimonial Area 26 # Pricing Plan Area 27 # Team Member Area 28 # Price Plan Area 29 # Footer Area 30 # Sidebar Area 31 # Blog Page 32 # Error 404 Page 33 # Blog Details 34 35 --------------------------------------------------------------*/ 36 /*----------------- 37 Global 38 -----------------*/ 39 40 :root { 41 --main-color-one: #500ade; 42 --secondary-color: #111d5c; 43 --heading-color: #1c144e; 44 --paragraph-color: #666; 45 --heading-font: 'Poppins', sans-serif; 46 --body-font: 'Poppins', sans-serif; 47 } 48 49 .site-title a { 50 font-size: 30px; 51 line-height: 40px; 52 font-weight: 700; 53 } 54 55 .site-title { 56 font-size: 30px; 57 line-height: 40px; 58 font-weight: 700; 59 } 60 61 html { 62 -webkit-text-size-adjust: 100%; 63 -ms-text-size-adjust: 100%; 64 overflow-x: hidden; 65 font-family: var(--body-font); 66 } 67 68 * { 69 -webkit-box-sizing: border-box; 70 box-sizing: border-box; 71 outline: none; 72 -moz-osx-font-smoothing: grayscale; 73 /* Firefox */ 74 -webkit-font-smoothing: antialiased; 75 /* WebKit */ 76 } 77 78 body { 79 margin: 0; 80 color: var(--paragraph-color); 81 overflow-x: hidden; 82 font-family: var(--body-font); 83 line-height: 1.4; 84 } 85 86 h1 { 87 font-size: 48px; 88 line-height: 1.0833333333333333; 89 } 90 91 h2 { 92 font-size: 36px; 93 line-height: 1.4444444444444444; 94 } 95 96 h3 { 97 font-size: 24px; 98 line-height: 1.0833333333333333; 99 } 100 101 h4 { 102 font-size: 20px; 103 line-height: 1.2380952380952381; 104 } 105 106 h1, 107 h2, 108 h3, 109 h4, 110 h5, 111 h6 { 112 color: var(--heading-color); 113 font-family: var(--heading-font); 114 } 115 116 p { 117 color: var(--paragraph-color); 118 margin-bottom: 10px; 119 } 120 121 a { 122 color: inherit; 123 text-decoration: none; 124 color: var(--paragraph-color); 125 } 126 127 a, 128 a:hover, 129 a:focus, 130 a:active { 131 text-decoration: none; 132 outline: none; 133 color: inherit; 134 } 135 136 pre { 137 word-break: break-word; 138 } 139 140 a i { 141 padding: 0 2px; 142 } 143 144 img { 145 max-width: 100%; 146 } 147 148 /*input and button type focus outline disable*/ 149 input[type="text"]:focus, 150 input[type="email"]:focus, 151 input[type="url"]:focus, 152 input[type="password"]:focus, 153 input[type="search"]:focus, 154 input[type="tel"]:focus, 155 input[type="number"]:focus, 156 textarea:focus, 157 input[type="button"]:focus, 158 input[type="reset"]:focus, 159 input[type="submit"]:focus, 160 select:focus { 161 outline: none; 162 -webkit-box-shadow: none; 163 box-shadow: none; 164 border: 1px solid #ddd; 165 } 166 167 code { 168 color: #faa603; 169 } 170 171 .dark-bg { 172 background-color: #111d5c; 173 } 174 175 .check-list { 176 margin: 0; 177 padding: 0; 178 list-style: none; 179 } 180 181 .check-list li { 182 display: block; 183 padding-left: 20px; 184 position: relative; 185 z-index: 0; 186 } 187 188 .check-list li:after { 189 position: absolute; 190 left: 0; 191 top: 0; 192 font-family: 'fontawesome'; 193 content: "\f105"; 194 color: var(--main-color-one); 195 } 196 197 .site-main .comment-navigation, 198 .site-main .posts-navigation, 199 .site-main .post-navigation { 200 clear: both; 201 } 202 203 .comment-navigation .nav-previous, 204 .posts-navigation .nav-previous, 205 .post-navigation .nav-previous { 206 float: left; 207 width: 50%; 208 } 209 210 .comment-navigation .nav-next, 211 .posts-navigation .nav-next, 212 .post-navigation .nav-next { 213 float: right; 214 width: 50%; 215 } 216 217 .comment-navigation .nav-previous > a, 218 .posts-navigation .nav-previous > a, 219 .post-navigation .nav-previous > a, 220 .comment-navigation .nav-next > a, 221 .posts-navigation .nav-next > a, 222 .post-navigation .nav-next > a { 223 -webkit-transition: .3s ease-in; 224 -o-transition: .3s ease-in; 225 transition: .3s ease-in; 226 } 227 228 .padding-left-0 { 229 padding-left: 0; 230 } 231 232 .padding-right-0 { 233 padding-left: 0; 234 } 235 236 .gray-bg { 237 background-color: #f8f8f8; 238 } 239 240 .padding-top-10 { 241 padding-top: 10px; 242 } 243 244 .padding-top-20 { 245 padding-top: 20px; 246 } 247 248 .padding-top-30 { 249 padding-top: 30px; 250 } 251 252 .padding-top-40 { 253 padding-top: 40px; 254 } 255 256 .padding-top-50 { 257 padding-top: 50px; 258 } 259 260 .padding-top-60 { 261 padding-top: 60px; 262 } 263 264 .padding-top-70 { 265 padding-top: 70px; 266 } 267 268 .padding-top-80 { 269 padding-top: 80px; 270 } 271 272 .padding-top-90 { 273 padding-top: 90px; 274 } 275 276 .padding-top-95 { 277 padding-top: 95px; 278 } 279 280 .padding-top-100 { 281 padding-top: 100px; 282 } 283 284 .padding-top-105 { 285 padding-top: 105px; 286 } 287 288 .padding-top-110 { 289 padding-top: 110px; 290 } 291 292 .padding-top-115 { 293 padding-top: 115px; 294 } 295 296 .padding-top-120 { 297 padding-top: 120px; 298 } 299 300 .padding-bottom-10 { 301 padding-bottom: 10px; 302 } 303 304 .padding-bottom-20 { 305 padding-bottom: 20px; 306 } 307 308 .padding-bottom-30 { 309 padding-bottom: 30px; 310 } 311 312 .padding-bottom-40 { 313 padding-bottom: 40px; 314 } 315 316 .padding-bottom-50 { 317 padding-bottom: 50px; 318 } 319 320 .padding-bottom-60 { 321 padding-bottom: 60px; 322 } 323 324 .padding-bottom-65 { 325 padding-bottom: 65px; 326 } 327 328 .padding-bottom-70 { 329 padding-bottom: 70px; 330 } 331 332 .padding-bottom-80 { 333 padding-bottom: 80px; 334 } 335 336 .padding-bottom-85 { 337 padding-bottom: 85px; 338 } 339 340 .padding-bottom-90 { 341 padding-bottom: 90px; 342 } 343 344 .padding-bottom-95 { 345 padding-bottom: 95px; 346 } 347 348 .padding-bottom-100 { 349 padding-bottom: 100px; 350 } 351 352 .padding-bottom-110 { 353 padding-bottom: 110px; 354 } 355 356 .padding-bottom-105 { 357 padding-bottom: 105px; 358 } 359 360 .padding-bottom-115 { 361 padding-bottom: 115px; 362 } 363 364 .padding-bottom-120 { 365 padding-bottom: 120px; 366 } 367 368 .padding-bottom-130 { 369 padding-bottom: 130px; 370 } 371 372 .padding-bottom-135 { 373 padding-bottom: 135px; 374 } 375 376 .padding-120 { 377 padding-top: 120px; 378 padding-bottom: 120px; 379 } 380 381 .padding-110 { 382 padding-top: 110px; 383 padding-bottom: 110px; 384 } 385 386 .padding-100 { 387 padding-top: 100px; 388 padding-bottom: 100px; 389 } 390 391 .padding-20 { 392 padding-top: 20px; 393 padding-bottom: 20px; 394 } 395 396 .padding-30 { 397 padding-top: 30px; 398 padding-bottom: 30px; 399 } 400 401 .padding-40 { 402 padding-top: 40px; 403 padding-bottom: 40px; 404 } 405 406 .padding-50 { 407 padding-top: 50px; 408 padding-bottom: 50px; 409 } 410 411 .padding-60 { 412 padding-top: 60px; 413 padding-bottom: 60px; 414 } 415 416 .padding-70 { 417 padding-top: 70px; 418 padding-bottom: 70px; 419 } 420 421 .padding-80 { 422 padding-top: 80px; 423 padding-bottom: 80px; 424 } 425 426 .padding-90 { 427 padding-top: 90px; 428 padding-bottom: 90px; 429 } 430 431 .padding-10 { 432 padding-top: 10px; 433 padding-bottom: 10px; 434 } 435 436 .margin-top-10 { 437 margin-top: 10px; 438 } 439 440 .margin-top-20 { 441 margin-top: 20px; 442 } 443 444 .margin-top-30 { 445 margin-top: 30px; 446 } 447 448 .margin-top-40 { 449 margin-top: 40px; 450 } 451 452 .margin-top-50 { 453 margin-top: 50px; 454 } 455 456 .margin-top-55 { 457 margin-top: 55px; 458 } 459 460 .margin-top-60 { 461 margin-top: 60px; 462 } 463 464 .margin-top-70 { 465 margin-top: 70px; 466 } 467 468 .margin-top-80 { 469 margin-top: 80px; 470 } 471 472 .margin-top-90 { 473 margin-top: 90px; 474 } 475 476 .margin-top-100 { 477 margin-top: 100px; 478 } 479 480 .margin-bottom-0 { 481 margin-bottom: 0px !important; 482 } 483 484 .margin-bottom-10 { 485 margin-bottom: 10px; 486 } 487 488 .margin-bottom-15 { 489 margin-bottom: 15px; 490 } 491 492 .margin-bottom-20 { 493 margin-bottom: 20px; 494 } 495 496 .margin-bottom-25 { 497 margin-bottom: 25px; 498 } 499 500 .margin-bottom-30 { 501 margin-bottom: 30px; 502 } 503 504 .margin-bottom-40 { 505 margin-bottom: 40px; 506 } 507 508 .margin-bottom-50 { 509 margin-bottom: 50px; 510 } 511 512 .margin-bottom-55 { 513 margin-bottom: 55px; 514 } 515 516 .margin-bottom-60 { 517 margin-bottom: 60px; 518 } 519 520 .margin-bottom-70 { 521 margin-bottom: 70px; 522 } 523 524 .margin-bottom-80 { 525 margin-bottom: 80px; 526 } 527 528 .margin-bottom-90 { 529 margin-bottom: 90px; 530 } 531 532 .margin-top-100 { 533 margin-bottom: 100px; 534 } 535 536 .margin-top-120 { 537 margin-top: 120px; 538 } 539 540 .min-height-600 { 541 min-height: 600px; 542 } 543 .footer-widget.widget_tag_cloud .tagcloud a { 544 color: var(--main-color-one); 545 } 546 .footer-widget.widget_tag_cloud .tagcloud a { 547 background-color: transparent; 548 border: 1px solid rgba(255,255,255,.2); 549 } 550 .back-to-top { 551 position: fixed; 552 right: 30px; 553 bottom: 30px; 554 width: 50px; 555 height: 50px; 556 background-color: var(--main-color-one);; 557 color: #fff; 558 text-align: center; 559 line-height: 50px; 560 border-radius: 50%; 561 z-index: 99; 562 cursor: pointer; 563 font-size: 30px; 564 -webkit-box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.1); 565 box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.1); 566 } 567 568 .gray-bg { 569 background-color: #f7f7f7; 570 } 571 572 .video-play-btn { 573 position: relative; 574 z-index: 1; 575 display: inline-block; 576 width: 70px; 577 height: 70px; 578 line-height: 70px; 579 text-align: center; 580 font-size: 16px; 581 background-color: #fff; 582 border-radius: 50%; 583 color: #313131; 584 } 585 586 .video-play-btn:before { 587 content: ""; 588 position: absolute; 589 z-index: 0; 590 left: 50%; 591 top: 50%; 592 -ms-transform: translateX(-50%) translateY(-50%); 593 /* IE 9 */ 594 -webkit-transform: translateX(-50%) translateY(-50%); 595 /* Chrome, Safari, Opera */ 596 transform: translateX(-50%) translateY(-50%); 597 display: block; 598 width: 80px; 599 height: 80px; 600 background: #fff; 601 border-radius: 50%; 602 -webkit-animation: pulse-border 1500ms ease-out infinite; 603 animation: pulse-border 1500ms ease-out infinite; 604 z-index: -1; 605 } 606 607 .video-play-btn:hover { 608 color: #313131; 609 } 610 611 @-webkit-keyframes pulse-border { 612 0% { 613 -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); 614 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); 615 opacity: 1; 616 } 617 100% { 618 -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.3); 619 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.3); 620 opacity: 0; 621 } 622 } 623 624 @-moz-keyframes pulse-border { 625 0% { 626 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); 627 opacity: 1; 628 } 629 100% { 630 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.3); 631 opacity: 0; 632 } 633 } 634 635 @-o-keyframes pulse-border { 636 0% { 637 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); 638 opacity: 1; 639 } 640 100% { 641 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.3); 642 opacity: 0; 643 } 644 } 645 646 @keyframes pulse-border { 647 0% { 648 -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); 649 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); 650 opacity: 1; 651 } 652 100% { 653 -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.3); 654 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.3); 655 opacity: 0; 656 } 657 } 658 659 660 .btn-wrapper .boxed-btn { 661 display: inline-block; 662 text-align: center; 663 height: 60px; 664 line-height: 60px; 665 font-size: 16px; 666 text-transform: capitalize; 667 font-weight: 600; 668 color: #fff; 669 width: 202px; 670 background-color: var(--main-color-one);; 671 padding: 0 20px; 672 -webkit-transition: all 0.3s ease-in; 673 -moz-transition: all 0.3s ease-in; 674 -o-transition: all 0.3s ease-in; 675 transition: all 0.3s ease-in; 676 } 677 678 .btn-wrapper .boxed-btn:hover { 679 color: #fff; 680 background-color: #333333; 681 } 682 683 .btn-wrapper .boxed-btn.gd-bg-1 { 684 background-image: -moz-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 685 background-image: -webkit-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 686 background-image: -ms-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 687 } 688 689 .btn-wrapper .boxed-btn.gd-bg-1:hover { 690 background-image: -moz-linear-gradient(50deg, #9749f8 0%, #5e2ced 100%); 691 background-image: -webkit-linear-gradient(50deg, #9749f8 0%, #5e2ced 100%); 692 background-image: -ms-linear-gradient(50deg, #9749f8 0%, #5e2ced 100%); 693 color: #fff; 694 } 695 696 .btn-wrapper .boxed-btn.gd-bg-2 { 697 background-image: -moz-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 698 background-image: -webkit-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 699 background-image: -ms-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 700 } 701 702 .btn-wrapper .boxed-btn.gd-bg-2:hover { 703 background-image: -moz-linear-gradient(50deg, #a197fa 0%, #e877cb 100%); 704 background-image: -webkit-linear-gradient(50deg, #a197fa 0%, #e877cb 100%); 705 background-image: -ms-linear-gradient(50deg, #a197fa 0%, #e877cb 100%); 706 color: #fff; 707 } 708 709 .btn-wrapper .boxed-btn.gd-bg-3 { 710 background-image: -moz-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 711 background-image: -webkit-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 712 background-image: -ms-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 713 } 714 715 .btn-wrapper .boxed-btn.gd-bg-3:hover { 716 background-image: -moz-linear-gradient(50deg, #2784fc 0%, #70bfec 100%); 717 background-image: -webkit-linear-gradient(50deg, #2784fc 0%, #70bfec 100%); 718 background-image: -ms-linear-gradient(50deg, #2784fc 0%, #70bfec 100%); 719 color: #fff; 720 } 721 722 .btn-wrapper .boxed-btn.btn-rounded { 723 border-radius: 30px; 724 } 725 726 .btn-wrapper .boxed-btn.blank { 727 background-color: transparent; 728 border: 2px solid var(--main-color-one);; 729 color: var(--main-color-one);; 730 } 731 732 .btn-wrapper .boxed-btn.blank:hover { 733 background-color: var(--main-color-one);; 734 color: #fff; 735 } 736 737 .btn-wrapper .boxed-btn.black { 738 border: none; 739 color: #fff; 740 background-color: #333333; 741 } 742 743 .btn-wrapper .boxed-btn.black:hover { 744 background-color: var(--main-color-one);; 745 color: #fff; 746 } 747 748 749 .boxed-btn-02 { 750 display: inline-block; 751 text-align: center; 752 height: 60px; 753 line-height: 56px; 754 font-size: 16px; 755 text-transform: capitalize; 756 font-weight: 600; 757 color: #fff; 758 background-color: var(--main-color-one); 759 padding: 0 30px; 760 -webkit-transition: all 0.3s ease-in; 761 -moz-transition: all 0.3s ease-in; 762 -o-transition: all 0.3s ease-in; 763 transition: all 0.3s ease-in; 764 border-radius: 5px; 765 border: 2px solid transparent; 766 } 767 768 .boxed-btn-02:hover { 769 background-color: #fff; 770 color: var(--main-color-one); 771 border-color: var(--main-color-one); 772 773 } 774 775 .boxed-btn-02.black:hover { 776 background-color: var(--secondary-color); 777 color: #fff; 778 } 779 780 .boxed-btn-02.reverse-color { 781 background-color: #fff; 782 color: var(--main-color-one); 783 } 784 785 .boxed-btn-02.reverse-color:hover { 786 color: #fff; 787 background-color: var(--main-color-one); 788 } 789 790 .boxed-btn-02.blank { 791 background-color: transparent; 792 color: #fff; 793 border: 2px solid #fff; 794 } 795 796 .boxed-btn-02.blank:hover { 797 color: var(--main-color-one); 798 background-color: #fff; 799 } 800 801 802 .boxed-btn-02.primary-border-color { 803 background-color: transparent; 804 color: var(--main-color-one); 805 border-color: var(--main-color-one); 806 margin-left: 15px; 807 } 808 809 .primary-border-color.boxed-btn-02:hover { 810 background-color: var(--main-color-one); 811 color: #fff; 812 border: 2px solid var(--main-color-one); 813 } 814 815 .submit-btn { 816 width: 180px; 817 height: 60px; 818 text-align: center; 819 font-weight: 600; 820 font-size: 16px; 821 line-height: 60px; 822 color: #fff; 823 text-transform: capitalize; 824 background-color: var(--main-color-one);; 825 border: none; 826 -webkit-transition: all 0.3s ease-in; 827 -moz-transition: all 0.3s ease-in; 828 -o-transition: all 0.3s ease-in; 829 transition: all 0.3s ease-in; 830 cursor: pointer; 831 } 832 833 .submit-btn:hover { 834 background-color: #333333; 835 } 836 837 .submit-btn.btn-rounded { 838 border-radius: 30px; 839 } 840 841 .submit-btn.btn-center { 842 display: block; 843 margin: 0 auto; 844 margin-top: 25px; 845 } 846 847 .submit-btn:focus { 848 outline: none; 849 } 850 851 .submit-btn.gd-bg-1 { 852 background-image: -moz-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 853 background-image: -webkit-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 854 background-image: -ms-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 855 } 856 857 .submit-btn.gd-bg-1:hover { 858 background-image: -moz-linear-gradient(50deg, #9749f8 0%, #5e2ced 100%); 859 background-image: -webkit-linear-gradient(50deg, #9749f8 0%, #5e2ced 100%); 860 background-image: -ms-linear-gradient(50deg, #9749f8 0%, #5e2ced 100%); 861 } 862 /*-------------------------------------------------------------- 863 # Accessibility 864 --------------------------------------------------------------*/ 865 /* Text meant only for screen readers. */ 866 .screen-reader-text { 867 border: 0; 868 clip: rect(1px, 1px, 1px, 1px); 869 -webkit-clip-path: inset(50%); 870 clip-path: inset(50%); 871 height: 1px; 872 margin: -1px; 873 overflow: hidden; 874 padding: 0; 875 position: absolute !important; 876 width: 1px; 877 word-wrap: normal !important; 878 /* Many screen reader and browser combinations announce broken words as they would appear visually. */ 879 } 880 881 .screen-reader-text:focus { 882 background-color: #f1f1f1; 883 border-radius: 3px; 884 -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); 885 box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); 886 clip: auto !important; 887 -webkit-clip-path: none; 888 clip-path: none; 889 color: #21759b; 890 display: block; 891 font-size: 14px; 892 font-size: 0.875rem; 893 font-weight: bold; 894 height: auto; 895 left: 5px; 896 line-height: normal; 897 padding: 15px 23px 14px; 898 text-decoration: none; 899 top: 5px; 900 width: auto; 901 z-index: 100000; 902 /* Above WP toolbar. */ 903 } 904 905 /* Do not show the outline on the skip link target. */ 906 #content[tabindex="-1"]:focus { 907 outline: 0; 908 } 909 910 911 /*-------------------------------------------------------------- 912 # Alignments 913 --------------------------------------------------------------*/ 914 .alignleft { 915 float: left; 916 clear: both; 917 margin-right: 20px; 918 } 919 920 .alignright { 921 float: right; 922 clear: both; 923 margin-left: 20px; 924 } 925 926 .aligncenter { 927 clear: both; 928 display: block; 929 margin: 0 auto 1.75em; 930 } 931 932 .alignfull { 933 margin: 1.5em 0; 934 max-width: 100%; 935 } 936 937 .alignwide { 938 max-width: 1100px; 939 } 940 941 /*-------------------------------------------------------------- 942 # Clearings 943 --------------------------------------------------------------*/ 944 .clear:before, 945 .clear:after, 946 .entry-content:before, 947 .entry-content:after, 948 .comment-content:before, 949 .comment-content:after, 950 .site-header:before, 951 .site-header:after, 952 .site-content:before, 953 .site-content:after, 954 .site-footer:before, 955 .site-footer:after { 956 content: ""; 957 display: table; 958 table-layout: fixed; 959 } 960 961 .clear:after, 962 .entry-content:after, 963 .comment-content:after, 964 .site-header:after, 965 .site-content:after, 966 .site-footer:after { 967 clear: both; 968 } 969 970 /*-------------------------------------------------------------- 971 ## Posts and pages 972 --------------------------------------------------------------*/ 973 .sticky { 974 display: block; 975 } 976 977 .updated:not(.published) { 978 display: none; 979 } 980 981 .blog-pagination ul li, 982 .woocommerce-pagination ul li { 983 display: inline-block; 984 } 985 986 .breadcrumb-area.default { 987 padding-top: 135px; 988 } 989 .breadcrumb-area.style-03 { 990 padding-top: 140px; 991 } 992 .woocommerce-pagination ul li + li, 993 .blog-pagination ul li + li { 994 margin: 0 5px; 995 } 996 997 .woocommerce-pagination, 998 .blog-pagination { 999 display: block; 1000 width: 100%; 1001 } 1002 1003 .blog-pagination ul { 1004 margin: 0; 1005 padding: 0; 1006 list-style: none; 1007 } 1008 1009 .blog-pagination ul li a, 1010 .blog-pagination ul li span, 1011 .woocommerce-pagination ul li a, 1012 .woocommerce-pagination ul li span { 1013 display: block; 1014 width: 40px; 1015 height: 40px; 1016 border: 1px solid #e2e2e2; 1017 line-height: 40px; 1018 text-align: center; 1019 font-weight: 600; 1020 -webkit-transition: .3s ease-in; 1021 -o-transition: .3s ease-in; 1022 transition: .3s ease-in; 1023 } 1024 1025 .blog-pagination ul li span.current, 1026 .blog-pagination ul li a:hover, 1027 .woocommerce-pagination ul li span.current, 1028 .woocommerce-pagination ul li a:hover { 1029 background-color: var(--main-color-one); 1030 color: #fff; 1031 } 1032 1033 .blog-pagination ul li a, 1034 .blog-pagination ul li span { 1035 width: auto; 1036 padding: 0 15px; 1037 color: var(--paragraph-color); 1038 } 1039 1040 .single-post-details-item.format-video .thumb { 1041 position: relative; 1042 z-index: 0; 1043 } 1044 1045 .single-post-details-item.format-video .thumb .hover { 1046 position: absolute; 1047 left: 0; 1048 top: 0; 1049 display: flex; 1050 justify-content: center; 1051 align-items: center; 1052 width: 100%; 1053 height: 100%; 1054 } 1055 1056 /*-------------------------------------------------------------- 1057 # Media 1058 --------------------------------------------------------------*/ 1059 .page-content .wp-smiley, 1060 .entry-content .wp-smiley, 1061 .comment-content .wp-smiley { 1062 border: none; 1063 margin-bottom: 0; 1064 margin-top: 0; 1065 padding: 0; 1066 } 1067 1068 /* Make sure embeds and iframes fit their containers. */ 1069 embed, 1070 iframe, 1071 object { 1072 max-width: 100%; 1073 } 1074 1075 /* Make sure logo link wraps around logo image. */ 1076 .custom-logo-link { 1077 display: inline-block; 1078 } 1079 1080 /*-------------------------------------------------------------- 1081 ## Captions 1082 --------------------------------------------------------------*/ 1083 .wp-caption { 1084 margin-bottom: 1.5em; 1085 max-width: 100%; 1086 clear: both; 1087 } 1088 1089 .wp-caption img[class*="wp-image-"] { 1090 display: block; 1091 margin-left: auto; 1092 margin-right: auto; 1093 } 1094 1095 .wp-caption .wp-caption-text { 1096 margin: 0.8075em 0; 1097 } 1098 1099 .wp-caption-text { 1100 text-align: center; 1101 } 1102 1103 /*-------------------------------------------------------------- 1104 ## Galleries 1105 --------------------------------------------------------------*/ 1106 .gallery { 1107 margin-bottom: 1.5em; 1108 } 1109 1110 .gallery-item { 1111 display: inline-block; 1112 text-align: center; 1113 vertical-align: top; 1114 width: 100%; 1115 } 1116 1117 .gallery-columns-2 .gallery-item { 1118 max-width: 50%; 1119 } 1120 1121 .gallery-columns-3 .gallery-item { 1122 max-width: 33.33%; 1123 } 1124 1125 .gallery-columns-4 .gallery-item { 1126 max-width: 25%; 1127 } 1128 1129 .gallery-columns-5 .gallery-item { 1130 max-width: 20%; 1131 } 1132 1133 .gallery-columns-6 .gallery-item { 1134 max-width: 16.66%; 1135 } 1136 1137 .gallery-columns-7 .gallery-item { 1138 max-width: 14.28%; 1139 } 1140 1141 .gallery-columns-8 .gallery-item { 1142 max-width: 12.5%; 1143 } 1144 1145 .gallery-columns-9 .gallery-item { 1146 max-width: 11.11%; 1147 } 1148 1149 .gallery-caption { 1150 display: block; 1151 } 1152 1153 /*---------------------------------------- 1154 # Unit test 1155 ------------------------------------------*/ 1156 .wp-link-pages a { 1157 margin: 0 5px; 1158 -webkit-transition: .3s ease-in; 1159 -o-transition: .3s ease-in; 1160 transition: .3s ease-in; 1161 } 1162 1163 .wp-link-pages { 1164 margin-bottom: 30px; 1165 margin-top: 25px; 1166 } 1167 1168 .wp-link-pages span, .wp-link-pages a { 1169 border: 1px solid #e2e2e2; 1170 padding: 5px 15px; 1171 display: inline-block; 1172 } 1173 1174 .wp-link-pages .current, 1175 .wp-link-pages a:hover { 1176 background-color: var(--main-color-one); 1177 color: #fff; 1178 border-color: var(--main-color-one); 1179 } 1180 1181 .wp-link-pages span:first-child { 1182 margin-right: 5px; 1183 } 1184 1185 dl, ol, ul { 1186 padding-left: 15px; 1187 } 1188 1189 .post-password-form input { 1190 display: block; 1191 border: 1px solid #e2e2e2; 1192 height: 50px; 1193 border-radius: 3px; 1194 padding: 0 20px; 1195 } 1196 1197 .post-password-form label { 1198 font-weight: 600; 1199 color: #333; 1200 } 1201 1202 .post-password-form input[type=submit] { 1203 width: 100px; 1204 height: 50px; 1205 background-color: var(--main-color-one); 1206 color: #fff; 1207 font-size: 16px; 1208 font-weight: 600; 1209 letter-spacing: 1px; 1210 border: none; 1211 cursor: pointer; 1212 -webkit-transition: .3s ease-in; 1213 -o-transition: .3s ease-in; 1214 transition: .3s ease-in; 1215 } 1216 1217 .post-password-form input[type=submit]:hover { 1218 background-color: #121A2F; 1219 } 1220 1221 .footer-widget .table td, .footer-widget .table th { 1222 padding: 0.50rem !important; 1223 } 1224 1225 .widget.footer-widget .widget-title { 1226 color: rgba(255, 255, 255, 0.9); 1227 } 1228 1229 .widget.footer-widget .widget-title:after { 1230 display: none; 1231 } 1232 1233 .footer-widget.widget .recent_post_item li.single-recent-post-item .content .title > a:hover { 1234 opacity: .7 !important; 1235 } 1236 1237 .widget.footer-widget p, 1238 .footer-widget.widget_tag_cloud .tagcloud a, 1239 .widget.footer-widget.widget_calendar caption, 1240 .widget.footer-widget.widget_calendar th, 1241 .widget.footer-widget.widget_calendar td { 1242 color: rgba(255, 255, 255, 0.8); 1243 } 1244 1245 .widget.footer-widget ul li a, 1246 .widget.footer-widget ul li { 1247 color: rgba(255, 255, 255, 0.8); 1248 } 1249 1250 .widget ul li ul.children { 1251 margin-top: 10px; 1252 } 1253 1254 .widget_categories ul li.cat-item { 1255 position: relative; 1256 padding-left: 15px; 1257 } 1258 1259 .widget_categories ul li.cat-item:after { 1260 position: absolute; 1261 left: 0; 1262 top: 10px; 1263 width: 8px; 1264 height: 8px; 1265 content: ''; 1266 border-radius: 50%; 1267 border: 2px solid var(--main-color-one); 1268 } 1269 1270 .widget_rss ul li cite { 1271 font-weight: 500; 1272 } 1273 1274 .widget_rss ul li a.rsswidget { 1275 color: var(--heading-color); 1276 margin-bottom: 5px; 1277 display: block; 1278 } 1279 1280 .widget_rss ul li .rss-date { 1281 display: block; 1282 position: relative; 1283 padding-left: 20px; 1284 margin-bottom: 10px; 1285 } 1286 1287 .widget_rss ul li .rss-date:after { 1288 position: absolute; 1289 left: 0; 1290 top: 0; 1291 font-family: 'fontawesome'; 1292 content: "\f017"; 1293 } 1294 1295 .widget_rss ul li + li { 1296 margin-top: 20px; 1297 } 1298 1299 .widget.widget_archive ul li { 1300 padding-left: 25px; 1301 position: relative; 1302 z-index: 0; 1303 } 1304 1305 .widget.footer-widget.widget_archive ul li { 1306 padding-left: 0px; 1307 } 1308 1309 .widget.footer-widget.widget_archive ul li:after { 1310 display: none; 1311 } 1312 1313 .widget.widget_archive ul li:after { 1314 position: absolute; 1315 left: 0; 1316 top: 0; 1317 content: "\f274"; 1318 font-family: fontawesome; 1319 } 1320 1321 /*--------------------- 1322 Breadcumb Area 1323 ----------------------*/ 1324 .breadcrumb-area { 1325 position: relative; 1326 z-index: 0; 1327 padding: 229px 0 140px 0; 1328 background-color: #1f2732; 1329 } 1330 1331 .breadcrumb-area.extra { 1332 padding-top: 232px; 1333 } 1334 1335 .breadcrumb-area .page-title { 1336 color: #fff; 1337 font-size: 50px; 1338 line-height: 60px; 1339 font-weight: 700; 1340 margin-bottom: 30px; 1341 word-break: break-word; 1342 } 1343 1344 .breadcrumb-area .page-list { 1345 margin: 0; 1346 padding: 0; 1347 list-style: none; 1348 } 1349 1350 .breadcrumb-area .page-list { 1351 font-size: 18px; 1352 line-height: 20px; 1353 color: var(--main-color-one);; 1354 } 1355 1356 .breadcrumb-area .page-list li { 1357 display: inline-block; 1358 position: relative; 1359 margin: 0 10px; 1360 color: #fff; 1361 word-break: break-word; 1362 font-size: 16px; 1363 } 1364 1365 .breadcrumb-area .page-list li:first-child { 1366 margin-left: 0; 1367 } 1368 1369 .breadcrumb-area .page-list li:last-child:after { 1370 display: none; 1371 } 1372 1373 .breadcrumb-area .page-list li:after { 1374 position: absolute; 1375 right: -15px; 1376 top: 0px; 1377 font-family: 'fontawesome'; 1378 content: '\f105'; 1379 font-weight: 900; 1380 } 1381 1382 .breadcrumb-area .page-list li a { 1383 color: #fff; 1384 -webkit-transition: all 0.3s ease-in; 1385 -moz-transition: all 0.3s ease-in; 1386 -o-transition: all 0.3s ease-in; 1387 transition: all 0.3s ease-in; 1388 word-break: break-word; 1389 } 1390 1391 .breadcrumb-area.breadcrumb-bg { 1392 background-size: cover; 1393 background-position: center; 1394 } 1395 1396 /*------------------------- 1397 Preloader Css 1398 ---------------------------*/ 1399 .preloader-wrapper { 1400 position: fixed; 1401 width: 100%; 1402 height: 100%; 1403 top: 0; 1404 left: 0; 1405 z-index: 99999999; 1406 background-color: #fff; 1407 } 1408 1409 .preloader-wrapper .preloader { 1410 position: absolute; 1411 top: 50%; 1412 left: 50%; 1413 width: 80px; 1414 height: 60px; 1415 margin: -30px 0 0 -40px; 1416 } 1417 1418 .sk-circle { 1419 width: 80px; 1420 height: 80px; 1421 position: relative; 1422 display: block; 1423 } 1424 1425 .sk-circle .sk-child { 1426 width: 100%; 1427 height: 100%; 1428 position: absolute; 1429 left: 0; 1430 top: 0; 1431 } 1432 1433 .sk-circle .sk-child:before { 1434 content: ''; 1435 display: block; 1436 margin: 0 auto; 1437 width: 15%; 1438 height: 15%; 1439 background-color: var(--main-color-one);; 1440 border-radius: 100%; 1441 -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both; 1442 animation: sk-circleBounceDelay 1.2s infinite ease-in-out both; 1443 } 1444 1445 .sk-circle .sk-circle2 { 1446 -webkit-transform: rotate(30deg); 1447 -ms-transform: rotate(30deg); 1448 transform: rotate(30deg); 1449 } 1450 1451 .sk-circle .sk-circle3 { 1452 -webkit-transform: rotate(60deg); 1453 -ms-transform: rotate(60deg); 1454 transform: rotate(60deg); 1455 } 1456 1457 .sk-circle .sk-circle4 { 1458 -webkit-transform: rotate(90deg); 1459 -ms-transform: rotate(90deg); 1460 transform: rotate(90deg); 1461 } 1462 1463 .sk-circle .sk-circle5 { 1464 -webkit-transform: rotate(120deg); 1465 -ms-transform: rotate(120deg); 1466 transform: rotate(120deg); 1467 } 1468 1469 .sk-circle .sk-circle6 { 1470 -webkit-transform: rotate(150deg); 1471 -ms-transform: rotate(150deg); 1472 transform: rotate(150deg); 1473 } 1474 1475 .sk-circle .sk-circle7 { 1476 -webkit-transform: rotate(180deg); 1477 -ms-transform: rotate(180deg); 1478 transform: rotate(180deg); 1479 } 1480 1481 .sk-circle .sk-circle8 { 1482 -webkit-transform: rotate(210deg); 1483 -ms-transform: rotate(210deg); 1484 transform: rotate(210deg); 1485 } 1486 1487 .sk-circle .sk-circle9 { 1488 -webkit-transform: rotate(240deg); 1489 -ms-transform: rotate(240deg); 1490 transform: rotate(240deg); 1491 } 1492 1493 .sk-circle .sk-circle10 { 1494 -webkit-transform: rotate(270deg); 1495 -ms-transform: rotate(270deg); 1496 transform: rotate(270deg); 1497 } 1498 1499 .sk-circle .sk-circle11 { 1500 -webkit-transform: rotate(300deg); 1501 -ms-transform: rotate(300deg); 1502 transform: rotate(300deg); 1503 } 1504 1505 .sk-circle .sk-circle12 { 1506 -webkit-transform: rotate(330deg); 1507 -ms-transform: rotate(330deg); 1508 transform: rotate(330deg); 1509 } 1510 1511 .sk-circle .sk-circle2:before { 1512 -webkit-animation-delay: -1.1s; 1513 animation-delay: -1.1s; 1514 } 1515 1516 .sk-circle .sk-circle3:before { 1517 -webkit-animation-delay: -1s; 1518 animation-delay: -1s; 1519 } 1520 1521 .sk-circle .sk-circle4:before { 1522 -webkit-animation-delay: -0.9s; 1523 animation-delay: -0.9s; 1524 } 1525 1526 .sk-circle .sk-circle5:before { 1527 -webkit-animation-delay: -0.8s; 1528 animation-delay: -0.8s; 1529 } 1530 1531 .sk-circle .sk-circle6:before { 1532 -webkit-animation-delay: -0.7s; 1533 animation-delay: -0.7s; 1534 } 1535 1536 .sk-circle .sk-circle7:before { 1537 -webkit-animation-delay: -0.6s; 1538 animation-delay: -0.6s; 1539 } 1540 1541 .sk-circle .sk-circle8:before { 1542 -webkit-animation-delay: -0.5s; 1543 animation-delay: -0.5s; 1544 } 1545 1546 .sk-circle .sk-circle9:before { 1547 -webkit-animation-delay: -0.4s; 1548 animation-delay: -0.4s; 1549 } 1550 1551 .sk-circle .sk-circle10:before { 1552 -webkit-animation-delay: -0.3s; 1553 animation-delay: -0.3s; 1554 } 1555 1556 .sk-circle .sk-circle11:before { 1557 -webkit-animation-delay: -0.2s; 1558 animation-delay: -0.2s; 1559 } 1560 1561 .sk-circle .sk-circle12:before { 1562 -webkit-animation-delay: -0.1s; 1563 animation-delay: -0.1s; 1564 } 1565 1566 @-webkit-keyframes sk-circleBounceDelay { 1567 0%, 80%, 100% { 1568 -webkit-transform: scale(0); 1569 transform: scale(0); 1570 } 1571 40% { 1572 -webkit-transform: scale(1); 1573 transform: scale(1); 1574 } 1575 } 1576 1577 @keyframes sk-circleBounceDelay { 1578 0%, 80%, 100% { 1579 -webkit-transform: scale(0); 1580 transform: scale(0); 1581 } 1582 40% { 1583 -webkit-transform: scale(1); 1584 transform: scale(1); 1585 } 1586 } 1587 1588 @-webkit-keyframes slide { 1589 0% { 1590 clip: rect(0, 0, 20px, 0); 1591 } 1592 30% { 1593 clip: rect(0, 80px, 20px, 0); 1594 } 1595 50% { 1596 clip: rect(0, 80px, 20px, 0); 1597 } 1598 80% { 1599 clip: rect(0, 80px, 20px, 80px); 1600 } 1601 100% { 1602 clip: rect(0, 80px, 20px, 80px); 1603 } 1604 } 1605 1606 @keyframes slide { 1607 0% { 1608 clip: rect(0, 0, 20px, 0); 1609 } 1610 30% { 1611 clip: rect(0, 80px, 20px, 0); 1612 } 1613 50% { 1614 clip: rect(0, 80px, 20px, 0); 1615 } 1616 80% { 1617 clip: rect(0, 80px, 20px, 80px); 1618 } 1619 100% { 1620 clip: rect(0, 80px, 20px, 80px); 1621 } 1622 } 1623 1624 @-webkit-keyframes fade { 1625 0% { 1626 opacity: 1; 1627 } 1628 50% { 1629 opacity: 0; 1630 } 1631 100% { 1632 opacity: 1; 1633 } 1634 } 1635 1636 @keyframes fade { 1637 0% { 1638 opacity: 1; 1639 } 1640 50% { 1641 opacity: 0; 1642 } 1643 100% { 1644 opacity: 1; 1645 } 1646 } 1647 1648 /*------------------------------ 1649 Navbar Area 1650 ------------------------------*/ 1651 .header-style-01 .navbar-area.navbar-style-transparent.nav-fixed{ 1652 background-color: var(--secondary-color); 1653 } 1654 .navbar-area.nav-fixed { 1655 position: fixed !important; 1656 top: 0 !important; 1657 left: 0 !important; 1658 background-color: var(--secondary-color); 1659 z-index: 999 !important; 1660 } 1661 .navbar-nav ul { 1662 margin: 0; 1663 padding: 0; 1664 list-style: none; 1665 text-align: left; 1666 } 1667 1668 .navbar-nav ul li { 1669 line-height: 100px; 1670 display: inline-block; 1671 } 1672 .navbar-nav ul li +li{ 1673 margin-left: 20px; 1674 } 1675 1676 .navbar-area.navbar-style-transparent { 1677 position: absolute; 1678 left: 0; 1679 top: 0; 1680 width: 100%; 1681 height: auto; 1682 z-index: 2; 1683 border-bottom: 1px solid rgba(255, 255, 255, .1); 1684 } 1685 1686 .header-style-transparent { 1687 position: relative; 1688 } 1689 1690 .navbar-area.navbar-style-transparent .nav-container .navbar-collapse .navbar-nav li a, 1691 .navbar-area.navbar-style-transparent .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children:before { 1692 color: rgba(255, 255, 255, .8); 1693 } 1694 1695 .navbar-area.navbar-style-transparent .nav-container .navbar-collapse .navbar-nav li a:hover { 1696 color: #fff; 1697 } 1698 1699 .navbar-area.navbar-style-transparent .nav-container .navbar-collapse .navbar-nav li.current-menu-item a { 1700 color: #fff; 1701 } 1702 1703 .navbar-area.navbar-style-transparent .nav-container .nav-right-content ul li .boxed-btn { 1704 background-color: var(--main-color-one); 1705 color: #fff; 1706 border: none; 1707 } 1708 1709 .navbar-area .nav-container .nav-right-content ul li .boxed-btn { 1710 border: 1px solid var(--main-color-one); 1711 padding: 12px 30px; 1712 border-radius: 5px; 1713 transition: all 500ms; 1714 font-weight: 600; 1715 background-color: var(--main-color-one); 1716 color: #fff; 1717 transition: all 500ms; 1718 } 1719 1720 .navbar-area .nav-container .nav-right-content ul li .boxed-btn:hover { 1721 box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.35); 1722 } 1723 1724 .navbar-area.navbar-style-transparent .nav-container .nav-right-content ul li .boxed-btn:hover { 1725 box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.15); 1726 } 1727 1728 1729 .navbar.navbar-area.navbar-style-transparent .navbar-toggler-icon { 1730 background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.50)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E"); 1731 } 1732 1733 .navbar.navbar-area .navbar-toggler-icon { 1734 background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.50)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E"); 1735 } 1736 1737 .mobile-logo { 1738 display: none; 1739 } 1740 /* header style 03 */ 1741 .header-style-02 .navbar-area.navbar-style-transparent .nav-container .nav-right-content ul li .boxed-btn:first-child { 1742 background-color: transparent; 1743 border: 1px solid; 1744 padding: 11px 26px; 1745 } 1746 1747 .header-style-02 .navbar-area.navbar-style-transparent .nav-container .nav-right-content ul li .boxed-btn:last-child { 1748 margin-left: 15px; 1749 } 1750 1751 .header-style-02 .navbar-area.navbar-style-transparent .nav-container .nav-right-content ul li .boxed-btn:first-child:hover { 1752 background-color: var(--main-color-one); 1753 border-color: var(--main-color-one); 1754 color: #fff; 1755 } 1756 .header-style-02 .navbar-area .nav-container .navbar-collapse .navbar-nav { 1757 text-align: center; 1758 } 1759 /* header style 04 */ 1760 .header-style-03 .navbar-area .nav-container .navbar-collapse .navbar-nav { 1761 text-align: center; 1762 } 1763 .header-style-03 .navbar-area .nav-container .nav-right-content ul li .boxed-btn{ 1764 border-radius: 30px; 1765 } 1766 /* elementor mega menu start */ 1767 .navbar-area .nav-container .navbar-collapse .navbar-nav li.appside-megamenu:after{ 1768 position: static; 1769 right: 0; 1770 top: 50%; 1771 padding-left: 5px; 1772 content: '\f107'; 1773 font-family: 'fontawesome'; 1774 -ms-transform: translateY(-50%); 1775 -webkit-transform: translateY(-50%); 1776 transform: translateY(-50%); 1777 -webkit-transition: all 0.3s ease-in; 1778 -moz-transition: all 0.3s ease-in; 1779 -o-transition: all 0.3s ease-in; 1780 transition: all 0.3s ease-in; 1781 1782 } 1783 .navbar-area .nav-container .navbar-collapse .navbar-nav li.appside-megamenu:hover > .appside-megamenu-wapper{ 1784 visibility: visible; 1785 opacity: 1; 1786 z-index: 999; 1787 } 1788 .navbar-area .nav-container .navbar-collapse .navbar-nav li.appside-megamenu .appside-megamenu-wapper{ 1789 max-width: 1240px; 1790 width: calc(100vw - 180px); 1791 box-sizing: border-box; 1792 position: fixed; 1793 left: 0; 1794 right: 0; 1795 margin-left: auto; 1796 margin-right: auto; 1797 padding: 0; 1798 box-sizing: border-box; 1799 border-radius: 5px; 1800 overflow: hidden; 1801 z-index: 99; 1802 background-color: #fff; 1803 box-shadow: 0 0 15px 0 rgba(0,0,0,0.06); 1804 visibility: hidden; 1805 opacity: 0; 1806 transition: all 300ms; 1807 } 1808 1809 /* elementor mega menu end */ 1810 @media only screen and (max-width: 991px) { 1811 .mobile-logo { 1812 display: block; 1813 } 1814 1815 .desktop-logo { 1816 display: none !important; 1817 } 1818 .navbar-area .nav-container .navbar-collapse .navbar-nav li.appside-megamenu:hover .appside-megamenu-wapper { 1819 width: 100%; 1820 max-width: 100%; 1821 position: initial; 1822 border-radius: 0; 1823 box-shadow: none; 1824 overflow-y: scroll; 1825 } 1826 1827 .navbar-area .nav-container .navbar-collapse .navbar-nav li.appside-megamenu { 1828 position: relative; 1829 } 1830 1831 1832 .navbar-area .nav-container .navbar-collapse .navbar-nav li.appside-megamenu:after { 1833 top: 25px; 1834 right: 20px; 1835 position: absolute; 1836 } 1837 } 1838 1839 .navbar-area { 1840 padding: 0; 1841 } 1842 1843 .navbar-area.nav-absolute { 1844 position: absolute; 1845 left: 0; 1846 width: 100%; 1847 top: 0px; 1848 z-index: 1; 1849 } 1850 1851 .navbar-area .nav-container .nav-right-content ul { 1852 margin: 0; 1853 padding: 0; 1854 list-style: none; 1855 margin-left: 30px; 1856 } 1857 1858 .navbar-area .nav-container .nav-right-content ul li { 1859 display: inline-block; 1860 } 1861 1862 .navbar-area .nav-container .nav-right-content ul li .btn-boxed { 1863 font-weight: 600; 1864 text-transform: capitalize; 1865 border-radius: 5px; 1866 background-color: var(--main-color-one); 1867 } 1868 1869 .navbar-area .nav-container .nav-right-content ul li .btn-boxed:hover { 1870 background-color: var(--secondary-color); 1871 } 1872 1873 .navbar-area .nav-container .navbar-brand .site-title { 1874 font-weight: 700; 1875 font-size: 30px; 1876 font-family: var(--heading-font); 1877 line-height: 90px; 1878 color: var(--heading-color); 1879 } 1880 1881 .navbar-area .nav-container .navbar-collapse .navbar-nav { 1882 display: block; 1883 width: 100%; 1884 text-align: right; 1885 } 1886 1887 .navbar-area .nav-container .navbar-collapse .navbar-nav li { 1888 display: inline-block; 1889 font-size: 16px; 1890 font-weight: 500; 1891 line-height: 90px; 1892 } 1893 1894 .navbar-area .nav-container .navbar-collapse .navbar-nav li + li { 1895 margin-left: 20px; 1896 } 1897 1898 .navbar-area .nav-container .navbar-collapse .navbar-nav li.current-menu-item a { 1899 color: var(--main-color-one); 1900 } 1901 1902 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children { 1903 position: relative; 1904 /*z-index: 0;*/ 1905 padding-right: 15px; 1906 } 1907 1908 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children:before { 1909 position: absolute; 1910 right: 0; 1911 top: 50%; 1912 content: '\f107'; 1913 font-family: 'fontawesome'; 1914 -ms-transform: translateY(-50%); 1915 /* IE 9 */ 1916 -webkit-transform: translateY(-50%); 1917 /* Chrome, Safari, Opera */ 1918 transform: translateY(-50%); 1919 -webkit-transition: all 0.3s ease-in; 1920 -moz-transition: all 0.3s ease-in; 1921 -o-transition: all 0.3s ease-in; 1922 transition: all 0.3s ease-in; 1923 } 1924 1925 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children:hover > .sub-menu { 1926 visibility: visible; 1927 opacity: 1; 1928 } 1929 1930 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu { 1931 position: absolute; 1932 text-align: left; 1933 min-width: 220px; 1934 margin: 0; 1935 padding: 0; 1936 list-style: none; 1937 left: 0; 1938 top: 100%; 1939 -webkit-box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.05); 1940 box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.05); 1941 background-color: #fff; 1942 z-index: 9; 1943 border-bottom: 4px solid var(--main-color-one); 1944 visibility: hidden; 1945 opacity: 0; 1946 -webkit-transition: all 0.3s ease-in; 1947 -moz-transition: all 0.3s ease-in; 1948 -o-transition: all 0.3s ease-in; 1949 transition: all 0.3s ease-in; 1950 } 1951 1952 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu li { 1953 display: block; 1954 margin-left: 0; 1955 line-height: 24px; 1956 font-size: 16px; 1957 } 1958 1959 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu li + li { 1960 border-top: 1px solid #e2e2e2; 1961 } 1962 1963 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu li a { 1964 display: block; 1965 padding: 12px 30px; 1966 background-color: #fff; 1967 white-space: nowrap; 1968 color: var(--paragraph-color); 1969 -webkit-transition: all 0.3s ease-in; 1970 -moz-transition: all 0.3s ease-in; 1971 -o-transition: all 0.3s ease-in; 1972 transition: all 0.3s ease-in; 1973 font-size: 14px; 1974 } 1975 1976 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu li a:hover { 1977 background-color: var(--main-color-one); 1978 color: #fff; 1979 } 1980 1981 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu .menu-item-has-children { 1982 position: relative; 1983 z-index: 0; 1984 padding-right: 0px; 1985 } 1986 1987 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu .menu-item-has-children:before { 1988 position: absolute; 1989 right: 15px; 1990 top: 50%; 1991 content: '\f105'; 1992 font-family: 'fontawesome'; 1993 -ms-transform: translateY(-50%); 1994 /* IE 9 */ 1995 -webkit-transform: translateY(-50%); 1996 /* Chrome, Safari, Opera */ 1997 transform: translateY(-50%); 1998 } 1999 2000 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu .menu-item-has-children > .sub-menu { 2001 right: 100%; 2002 top: 20px; 2003 left: auto; 2004 } 2005 2006 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu .menu-item-has-children > .sub-menu .sub-menu .sub-menu { 2007 left: auto; 2008 right: 100%; 2009 } 2010 2011 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu .menu-item-has-children:hover > .sub-menu { 2012 visibility: visible; 2013 opacity: 1; 2014 } 2015 2016 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu .menu-item-has-children:hover > .sub-menu li:hover:before { 2017 color: #fff; 2018 } 2019 2020 .navbar-area .nav-container .navbar-collapse .navbar-nav li a { 2021 -webkit-transition: all 0.3s ease-in; 2022 -moz-transition: all 0.3s ease-in; 2023 -o-transition: all 0.3s ease-in; 2024 transition: all 0.3s ease-in; 2025 } 2026 2027 .navbar-area .nav-container .navbar-collapse .navbar-nav li a:hover { 2028 color: var(--main-color-one); 2029 } 2030 2031 .navbar-elementor-style-one-wrapper .navbar-area.navbar-default.navbar-absolute, 2032 .navbar-elementor-style-two-wrapper .navbar-area.navbar-default.navbar-absolute{ 2033 position: absolute; 2034 left: 0; 2035 top: 0; 2036 width: 100%; 2037 z-index: 9; 2038 } 2039 2040 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu li+li { 2041 margin-left: 0!important; 2042 } 2043 2044 @media only screen and (max-width: 991px) { 2045 .nav-right-content { 2046 display: none; 2047 } 2048 2049 .navbar-area .nav-container { 2050 position: relative; 2051 } 2052 2053 .navbar-area .nav-container .navbar-brand { 2054 display: block; 2055 } 2056 2057 .navbar-area .nav-container .navbar-brand .navbar-toggler { 2058 position: absolute; 2059 right: 0px; 2060 border: 1px solid #e2e2e2; 2061 } 2062 2063 .navbar-area .nav-container .navbar-collapse .navbar-nav { 2064 display: block; 2065 /*margin-top: 20px;*/ 2066 } 2067 2068 .navbar-area .nav-container .navbar-collapse .navbar-nav li { 2069 display: block; 2070 text-align: left; 2071 line-height: 30px; 2072 padding: 10px 0; 2073 border-bottom: 1px solid #e2e2e2; 2074 } 2075 2076 .navbar-area .nav-container .navbar-collapse .navbar-nav li:last-child { 2077 border-bottom: none; 2078 } 2079 2080 .navbar-area .nav-container .navbar-collapse .navbar-nav li + li { 2081 margin-left: 0 !important; 2082 } 2083 2084 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children:before { 2085 top: 25px; 2086 right: 20px; 2087 } 2088 2089 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children:hover { 2090 padding-bottom: 0; 2091 } 2092 2093 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children:hover > .sub-menu { 2094 visibility: visible; 2095 height: auto; 2096 opacity: 1; 2097 background-color: transparent; 2098 border-bottom: none; 2099 } 2100 2101 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children:hover > a { 2102 padding-bottom: 10px; 2103 display: inline-block; 2104 } 2105 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu { 2106 position: initial; 2107 display: block; 2108 width: 100%; 2109 border-top: none; 2110 -webkit-box-shadow: none; 2111 box-shadow: none; 2112 margin-left: 0; 2113 padding-bottom: 0; 2114 visibility: hidden; 2115 opacity: 0; 2116 height: 0; 2117 overflow: hidden; 2118 overflow-y: scroll; 2119 -webkit-transition: height 500ms; 2120 -moz-transition: height 500ms; 2121 -o-transition: height 500ms; 2122 transition: height 500ms; 2123 } 2124 2125 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu .sub-menu .menu-item-has-children:before { 2126 content: "\f107"; 2127 } 2128 2129 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu li { 2130 padding: 0; 2131 } 2132 2133 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu li.menu-item-has-children:hover:before { 2134 top: 25px; 2135 color: #fff; 2136 } 2137 2138 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu li + li { 2139 border-top: none; 2140 } 2141 2142 .navbar-area .nav-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu li:first-child { 2143 border-top: 1px solid #e2e2e2; 2144 } 2145 2146 .responsive-mobile-menu { 2147 display: block; 2148 width: 100%; 2149 position: relative; 2150 z-index: 0; 2151 } 2152 2153 .responsive-mobile-menu .navbar-toggler { 2154 float: right; 2155 margin-top: 10px; 2156 border: 1px solid #e2e2e2; 2157 } 2158 2159 .responsive-mobile-menu .logo-wrapper { 2160 display: inline-block; 2161 } 2162 2163 .navbar-area.navbar-style-transparent .navbar-collapse.collapse { 2164 background-color: #1f2732; 2165 } 2166 } 2167 2168 @media only screen and (max-width: 575px) { 2169 .responsive-mobile-menu { 2170 padding: 0 10px; 2171 } 2172 2173 .navbar-area.navbar-style-transparent .navbar-collapse.collapse { 2174 background-color: #1f2732; 2175 } 2176 2177 .navbar-area .navbar-collapse { 2178 padding: 0px 15px; 2179 } 2180 } 2181 2182 .navbar-area.navbar-default { 2183 background-color: #fbfbfb; 2184 } 2185 .navbar-area.nav-fixed.navbar-default { 2186 background-color: #fbfbfb; 2187 width: 100%; 2188 } 2189 .logo-wrapper img { 2190 max-width: 180px; 2191 } 2192 /*------------------------------ 2193 Header Area 2194 ------------------------------*/ 2195 .header-area { 2196 padding: 352px 0 252px 0; 2197 background-color: #fff; 2198 position: relative; 2199 } 2200 2201 .header-area .shape-1 { 2202 position: absolute; 2203 left: 10%; 2204 top: 15%; 2205 -webkit-animation: left2right 10s linear 0s infinite; 2206 animation: left2right 10s linear 0s infinite; 2207 opacity: .1; 2208 } 2209 2210 .header-area .shape-2 { 2211 position: absolute; 2212 right: 5%; 2213 top: 10%; 2214 -webkit-animation: upndown 10s linear 0s infinite; 2215 animation: upndown 10s linear 0s infinite; 2216 opacity: .3; 2217 } 2218 2219 .header-area .shape-3 { 2220 position: absolute; 2221 left: 50%; 2222 bottom: 30%; 2223 -webkit-animation: left2right 10s linear 0s infinite; 2224 animation: left2right 10s linear 0s infinite; 2225 opacity: .2; 2226 } 2227 2228 .header-area .header-right-image { 2229 position: absolute; 2230 bottom: 0px; 2231 right: 10%; 2232 } 2233 2234 .header-area.header-bg { 2235 background-color: #fff; 2236 background-position: top right; 2237 background-repeat: no-repeat; 2238 } 2239 2240 .header-area.header-bg-2 { 2241 background-color: #fff; 2242 background-position: top right; 2243 background-repeat: no-repeat; 2244 } 2245 2246 .header-area.header-bg-3 { 2247 background-color: #fff; 2248 background-position: center; 2249 background-size: cover; 2250 } 2251 2252 .header-area.header-bg-4 { 2253 background-color: #fff; 2254 background-position: center; 2255 background-size: cover; 2256 } 2257 2258 .header-area.header-bg-5 { 2259 background-color: #fff; 2260 background-position: center; 2261 background-size: cover; 2262 } 2263 2264 .header-area.header-bg-5.dark-bg { 2265 background-color: #10102D; 2266 } 2267 2268 .header-area.header-bg-6 { 2269 background-color: #fff; 2270 background-position: center; 2271 background-size: cover; 2272 } 2273 2274 .header-area.dark-home-1 { 2275 background-color: #fff; 2276 background-position: bottom; 2277 background-size: cover; 2278 background-color: #10102d; 2279 } 2280 2281 .header-area.dark-home-1 .shape-1 { 2282 position: absolute; 2283 left: 10%; 2284 top: 15%; 2285 -webkit-animation: upndown 10s linear 0s infinite; 2286 animation: upndown 10s linear 0s infinite; 2287 } 2288 2289 .header-area.dark-home-1 .shape-2 { 2290 position: absolute; 2291 right: 5%; 2292 top: 10%; 2293 -webkit-animation: upndown 10s linear 0s infinite; 2294 animation: upndown 10s linear 0s infinite; 2295 } 2296 2297 .header-area.dark-home-1 .shape-3 { 2298 position: absolute; 2299 left: 50%; 2300 bottom: 30%; 2301 -webkit-animation: left2right 10s linear 0s infinite; 2302 animation: left2right 10s linear 0s infinite; 2303 } 2304 2305 .header-area.dark-home-1 .shape-4 { 2306 position: absolute; 2307 left: 55%; 2308 top: 15%; 2309 -webkit-animation: roatate 10s linear 5s infinite; 2310 animation: roatate 10s linear 5s infinite; 2311 display: inline-block; 2312 } 2313 2314 .header-area.dark-home-1 .header-inner .title { 2315 color: #fff; 2316 } 2317 2318 .header-area.dark-home-1 .header-inner p { 2319 color: rgba(255, 255, 255, 0.8); 2320 } 2321 2322 .header-area.dark-home-2 { 2323 background-color: #fff; 2324 background-position: bottom; 2325 background-size: cover; 2326 background-color: #10102d; 2327 } 2328 2329 .header-area.dark-home-2 .shape-1 { 2330 position: absolute; 2331 left: 10%; 2332 top: 15%; 2333 -webkit-animation: upndown 10s linear 0s infinite; 2334 animation: upndown 10s linear 0s infinite; 2335 } 2336 2337 .header-area.dark-home-2 .shape-2 { 2338 position: absolute; 2339 right: 5%; 2340 top: 10%; 2341 -webkit-animation: upndown 10s linear 0s infinite; 2342 animation: upndown 10s linear 0s infinite; 2343 } 2344 2345 .header-area.dark-home-2 .shape-3 { 2346 position: absolute; 2347 left: 50%; 2348 bottom: 30%; 2349 -webkit-animation: left2right 10s linear 0s infinite; 2350 animation: left2right 10s linear 0s infinite; 2351 } 2352 2353 .header-area.dark-home-2 .shape-4 { 2354 position: absolute; 2355 left: 55%; 2356 top: 15%; 2357 -webkit-animation: roatate 10s linear 5s infinite; 2358 animation: roatate 10s linear 5s infinite; 2359 display: inline-block; 2360 } 2361 2362 .header-area.dark-home-2 .header-inner .title { 2363 color: #fff; 2364 } 2365 2366 .header-area.dark-home-2 .header-inner p { 2367 color: rgba(255, 255, 255, 0.8); 2368 } 2369 2370 .header-area.style-six .header-inner { 2371 text-align: center; 2372 } 2373 2374 .header-area.style-six .header-inner .video-play-btn { 2375 color: var(--main-color-one);; 2376 margin-bottom: 30px; 2377 } 2378 2379 .header-area.style-six .header-inner .title { 2380 color: #fff; 2381 } 2382 2383 .header-area.style-six .header-inner p { 2384 color: rgba(255, 255, 255, 0.8); 2385 margin: 0 auto; 2386 } 2387 2388 .header-area.style-five .header-inner { 2389 display: -webkit-box; 2390 display: -ms-flexbox; 2391 display: flex; 2392 -webkit-box-orient: vertical; 2393 -webkit-box-direction: normal; 2394 -ms-flex-direction: column; 2395 flex-direction: column; 2396 height: 100%; 2397 -webkit-box-pack: center; 2398 -ms-flex-pack: center; 2399 justify-content: center; 2400 } 2401 2402 .header-area.style-five .header-inner .title { 2403 color: #fff; 2404 } 2405 2406 .header-area.style-five .header-inner p { 2407 color: rgba(255, 255, 255, 0.8); 2408 } 2409 2410 .header-area.style-four .header-inner .title { 2411 color: #fff; 2412 } 2413 2414 .header-area.style-four .header-inner p { 2415 color: rgba(255, 255, 255, 0.8); 2416 } 2417 2418 .header-area.style-four .header-inner .free-trail-form { 2419 position: relative; 2420 z-index: 0; 2421 max-width: 500px; 2422 margin-top: 36px; 2423 } 2424 2425 .header-area.style-four .header-inner .free-trail-form .form-group .form-control { 2426 height: 60px; 2427 padding: 0 170px 0 20px; 2428 } 2429 2430 .header-area.style-four .header-inner .free-trail-form .submit-btn { 2431 position: absolute; 2432 top: 0; 2433 right: 0; 2434 background-color: var(--main-color-one); 2435 -webkit-transition: all 0.3s ease-in; 2436 -moz-transition: all 0.3s ease-in; 2437 -o-transition: all 0.3s ease-in; 2438 transition: all 0.3s ease-in; 2439 cursor: pointer; 2440 width: 150px; 2441 } 2442 2443 .header-area.style-four .header-inner .free-trail-form .submit-btn:hover { 2444 background-color: var(--main-color-one); 2445 } 2446 2447 .header-area.style-three .header-overlay-image { 2448 position: absolute; 2449 left: 0; 2450 bottom: -10px; 2451 width: 100%; 2452 -ms-transform: scale(1.05); 2453 /* IE 9 */ 2454 -webkit-transform: scale(1.05); 2455 /* Chrome, Safari, Opera */ 2456 transform: scale(1.05); 2457 } 2458 2459 .header-area.style-three .header-overlay-image .st1, .header-area.style-three .header-overlay-image .st0 { 2460 fill: #fff; 2461 } 2462 2463 .header-area.style-three .header-inner .title { 2464 color: #fff; 2465 } 2466 2467 .header-area.style-three .header-inner p { 2468 color: rgba(255, 255, 255, 0.8); 2469 } 2470 2471 .header-area.style-two .header-inner .title { 2472 color: #fff; 2473 } 2474 2475 .header-area.style-two .header-inner p { 2476 color: rgba(255, 255, 255, 0.8); 2477 } 2478 2479 .header-area .header-inner .title { 2480 font-size: 60px; 2481 font-weight: 600; 2482 line-height: 70px; 2483 color: var(--heading-color); 2484 margin-bottom: 22px; 2485 } 2486 2487 .header-area .header-inner p { 2488 font-size: 18px; 2489 line-height: 28px; 2490 color: var(--paragraph-color); 2491 max-width: 520px; 2492 } 2493 2494 .header-form-area .header-form-inner { 2495 background-color: #fff; 2496 padding: 40px 30px 50px 40px; 2497 border-radius: 5px; 2498 border: 1px solid #e2e2e2; 2499 } 2500 2501 .header-form-area .header-form-inner .title { 2502 font-size: 30px; 2503 line-height: 40px; 2504 color: var(--heading-color); 2505 margin-bottom: 25px; 2506 } 2507 2508 .get-quote-form .form-group.textarea .form-control { 2509 min-height: 140px; 2510 resize: none; 2511 } 2512 2513 .get-quote-form .form-group.textarea .form-control:focus { 2514 -webkit-box-shadow: none; 2515 box-shadow: none; 2516 } 2517 2518 .get-quote-form .form-group .form-control { 2519 height: 50px; 2520 border: 1px solid #e3e3e3; 2521 } 2522 2523 .get-quote-form .submit-btn { 2524 font-size: 16px; 2525 font-weight: 600; 2526 border-radius: 3px; 2527 background-image: -moz-linear-gradient(0deg, #5e2ced 0%, #9749f8 100%); 2528 background-image: -webkit-linear-gradient(0deg, #5e2ced 0%, #9749f8 100%); 2529 background-image: -ms-linear-gradient(0deg, #5e2ced 0%, #9749f8 100%); 2530 } 2531 2532 .get-quote-form .submit-btn:hover { 2533 -webkit-box-shadow: 0px 3px 20px 0px rgba(13, 21, 75, 0.3); 2534 box-shadow: 0px 3px 20px 0px rgba(13, 21, 75, 0.3); 2535 } 2536 2537 @-webkit-keyframes upndown { 2538 0% { 2539 -ms-transform: translateY(0px); 2540 /* IE 9 */ 2541 -webkit-transform: translateY(0px); 2542 /* Chrome, Safari, Opera */ 2543 transform: translateY(0px); 2544 } 2545 50% { 2546 -ms-transform: translateY(100px); 2547 /* IE 9 */ 2548 -webkit-transform: translateY(100px); 2549 /* Chrome, Safari, Opera */ 2550 transform: translateY(100px); 2551 } 2552 100% { 2553 -ms-transform: translateY(0px); 2554 /* IE 9 */ 2555 -webkit-transform: translateY(0px); 2556 /* Chrome, Safari, Opera */ 2557 transform: translateY(0px); 2558 } 2559 } 2560 2561 @-moz-keyframes upndown { 2562 0% { 2563 -ms-transform: translateY(0px); 2564 /* IE 9 */ 2565 -webkit-transform: translateY(0px); 2566 /* Chrome, Safari, Opera */ 2567 transform: translateY(0px); 2568 } 2569 50% { 2570 -ms-transform: translateY(100px); 2571 /* IE 9 */ 2572 -webkit-transform: translateY(100px); 2573 /* Chrome, Safari, Opera */ 2574 transform: translateY(100px); 2575 } 2576 100% { 2577 -ms-transform: translateY(0px); 2578 /* IE 9 */ 2579 -webkit-transform: translateY(0px); 2580 /* Chrome, Safari, Opera */ 2581 transform: translateY(0px); 2582 } 2583 } 2584 2585 @-o-keyframes upndown { 2586 0% { 2587 -ms-transform: translateY(0px); 2588 /* IE 9 */ 2589 -webkit-transform: translateY(0px); 2590 /* Chrome, Safari, Opera */ 2591 transform: translateY(0px); 2592 } 2593 50% { 2594 -ms-transform: translateY(100px); 2595 /* IE 9 */ 2596 -webkit-transform: translateY(100px); 2597 /* Chrome, Safari, Opera */ 2598 transform: translateY(100px); 2599 } 2600 100% { 2601 -ms-transform: translateY(0px); 2602 /* IE 9 */ 2603 -webkit-transform: translateY(0px); 2604 /* Chrome, Safari, Opera */ 2605 transform: translateY(0px); 2606 } 2607 } 2608 2609 @keyframes upndown { 2610 0% { 2611 -ms-transform: translateY(0px); 2612 /* IE 9 */ 2613 -webkit-transform: translateY(0px); 2614 /* Chrome, Safari, Opera */ 2615 transform: translateY(0px); 2616 } 2617 50% { 2618 -ms-transform: translateY(100px); 2619 /* IE 9 */ 2620 -webkit-transform: translateY(100px); 2621 /* Chrome, Safari, Opera */ 2622 transform: translateY(100px); 2623 } 2624 100% { 2625 -ms-transform: translateY(0px); 2626 /* IE 9 */ 2627 -webkit-transform: translateY(0px); 2628 /* Chrome, Safari, Opera */ 2629 transform: translateY(0px); 2630 } 2631 } 2632 2633 @-webkit-keyframes left2right { 2634 0% { 2635 -ms-transform: translateX(0px); 2636 /* IE 9 */ 2637 -webkit-transform: translateX(0px); 2638 /* Chrome, Safari, Opera */ 2639 transform: translateX(0px); 2640 } 2641 50% { 2642 -ms-transform: translateX(100px); 2643 /* IE 9 */ 2644 -webkit-transform: translateX(100px); 2645 /* Chrome, Safari, Opera */ 2646 transform: translateX(100px); 2647 } 2648 100% { 2649 -ms-transform: translateX(0px); 2650 /* IE 9 */ 2651 -webkit-transform: translateX(0px); 2652 /* Chrome, Safari, Opera */ 2653 transform: translateX(0px); 2654 } 2655 } 2656 2657 @-moz-keyframes left2right { 2658 0% { 2659 -ms-transform: translateX(0px); 2660 /* IE 9 */ 2661 -webkit-transform: translateX(0px); 2662 /* Chrome, Safari, Opera */ 2663 transform: translateX(0px); 2664 } 2665 50% { 2666 -ms-transform: translateX(100px); 2667 /* IE 9 */ 2668 -webkit-transform: translateX(100px); 2669 /* Chrome, Safari, Opera */ 2670 transform: translateX(100px); 2671 } 2672 100% { 2673 -ms-transform: translateX(0px); 2674 /* IE 9 */ 2675 -webkit-transform: translateX(0px); 2676 /* Chrome, Safari, Opera */ 2677 transform: translateX(0px); 2678 } 2679 } 2680 2681 @-o-keyframes left2right { 2682 0% { 2683 -ms-transform: translateX(0px); 2684 /* IE 9 */ 2685 -webkit-transform: translateX(0px); 2686 /* Chrome, Safari, Opera */ 2687 transform: translateX(0px); 2688 } 2689 50% { 2690 -ms-transform: translateX(100px); 2691 /* IE 9 */ 2692 -webkit-transform: translateX(100px); 2693 /* Chrome, Safari, Opera */ 2694 transform: translateX(100px); 2695 } 2696 100% { 2697 -ms-transform: translateX(0px); 2698 /* IE 9 */ 2699 -webkit-transform: translateX(0px); 2700 /* Chrome, Safari, Opera */ 2701 transform: translateX(0px); 2702 } 2703 } 2704 2705 @keyframes left2right { 2706 0% { 2707 -ms-transform: translateX(0px); 2708 /* IE 9 */ 2709 -webkit-transform: translateX(0px); 2710 /* Chrome, Safari, Opera */ 2711 transform: translateX(0px); 2712 } 2713 50% { 2714 -ms-transform: translateX(100px); 2715 /* IE 9 */ 2716 -webkit-transform: translateX(100px); 2717 /* Chrome, Safari, Opera */ 2718 transform: translateX(100px); 2719 } 2720 100% { 2721 -ms-transform: translateX(0px); 2722 /* IE 9 */ 2723 -webkit-transform: translateX(0px); 2724 /* Chrome, Safari, Opera */ 2725 transform: translateX(0px); 2726 } 2727 } 2728 2729 @-webkit-keyframes roatate { 2730 0% { 2731 -ms-transform: rotate(90deg); 2732 /* IE 9 */ 2733 -webkit-transform: rotate(90deg); 2734 /* Chrome, Safari, Opera */ 2735 transform: rotate(90deg); 2736 opacity: 0.3; 2737 } 2738 25% { 2739 opacity: 0.6; 2740 -ms-transform: rotate(180deg); 2741 /* IE 9 */ 2742 -webkit-transform: rotate(180deg); 2743 /* Chrome, Safari, Opera */ 2744 transform: rotate(180deg); 2745 } 2746 50% { 2747 -ms-transform: rotate(-90deg); 2748 /* IE 9 */ 2749 -webkit-transform: rotate(-90deg); 2750 /* Chrome, Safari, Opera */ 2751 transform: rotate(-90deg); 2752 opacity: 0.8; 2753 } 2754 75% { 2755 -ms-transform: rotate(-180deg); 2756 /* IE 9 */ 2757 -webkit-transform: rotate(-180deg); 2758 /* Chrome, Safari, Opera */ 2759 transform: rotate(-180deg); 2760 opacity: 0.6; 2761 } 2762 100% { 2763 -ms-transform: rotate(-90deg); 2764 /* IE 9 */ 2765 -webkit-transform: rotate(-90deg); 2766 /* Chrome, Safari, Opera */ 2767 transform: rotate(-90deg); 2768 opacity: 0.3; 2769 } 2770 } 2771 2772 @-moz-keyframes roatate { 2773 0% { 2774 -ms-transform: rotate(90deg); 2775 /* IE 9 */ 2776 -webkit-transform: rotate(90deg); 2777 /* Chrome, Safari, Opera */ 2778 transform: rotate(90deg); 2779 opacity: 0.3; 2780 } 2781 25% { 2782 opacity: 0.6; 2783 -ms-transform: rotate(180deg); 2784 /* IE 9 */ 2785 -webkit-transform: rotate(180deg); 2786 /* Chrome, Safari, Opera */ 2787 transform: rotate(180deg); 2788 } 2789 50% { 2790 -ms-transform: rotate(-90deg); 2791 /* IE 9 */ 2792 -webkit-transform: rotate(-90deg); 2793 /* Chrome, Safari, Opera */ 2794 transform: rotate(-90deg); 2795 opacity: 0.8; 2796 } 2797 75% { 2798 -ms-transform: rotate(-180deg); 2799 /* IE 9 */ 2800 -webkit-transform: rotate(-180deg); 2801 /* Chrome, Safari, Opera */ 2802 transform: rotate(-180deg); 2803 opacity: 0.6; 2804 } 2805 100% { 2806 -ms-transform: rotate(-90deg); 2807 /* IE 9 */ 2808 -webkit-transform: rotate(-90deg); 2809 /* Chrome, Safari, Opera */ 2810 transform: rotate(-90deg); 2811 opacity: 0.3; 2812 } 2813 } 2814 2815 @-o-keyframes roatate { 2816 0% { 2817 -ms-transform: rotate(90deg); 2818 /* IE 9 */ 2819 -webkit-transform: rotate(90deg); 2820 /* Chrome, Safari, Opera */ 2821 transform: rotate(90deg); 2822 opacity: 0.3; 2823 } 2824 25% { 2825 opacity: 0.6; 2826 -ms-transform: rotate(180deg); 2827 /* IE 9 */ 2828 -webkit-transform: rotate(180deg); 2829 /* Chrome, Safari, Opera */ 2830 transform: rotate(180deg); 2831 } 2832 50% { 2833 -ms-transform: rotate(-90deg); 2834 /* IE 9 */ 2835 -webkit-transform: rotate(-90deg); 2836 /* Chrome, Safari, Opera */ 2837 transform: rotate(-90deg); 2838 opacity: 0.8; 2839 } 2840 75% { 2841 -ms-transform: rotate(-180deg); 2842 /* IE 9 */ 2843 -webkit-transform: rotate(-180deg); 2844 /* Chrome, Safari, Opera */ 2845 transform: rotate(-180deg); 2846 opacity: 0.6; 2847 } 2848 100% { 2849 -ms-transform: rotate(-90deg); 2850 /* IE 9 */ 2851 -webkit-transform: rotate(-90deg); 2852 /* Chrome, Safari, Opera */ 2853 transform: rotate(-90deg); 2854 opacity: 0.3; 2855 } 2856 } 2857 2858 @keyframes roatate { 2859 0% { 2860 -ms-transform: rotate(90deg); 2861 /* IE 9 */ 2862 -webkit-transform: rotate(90deg); 2863 /* Chrome, Safari, Opera */ 2864 transform: rotate(90deg); 2865 opacity: 0.3; 2866 } 2867 25% { 2868 opacity: 0.6; 2869 -ms-transform: rotate(180deg); 2870 /* IE 9 */ 2871 -webkit-transform: rotate(180deg); 2872 /* Chrome, Safari, Opera */ 2873 transform: rotate(180deg); 2874 } 2875 50% { 2876 -ms-transform: rotate(-90deg); 2877 /* IE 9 */ 2878 -webkit-transform: rotate(-90deg); 2879 /* Chrome, Safari, Opera */ 2880 transform: rotate(-90deg); 2881 opacity: 0.8; 2882 } 2883 75% { 2884 -ms-transform: rotate(-180deg); 2885 /* IE 9 */ 2886 -webkit-transform: rotate(-180deg); 2887 /* Chrome, Safari, Opera */ 2888 transform: rotate(-180deg); 2889 opacity: 0.6; 2890 } 2891 100% { 2892 -ms-transform: rotate(-90deg); 2893 /* IE 9 */ 2894 -webkit-transform: rotate(-90deg); 2895 /* Chrome, Safari, Opera */ 2896 transform: rotate(-90deg); 2897 opacity: 0.3; 2898 } 2899 } 2900 .btn-wrapper .boxed-btn + .boxed-btn{ 2901 margin-left: 20px; 2902 } 2903 2904 .btn-wrapper .boxed-btn { 2905 margin: 0 10px; 2906 border: none; 2907 width: 165px; 2908 height: 60px; 2909 line-height: 55px; 2910 position: relative; 2911 z-index: 1; 2912 overflow: hidden; 2913 font-size: 16px; 2914 font-weight: 600; 2915 border: 2px solid #fff; 2916 background-image: -moz-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 2917 background-image: -webkit-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 2918 background-image: -ms-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 2919 -webkit-box-shadow: 0px 3px 20px 0px rgba(13, 21, 75, 0.3); 2920 box-shadow: 0px 3px 20px 0px rgba(13, 21, 75, 0.3); 2921 -webkit-transition: all 0.3s ease-in; 2922 -moz-transition: all 0.3s ease-in; 2923 -o-transition: all 0.3s ease-in; 2924 transition: all 0.3s ease-in; 2925 text-transform: capitalize; 2926 } 2927 2928 .btn-wrapper .boxed-btn.blank { 2929 background-color: #fff; 2930 color: #252a32; 2931 border: 2px solid var(--main-color-one); 2932 background-image: -moz-linear-gradient(0deg, transparent 0%, transparent 100%); 2933 background-image: -webkit-linear-gradient(0deg, transparent 0%, transparent 100%); 2934 background-image: -ms-linear-gradient(0deg, transparent 0%, transparent 100%); 2935 -webkit-transition: all 0.3s ease-in; 2936 -moz-transition: all 0.3s ease-in; 2937 -o-transition: all 0.3s ease-in; 2938 transition: all 0.3s ease-in; 2939 } 2940 2941 .btn-wrapper .boxed-btn.blank img { 2942 margin-right: 3px; 2943 } 2944 2945 .btn-wrapper .boxed-btn.blank:hover { 2946 background-image: -moz-linear-gradient(0deg, #5e2ced 0%, #9749f8 100%); 2947 background-image: -webkit-linear-gradient(0deg, #5e2ced 0%, #9749f8 100%); 2948 background-image: -ms-linear-gradient(0deg, #5e2ced 0%, #9749f8 100%); 2949 border-color: #fff; 2950 color: #fff; 2951 } 2952 2953 .btn-wrapper .boxed-btn:hover { 2954 background-image: -moz-linear-gradient(0deg, transparent 0%, transparent 100%); 2955 background-image: -webkit-linear-gradient(0deg, transparent 0%, transparent 100%); 2956 background-image: -ms-linear-gradient(0deg, transparent 0%, transparent 100%); 2957 background-color: #fff; 2958 color: #505b6d; 2959 } 2960 2961 /*------------------------ 2962 Featured Area 2963 ------------------------*/ 2964 2965 .about-us-area .shape-1 { 2966 position: absolute; 2967 right: 10%; 2968 bottom: 10%; 2969 -webkit-animation: upndown 10s linear 0s infinite; 2970 animation: upndown 10s linear 0s infinite; 2971 } 2972 2973 .about-us-area .shape-2 { 2974 position: absolute; 2975 left: 10%; 2976 top: 15%; 2977 -webkit-animation: roatate 10s linear 5s infinite; 2978 animation: roatate 10s linear 5s infinite; 2979 display: inline-block; 2980 } 2981 2982 .about-us-area .btn-wrapper { 2983 text-align: center; 2984 margin-top: 60px; 2985 } 2986 2987 .about-us-area .btn-wrapper .boxed-btn { 2988 margin: 0 10px; 2989 } 2990 2991 .about-us-area.style-two .section-title { 2992 padding-right: 100px; 2993 } 2994 2995 .about-us-area.style-two .feature-list { 2996 -ms-flex-wrap: wrap; 2997 flex-wrap: wrap; 2998 border: none; 2999 } 3000 3001 .about-us-area.style-two .feature-list .single-feature-list { 3002 margin-bottom: 20px; 3003 width: 50%; 3004 border: none; 3005 padding: 0 20px; 3006 text-align: left; 3007 } 3008 3009 .about-us-area.style-two .feature-list .single-feature-list .icon { 3010 text-align: center; 3011 } 3012 3013 .feature-list { 3014 margin: 0; 3015 padding: 0; 3016 list-style: none; 3017 display: -webkit-box; 3018 display: -ms-flexbox; 3019 display: flex; 3020 -ms-flex-wrap: nowrap; 3021 flex-wrap: nowrap; 3022 } 3023 3024 .feature-list.white { 3025 border-color: rgba(255, 255, 255, 0.2); 3026 } 3027 3028 .single-feature-list:last-child { 3029 border-right: none; 3030 } 3031 .single-feature-list.white{ 3032 background-color: transparent; 3033 } 3034 .single-feature-list { 3035 display: block; 3036 text-align: center; 3037 padding: 60px 20px 40px 20px; 3038 background-color: #fff; 3039 } 3040 3041 .single-feature-list.white { 3042 border-right: 2px solid rgba(255, 255, 255, 0.2); 3043 } 3044 3045 .single-feature-list.white .content .title { 3046 color: #fff; 3047 } 3048 3049 .single-feature-list.white .content p { 3050 color: rgba(255, 255, 255, 0.7); 3051 } 3052 .feature-list.style-03 .single-feature-list:nth-child(even) { 3053 background-color: #f0e4f7; 3054 } 3055 3056 .feature-list.style-03 .single-feature-list:nth-child(odd) { 3057 background-color: #e8f2f9; 3058 } 3059 .single-feature-list:hover .icon { 3060 -ms-transform: rotateY(360deg); 3061 /* IE 9 */ 3062 -webkit-transform: rotateY(360deg); 3063 /* Chrome, Safari, Opera */ 3064 transform: rotateY(360deg); 3065 } 3066 3067 .single-feature-list .icon { 3068 font-size: 40px; 3069 display: inline-block; 3070 margin: 0 auto; 3071 width: 100px; 3072 height: 100px; 3073 line-height: 100px; 3074 color: #fff; 3075 margin-bottom: 15px; 3076 -webkit-transition: all 0.3s ease-in; 3077 -moz-transition: all 0.3s ease-in; 3078 -o-transition: all 0.3s ease-in; 3079 transition: all 0.3s ease-in; 3080 } 3081 3082 .single-feature-list .icon.icon-bg-1 { 3083 background-image: url(../img/icon-bg/01.png); 3084 background-repeat: no-repeat; 3085 } 3086 3087 .single-feature-list .icon.icon-bg-2 { 3088 background-image: url(../img/icon-bg/02.png); 3089 background-repeat: no-repeat; 3090 } 3091 3092 .single-feature-list .icon.icon-bg-3 { 3093 background-image: url(../img/icon-bg/03.png); 3094 background-repeat: no-repeat; 3095 } 3096 3097 .single-feature-list .icon.icon-bg-4 { 3098 background-image: url(../img/icon-bg/04.png); 3099 background-repeat: no-repeat; 3100 } 3101 3102 .single-feature-list .content .title { 3103 font-size: 20px; 3104 line-height: 32px; 3105 font-weight: 600; 3106 margin-bottom: 15px; 3107 } 3108 3109 .single-feature-list .content .title a { 3110 color: var(--heading-color); 3111 -webkit-transition: all 0.3s ease-in; 3112 -moz-transition: all 0.3s ease-in; 3113 -o-transition: all 0.3s ease-in; 3114 transition: all 0.3s ease-in; 3115 } 3116 3117 .single-feature-list .content .title a:hover { 3118 color: var(--main-color-one); 3119 } 3120 .feature-list.appside_feature_box_one { 3121 border: 2px solid #e2e2e2; 3122 } 3123 .feature-list.appside_feature_box_one.white { 3124 border: 2px solid rgba(255, 255, 255, 0.2); 3125 } 3126 .feature-list.appside_feature_box_one.white .single-feature-list.white{ 3127 background-color: transparent; 3128 } 3129 .feature-list.appside_feature_box_one.white .single-feature-list.white .content .title{ 3130 color: #fff; 3131 } 3132 3133 .feature-list.appside_feature_box_one .single-feature-list { 3134 border-right: 2px solid #e2e2e2; 3135 } 3136 3137 .feature-list.appside_feature_box_one .single-feature-list:last-child { 3138 border-right: 0px; 3139 } 3140 .feature-list.appside_feature_box_one.white .single-feature-list.white{ 3141 border-right: 2px solid rgba(255, 255, 255, 0.2); 3142 } 3143 /*------------------------ 3144 Icon box 3145 -------------------------*/ 3146 .single-icon-box-03:hover { 3147 -webkit-transform: translateY(-5px); 3148 -ms-transform: translateY(-5px); 3149 transform: translateY(-5px); 3150 background: #fff; 3151 -webkit-box-shadow: 0 10px 50px 5px rgba(89, 69, 230, 0.1); 3152 box-shadow: 0 10px 50px 5px rgba(89, 69, 230, 0.1); 3153 } 3154 3155 .single-icon-box-03 .content p { 3156 margin-bottom: 0; 3157 } 3158 .single-icon-box-03 { 3159 display: -webkit-box; 3160 display: -ms-flexbox; 3161 display: flex; 3162 -ms-flex-item-align: start; 3163 align-self: flex-start; 3164 transition: all 500ms; 3165 padding: 20px 30px; 3166 } 3167 3168 .single-icon-box-03.theme-01 .icon { 3169 color: #e81273; 3170 } 3171 3172 .single-icon-box-03.theme-01 .icon { 3173 color: #7142f8; 3174 } 3175 3176 .single-icon-box-03 .content .title { 3177 font-size: 20px; 3178 line-height: 30px; 3179 font-weight: 600; 3180 } 3181 .single-icon-box-03.theme-02 .icon { 3182 color: #f38650; 3183 } 3184 3185 3186 .single-icon-box-03.theme-03 .icon { 3187 color: #ecbf24; 3188 } 3189 3190 3191 .single-icon-box-03.theme-04 .icon { 3192 color: #f9556d; 3193 } 3194 3195 .single-icon-box-03 .icon { 3196 margin-right: 20px; 3197 width: 100px; 3198 height: 100px; 3199 border-radius: 5px; 3200 line-height: 100px; 3201 text-align: center; 3202 font-size: 30px; 3203 color: var(--main-color-one); 3204 -webkit-transition: all 500ms; 3205 -o-transition: all 500ms; 3206 transition: all 500ms; 3207 border-radius: 50%; 3208 border: 2px solid #f5f5f5; 3209 } 3210 3211 .single-icon-box-03 .content { 3212 -webkit-box-flex: 1; 3213 -ms-flex: 1; 3214 flex: 1; 3215 margin-top: -5px; 3216 } 3217 .icon-box-list { 3218 margin: 0; 3219 padding: 0; 3220 list-style: none; 3221 display: flex; 3222 } 3223 3224 .icon-box-list li { 3225 display: flex; 3226 align-self: flex-start; 3227 } 3228 .icon-box-list li +li{ 3229 margin-left: 20px; 3230 } 3231 3232 .icon-box-list li .icon { 3233 margin-right: 10px; 3234 font-size: 35px; 3235 line-height: 40px; 3236 color: #c1c3c6; 3237 } 3238 3239 .icon-box-list li .content .title { 3240 font-size: 16px; 3241 line-height: 20px; 3242 font-weight: 600; 3243 } 3244 .single-discover-item { 3245 text-align: center; 3246 } 3247 3248 .single-discover-item .icon { 3249 font-size: 60px; 3250 line-height: 70px; 3251 margin-bottom: 12px; 3252 color: var(--main-color-one); 3253 } 3254 3255 .single-discover-item .content .title { 3256 font-size: 20px; 3257 line-height: 30px; 3258 font-weight: 600; 3259 margin-bottom: 15px; 3260 } 3261 3262 .single-connect-you-item { 3263 background-image: -moz-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3264 background-image: -webkit-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3265 background-image: -ms-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3266 padding: 40px 30px; 3267 border-radius: 10px; 3268 text-align: center; 3269 } 3270 3271 .single-connect-you-item.theme-02 { 3272 background-image: -moz-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 3273 background-image: -webkit-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 3274 background-image: -ms-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 3275 } 3276 3277 .single-connect-you-item.theme-03 { 3278 background-image: -moz-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3279 background-image: -webkit-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3280 background-image: -ms-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3281 } 3282 3283 .single-connect-you-item .icon { 3284 font-size: 60px; 3285 line-height: 70px; 3286 color: #fff; 3287 margin-bottom: 16px; 3288 } 3289 3290 .single-connect-you-item .content .title { 3291 font-size: 22px; 3292 line-height: 34px; 3293 font-weight: 600; 3294 color: #fff; 3295 } 3296 3297 .single-connect-you-item .content p { 3298 color: rgba(255, 255, 255, 0.9); 3299 margin-bottom: 0px; 3300 } 3301 3302 .single-feature-item-02 { 3303 background-color: #fff; 3304 position: relative; 3305 z-index: 0; 3306 overflow: hidden; 3307 padding: 70px 30px 50px 30px; 3308 text-align: center; 3309 -webkit-transition: 500ms all; 3310 -o-transition: 500ms all; 3311 transition: 500ms all; 3312 -webkit-box-shadow: 0px 0px 95px 0px rgba(0, 0, 0, 0.07); 3313 box-shadow: 0px 0px 95px 0px rgba(0, 0, 0, 0.07); 3314 } 3315 3316 .single-feature-item-02 .icon { 3317 position: relative; 3318 z-index: 0; 3319 font-size: 36px; 3320 line-height: 46px; 3321 color: #fff; 3322 margin-bottom: 40px; 3323 } 3324 3325 .single-feature-item-02 .icon:after { 3326 position: absolute; 3327 left: 50%; 3328 top: 5px; 3329 width: 70px; 3330 height: 90px; 3331 border-radius: 40px; 3332 content: ''; 3333 -ms-transform: rotate(40deg) translateX(-60%); 3334 /* IE 9 */ 3335 -webkit-transform: rotate(40deg) translateX(-60%); 3336 /* Chrome, Safari, Opera */ 3337 transform: rotate(40deg) translateX(-60%); 3338 z-index: -1; 3339 } 3340 3341 .single-feature-item-02 .icon.icon-bg-1 { 3342 background-image: unset; 3343 } 3344 3345 .single-feature-item-02 .icon.icon-bg-1:after { 3346 background-image: -moz-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3347 background-image: -webkit-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3348 background-image: -ms-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3349 } 3350 3351 .single-feature-item-02 .icon.icon-bg-2 { 3352 background-image: unset; 3353 } 3354 3355 .single-feature-item-02 .icon.icon-bg-2:after { 3356 background-image: -moz-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3357 background-image: -webkit-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3358 background-image: -ms-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3359 } 3360 3361 .single-feature-item-02 .icon.icon-bg-3 { 3362 background-image: unset; 3363 } 3364 3365 .single-feature-item-02 .icon.icon-bg-3:after { 3366 background-image: -moz-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 3367 background-image: -webkit-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 3368 background-image: -ms-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 3369 } 3370 3371 .single-feature-item-02 .icon.icon-bg-4 { 3372 background-image: unset; 3373 } 3374 3375 .single-feature-item-02 .icon.icon-bg-4:after { 3376 background-image: -moz-linear-gradient(90deg, #ec6c7f 0%, #fa9f69 100%); 3377 background-image: -webkit-linear-gradient(90deg, #ec6c7f 0%, #fa9f69 100%); 3378 background-image: -ms-linear-gradient(90deg, #ec6c7f 0%, #fa9f69 100%); 3379 } 3380 3381 .single-feature-item-02:hover { 3382 -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.07); 3383 box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.07); 3384 } 3385 3386 .single-feature-item-02 .content .title { 3387 font-size: 20px; 3388 line-height: 34px; 3389 font-weight: 600; 3390 } 3391 3392 .feature-list-04 .single-feature-list-item-04 { 3393 padding: 30px 30px; 3394 -webkit-box-shadow: 0px 0px 95px 0px rgba(0, 0, 0, 0.07); 3395 box-shadow: 0px 0px 95px 0px rgba(0, 0, 0, 0.07); 3396 display: -webkit-box; 3397 display: -ms-flexbox; 3398 display: flex; 3399 -ms-flex-item-align: start; 3400 align-self: flex-start; 3401 -webkit-transition: all 500ms; 3402 -o-transition: all 500ms; 3403 transition: all 500ms; 3404 } 3405 3406 .feature-list-04 .single-feature-list-item-04 + .single-feature-list-item-04 { 3407 margin-top: 30px; 3408 } 3409 3410 .feature-list-04 .single-feature-list-item-04:hover { 3411 -webkit-box-shadow: 0px 0px 155px 0px rgba(0, 0, 0, 0.2); 3412 box-shadow: 0px 0px 155px 0px rgba(0, 0, 0, 0.2); 3413 } 3414 3415 .feature-list-04 .single-feature-list-item-04.theme-01 .icon { 3416 color: #e81273; 3417 } 3418 3419 .feature-list-04 .single-feature-list-item-04.theme-02 .icon { 3420 color: #3ceb9e; 3421 } 3422 3423 .feature-list-04 .single-feature-list-item-04.theme-03 .icon { 3424 color: #f99c6a; 3425 } 3426 3427 .feature-list-04 .single-feature-list-item-04 .icon { 3428 font-size: 40px; 3429 line-height: 50px; 3430 margin-right: 20px; 3431 -webkit-transition: all 500ms; 3432 -o-transition: all 500ms; 3433 transition: all 500ms; 3434 } 3435 3436 .feature-list-04 .single-feature-list-item-04 .content { 3437 -webkit-box-flex: 1; 3438 -ms-flex: 1; 3439 flex: 1; 3440 } 3441 3442 .feature-list-04 .single-feature-list-item-04 .content p { 3443 margin-bottom: 0px; 3444 } 3445 3446 .feature-list-04 { 3447 padding: 0px; 3448 margin: 0px; 3449 } 3450 .feature-list-04 .single-feature-list-item-04 .content .title { 3451 font-size: 20px; 3452 font-weight: 600; 3453 } 3454 /*------------------------ 3455 Video Area 3456 -------------------------*/ 3457 .img-with-video { 3458 display: inline-block; 3459 } 3460 3461 .img-with-video .img-wrap { 3462 position: relative; 3463 z-index: 0; 3464 } 3465 3466 .img-with-video .img-wrap .hover { 3467 position: absolute; 3468 left: 0; 3469 top: 0; 3470 background-color: rgba(98, 46, 238, 0.6); 3471 width: 100%; 3472 height: 100%; 3473 display: -webkit-box; 3474 display: -ms-flexbox; 3475 display: flex; 3476 -webkit-box-pack: center; 3477 -ms-flex-pack: center; 3478 justify-content: center; 3479 -webkit-box-align: center; 3480 -ms-flex-align: center; 3481 align-items: center; 3482 } 3483 3484 .img-with-video .img-wrap .hover .video-play-btn { 3485 color: var(--main-color-one); 3486 width: 100px; 3487 height: 100px; 3488 line-height: 100px; 3489 } 3490 3491 .img-with-video .img-wrap .hover .video-play-btn:before { 3492 width: 120px; 3493 height: 120px; 3494 } 3495 3496 .video-area.white .right-content-area .title { 3497 color: #fff; 3498 } 3499 3500 .video-area.white .right-content-area .subtitle { 3501 color: rgba(255, 255, 255, 0.8); 3502 } 3503 3504 .video-area.white .right-content-area p { 3505 color: rgba(255, 255, 255, 0.6); 3506 } 3507 3508 .video-area.style-two { 3509 position: relative; 3510 z-index: 0; 3511 } 3512 3513 .video-area.style-two:after { 3514 position: absolute; 3515 left: 0; 3516 top: 0; 3517 content: ''; 3518 z-index: -1; 3519 width: 100%; 3520 height: 100%; 3521 } 3522 3523 .video-area .right-content-area { 3524 margin-top: 45px; 3525 } 3526 3527 .video-area .right-content-area .title { 3528 font-size: 48px; 3529 line-height: 58px; 3530 margin-bottom: 20px; 3531 font-weight: 700; 3532 color: var(--heading-color); 3533 } 3534 3535 .video-area .right-content-area .subtitle { 3536 font-size: 20px; 3537 line-height: 30px; 3538 color: var(--main-color-one); 3539 text-transform: uppercase; 3540 font-weight: 600; 3541 font-family: var(--heading-font); 3542 display: block; 3543 margin-bottom: 10px; 3544 } 3545 3546 .img-full-width-video { 3547 position: relative; 3548 z-index: 0; 3549 } 3550 3551 .img-full-width-video img { 3552 border-radius: 10px; 3553 } 3554 3555 .img-full-width-video .hover { 3556 position: absolute; 3557 right: 15%; 3558 top: 50%; 3559 -ms-transform: translateY(-50%); 3560 /* IE 9 */ 3561 -webkit-transform: translateY(-50%); 3562 /* Chrome, Safari, Opera */ 3563 transform: translateY(-50%); 3564 } 3565 3566 .img-full-width-video .hover .play-video-btn { 3567 display: inline-block; 3568 padding: 15px 40px; 3569 border-radius: 5px; 3570 background-image: -moz-linear-gradient(176deg, #0250c5 0%, #d43f8d 100%); 3571 background-image: -webkit-linear-gradient(176deg, #0250c5 0%, #d43f8d 100%); 3572 background-image: -ms-linear-gradient(176deg, #0250c5 0%, #d43f8d 100%); 3573 color: #fff; 3574 font-weight: 600; 3575 } 3576 3577 .video-play-width-image { 3578 position: relative; 3579 z-index: 0; 3580 z-index: 2; 3581 } 3582 3583 .video-play-width-image img { 3584 border-radius: 5px !important; 3585 } 3586 3587 .video-play-width-image .hover { 3588 position: absolute; 3589 left: 50%; 3590 top: 50%; 3591 -ms-transform: translate(-50%, -50%); 3592 /* IE 9 */ 3593 -webkit-transform: translate(-50%, -50%); 3594 /* Chrome, Safari, Opera */ 3595 transform: translate(-50%, -50%); 3596 } 3597 3598 .video-play-width-image .hover .video-play-btn { 3599 background-color: var(--main-color-one); 3600 color: #fff; 3601 } 3602 3603 .video-play-width-image .hover .video-play-btn:before { 3604 background-color: var(--main-color-one); 3605 } 3606 3607 /*---------------------- 3608 Counterup Area 3609 -----------------------*/ 3610 .counterup-area { 3611 padding: 120px 0 120px 0; 3612 } 3613 3614 .single-counter-item { 3615 display: -webkit-box; 3616 display: -ms-flexbox; 3617 display: flex; 3618 } 3619 3620 .single-counter-item.white .content .count-num { 3621 color: #fff; 3622 } 3623 3624 .single-counter-item.white .content .title { 3625 color: rgba(255, 255, 255, 0.7); 3626 } 3627 3628 .single-counter-item .icon { 3629 font-size: 80px; 3630 line-height: 80px; 3631 color: var(--main-color-one); 3632 margin-right: 20px; 3633 } 3634 3635 .single-counter-item .content .count-num { 3636 font-size: 36px; 3637 line-height: 46px; 3638 color: var(--heading-color); 3639 font-weight: 600; 3640 } 3641 3642 .single-counter-item .content .title { 3643 font-size: 16px; 3644 line-height: 26px; 3645 color: var(--paragraph-color); 3646 font-weight: 500; 3647 } 3648 3649 .single-counterup-style-02 { 3650 display: flex; 3651 align-self: flex-start; 3652 box-shadow: 0 0 50px 0 rgba(0, 0, 0, .06); 3653 padding: 30px; 3654 background-color: #fff; 3655 border-radius: 5px; 3656 padding-bottom: 35px; 3657 } 3658 3659 .single-counterup-style-02 .icon { 3660 font-size: 50px; 3661 line-height: 60px; 3662 color: var(--main-color-one); 3663 margin-right: 20px; 3664 } 3665 3666 .single-counterup-style-02 .content { 3667 flex: 1; 3668 } 3669 3670 .single-counterup-style-02 .content .count-wrap { 3671 font-size: 40px; 3672 line-height: 58px; 3673 position: relative; 3674 z-index: 0; 3675 font-weight: 500; 3676 color: var(--heading-color); 3677 } 3678 3679 3680 .single-counterup-style-02 .content .title { 3681 font-size: 18px; 3682 line-height: 28px; 3683 font-weight: 500; 3684 } 3685 3686 /*------------------------ 3687 Why Choose Us 3688 -------------------------*/ 3689 3690 .why-choose-area .shape-1 { 3691 position: absolute; 3692 left: 10%; 3693 top: 10%; 3694 -webkit-animation: fadeIn 10s linear 2s infinite; 3695 animation: fadeIn 10s linear 2s infinite; 3696 } 3697 3698 .why-choose-area.why-choose-us-bg { 3699 background-size: cover; 3700 background-position: center; 3701 } 3702 3703 .why-choose-area.dark-bg { 3704 background-size: cover; 3705 background-position: center; 3706 } 3707 3708 .single-why-us-item { 3709 border: 1px solid rgba(255, 255, 255, 0.8); 3710 border-radius: 6px; 3711 padding: 40px 30px 15px 30px; 3712 background-color: rgba(118, 70, 233, 0.2); 3713 -webkit-transition: all 0.3s ease-in; 3714 -moz-transition: all 0.3s ease-in; 3715 -o-transition: all 0.3s ease-in; 3716 transition: all 0.3s ease-in; 3717 } 3718 3719 .single-why-us-item.white { 3720 background-color: transparent; 3721 } 3722 3723 .single-why-us-item:hover { 3724 background-color: #fff; 3725 } 3726 3727 .single-why-us-item:hover .content .title { 3728 color: var(--heading-color); 3729 } 3730 3731 .single-why-us-item:hover .content p { 3732 color: var(--paragraph-color); 3733 } 3734 3735 .single-why-us-item .icon { 3736 width: 60px; 3737 height: 60px; 3738 border-radius: 50%; 3739 background-image: -moz-linear-gradient(50deg, #776df2 0%, #a1f0e6 100%); 3740 background-image: -webkit-linear-gradient(50deg, #776df2 0%, #a1f0e6 100%); 3741 background-image: -ms-linear-gradient(50deg, #776df2 0%, #a1f0e6 100%); 3742 -webkit-box-shadow: 0px 26px 68px 0px rgba(42, 0, 117, 0.4); 3743 box-shadow: 0px 26px 68px 0px rgba(42, 0, 117, 0.4); 3744 text-align: center; 3745 line-height: 60px; 3746 font-size: 30px; 3747 color: #fff; 3748 margin-bottom: 27px; 3749 } 3750 3751 .single-why-us-item .icon.gdbg-1 { 3752 background-image: -moz-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3753 background-image: -webkit-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3754 background-image: -ms-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3755 -webkit-box-shadow: 0px 26px 68px 0px rgba(42, 0, 117, 0.4); 3756 box-shadow: 0px 26px 68px 0px rgba(42, 0, 117, 0.4); 3757 } 3758 3759 .single-why-us-item .icon.gdbg-3 { 3760 background-image: -moz-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3761 background-image: -webkit-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3762 background-image: -ms-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3763 } 3764 3765 .single-why-us-item .icon.gdbg-4 { 3766 background-image: -moz-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 3767 background-image: -webkit-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 3768 background-image: -ms-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 3769 } 3770 3771 .single-why-us-item .content .title { 3772 font-size: 22px; 3773 line-height: 32px; 3774 color: #fff; 3775 -webkit-transition: all 0.3s ease-in; 3776 -moz-transition: all 0.3s ease-in; 3777 -o-transition: all 0.3s ease-in; 3778 transition: all 0.3s ease-in; 3779 font-weight: 700; 3780 } 3781 3782 .single-why-us-item .content p { 3783 font-size: 16px; 3784 line-height: 26px; 3785 color: rgba(255, 255, 255, 0.8); 3786 -webkit-transition: all 0.3s ease-in; 3787 -moz-transition: all 0.3s ease-in; 3788 -o-transition: all 0.3s ease-in; 3789 transition: all 0.3s ease-in; 3790 } 3791 3792 /*------------------------- 3793 How It Works Area 3794 ---------------------------*/ 3795 .how-it-work-area { 3796 padding: 112px 0 112px 0; 3797 position: relative; 3798 } 3799 3800 .how-it-work-area .shape-1 { 3801 position: absolute; 3802 left: 10%; 3803 top: 10%; 3804 -webkit-animation: upndown 10s linear 2s infinite; 3805 animation: upndown 10s linear 2s infinite; 3806 } 3807 3808 .how-it-work-area .shape-2 { 3809 position: absolute; 3810 left: 6%; 3811 top: 20%; 3812 -webkit-animation: upndown 8s linear 2s infinite; 3813 animation: upndown 8s linear 2s infinite; 3814 opacity: .5; 3815 } 3816 3817 .how-it-work-area .shape-3 { 3818 position: absolute; 3819 right: 10%; 3820 bottom: 10%; 3821 -webkit-animation: upndown 10s linear 2s infinite; 3822 animation: upndown 10s linear 2s infinite; 3823 } 3824 3825 .how-it-work-area .shape-4 { 3826 position: absolute; 3827 right: 6%; 3828 bottom: 20%; 3829 -webkit-animation: upndown 8s linear 2s infinite; 3830 animation: upndown 8s linear 2s infinite; 3831 opacity: .5; 3832 } 3833 3834 .how-it-work-tab-nav { 3835 margin-bottom: 40px; 3836 } 3837 3838 .how-it-work-tab-nav .nav-tabs { 3839 border: none; 3840 display: block; 3841 text-align: center; 3842 font-size: 0; 3843 margin-top: 18px; 3844 } 3845 3846 .how-it-work-tab-nav .nav-tabs .nav-item { 3847 display: inline-block; 3848 border-right: 1px solid #b1aeb6; 3849 } 3850 3851 .how-it-work-tab-nav .nav-tabs .nav-item:last-child { 3852 border-right: none; 3853 } 3854 3855 .how-it-work-tab-nav .nav-tabs .nav-item .nav-link { 3856 border: none; 3857 height: 70px; 3858 line-height: 60px; 3859 padding: 0 30px; 3860 color: var(--heading-color); 3861 background-color: #f6f2fd; 3862 font-size: 16px; 3863 font-weight: 500; 3864 position: relative; 3865 } 3866 3867 .how-it-work-tab-nav .nav-tabs .nav-item .nav-link .number { 3868 position: absolute; 3869 top: -20px; 3870 right: 30px; 3871 width: 40px; 3872 height: 40px; 3873 border-radius: 50%; 3874 background-image: -moz-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3875 background-image: -webkit-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3876 background-image: -ms-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 3877 text-align: center; 3878 line-height: 40px; 3879 font-weight: 600; 3880 color: #fff; 3881 border: 2px solid #fff; 3882 } 3883 3884 .how-it-work-tab-nav .nav-tabs .nav-item .nav-link i { 3885 font-size: 30px; 3886 position: relative; 3887 top: 5px; 3888 color: var(--main-color-one); 3889 } 3890 3891 .how-it-work-tab-nav .nav-tabs .nav-item .nav-link.active { 3892 color: #fff; 3893 background-image: -moz-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3894 background-image: -webkit-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3895 background-image: -ms-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 3896 } 3897 3898 .how-it-work-tab-nav .nav-tabs .nav-item .nav-link.active i { 3899 color: #fff; 3900 } 3901 3902 .how-it-works-tab-content.white .left-content-area .title { 3903 color: #fff; 3904 } 3905 3906 .how-it-works-tab-content.white .left-content-area p { 3907 color: rgba(255, 255, 255, 0.7); 3908 } 3909 3910 .how-it-works-tab-content .left-content-area .title { 3911 font-size: 24px; 3912 line-height: 34px; 3913 margin-bottom: 15px; 3914 color: var(--heading-color); 3915 } 3916 3917 /*--------------------------- 3918 Screenshort area 3919 ---------------------------*/ 3920 .screenshort-area { 3921 padding-bottom: 102px; 3922 position: relative; 3923 } 3924 3925 .screenshort-area .shape-1 { 3926 position: absolute; 3927 left: 10%; 3928 bottom: 10%; 3929 -webkit-animation: upndown 10s linear 2s infinite; 3930 animation: upndown 10s linear 2s infinite; 3931 } 3932 3933 .screenshort-area .shape-2 { 3934 position: absolute; 3935 left: 6%; 3936 bottom: 20%; 3937 -webkit-animation: upndown 8s linear 2s infinite; 3938 animation: upndown 8s linear 2s infinite; 3939 opacity: .5; 3940 } 3941 3942 .single-screenshort-item { 3943 -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); 3944 box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); 3945 border-radius: 10px; 3946 margin-bottom: 10px; 3947 } 3948 3949 .screeshort-carousel-wrap-02 { 3950 position: relative; 3951 z-index: 0; 3952 } 3953 3954 .screeshort-carousel-wrap-02 .mobile-cover { 3955 position: absolute; 3956 left: 50%; 3957 -webkit-transform: translateX(-50%); 3958 -ms-transform: translateX(-50%); 3959 transform: translateX(-50%); 3960 z-index: 2; 3961 overflow: hidden; 3962 } 3963 3964 .screeshort-carousel-wrap-02 .single-screenshort-item { 3965 -webkit-box-shadow: none; 3966 box-shadow: none; 3967 border-bottom: 0px; 3968 border-radius: 10px; 3969 } 3970 3971 .screeshort-carousel-wrap-02 .single-screenshort-item img { 3972 border-radius: 10px; 3973 } 3974 .single-brand-item img { 3975 transition: all 500ms; 3976 -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */ 3977 filter: grayscale(100%); 3978 opacity: .3; 3979 } 3980 3981 .single-brand-item:hover img { 3982 -webkit-filter: grayscale(0%); 3983 filter: grayscale(0%); 3984 opacity: 1; 3985 } 3986 3987 /*---------------------------- 3988 Testimonial Area 3989 -----------------------------*/ 3990 .testimonial-area { 3991 padding-bottom: 120px; 3992 position: relative; 3993 } 3994 3995 .testimonial-area .shape-1 { 3996 position: absolute; 3997 right: 10%; 3998 bottom: 40%; 3999 -webkit-animation: upndown 10s linear 2s infinite; 4000 animation: upndown 10s linear 2s infinite; 4001 } 4002 4003 .testimonial-area .shape-2 { 4004 position: absolute; 4005 right: 6%; 4006 bottom: 30%; 4007 -webkit-animation: upndown 8s linear 2s infinite; 4008 animation: upndown 8s linear 2s infinite; 4009 opacity: .5; 4010 } 4011 4012 .single-testimonial-item { 4013 position: relative; 4014 z-index: 0; 4015 } 4016 4017 .single-testimonial-item img { 4018 width: auto !important; 4019 } 4020 4021 .single-testimonial-item .hover { 4022 position: absolute; 4023 right: 0; 4024 top: 50%; 4025 width: 50%; 4026 background-color: #fff; 4027 -webkit-box-shadow: 0px 0px 100px 0px rgba(0, 0, 0, 0.08); 4028 box-shadow: 0px 0px 100px 0px rgba(0, 0, 0, 0.08); 4029 margin-right: 30px; 4030 -ms-transform: translateY(-50%); 4031 /* IE 9 */ 4032 -webkit-transform: translateY(-50%); 4033 /* Chrome, Safari, Opera */ 4034 transform: translateY(-50%); 4035 } 4036 4037 .single-testimonial-item .hover .hover-inner { 4038 text-align: center; 4039 padding: 50px 50px 43px 50px; 4040 } 4041 4042 .single-testimonial-item .hover .hover-inner .icon { 4043 position: absolute; 4044 top: -40px; 4045 left: 50%; 4046 width: 80px; 4047 height: 80px; 4048 border-radius: 50%; 4049 background-image: -moz-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 4050 background-image: -webkit-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 4051 background-image: -ms-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 4052 line-height: 80px; 4053 color: #fff; 4054 -ms-transform: translateX(-50%); 4055 /* IE 9 */ 4056 -webkit-transform: translateX(-50%); 4057 /* Chrome, Safari, Opera */ 4058 transform: translateX(-50%); 4059 } 4060 4061 .single-testimonial-item .hover .hover-inner p { 4062 font-size: 24px; 4063 line-height: 34px; 4064 margin-top: 15px; 4065 } 4066 4067 .single-testimonial-item .hover .hover-inner .author-meta { 4068 margin-top: 33px; 4069 } 4070 4071 .single-testimonial-item .hover .hover-inner .author-meta .name { 4072 font-size: 18px; 4073 text-transform: capitalize; 4074 font-weight: 600; 4075 } 4076 4077 .single-testimonial-item .hover .hover-inner .author-meta .post { 4078 font-size: 14px; 4079 } 4080 4081 .single-testimonial-item .thumb { 4082 position: relative; 4083 display: block; 4084 -webkit-mask-repeat: no-repeat; 4085 mask-repeat: no-repeat; 4086 -webkit-mask-image: url(../img/mask-image.png); 4087 mask-image: url(../img/mask-image.png); 4088 -webkit-mask-size: 100% 100%; 4089 mask-size: 100% 100%; 4090 overflow: hidden; 4091 width: 763px; 4092 height: 827px; 4093 } 4094 4095 .single-testimonial-item .thumb img { 4096 width: 100%; 4097 height: 100%; 4098 } 4099 4100 @media only screen and (max-width: 768px) { 4101 .single-testimonial-item .thumb { 4102 width: 100%; 4103 height: 630px; 4104 } 4105 } 4106 4107 @media only screen and (max-width: 500px) { 4108 .single-testimonial-item .thumb { 4109 width: 100%; 4110 height: 530px; 4111 } 4112 } 4113 4114 .appside-testimonial-carousel-02 .owl-item.active.center .single-testimonial-item-02 .content-area{ 4115 background: -webkit-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4116 background: -o-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4117 background: -ms-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4118 background: -moz-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4119 background: linear-gradient(to right, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4120 4121 } 4122 .appside-testimonial-carousel-02 .owl-item.active.center .single-testimonial-item-02 .content-area p { 4123 color: rgba(255,255,255,.8); 4124 } 4125 4126 .appside-testimonial-carousel-02 .owl-item.active.center .single-testimonial-item-02 .content-area:after { 4127 color: rgba(255,255,255,.30); 4128 } 4129 .appside-testimonial-carousel-02 .owl-item.active.center .single-testimonial-item-02 .author-meta:before { 4130 border-top-color: #b84194; 4131 } 4132 4133 .single-testimonial-item-02 .content-area { 4134 background-color: #e8f2f9; 4135 position: relative; 4136 overflow: hidden; 4137 padding: 33px 40px 25px 40px; 4138 border-radius: 30px; 4139 } 4140 .single-testimonial-item-02 .author-meta img { 4141 max-width: 60px; 4142 border-radius: 50%; 4143 } 4144 4145 .single-testimonial-item-02 .content-area:after { 4146 position: absolute; 4147 right: 30px; 4148 bottom: -30px; 4149 font-size: 80px; 4150 line-height: 80px; 4151 content: "\f10d"; 4152 font-family: 'fontawesome'; 4153 font-weight: 900; 4154 color: rgba(109, 52, 240,.30); 4155 } 4156 4157 .single-testimonial-item-02 .content-area p { 4158 font-size: 16px; 4159 line-height: 26px; 4160 color: var(--paragph-color); 4161 } 4162 4163 .single-testimonial-item-02 .author-meta { 4164 margin-top: 25px; 4165 position: relative; 4166 display: flex; 4167 align-self: flex-start; 4168 margin-left: 90px; 4169 } 4170 .single-testimonial-item-02 .author-meta:before { 4171 position: absolute; 4172 left: -55px; 4173 top: -26px; 4174 content: ''; 4175 border-top: 30px solid #e8f2f9; 4176 border-left: 50px solid transparent; 4177 } 4178 .single-testimonial-item-02 .author-meta .content{ 4179 flex: 1; 4180 margin-left: 20px; 4181 } 4182 .single-testimonial-item-02 .author-meta .title { 4183 font-size: 20px; 4184 font-weight: 600; 4185 line-height: 22px; 4186 color: var(--heading-color); 4187 margin-bottom: 0px; 4188 } 4189 4190 .single-testimonial-item-02 .author-meta .designation { 4191 font-size: 16px; 4192 line-height: 26px; 4193 color: var(--paragph-color); 4194 } 4195 4196 .single-testimonial-item-03 { 4197 position: relative; 4198 z-index: 0; 4199 margin-bottom: 40px; 4200 } 4201 4202 .single-testimonial-item-03 .img-wrapper { 4203 position: absolute; 4204 left: 30px; 4205 bottom: -40px; 4206 } 4207 4208 .single-testimonial-item-03 .img-wrapper img { 4209 width: 80px; 4210 height: 80px; 4211 border-radius: 50%; 4212 } 4213 4214 .single-testimonial-item-03 .content-area { 4215 background: -webkit-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4216 background: -o-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4217 background: -ms-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4218 background: -moz-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4219 background: linear-gradient(to right, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4220 padding: 55px 30px 65px 30px; 4221 position: relative; 4222 z-index: 0; 4223 overflow: hidden; 4224 border-radius: 10px; 4225 } 4226 4227 .single-testimonial-item-03 .content-area:after { 4228 position: absolute; 4229 right: 30px; 4230 top: -20px; 4231 font-size: 80px; 4232 line-height: 80px; 4233 content: "\f10e"; 4234 font-family: 'fontawesome'; 4235 font-weight: 900; 4236 color: rgba(255, 255, 255, 0.2); 4237 } 4238 4239 .single-testimonial-item-03 .content-area p { 4240 font-size: 18px; 4241 line-height: 30px; 4242 color: rgba(255, 255, 255, 0.8); 4243 } 4244 4245 .single-testimonial-item-03 .content-area .author-meta { 4246 margin-top: 20px; 4247 } 4248 4249 .single-testimonial-item-03 .content-area .author-meta .title { 4250 font-size: 20px; 4251 font-weight: 600; 4252 line-height: 32px; 4253 color: #fff; 4254 margin-bottom: 0px; 4255 } 4256 4257 .single-testimonial-item-03 .content-area .author-meta .designation { 4258 font-size: 16px; 4259 line-height: 26px; 4260 color: rgba(255, 255, 255, 0.9); 4261 font-weight: 400; 4262 } 4263 4264 /*-------------------------- 4265 Pricing Plan Area 4266 ---------------------------*/ 4267 4268 .single-price-plan-01 { 4269 text-align: center; 4270 background-color: rgba(121, 71, 224, 0.4); 4271 border: 1px solid rgba(255, 255, 255, 0.3); 4272 border-radius: 5px; 4273 padding: 52px 0 60px 0; 4274 -webkit-transition: all 0.3s ease-in; 4275 -moz-transition: all 0.3s ease-in; 4276 -o-transition: all 0.3s ease-in; 4277 transition: all 0.3s ease-in; 4278 } 4279 4280 .single-price-plan-01.white { 4281 background-color: #131332; 4282 } 4283 4284 .single-price-plan-01:hover { 4285 background-color: #fff; 4286 } 4287 4288 .single-price-plan-01:hover .price-header .name { 4289 color: var(--heading-color); 4290 } 4291 4292 .single-price-plan-01:hover .price-header .price-wrap .price { 4293 color: var(--heading-color); 4294 } 4295 4296 .single-price-plan-01:hover .price-header .price-wrap .month { 4297 color: var(--paragraph-color); 4298 } 4299 4300 .single-price-plan-01:hover .price-body ul li { 4301 color: var(--paragraph-color); 4302 } 4303 4304 .single-price-plan-01 .price-header .name { 4305 font-size: 18px; 4306 line-height: 28px; 4307 text-transform: uppercase; 4308 font-weight: 600; 4309 margin-bottom: 15px; 4310 color: #fff; 4311 -webkit-transition: all 0.3s ease-in; 4312 -moz-transition: all 0.3s ease-in; 4313 -o-transition: all 0.3s ease-in; 4314 transition: all 0.3s ease-in; 4315 } 4316 4317 .single-price-plan-01 .price-header .price-wrap { 4318 margin-bottom: 36px; 4319 } 4320 4321 .single-price-plan-01 .price-header .price-wrap .price { 4322 font-size: 48px; 4323 line-height: 58px; 4324 color: #fff; 4325 -webkit-transition: all 0.3s ease-in; 4326 -moz-transition: all 0.3s ease-in; 4327 -o-transition: all 0.3s ease-in; 4328 transition: all 0.3s ease-in; 4329 } 4330 4331 .single-price-plan-01 .price-header .price-wrap .month { 4332 color: rgba(255, 255, 255, 0.8); 4333 -webkit-transition: all 0.3s ease-in; 4334 -moz-transition: all 0.3s ease-in; 4335 -o-transition: all 0.3s ease-in; 4336 transition: all 0.3s ease-in; 4337 } 4338 4339 .single-price-plan-01 .price-body ul { 4340 margin: 0; 4341 padding: 0; 4342 list-style: none; 4343 } 4344 4345 .single-price-plan-01 .price-body ul li { 4346 display: block; 4347 margin: 15px 0; 4348 color: rgba(255, 255, 255, 0.8); 4349 -webkit-transition: all 0.3s ease-in; 4350 -moz-transition: all 0.3s ease-in; 4351 -o-transition: all 0.3s ease-in; 4352 transition: all 0.3s ease-in; 4353 } 4354 4355 .single-price-plan-01 .price-body ul li:first-child { 4356 margin-top: 0; 4357 } 4358 4359 .single-price-plan-01 .price-body ul li:last-child { 4360 margin-bottom: 0; 4361 } 4362 4363 .single-price-plan-01 .price-footer { 4364 margin-top: 48px; 4365 display: block; 4366 } 4367 4368 .single-price-plan-02 { 4369 text-align: center; 4370 border: 1px solid rgba(0, 0, 0, 0.06); 4371 border-radius: 5px; 4372 padding: 52px 0 60px 0; 4373 -webkit-transition: all 0.3s ease-in; 4374 -moz-transition: all 0.3s ease-in; 4375 -o-transition: all 0.3s ease-in; 4376 transition: all 0.3s ease-in; 4377 position: relative; 4378 z-index: 0; 4379 overflow: hidden; 4380 } 4381 4382 .single-price-plan-02.featured { 4383 -webkit-box-shadow: 0px 0px 95px 0px rgba(0, 0, 0, 0.07); 4384 box-shadow: 0px 0px 95px 0px rgba(0, 0, 0, 0.07); 4385 } 4386 4387 .single-price-plan-02.featured:after { 4388 -ms-transform: translateX(0%); 4389 /* IE 9 */ 4390 -webkit-transform: translateX(0%); 4391 /* Chrome, Safari, Opera */ 4392 transform: translateX(0%); 4393 visibility: visible; 4394 opacity: 1; 4395 } 4396 4397 .single-price-plan-02:after { 4398 position: absolute; 4399 left: 0; 4400 top: 0; 4401 width: 100%; 4402 height: 5px; 4403 background-image: -webkit-linear-gradient(267deg, #0250c5 0%, #d43f8d 100%); 4404 background-image: -o-linear-gradient(267deg, #0250c5 0%, #d43f8d 100%); 4405 background-image: linear-gradient(-177deg, #0250c5 0%, #d43f8d 100%); 4406 background-image: -moz-linear-gradient(-177deg, #0250c5 0%, #d43f8d 100%); 4407 background-image: -webkit-linear-gradient(-177deg, #0250c5 0%, #d43f8d 100%); 4408 background-image: -ms-linear-gradient(-177deg, #0250c5 0%, #d43f8d 100%); 4409 content: ''; 4410 z-index: -1; 4411 visibility: hidden; 4412 opacity: 0; 4413 -webkit-transition: all 500ms; 4414 -o-transition: all 500ms; 4415 transition: all 500ms; 4416 -ms-transform: translateX(-100%); 4417 /* IE 9 */ 4418 -webkit-transform: translateX(-100%); 4419 /* Chrome, Safari, Opera */ 4420 transform: translateX(-100%); 4421 } 4422 4423 .single-price-plan-02.white { 4424 background-color: #131332; 4425 } 4426 4427 .single-price-plan-02:hover { 4428 -webkit-box-shadow: 0px 0px 95px 0px rgba(0, 0, 0, 0.07); 4429 box-shadow: 0px 0px 95px 0px rgba(0, 0, 0, 0.07); 4430 } 4431 4432 .single-price-plan-02:hover:after { 4433 -ms-transform: translateX(0%); 4434 /* IE 9 */ 4435 -webkit-transform: translateX(0%); 4436 /* Chrome, Safari, Opera */ 4437 transform: translateX(0%); 4438 visibility: visible; 4439 opacity: 1; 4440 } 4441 4442 .single-price-plan-02 .price-header .name { 4443 font-size: 16px; 4444 line-height: 28px; 4445 text-transform: uppercase; 4446 font-weight: 600; 4447 margin-bottom: 15px; 4448 -webkit-transition: all 0.3s ease-in; 4449 -moz-transition: all 0.3s ease-in; 4450 -o-transition: all 0.3s ease-in; 4451 transition: all 0.3s ease-in; 4452 color: var(--main-color-one); 4453 } 4454 4455 .single-price-plan-02 .price-header .price-wrap { 4456 margin-bottom: 36px; 4457 } 4458 4459 .single-price-plan-02 .price-header .price-wrap .price { 4460 font-size: 40px; 4461 line-height: 50px; 4462 color: var(--heading-color); 4463 -webkit-transition: all 0.3s ease-in; 4464 -moz-transition: all 0.3s ease-in; 4465 -o-transition: all 0.3s ease-in; 4466 transition: all 0.3s ease-in; 4467 font-weight: 600; 4468 } 4469 4470 .single-price-plan-02 .price-header .price-wrap .month { 4471 color: var(--heading-color); 4472 -webkit-transition: all 0.3s ease-in; 4473 -moz-transition: all 0.3s ease-in; 4474 -o-transition: all 0.3s ease-in; 4475 transition: all 0.3s ease-in; 4476 } 4477 4478 .single-price-plan-02 .price-body ul { 4479 margin: 0; 4480 padding: 0; 4481 list-style: none; 4482 } 4483 4484 .single-price-plan-02 .price-body ul li { 4485 display: block; 4486 margin: 15px 0; 4487 -webkit-transition: all 0.3s ease-in; 4488 -moz-transition: all 0.3s ease-in; 4489 -o-transition: all 0.3s ease-in; 4490 transition: all 0.3s ease-in; 4491 } 4492 4493 .single-price-plan-02 .price-body ul li:first-child { 4494 margin-top: 0; 4495 } 4496 4497 .single-price-plan-02 .price-body ul li:last-child { 4498 margin-bottom: 0; 4499 } 4500 4501 .single-price-plan-02 .price-footer { 4502 margin-top: 48px; 4503 display: block; 4504 } 4505 4506 .single-price-plan-02 .price-footer .boxed-btn:hover { 4507 color: #fff; 4508 background-color: var(--secondary-color); 4509 } 4510 4511 .single-price-plan-02 .price-footer .boxed-btn { 4512 display: inline-block; 4513 text-align: center; 4514 height: 60px; 4515 line-height: 60px; 4516 font-size: 14px; 4517 text-transform: capitalize; 4518 font-weight: 600; 4519 color: #fff; 4520 width: 202px; 4521 background-color: var(--main-color-one); 4522 padding: 0 20px; 4523 -webkit-transition: all 0.3s ease-in; 4524 -moz-transition: all 0.3s ease-in; 4525 -o-transition: all 0.3s ease-in; 4526 transition: all 0.3s ease-in; 4527 border-radius: 5px; 4528 } 4529 4530 /*----------------------- 4531 Team Member Area 4532 ------------------------*/ 4533 .team-member-area { 4534 position: relative; 4535 z-index: 0; 4536 padding-top: 112px; 4537 overflow: hidden; 4538 } 4539 4540 .team-member-area .bg-shape-1 { 4541 position: absolute; 4542 left: 0; 4543 top: 50px; 4544 width: 100%; 4545 height: 100%; 4546 } 4547 4548 .team-member-area .bg-shape-2 { 4549 position: absolute; 4550 left: 0; 4551 bottom: 0px; 4552 } 4553 4554 .team-member-area .bg-shape-3 { 4555 position: absolute; 4556 right: 0; 4557 bottom: 50px; 4558 } 4559 /* team style one */ 4560 .single-team-member { 4561 text-align: center; 4562 display: inline-block; 4563 } 4564 .single-team-member.white .content .title { 4565 color: #fff; 4566 } 4567 .single-team-member.white .content .post { 4568 color: rgba(255, 255, 255, 0.7); 4569 } 4570 .single-team-member:hover .thumb .hover { 4571 visibility: visible; 4572 opacity: 1; 4573 -ms-transform: scaleY(1); 4574 /* IE 9 */ 4575 -webkit-transform: scaleY(1); 4576 /* Safari 3-8 */ 4577 transform: scaleY(1); 4578 } 4579 .single-team-member .thumb { 4580 display: inline-block; 4581 background-color: white; 4582 /*box-shadow: 0px 4px 15px 0px rgba(22, 12, 43, 0.18);*/ 4583 border-radius: 50%; 4584 border: 8px solid #eaeaea; 4585 position: relative; 4586 z-index: 0; 4587 margin-bottom: 15px; 4588 overflow: hidden; 4589 } 4590 .single-team-member .thumb img { 4591 width: 130px; 4592 height: 130px; 4593 border-radius: 50%; 4594 -ms-transform: scale(1.05); 4595 /* IE 9 */ 4596 -webkit-transform: scale(1.05); 4597 /* Safari 3-8 */ 4598 transform: scale(1.05); 4599 } 4600 .single-team-member .thumb .hover { 4601 position: absolute; 4602 left: 0; 4603 top: 0; 4604 width: 100%; 4605 height: 100%; 4606 background-color: rgba(109, 52, 240,.7); 4607 border-radius: 50%; 4608 visibility: hidden; 4609 opacity: 0; 4610 -ms-transform: scaleY(0); 4611 /* IE 9 */ 4612 -webkit-transform: scaleY(0); 4613 /* Safari 3-8 */ 4614 transform: scaleY(0); 4615 transition: all 500ms; 4616 -webkit-transition: all 500ms; 4617 /* Safari 3.1 to 6.0 */ 4618 } 4619 .single-team-member .thumb .hover .social-icon { 4620 margin: 0; 4621 padding: 0; 4622 list-style: none; 4623 position: absolute; 4624 left: 50%; 4625 bottom: 30px; 4626 -ms-transform: translateX(-50%); 4627 /* IE 9 */ 4628 -webkit-transform: translateX(-50%); 4629 /* Safari 3-8 */ 4630 transform: translateX(-50%); 4631 } 4632 .single-team-member .thumb .hover .social-icon li { 4633 display: inline-block; 4634 margin: 0 5px; 4635 } 4636 .single-team-member .thumb .hover .social-icon li a { 4637 display: block; 4638 color: #fff; 4639 } 4640 .single-team-member .thumb .hover .social-icon li a i { 4641 transition: all 500ms; 4642 -webkit-transition: all 500ms; 4643 /* Safari 3.1 to 6.0 */ 4644 } 4645 .single-team-member .thumb .hover .social-icon li a:hover i { 4646 -ms-transform: scaleY(1.2); 4647 /* IE 9 */ 4648 -webkit-transform: scaleY(1.2); 4649 /* Safari 3-8 */ 4650 transform: scaleY(1.2); 4651 } 4652 .single-team-member .content .title { 4653 font-size: 18px; 4654 line-height: 28px; 4655 color: #283659; 4656 margin-bottom: 0; 4657 font-weight: 600; 4658 } 4659 .single-team-member .content .post { 4660 font-size: 13px; 4661 line-height: 24px; 4662 } 4663 .team-member-carousel-wrapper .owl-carousel .owl-stage-outer { 4664 padding-left: 10px; 4665 } 4666 4667 .download-area-wrapper { 4668 background-color: #fff; 4669 -webkit-box-shadow: 0px 0px 169px 0px rgba(0, 0, 0, 0.08); 4670 box-shadow: 0px 0px 169px 0px rgba(0, 0, 0, 0.08); 4671 text-align: center; 4672 padding: 93px 100px 100px 100px; 4673 } 4674 4675 .download-area-wrapper.white { 4676 background-color: #131333; 4677 } 4678 4679 .download-area-wrapper.white .title { 4680 color: #fff; 4681 } 4682 4683 .download-area-wrapper.white .subtitle { 4684 color: rgba(255, 255, 255, 0.8); 4685 } 4686 4687 .download-area-wrapper.white p { 4688 color: rgba(255, 255, 255, 0.7); 4689 } 4690 4691 .download-area-wrapper p { 4692 max-width: 750px; 4693 margin: 0 auto; 4694 } 4695 4696 .download-area-wrapper .title { 4697 font-size: 48px; 4698 line-height: 58px; 4699 margin-bottom: 10px; 4700 font-weight: 700; 4701 color: var(--heading-color); 4702 } 4703 4704 .download-area-wrapper .subtitle { 4705 font-size: 20px; 4706 line-height: 30px; 4707 color: var(--main-color-one); 4708 text-transform: uppercase; 4709 font-weight: 600; 4710 font-family: var(--heading-font); 4711 display: block; 4712 margin-bottom: 10px; 4713 } 4714 4715 .download-area-wrapper .btn-wrapper { 4716 margin-top: 57px; 4717 } 4718 4719 .download-area-wrapper .btn-wrapper .boxed-btn { 4720 margin: 0 10px; 4721 } 4722 4723 .contact-area-wrapper { 4724 padding: 113px 0 120px 0; 4725 } 4726 4727 .contact-area-wrapper.white .title { 4728 color: #fff; 4729 } 4730 4731 .contact-area-wrapper.white .subtitle { 4732 color: rgba(255, 255, 255, 0.8); 4733 } 4734 4735 .contact-area-wrapper.white p { 4736 color: rgba(255, 255, 255, 0.7); 4737 } 4738 4739 .contact-area-wrapper .title { 4740 font-size: 48px; 4741 line-height: 58px; 4742 margin-bottom: 10px; 4743 font-weight: 700; 4744 color: var(--heading-color); 4745 } 4746 4747 .contact-area-wrapper .subtitle { 4748 font-size: 20px; 4749 line-height: 30px; 4750 color: var(--main-color-one); 4751 text-transform: uppercase; 4752 font-weight: 600; 4753 font-family: var(--heading-font); 4754 display: block; 4755 margin-bottom: 10px; 4756 } 4757 4758 .contact-form.sec-margin { 4759 margin-top: 57px; 4760 } 4761 4762 .contact-form .form-group.textarea .form-control { 4763 resize: none; 4764 padding: 20px; 4765 min-height: 150px; 4766 } 4767 4768 .contact-form .form-group.textarea .form-control:focus { 4769 outline: none; 4770 -webkit-box-shadow: none; 4771 box-shadow: none; 4772 } 4773 4774 .contact-form .form-group .form-control { 4775 border: 2px solid #fafafa; 4776 height: 60px; 4777 padding: 0 20px; 4778 box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.06); 4779 } 4780 /*------------------------------ 4781 Price Plan Area 4782 ------------------------------*/ 4783 .price-plan-left-content .section-title .subtitle { 4784 font-size: 14px; 4785 line-height: 26px; 4786 text-transform: uppercase; 4787 font-weight: 600; 4788 color: var(--main-color-one); 4789 margin-bottom: 10px; 4790 display: block; 4791 } 4792 4793 .price-plan-left-content .section-title .title { 4794 font-size: 40px; 4795 line-height: 50px; 4796 font-weight: 600; 4797 color: var(--heading-color); 4798 margin-bottom: 25px; 4799 } 4800 .price-plan-tab-nav .nav-tabs { 4801 display: block; 4802 border: none; 4803 font-size: 0px; 4804 border-radius: 5px; 4805 } 4806 4807 .price-plan-tab-nav .nav-tabs .nav-item { 4808 display: inline-block; 4809 border: none; 4810 background-color: #eae2fd; 4811 font-size: 16px; 4812 border-radius: 0; 4813 color: var(--heading-color); 4814 font-weight: 600; 4815 width: 110px; 4816 height: 50px; 4817 line-height: 33px; 4818 text-align:center; 4819 } 4820 .price-plan-tab-nav { 4821 margin-top: 36px; 4822 } 4823 .price-plan-tab-nav .nav-tabs .nav-item:nth-child(1){ 4824 border-top-left-radius: 5px; 4825 border-bottom-left-radius: 5px; 4826 } 4827 4828 .price-plan-tab-nav .nav-tabs .nav-item:nth-child(2) { 4829 border-bottom-right-radius: 5px; 4830 border-top-right-radius: 5px; 4831 } 4832 4833 .price-plan-tab-nav .nav-tabs .nav-item.active { 4834 background: -webkit-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4835 background: -o-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4836 background: -ms-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4837 background: -moz-linear-gradient(left, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4838 background: linear-gradient(to right, rgb(208, 62, 141) 0%, rgb(136, 70, 161) 40%, rgb(89, 74, 175) 60%, rgb(45, 77, 185) 80%, rgb(12, 79, 195) 100%); 4839 color: #fff; 4840 } 4841 .single-price-plan-03.popular:after{ 4842 -ms-transform: translateX(0%); 4843 /* IE 9 */ 4844 -webkit-transform: translateX(0%); 4845 /* Chrome, Safari, Opera */ 4846 transform: translateX(0%); 4847 visibility: visible; 4848 opacity: 1; 4849 } 4850 4851 .single-price-plan-03 { 4852 text-align: center; 4853 border-radius: 10px; 4854 padding: 52px 0 40px 0; 4855 -webkit-transition: all 0.3s ease-in; 4856 -moz-transition: all 0.3s ease-in; 4857 -o-transition: all 0.3s ease-in; 4858 transition: all 0.3s ease-in; 4859 position: relative; 4860 z-index: 0; 4861 overflow: hidden; 4862 } 4863 .single-price-plan-03 .popular{ 4864 position: absolute; 4865 left: -58px; 4866 top: -12px; 4867 background-color: var(--main-color-one); 4868 color: #fff; 4869 transform: rotate(-45deg); 4870 height: 62px; 4871 line-height: 84px; 4872 width: 154px; 4873 font-size: 14px; 4874 font-weight: 600; 4875 } 4876 4877 .single-price-plan-03:after { 4878 position: absolute; 4879 left: 0; 4880 bottom: 0; 4881 width: 100%; 4882 height: 5px; 4883 background: -webkit-linear-gradient(359deg, rgb(212, 63, 141) 0%, rgb(172, 66, 152) 56%, rgb(35, 77, 189) 76%, rgb(2, 80, 197) 96%, rgb(1, 79, 196) 100%); 4884 background: -o-linear-gradient(359deg, rgb(212, 63, 141) 0%, rgb(172, 66, 152) 56%, rgb(35, 77, 189) 76%, rgb(2, 80, 197) 96%, rgb(1, 79, 196) 100%); 4885 background: -ms-linear-gradient(359deg, rgb(212, 63, 141) 0%, rgb(172, 66, 152) 56%, rgb(35, 77, 189) 76%, rgb(2, 80, 197) 96%, rgb(1, 79, 196) 100%); 4886 background: -moz-linear-gradient(359deg, rgb(212, 63, 141) 0%, rgb(172, 66, 152) 56%, rgb(35, 77, 189) 76%, rgb(2, 80, 197) 96%, rgb(1, 79, 196) 100%); 4887 background: linear-gradient(91deg, rgb(212, 63, 141) 0%, rgb(172, 66, 152) 56%, rgb(35, 77, 189) 76%, rgb(2, 80, 197) 96%, rgb(1, 79, 196) 100%); 4888 content: ''; 4889 z-index: -1; 4890 visibility: hidden; 4891 opacity: 0; 4892 -webkit-transition: all 500ms; 4893 -o-transition: all 500ms; 4894 transition: all 500ms; 4895 -ms-transform: translateX(-100%); 4896 /* IE 9 */ 4897 -webkit-transform: translateX(-100%); 4898 /* Chrome, Safari, Opera */ 4899 transform: translateX(-100%); 4900 } 4901 4902 .single-price-plan-03.white { 4903 background-color: #131332; 4904 } 4905 4906 .single-price-plan-03:hover { 4907 -webkit-box-shadow: 0px 0px 95px 0px rgba(0, 0, 0, 0.07); 4908 box-shadow: 0px 0px 95px 0px rgba(0, 0, 0, 0.07); 4909 } 4910 4911 .single-price-plan-03:hover:after { 4912 -ms-transform: translateX(0%); 4913 /* IE 9 */ 4914 -webkit-transform: translateX(0%); 4915 /* Chrome, Safari, Opera */ 4916 transform: translateX(0%); 4917 visibility: visible; 4918 opacity: 1; 4919 } 4920 4921 .single-price-plan-03 .price-header .name { 4922 font-size: 16px; 4923 line-height: 28px; 4924 text-transform: capitalize; 4925 font-weight: 600; 4926 margin-bottom: 15px; 4927 -webkit-transition: all 0.3s ease-in; 4928 -moz-transition: all 0.3s ease-in; 4929 -o-transition: all 0.3s ease-in; 4930 transition: all 0.3s ease-in; 4931 color: var(--heading-color); 4932 } 4933 4934 .single-price-plan-03 .price-header .price-wrap { 4935 margin-bottom: 25px; 4936 } 4937 4938 .single-price-plan-03 .price-header .price-wrap .price { 4939 font-size: 60px; 4940 line-height: 70px; 4941 color: var(--heading-color); 4942 -webkit-transition: all 0.3s ease-in; 4943 -moz-transition: all 0.3s ease-in; 4944 -o-transition: all 0.3s ease-in; 4945 transition: all 0.3s ease-in; 4946 font-weight: 600; 4947 } 4948 4949 .single-price-plan-03 .price-header .price-wrap .month { 4950 color: var(--heading-color); 4951 -webkit-transition: all 0.3s ease-in; 4952 -moz-transition: all 0.3s ease-in; 4953 -o-transition: all 0.3s ease-in; 4954 transition: all 0.3s ease-in; 4955 font-weight: 600; 4956 } 4957 4958 .single-price-plan-03 .price-body ul { 4959 margin: 0; 4960 padding: 0; 4961 list-style: none; 4962 } 4963 4964 .single-price-plan-03 .price-body ul li { 4965 display: block; 4966 -webkit-transition: all 0.3s ease-in; 4967 -moz-transition: all 0.3s ease-in; 4968 -o-transition: all 0.3s ease-in; 4969 transition: all 0.3s ease-in; 4970 } 4971 4972 .single-price-plan-03 .price-body ul li:first-child { 4973 margin-top: 0; 4974 } 4975 4976 .single-price-plan-03 .price-body ul li:last-child { 4977 margin-bottom: 0; 4978 } 4979 4980 .single-price-plan-03 .price-footer { 4981 margin-top: 35px; 4982 display: block; 4983 } 4984 4985 .single-price-plan-03 .price-footer .boxed-btn:hover , 4986 .single-price-plan-03.popular .price-footer .boxed-btn , 4987 .single-price-plan-03:hover .price-footer .boxed-btn { 4988 color: #fff; 4989 background-color: var(--main-color-one); 4990 } 4991 4992 .single-price-plan-03 .price-footer .boxed-btn { 4993 display: inline-block; 4994 text-align: center; 4995 height: 50px; 4996 line-height: 50px; 4997 font-size: 14px; 4998 text-transform: capitalize; 4999 font-weight: 600; 5000 color: var(--main-color-one); 5001 width: 160px; 5002 background-color: rgba(109, 52, 240,.15); 5003 padding: 0 20px; 5004 -webkit-transition: all 0.3s ease-in; 5005 -moz-transition: all 0.3s ease-in; 5006 -o-transition: all 0.3s ease-in; 5007 transition: all 0.3s ease-in; 5008 border-radius: 5px; 5009 } 5010 .single-price-plan-03 { 5011 box-shadow: 0px 0px 95px 0px rgba(0, 0, 0, 0.1); 5012 background-color: #fff; 5013 } 5014 .price-plan-single-item-area { 5015 display: flex; 5016 flex-direction: column; 5017 justify-content: center; 5018 height: 100%; 5019 } 5020 .price-plan-left-content { 5021 display: flex; 5022 justify-content: center; 5023 height: 100%; 5024 flex-direction: column; 5025 } 5026 .price-plan-tab-content { 5027 position: relative; 5028 z-index: 0; 5029 } 5030 5031 .price-plan-tab-content:after { 5032 position: absolute; 5033 right: -24%; 5034 top: 44%; 5035 width: 120%; 5036 height: 400px; 5037 background-color: #e8f2f9; 5038 content: ''; 5039 border-radius: 200px; 5040 z-index: -1; 5041 transform: rotate(-36deg)translateY(-50%); 5042 } 5043 /*-------------------------- 5044 Footer Area 5045 ---------------------------*/ 5046 .footer-top { 5047 padding: 100px 0 95px 0; 5048 } 5049 5050 .footer-area { 5051 background-color: #0d2753; 5052 } 5053 5054 .copyright-inner { 5055 border-top: 1px solid rgba(255, 255, 255, 0.2); 5056 color: rgba(255, 255, 255, 0.8); 5057 font-size: 14px; 5058 padding: 20px 0; 5059 } 5060 5061 .copyright-inner .left-content-area { 5062 display: inline-block; 5063 } 5064 5065 .copyright-inner .right-content-area { 5066 display: inline-block; 5067 float: right; 5068 } 5069 5070 .footer-widget { 5071 border: none !important; 5072 } 5073 5074 .footer-widget .widget-title { 5075 font-size: 22px; 5076 line-height: 32px; 5077 color: #fff; 5078 margin-bottom: 23px; 5079 } 5080 5081 .about_widget .footer-logo { 5082 display: block; 5083 margin-bottom: 25px; 5084 } 5085 5086 .about_widget p { 5087 font-size: 16px; 5088 line-height: 26px; 5089 color: rgba(255, 255, 255, 0.8); 5090 } 5091 5092 .about_widget .social-icon { 5093 margin: 0; 5094 padding: 0; 5095 list-style: none; 5096 } 5097 5098 .about_widget .social-icon li { 5099 display: inline-block; 5100 margin: 0 5px; 5101 } 5102 5103 .about_widget .social-icon li:first-child { 5104 margin-left: 0; 5105 } 5106 5107 .about_widget .social-icon li:last-child { 5108 margin-right: 0; 5109 } 5110 5111 .about_widget .social-icon li a { 5112 color: rgba(255, 255, 255, 0.8); 5113 -webkit-transition: all 0.3s ease-in; 5114 -moz-transition: all 0.3s ease-in; 5115 -o-transition: all 0.3s ease-in; 5116 transition: all 0.3s ease-in; 5117 } 5118 5119 .about_widget .social-icon li a:hover { 5120 color: #fff; 5121 } 5122 5123 .nav_menus_widget ul { 5124 margin: 0; 5125 padding: 0; 5126 list-style: none; 5127 } 5128 5129 .feature-list.style-03 .single-feature-list { 5130 background-color: #fff; 5131 position: relative; 5132 z-index: 0; 5133 overflow: hidden; 5134 } 5135 5136 .feature-list.style-03 .single-feature-list .icon { 5137 position: relative; 5138 z-index: 0; 5139 font-size: 36px; 5140 } 5141 5142 .feature-list.style-03 .single-feature-list .icon:after { 5143 position: absolute; 5144 left: 15px; 5145 top: 0; 5146 width: 70px; 5147 height: 90px; 5148 border-radius: 40px; 5149 content: ''; 5150 -ms-transform: rotate(40deg); 5151 /* IE 9 */ 5152 -webkit-transform: rotate(40deg); 5153 /* Chrome, Safari, Opera */ 5154 transform: rotate(40deg); 5155 z-index: -1; 5156 } 5157 5158 .feature-list.style-03 .single-feature-list .icon.icon-bg-1 { 5159 background-image: unset; 5160 } 5161 5162 .feature-list.style-03 .single-feature-list .icon.icon-bg-1:after { 5163 background-image: -moz-linear-gradient(50deg, #500ade 0%, #9749f8 100%); 5164 background-image: -webkit-linear-gradient(50deg, #500ade 0%, #9749f8 100%); 5165 background-image: -ms-linear-gradient(50deg, #500ade 0%, #9749f8 100%); 5166 } 5167 5168 .feature-list.style-03 .single-feature-list .icon.icon-bg-2 { 5169 background-image: unset; 5170 } 5171 5172 .feature-list.style-03 .single-feature-list .icon.icon-bg-2:after { 5173 background-image: -moz-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 5174 background-image: -webkit-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 5175 background-image: -ms-linear-gradient(50deg, #e877cb 0%, #a197fa 100%); 5176 } 5177 5178 .feature-list.style-03 .single-feature-list .icon.icon-bg-3 { 5179 background-image: unset; 5180 } 5181 5182 .feature-list.style-03 .single-feature-list .icon.icon-bg-3:after { 5183 background-image: -moz-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 5184 background-image: -webkit-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 5185 background-image: -ms-linear-gradient(50deg, #70bfec 0%, #2784fc 100%); 5186 } 5187 5188 .feature-list.style-03 .single-feature-list .icon.icon-bg-4 { 5189 background-image: unset; 5190 } 5191 5192 .feature-list.style-03 .single-feature-list .icon.icon-bg-4:after { 5193 background-image: -moz-linear-gradient(90deg, #ec6c7f 0%, #fa9f69 100%); 5194 background-image: -webkit-linear-gradient(90deg, #ec6c7f 0%, #fa9f69 100%); 5195 background-image: -ms-linear-gradient(90deg, #ec6c7f 0%, #fa9f69 100%); 5196 } 5197 5198 .feature-list.style-03 .single-feature-list:after { 5199 position: absolute; 5200 left: 0; 5201 top: 0; 5202 width: 100%; 5203 height: 5px; 5204 background-image: -moz-linear-gradient(-177deg, #500ade 0%, #d43f8d 100%); 5205 background-image: -webkit-linear-gradient(-177deg, #500ade 0%, #d43f8d 100%); 5206 background-image: -ms-linear-gradient(-177deg, #500ade 0%, #d43f8d 100%); 5207 content: ''; 5208 -ms-transform: translateX(-105%); 5209 /* IE 9 */ 5210 -webkit-transform: translateX(-105%); 5211 /* Chrome, Safari, Opera */ 5212 transform: translateX(-105%); 5213 -webkit-transition: -webkit-transform 1s; 5214 transition: -webkit-transform 1s; 5215 -o-transition: transform 1s; 5216 transition: transform 1s; 5217 transition: transform 1s, -webkit-transform 1s; 5218 } 5219 5220 5221 .feature-list.style-03 .single-feature-list:hover:after { 5222 -ms-transform: translateX(0%); 5223 /* IE 9 */ 5224 -webkit-transform: translateX(0%); 5225 /* Chrome, Safari, Opera */ 5226 transform: translateX(0%); 5227 } 5228 5229 .nav_menus_widget ul li { 5230 margin: 15px 0; 5231 } 5232 5233 .nav_menus_widget ul li:first-child { 5234 margin-top: 0; 5235 } 5236 5237 .nav_menus_widget ul li:last-child { 5238 margin-bottom: 0; 5239 } 5240 5241 .nav_menus_widget ul li a { 5242 color: rgba(255, 255, 255, 0.8); 5243 -webkit-transition: all 0.3s ease-in; 5244 -moz-transition: all 0.3s ease-in; 5245 -o-transition: all 0.3s ease-in; 5246 transition: all 0.3s ease-in; 5247 } 5248 5249 .nav_menus_widget ul li a:hover { 5250 color: #fff; 5251 } 5252 5253 .appside-mail-subscription { 5254 display: block; 5255 width: 100%; 5256 position: relative; 5257 z-index: 0; 5258 margin-top: 20px; 5259 } 5260 5261 .appside-mail-subscription input[type=email] { 5262 width: 100%; 5263 display: block; 5264 height: 50px; 5265 padding: 10px 20px; 5266 padding-right: 65px; 5267 border: none; 5268 border-radius: 5px; 5269 } 5270 5271 .appside-mail-subscription button[type=submit] { 5272 position: absolute; 5273 right: -1px; 5274 top: 0; 5275 border: none; 5276 height: 50px; 5277 width: 50px; 5278 text-align: center; 5279 background-color: var(--main-color-one); 5280 border-top-right-radius: 5px; 5281 border-bottom-right-radius: 5px; 5282 color: #fff; 5283 transition: all 500ms; 5284 cursor: pointer; 5285 } 5286 5287 .appside-mail-subscription button[type=submit]:hover { 5288 opacity: .8; 5289 } 5290 5291 /*-------------------- 5292 Sidebar Area 5293 --------------------*/ 5294 .dark-bg .widget { 5295 background-color: #191946; 5296 } 5297 5298 .dark-bg .widget .widget-title { 5299 color: #fff; 5300 } 5301 5302 .dark-bg .widget ul li a { 5303 color: rgba(255, 255, 255, 0.7); 5304 } 5305 5306 .dark-bg .widget .tagcloud a { 5307 color: rgba(255, 255, 255, 0.7); 5308 border-color: rgba(255, 255, 255, 0.2); 5309 } 5310 5311 .widget { 5312 /*background-color: #f8f8f8;*/ 5313 margin-bottom: 30px; 5314 padding: 25px 30px 30px 30px; 5315 border: 2px solid #fafafa; 5316 border-radius: 3px; 5317 } 5318 5319 .widget.footer-widget { 5320 background-color: transparent; 5321 padding: 0; 5322 } 5323 5324 .widget.footer-widget .widget-title { 5325 font-size: 20px; 5326 line-height: 31px; 5327 font-weight: 600; 5328 margin-bottom: 17px; 5329 } 5330 5331 .widget .widget-title { 5332 font-size: 22px; 5333 font-weight: 600; 5334 line-height: 32px; 5335 margin-bottom: 35px; 5336 position: relative; 5337 z-index: 0; 5338 } 5339 5340 .widget .widget-title:after { 5341 position: absolute; 5342 left: 0; 5343 bottom: -10px; 5344 width: 20px; 5345 height: 2px; 5346 background-color: var(--main-color-one); 5347 content: ''; 5348 transition: all 500ms; 5349 } 5350 5351 .widget:hover .widget-title:after { 5352 width: 50px; 5353 } 5354 5355 .widget:last-child { 5356 margin-bottom: 0px; 5357 } 5358 5359 .widget ul { 5360 margin: 0; 5361 padding: 0; 5362 list-style: none; 5363 } 5364 5365 .widget ul li { 5366 display: block; 5367 margin: 8px 0; 5368 } 5369 5370 .widget ul li:first-child { 5371 margin-top: 0px; 5372 } 5373 5374 .widget ul li:last-child { 5375 margin-bottom: 0px; 5376 } 5377 5378 .widget ul li a { 5379 color: var(--paragraph-color); 5380 -webkit-transition: all 0.3s ease-in; 5381 -moz-transition: all 0.3s ease-in; 5382 -o-transition: all 0.3s ease-in; 5383 transition: all 0.3s ease-in; 5384 } 5385 5386 .widget ul li a:hover { 5387 color: var(--main-color-one); 5388 } 5389 5390 .about_widget .contact-info-list { 5391 margin: 0; 5392 padding: 0; 5393 list-style: none; 5394 } 5395 5396 .about_widget .contact-info-list li { 5397 display: block; 5398 } 5399 5400 .about_widget .social-icon { 5401 margin: 0; 5402 padding: 0; 5403 list-style: none; 5404 } 5405 5406 .about_widget .social-icon li { 5407 display: inline-block; 5408 margin: 0 8px; 5409 } 5410 5411 .about_widget .social-icon li:first-child { 5412 margin-left: 0; 5413 } 5414 5415 .about_widget .social-icon li:last-child { 5416 margin-right: 0; 5417 } 5418 5419 .about_widget .social-icon li a { 5420 -webkit-transition: all 0.3s ease-in; 5421 -moz-transition: all 0.3s ease-in; 5422 -o-transition: all 0.3s ease-in; 5423 transition: all 0.3s ease-in; 5424 } 5425 5426 .about_widget .social-icon li a:hover { 5427 color: var(--main-color-one); 5428 } 5429 5430 .footer-widget.widget_nav_menu ul li a { 5431 position: relative; 5432 padding-left: 15px; 5433 } 5434 5435 .footer-widget.widget_nav_menu ul li a:after { 5436 position: absolute; 5437 left: 0; 5438 top: 0; 5439 content: ""; 5440 font-family: "Fontawesome"; 5441 font-weight: 900; 5442 } 5443 5444 .subscribe-form form { 5445 position: relative; 5446 } 5447 5448 .subscribe-form form .form-control { 5449 width: 100%; 5450 height: 50px; 5451 border: 2px solid #f2f2f2; 5452 background-color: transparent; 5453 color: #838a95; 5454 padding-right: 70px; 5455 font-size: 14px; 5456 } 5457 5458 .subscribe-form form .form-control::-webkit-input-placeholder { 5459 /* WebKit browsers */ 5460 color: #838a95; 5461 } 5462 5463 .subscribe-form form .form-control:-moz-placeholder { 5464 /* Mozilla Firefox 4 to 18 */ 5465 color: #838a95; 5466 } 5467 5468 .subscribe-form form .form-control::-moz-placeholder { 5469 /* Mozilla Firefox 19+ */ 5470 color: #838a95; 5471 } 5472 5473 .subscribe-form form .form-control:-ms-input-placeholder { 5474 /* Internet Explorer 10+ */ 5475 color: #838a95; 5476 } 5477 5478 .submit-btn-02 { 5479 display: inline-block; 5480 text-align: center; 5481 height: 60px; 5482 line-height: 60px; 5483 font-size: 16px; 5484 text-transform: capitalize; 5485 font-weight: 600; 5486 color: #fff; 5487 width: 202px; 5488 background-color: var(--main-color-one); 5489 padding: 0 20px; 5490 -webkit-transition: all 0.3s ease-in; 5491 -moz-transition: all 0.3s ease-in; 5492 -o-transition: all 0.3s ease-in; 5493 transition: all 0.3s ease-in; 5494 cursor: pointer; 5495 border: none; 5496 border-radius: 5px; 5497 } 5498 5499 .submit-btn-02:hover { 5500 color: #fff; 5501 background-color: var(--secondary-color); 5502 } 5503 5504 .subscribe-form form .submit-btn { 5505 position: absolute; 5506 right: 0; 5507 top: 0; 5508 width: 60px; 5509 height: 50px; 5510 border-top-right-radius: 5px; 5511 border-bottom-right-radius: 5px; 5512 -webkit-transition: all 0.3s ease-in; 5513 -moz-transition: all 0.3s ease-in; 5514 -o-transition: all 0.3s ease-in; 5515 transition: all 0.3s ease-in; 5516 } 5517 5518 .subscribe-form form .submit-btn:hover { 5519 background-color: var(--main-color-one); 5520 opacity: .8; 5521 } 5522 5523 .widget_cgency_subscribe form { 5524 position: relative; 5525 } 5526 5527 .widget_cgency_subscribe form .form-control { 5528 width: 100%; 5529 height: 50px; 5530 border: 1px solid rgba(255, 255, 255, 0.6); 5531 background-color: transparent; 5532 color: #fff; 5533 padding-right: 70px; 5534 } 5535 5536 .widget_cgency_subscribe form .submit-btn { 5537 position: absolute; 5538 right: 0; 5539 top: 0; 5540 width: 60px; 5541 height: 50px; 5542 border-top-right-radius: 5px; 5543 border-bottom-right-radius: 5px; 5544 -webkit-transition: all 0.3s ease-in; 5545 -moz-transition: all 0.3s ease-in; 5546 -o-transition: all 0.3s ease-in; 5547 transition: all 0.3s ease-in; 5548 } 5549 5550 .widget_cgency_subscribe form .submit-btn:hover { 5551 background-color: var(--main-color-one); 5552 opacity: .8; 5553 } 5554 5555 .about_widget .footer-logo { 5556 margin-bottom: 25px; 5557 display: block; 5558 } 5559 5560 .about_widget .subscribe-form { 5561 margin-top: 25px; 5562 } 5563 5564 .widget_search .search-form { 5565 position: relative; 5566 } 5567 5568 .widget_search .search-form .form-group { 5569 margin-bottom: 0; 5570 } 5571 5572 .widget_search .search-form .form-group .form-control { 5573 height: 50px; 5574 border: 1px solid rgba(0, 0, 0, 0.2); 5575 padding-right: 70px; 5576 } 5577 5578 .widget_search .search-form .submit-btn { 5579 position: absolute; 5580 right: 0; 5581 top: 0; 5582 width: 50px; 5583 height: 50px; 5584 line-height: 50px; 5585 } 5586 5587 .widget_author_meta { 5588 text-align: center; 5589 } 5590 5591 .widget_author_meta .thumb { 5592 width: 80px; 5593 height: 80px; 5594 margin: 0 auto; 5595 margin-bottom: 20px; 5596 } 5597 5598 .widget_author_meta .thumb img { 5599 border-radius: 50%; 5600 } 5601 5602 .widget_author_meta .content .name { 5603 font-size: 21px; 5604 font-weight: 700; 5605 } 5606 5607 .widget_author_meta .content p { 5608 font-size: 16px; 5609 line-height: 26px; 5610 } 5611 5612 .widget_author_meta .content ul { 5613 margin-top: 25px; 5614 } 5615 5616 .widget_author_meta .content ul li { 5617 display: inline-block; 5618 margin: 0 5px; 5619 } 5620 5621 .widget_author_meta .content ul li a { 5622 display: block; 5623 width: 40px; 5624 height: 40px; 5625 line-height: 40px; 5626 text-align: center; 5627 border: 1px solid rgba(0, 0, 0, 0.1); 5628 border-radius: 50%; 5629 -webkit-transition: all 0.3s ease-in; 5630 -moz-transition: all 0.3s ease-in; 5631 -o-transition: all 0.3s ease-in; 5632 transition: all 0.3s ease-in; 5633 } 5634 5635 .widget_author_meta .content ul li a:hover { 5636 background-color: var(--main-color-one); 5637 color: #fff; 5638 } 5639 5640 .widget_popular_posts .single-popular-post-item { 5641 display: -webkit-box; 5642 display: -ms-flexbox; 5643 display: flex; 5644 -ms-flex-item-align: start; 5645 align-self: flex-start; 5646 } 5647 5648 .widget_popular_posts .single-popular-post-item:last-child .content .title { 5649 margin-bottom: 0; 5650 } 5651 5652 .widget_popular_posts .single-popular-post-item .thumb { 5653 margin-right: 20px; 5654 } 5655 5656 .widget_popular_posts .single-popular-post-item .content { 5657 -webkit-box-flex: 1; 5658 -ms-flex: 1; 5659 flex: 1; 5660 } 5661 5662 .widget_popular_posts .single-popular-post-item .content .time { 5663 color: var(--main-color-one); 5664 font-size: 12px; 5665 line-height: 24px; 5666 margin-bottom: 15px; 5667 font-weight: 500; 5668 } 5669 5670 .widget_popular_posts .single-popular-post-item .content .title { 5671 font-size: 18px; 5672 line-height: 26px; 5673 font-family: var(--heading-font); 5674 font-weight: 400; 5675 color: var(--heading-color); 5676 } 5677 5678 .widget_tag_cloud .tagcloud a { 5679 display: inline-block; 5680 padding: 5px 15px; 5681 margin: 5px; 5682 color: var(--paragraph-color); 5683 -webkit-transition: all 0.3s ease-in; 5684 -moz-transition: all 0.3s ease-in; 5685 -o-transition: all 0.3s ease-in; 5686 transition: all 0.3s ease-in; 5687 border-radius: 5px; 5688 } 5689 5690 .widget_tag_cloud .tagcloud a:hover { 5691 background-color: var(--main-color-one); 5692 color: #fff; 5693 } 5694 5695 .widget_categories.footer-widget ul li.cat-item:after { 5696 display: none; 5697 } 5698 5699 .widget_categories.footer-widget ul li.cat-item { 5700 padding-left: 0; 5701 } 5702 5703 .footer-widget.widget ul li a:hover { 5704 color: #fff !important; 5705 } 5706 5707 .footer-widget.widget_rss ul li a.rsswidget { 5708 color: #fff; 5709 } 5710 5711 .footer-widget.widget { 5712 margin-bottom: 40px; 5713 } 5714 5715 /*-------------------- 5716 Blog Page 5717 --------------------*/ 5718 .single-post-details-item .entry-content p:last-child { 5719 margin-bottom: 0; 5720 } 5721 5722 .single-blog-classic-item.sticky { 5723 position: relative; 5724 z-index: 0; 5725 background-color: #f5f5f5; 5726 } 5727 5728 .single-blog-classic-item.sticky:after { 5729 position: absolute; 5730 right: 10px; 5731 top: 10px; 5732 font-family: 'fontawesome'; 5733 content: "\f08d"; 5734 font-size: 20px; 5735 color: var(--main-color-one); 5736 } 5737 5738 .single-post-details-item .thumb, 5739 .single-blog-classic-item .thumb { 5740 position: relative; 5741 z-index: 0 5742 } 5743 .single-post-details-item .thumb .time , 5744 .single-blog-classic-item .thumb .time { 5745 position: absolute; 5746 left: 0; 5747 bottom: 0; 5748 width: 70px; 5749 height: 70px; 5750 line-height: 65px; 5751 text-align: center; 5752 background-color: var(--main-color-one); 5753 color: #fff; 5754 z-index: 2; 5755 } 5756 .single-post-details-item .thumb .time .date , 5757 .single-blog-classic-item .thumb .time .date { 5758 font-weight: 600; 5759 font-size: 26px; 5760 line-height: 35px; 5761 display: block; 5762 margin-top: 10px; 5763 } 5764 .single-post-details-item .thumb .time .month , 5765 .single-blog-classic-item .thumb .time .month { 5766 font-weight: 600; 5767 font-size: 14px; 5768 line-height: 16px; 5769 display: block; 5770 } 5771 5772 .single-blog-classic-item .content { 5773 border: 2px solid #fafafa; 5774 padding: 30px; 5775 } 5776 5777 .single-blog-classic-item .content .title { 5778 font-size: 26px; 5779 line-height: 36px; 5780 margin-bottom: 15px; 5781 word-break: break-word; 5782 font-weight: 600; 5783 } 5784 5785 .single-blog-classic-item .content .title a { 5786 color: var(--heading-color); 5787 -webkit-transition: all 0.3s ease-in; 5788 -moz-transition: all 0.3s ease-in; 5789 -o-transition: all 0.3s ease-in; 5790 transition: all 0.3s ease-in; 5791 } 5792 5793 .single-blog-classic-item .content .title a:hover { 5794 color: var(--main-color-one); 5795 } 5796 5797 .single-blog-classic-item .content .post-meta { 5798 margin: 0; 5799 padding: 0; 5800 list-style: none; 5801 margin-bottom: 10px; 5802 } 5803 5804 .single-blog-classic-item .content .post-meta li i { 5805 color: var(--main-color-one); 5806 } 5807 5808 .single-blog-classic-item .content .post-meta li { 5809 display: inline-block; 5810 margin: 0 10px; 5811 font-size: 14px; 5812 } 5813 5814 5815 .single-blog-classic-item .content .post-meta li a { 5816 color: var(--paragraph-color); 5817 -webkit-transition: all 0.3s ease-in; 5818 -moz-transition: all 0.3s ease-in; 5819 -o-transition: all 0.3s ease-in; 5820 transition: all 0.3s ease-in; 5821 } 5822 5823 .single-blog-classic-item .content .post-meta li a:hover { 5824 color: var(--main-color-one);; 5825 } 5826 5827 .single-blog-classic-item .content .post-meta li:first-child { 5828 margin-left: 0; 5829 } 5830 5831 .single-blog-classic-item .content .post-meta li:last-child { 5832 margin-right: 0; 5833 } 5834 5835 .single-blog-classic-item .content .readmore { 5836 color: var(--paragraph-color); 5837 -webkit-transition: all 0.3s ease-in; 5838 -moz-transition: all 0.3s ease-in; 5839 -o-transition: all 0.3s ease-in; 5840 transition: all 0.3s ease-in; 5841 } 5842 5843 .single-blog-classic-item .content .readmore:hover { 5844 color: var(--main-color-one);; 5845 } 5846 5847 .single-blog-classic-item.format-link, 5848 .single-blog-classic-item.format-quote { 5849 position: relative; 5850 z-index: 0; 5851 padding: 30px; 5852 border: 2px solid #fafafa; 5853 border-radius: 3px; 5854 } 5855 5856 .single-blog-classic-item.format-link .title, 5857 .single-blog-classic-item.format-quote .title { 5858 font-size: 26px; 5859 line-height: 38px; 5860 margin-bottom: 0; 5861 font-weight: 600; 5862 } 5863 5864 .single-blog-classic-item.format-link:after, 5865 .single-blog-classic-item.format-quote:after { 5866 position: absolute; 5867 right: 30px; 5868 top: 30px; 5869 font-family: 'fontawesome'; 5870 content: "\f0c1"; 5871 font-size: 30px; 5872 z-index: -1; 5873 color: rgba(0, 0, 0, 0.3); 5874 } 5875 5876 .single-blog-classic-item.format-quote:after { 5877 content: "\f10e"; 5878 } 5879 5880 .single-blog-classic-item.format-video .thumb { 5881 position: relative; 5882 z-index: 0; 5883 } 5884 5885 .single-blog-classic-item.format-video .thumb .hover { 5886 position: absolute; 5887 left: 0; 5888 top: 0; 5889 display: flex; 5890 width: 100%; 5891 height: 100%; 5892 flex-direction: column; 5893 align-items: center; 5894 justify-content: center; 5895 } 5896 5897 .no-results.not-found .page-title { 5898 font-size: 30px; 5899 line-height: 36px; 5900 font-weight: 700; 5901 margin-bottom: 16px; 5902 } 5903 5904 .no-results.not-found .search-form { 5905 position: relative; 5906 z-index: 0; 5907 margin-top: 30px; 5908 } 5909 5910 .no-results.not-found .search-form .form-control { 5911 height: 50px; 5912 padding: 0 60px 0 20px; 5913 } 5914 5915 .no-results.not-found .search-form .submit-btn { 5916 position: absolute; 5917 right: 0; 5918 top: 0; 5919 width: 60px; 5920 height: 100%; 5921 border-top-right-radius: 5px; 5922 border-bottom-right-radius: 5px; 5923 padding: 0; 5924 line-height: 50px; 5925 } 5926 5927 .single-blog-grid-item { 5928 margin-bottom: 25px; 5929 } 5930 5931 .single-blog-grid-item.white .content .post-meta li a { 5932 color: rgba(255, 255, 255, 0.7); 5933 } 5934 5935 .single-blog-grid-item.white .content .title a { 5936 color: #fff; 5937 } 5938 5939 .single-blog-grid-item.white .content .readmore { 5940 color: rgba(255, 255, 255, 0.7); 5941 } 5942 5943 .single-blog-grid-item .thumb { 5944 margin-bottom: 23px; 5945 } 5946 5947 .single-blog-grid-item .content .title { 5948 font-size: 22px; 5949 line-height: 32px; 5950 margin-bottom: 22px; 5951 font-weight: 700; 5952 } 5953 5954 .single-blog-grid-item .content .title a { 5955 color: var(--heading-color); 5956 -webkit-transition: all 0.3s ease-in; 5957 -moz-transition: all 0.3s ease-in; 5958 -o-transition: all 0.3s ease-in; 5959 transition: all 0.3s ease-in; 5960 } 5961 5962 .single-blog-grid-item .content .title a:hover { 5963 color: var(--main-color-one); 5964 } 5965 5966 .single-blog-grid-item .content .post-meta { 5967 margin: 0; 5968 padding: 0; 5969 list-style: none; 5970 margin-bottom: 10px; 5971 } 5972 5973 .single-blog-grid-item .content .post-meta li { 5974 display: inline-block; 5975 margin: 0 10px; 5976 font-size: 14px; 5977 } 5978 5979 .single-blog-grid-item .content .post-meta li a { 5980 color: var(--paragraph-color); 5981 -webkit-transition: all 0.3s ease-in; 5982 -moz-transition: all 0.3s ease-in; 5983 -o-transition: all 0.3s ease-in; 5984 transition: all 0.3s ease-in; 5985 } 5986 5987 .single-blog-grid-item .content .post-meta li a:hover { 5988 color: var(--main-color-one);; 5989 } 5990 5991 .single-blog-grid-item .content .post-meta li:first-child { 5992 margin-left: 0; 5993 } 5994 5995 .single-blog-grid-item .content .post-meta li:last-child { 5996 margin-right: 0; 5997 } 5998 5999 .single-blog-grid-item .content .readmore { 6000 color: var(--paragraph-color); 6001 -webkit-transition: all 0.3s ease-in; 6002 -moz-transition: all 0.3s ease-in; 6003 -o-transition: all 0.3s ease-in; 6004 transition: all 0.3s ease-in; 6005 } 6006 6007 .single-blog-grid-item .content .readmore:hover { 6008 color: var(--main-color-one);; 6009 } 6010 6011 .blog-pagination .pagination { 6012 margin: 0; 6013 padding: 0; 6014 list-style: none; 6015 display: block; 6016 } 6017 6018 .blog-pagination .pagination .page-item { 6019 display: inline-block; 6020 margin: 0 5px; 6021 } 6022 6023 .blog-pagination .pagination .page-item:first-child { 6024 margin-left: 0; 6025 } 6026 6027 .blog-pagination .pagination .page-item.active .page-link, .blog-pagination .pagination .page-item:hover .page-link { 6028 color: #fff; 6029 background-image: -moz-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 6030 background-image: -webkit-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 6031 background-image: -ms-linear-gradient(50deg, #5e2ced 0%, #9749f8 100%); 6032 } 6033 6034 .blog-pagination .pagination .page-item .page-link { 6035 display: inline-block; 6036 width: 40px; 6037 height: 40px; 6038 line-height: 40px; 6039 padding: 0; 6040 font-weight: 600; 6041 font-size: 14px; 6042 border: none; 6043 text-align: center; 6044 color: var(--paragraph-color); 6045 -webkit-transition: all 0.3s ease-in; 6046 -moz-transition: all 0.3s ease-in; 6047 -o-transition: all 0.3s ease-in; 6048 transition: all 0.3s ease-in; 6049 border: 2px solid #ededed; 6050 } 6051 6052 /*----------------------- 6053 Error 404 Page 6054 -----------------------*/ 6055 .error-404 { 6056 text-align: center; 6057 } 6058 6059 .error-404 .boxed-btn { 6060 width: auto; 6061 padding: 0 40px; 6062 border-radius: 5px; 6063 } 6064 6065 .error-404 .title { 6066 font-size: 200px; 6067 line-height: 160px; 6068 font-weight: 700; 6069 margin-bottom: 45px; 6070 color: var(--main-color-one); 6071 } 6072 6073 .error-404 .subtitle { 6074 font-size: 24px; 6075 line-height: 34px; 6076 font-weight: 600; 6077 margin-bottom: 20px; 6078 } 6079 6080 .error-404 .search-form { 6081 position: relative; 6082 z-index: 0; 6083 margin-top: 36px; 6084 } 6085 6086 .error-404 .search-form .form-control { 6087 height: 54px; 6088 padding: 0 20px; 6089 } 6090 6091 .error-404 .search-form .submit-btn { 6092 position: absolute; 6093 right: 0; 6094 top: 0; 6095 width: 70px; 6096 text-align: center; 6097 padding: 0; 6098 height: 55px; 6099 border-top-right-radius: 5px; 6100 border-bottom-right-radius: 5px; 6101 } 6102 6103 /*-------------------- 6104 Blog Details 6105 --------------------*/ 6106 .single-post-details-item table, 6107 .page-content table, 6108 .appside-page-content-area table { 6109 border-collapse: collapse; 6110 width: 100%; 6111 margin-bottom: 10px; 6112 } 6113 6114 .single-post-details-item table td, 6115 .page-content table td, 6116 .single-post-details-item table th, 6117 .page-content table th, 6118 .appside-page-content-area table th, 6119 .appside-page-content-area table td { 6120 border: 1px solid #e3e3e3; 6121 padding: 8px; 6122 } 6123 6124 .single-post-details-item table th, 6125 .appside-page-content-area table th, 6126 .page-content table th { 6127 padding-top: 12px; 6128 padding-bottom: 12px; 6129 text-align: left; 6130 } 6131 6132 .single-post-details-item.dark-bg .entry-footer { 6133 border-color: rgba(255, 255, 255, 0.2); 6134 } 6135 6136 .single-post-details-item.dark-bg .entry-footer .left .title, .single-post-details-item.dark-bg .entry-footer .right .title { 6137 color: rgba(255, 255, 255, 0.8); 6138 } 6139 6140 .single-post-details-item.dark-bg .entry-footer .left a, .single-post-details-item.dark-bg .entry-footer .right a { 6141 color: rgba(255, 255, 255, 0.7); 6142 } 6143 6144 .single-post-details-item.dark-bg .entry-content .title { 6145 color: #fff; 6146 } 6147 6148 .single-post-details-item.dark-bg .entry-content blockquote { 6149 background-color: #191946; 6150 color: rgba(255, 255, 255, 0.7); 6151 } 6152 6153 .single-post-details-item.dark-bg .entry-content p { 6154 color: rgba(255, 255, 255, 0.7); 6155 } 6156 6157 .single-post-details-item.dark-bg .entry-content .post-meta li { 6158 color: rgba(255, 255, 255, 0.8); 6159 } 6160 6161 .single-post-details-item.dark-bg .entry-content .post-meta li a { 6162 color: rgba(255, 255, 255, 0.8); 6163 } 6164 6165 .single-post-details-item.dark-bg .entry-content .post-meta li.cat a { 6166 color: rgba(255, 255, 255, 0.8); 6167 } 6168 6169 .single-post-details-item .thumb { 6170 margin-bottom: 30px; 6171 } 6172 6173 .single-post-details-item .entry-content .title { 6174 font-size: 32px; 6175 line-height: 40px; 6176 font-weight: 600; 6177 margin-bottom: 15px; 6178 } 6179 6180 .single-post-details-item .entry-content .gal-img { 6181 margin: 10px 0 15px 0; 6182 } 6183 6184 .single-post-details-item .entry-content .post-meta { 6185 margin: 0; 6186 padding: 0; 6187 margin-bottom: 30px; 6188 } 6189 6190 .single-post-details-item .entry-content .post-meta li { 6191 margin: 0 8px; 6192 display: inline-block; 6193 font-size: 14px; 6194 } 6195 6196 .single-post-details-item .entry-content .post-meta li:first-child { 6197 margin-left: 0; 6198 } 6199 6200 .single-post-details-item .entry-content .post-meta li:last-child { 6201 margin-right: 0; 6202 } 6203 6204 .single-post-details-item .entry-content .post-meta li.cat a { 6205 margin: 0 5px; 6206 color: var(--paragraph-color); 6207 position: relative; 6208 z-index: 0; 6209 } 6210 6211 .single-post-details-item .entry-content .post-meta li.cat a:first-child { 6212 margin-left: 0; 6213 } 6214 6215 .single-post-details-item .entry-content .post-meta li.cat a:last-child { 6216 margin-right: 0; 6217 } 6218 6219 .single-post-details-item .entry-content .post-meta li.cat a:last-child:after { 6220 display: none; 6221 } 6222 6223 .single-post-details-item .entry-content .post-meta li.cat a:after { 6224 position: absolute; 6225 right: -5px; 6226 top: 0; 6227 content: ','; 6228 } 6229 6230 .single-post-details-item .entry-content .post-meta li > i, 6231 .single-post-details-item .entry-content .post-meta li a > i { 6232 color: var(--main-color-one); 6233 } 6234 6235 .single-post-details-item .entry-content .post-meta li a { 6236 -webkit-transition: all 0.3s ease-in; 6237 -moz-transition: all 0.3s ease-in; 6238 -o-transition: all 0.3s ease-in; 6239 transition: all 0.3s ease-in; 6240 color: var(--paragraph-color); 6241 } 6242 6243 .single-post-details-item .entry-content .post-meta li a:hover { 6244 color: var(--main-color-one);; 6245 } 6246 6247 .single-post-details-item .entry-content blockquote:not([class]), 6248 .appside-page-content-area blockquote:not([class]) { 6249 background-color: #fff; 6250 border-left: 5px solid var(--main-color-one); 6251 padding: 22px 30px 24px 30px; 6252 font-size: 18px; 6253 font-style: italic; 6254 line-height: 28px; 6255 margin: 25px 0; 6256 quotes: "“" "”"; 6257 position: relative; 6258 z-index: 0; 6259 } 6260 6261 .single-post-details-item .entry-content blockquote:not([class]):after, 6262 .appside-page-content-area blockquote:not([class]):after { 6263 position: absolute; 6264 left: 0; 6265 top: 0; 6266 content: open-quote; 6267 font-size: 92px; 6268 font-size: 5.75rem; 6269 line-height: 1; 6270 display: inline-block; 6271 float: left; 6272 margin-right: 20px; 6273 color: #4b87fd; 6274 z-index: -1; 6275 opacity: .2; 6276 } 6277 6278 .wp-block-quote { 6279 quotes: "“" "”"; 6280 overflow: hidden; 6281 margin: 30px 0; 6282 color: #2e3652; 6283 font-size: 18px; 6284 font-size: 1.125rem; 6285 position: relative; 6286 font-weight: 700; 6287 line-height: 1.5; 6288 border: 2px solid #fafafa; 6289 padding: 30px 0; 6290 border-left-color: var(--main-color-one) !important; 6291 padding-right: 30px; 6292 } 6293 6294 .wp-block-quote:before { 6295 content: open-quote; 6296 font-size: 92px; 6297 font-size: 5.75rem; 6298 line-height: 1; 6299 display: inline-block; 6300 float: left; 6301 margin-right: 20px; 6302 color: var(--main-color-one); 6303 } 6304 6305 .wp-block-quote cite { 6306 display: block; 6307 font-size: 18px; 6308 font-weight: 600; 6309 line-height: 26px; 6310 margin-top: 20px; 6311 margin-left: 60px; 6312 } 6313 6314 .single-post-details-item .entry-content blockquote cite, 6315 .appside-page-content-area blockquote cite { 6316 display: block; 6317 font-size: 16px; 6318 font-weight: 500; 6319 line-height: 26px; 6320 margin-top: 20px; 6321 } 6322 6323 .single-post-details-item .entry-footer { 6324 margin-top: 26px; 6325 display: -webkit-box; 6326 display: -ms-flexbox; 6327 display: flex; 6328 -webkit-box-pack: justify; 6329 -ms-flex-pack: justify; 6330 justify-content: space-between; 6331 } 6332 6333 .single-post-details-item .entry-footer .left { 6334 display: inline-block; 6335 } 6336 6337 .single-post-details-item .entry-footer .left ul { 6338 margin: 0; 6339 padding: 0; 6340 list-style: none; 6341 } 6342 6343 .single-post-details-item .entry-footer .left ul li { 6344 display: inline-block; 6345 margin: 0 5px; 6346 } 6347 6348 .single-post-details-item .entry-footer .left ul li.title { 6349 font-weight: 600; 6350 color: var(--heading-color); 6351 font-size: 18px; 6352 } 6353 6354 .single-post-details-item .entry-footer .left ul li:first-child { 6355 margin-left: 0; 6356 } 6357 6358 .single-post-details-item .entry-footer .left ul li:last-child { 6359 margin-right: 0; 6360 } 6361 6362 .single-post-details-item .entry-footer .left ul li a { 6363 color: var(--paragraph-color); 6364 margin: 0 5px; 6365 position: relative; 6366 z-index: 0; 6367 -webkit-transition: all 0.3s ease-in; 6368 -moz-transition: all 0.3s ease-in; 6369 -o-transition: all 0.3s ease-in; 6370 transition: all 0.3s ease-in; 6371 } 6372 6373 .single-post-details-item .entry-footer .left ul li a { 6374 display: inline-block; 6375 border: 2px solid #fafafa; 6376 font-size: 14px; 6377 padding: 4px 15px; 6378 border-radius: 5px; 6379 } 6380 6381 .single-post-details-item .entry-footer .left ul li a:hover { 6382 background-color: var(--main-color-one); 6383 color: #fff; 6384 } 6385 6386 .single-post-details-item .entry-footer .left ul li a:first-child { 6387 margin-left: 0; 6388 } 6389 6390 .single-post-details-item .entry-footer .left ul li a:last-child { 6391 margin-right: 0; 6392 } 6393 6394 .single-post-details-item .entry-footer .left ul li a:last-child:after { 6395 display: none; 6396 } 6397 6398 .single-post-details-item .entry-footer .right { 6399 display: inline-block; 6400 } 6401 6402 .single-post-details-item .entry-footer .right ul { 6403 margin: 0; 6404 padding: 0; 6405 list-style: none; 6406 } 6407 6408 .single-post-details-item .entry-footer .right ul li { 6409 display: inline-block; 6410 margin: 0 5px; 6411 } 6412 6413 .single-post-details-item .entry-footer .right ul li.title { 6414 font-weight: 600; 6415 color: var(--heading-color); 6416 font-size: 18px; 6417 } 6418 6419 .single-post-details-item .entry-footer .right ul li a { 6420 -webkit-transition: all 0.3s ease-in; 6421 -moz-transition: all 0.3s ease-in; 6422 -o-transition: all 0.3s ease-in; 6423 transition: all 0.3s ease-in; 6424 display: inline-block; 6425 width: 40px; 6426 height: 40px; 6427 text-align: center; 6428 line-height: 40px; 6429 border-radius: 3px; 6430 color: #fff; 6431 } 6432 6433 .single-post-details-item .entry-footer .right ul li .facebook { 6434 background-color: #3b5998; 6435 } 6436 6437 .single-post-details-item .entry-footer .right ul li .twitter { 6438 background-color: #55acee; 6439 } 6440 6441 .single-post-details-item .entry-footer .right ul li .linkedin { 6442 background-color: #0077b5; 6443 } 6444 6445 .single-post-details-item .entry-footer .right ul li .pinterest { 6446 background-color: #bd081c; 6447 } 6448 6449 .single-post-details-item .entry-footer .right ul li a:hover { 6450 opacity: .8; 6451 } 6452 6453 .dark-bg .comment-area .comment-title { 6454 color: #fff; 6455 } 6456 6457 .dark-bg .comment-area .comment-list li .single-comment-wrap .content .date, .dark-bg .comment-area .comment-list li .single-comment-wrap .content .time { 6458 color: rgba(255, 255, 255, 0.7); 6459 } 6460 6461 .dark-bg .comment-area .comment-list li .single-comment-wrap .content .title { 6462 color: #fff; 6463 } 6464 6465 .dark-bg .comment-area .comment-list li .single-comment-wrap .content p { 6466 color: rgba(255, 255, 255, 0.7); 6467 } 6468 6469 .dark-bg .comment-area .comment-list li .single-comment-wrap .content .reply { 6470 color: rgba(255, 255, 255, 0.7); 6471 } 6472 6473 .dark-bg .comment-form-wrap .title { 6474 color: #fff; 6475 } 6476 6477 .dark-bg .comment-form-wrap .comment-form .form-group .form-control { 6478 background-color: rgba(16, 16, 45, 0.7); 6479 border-color: rgba(255, 255, 255, 0.2); 6480 color: rgba(255, 255, 255, 0.7); 6481 } 6482 6483 ul.xg-comments-meta { 6484 margin: 0; 6485 padding: 0; 6486 list-style: none; 6487 margin-bottom: 10px; 6488 } 6489 6490 ul.xg-comments-meta li { 6491 display: inline-block; 6492 font-size: 14px; 6493 line-height: 24px; 6494 font-weight: 500; 6495 position: relative; 6496 z-index: 0; 6497 } 6498 6499 ul.xg-comments-meta li:after { 6500 position: absolute; 6501 right: -12px; 6502 top: 0; 6503 content: "|"; 6504 } 6505 6506 ul.xg-comments-meta li + li, 6507 .comments-area .comment-list li ul.children ul.xg-comments-meta li + li { 6508 margin-left: 16px; 6509 } 6510 6511 .comments-area .comment-list li ul.children ul.xg-comments-meta li { 6512 margin-left: 0; 6513 } 6514 6515 ul.xg-comments-meta li:last-child:after { 6516 display: none; 6517 } 6518 6519 ul.xg-comments-meta li > a { 6520 transition: all 500ms; 6521 } 6522 6523 ul.xg-comments-meta li > a:hover { 6524 color: var(--main-color-one); 6525 } 6526 6527 .comments-area .comment-list li .single-comment-wrap .content .title { 6528 margin-bottom: 0px; 6529 } 6530 6531 /*---------------------------- 6532 Portfolio Sidebar 6533 ----------------------------*/ 6534 .portfolio-sidebar .title { 6535 font-size: 22px; 6536 line-height: 32px; 6537 font-weight: 600; 6538 } 6539 6540 .portfolio-sidebar .portfolio-meta { 6541 margin: 0; 6542 padding: 0; 6543 list-style: none; 6544 margin-top: 15px; 6545 } 6546 6547 .portfolio-sidebar .portfolio-meta li .label { 6548 width: 120px; 6549 display: inline-block; 6550 font-weight: 600; 6551 color: var(--heading-color); 6552 position: relative; 6553 } 6554 6555 .portfolio-sidebar .portfolio-meta li+li { 6556 margin-top: 10px; 6557 } 6558 6559 .portfolio-sidebar .portfolio-meta li .label:after { 6560 position: absolute; 6561 right: 0; 6562 top: 0; 6563 content: ":"; 6564 padding-right: 10px; 6565 } 6566 .portfolio-sidebar .portfolio-meta li .cats a+a:before { 6567 position: static; 6568 content: ","; 6569 padding-right: 5px; 6570 } 6571 6572 .portfolio-sidebar .portfolio-meta li .cats a { 6573 transition: all 300ms; 6574 } 6575 6576 .portfolio-sidebar .portfolio-meta li .cats a:hover { 6577 color: var(--main-color-one); 6578 } 6579 .single-portfolio-details-item .entry-content p { 6580 line-height: 2; 6581 } 6582 .single-portfolio-details-item .thumb { 6583 margin-bottom: 30px; 6584 } 6585 /*----------------------------- 6586 Portfolio Grid 6587 -----------------------------*/ 6588 .single-portfolio-style-01{ 6589 margin-bottom: 30px; 6590 } 6591 .single-portfolio-style-01 .content .title { 6592 font-size: 24px; 6593 line-height: 34px; 6594 font-weight: 500; 6595 color: var(--heading-color); 6596 text-transform: capitalize; 6597 } 6598 .single-portfolio-style-01 .thumbnail img{ 6599 border-radius: 20px; 6600 } 6601 .single-portfolio-style-01 .thumbnail { 6602 margin-bottom: 25px; 6603 } 6604 6605 .single-portfolio-style-01 .content .cats { 6606 font-size: 14px; 6607 line-height: 24px; 6608 color: var(--paragraph-color); 6609 } 6610 6611 .single-portfolio-style-01 .content .cats a+a:before { 6612 position: static; 6613 content: ","; 6614 padding-right: 5px; 6615 } 6616 6617 .single-portfolio-style-01 .content .cats a { 6618 transition: all 300ms; 6619 } 6620 6621 .single-portfolio-style-01 .content .cats a:hover { 6622 color: var(--main-color-one); 6623 }