default-style.css (24431B)
1 /*-------------------------------------------------------------- 2 >>> TABLE OF CONTENTS: 3 ---------------------------------------------------------------- 4 5 # Normalize 6 # Accessibility 7 # Alignments 8 # Clearings 9 # Widgets 10 # Content 11 ## Posts and pages 12 ## Comments 13 # Media 14 ## Captions 15 ## Galleries 16 # Gutenberg Default Style 17 ## Block Color Palette Colors 18 # Unit test 19 --------------------------------------------------------------*/ 20 21 /*-------------------------------------------------------------- 22 # Normalize 23 --------------------------------------------------------------*/ 24 html { 25 -webkit-text-size-adjust: 100%; 26 -ms-text-size-adjust: 100%; 27 overflow-x: hidden; 28 } 29 30 * { 31 -webkit-box-sizing: border-box; 32 box-sizing: border-box; 33 outline: none; 34 -moz-osx-font-smoothing: grayscale; 35 /* Firefox */ 36 -webkit-font-smoothing: antialiased; 37 /* WebKit */ 38 } 39 40 body { 41 margin: 0; 42 color: var(--paragraph-color); 43 overflow-x: hidden; 44 } 45 46 h1 { 47 font-size: 48px; 48 line-height: 1.0833333333333333; 49 } 50 51 h2 { 52 font-size: 36px; 53 line-height: 1.4444444444444444; 54 } 55 56 h3 { 57 font-size: 24px; 58 line-height: 1.0833333333333333; 59 } 60 61 h4 { 62 font-size: 20px; 63 line-height: 1.2380952380952381; 64 } 65 66 h1, 67 h2, 68 h3, 69 h4, 70 h5, 71 h6 { 72 color: var(--heading-color); 73 } 74 75 p { 76 color:var(--paragraph-color); 77 margin-bottom: 10px; 78 line-height: 1.6; 79 } 80 81 a { 82 color: inherit; 83 text-decoration: none; 84 } 85 86 a, 87 a:hover, 88 a:focus, 89 a:active { 90 text-decoration: none; 91 outline: none; 92 color: inherit; 93 } 94 pre{ 95 word-break: break-word; 96 } 97 a i { 98 padding: 0 2px; 99 } 100 101 img { 102 max-width: 100%; 103 height: auto; 104 } 105 106 ol li +li, 107 ol li ol li:first-child, 108 ol li ul li:first-child{ 109 margin-top: 10px; 110 } 111 112 /*input and button type focus outline disable*/ 113 input[type="text"]:focus, 114 input[type="email"]:focus, 115 input[type="url"]:focus, 116 input[type="password"]:focus, 117 input[type="search"]:focus, 118 input[type="tel"]:focus, 119 input[type="number"]:focus, 120 textarea:focus, 121 input[type="button"]:focus, 122 input[type="reset"]:focus, 123 input[type="submit"]:focus, 124 select:focus { 125 outline: none; 126 -webkit-box-shadow: none; 127 box-shadow: none; 128 border: 1px solid #ddd; 129 } 130 code{ 131 color: #fc4444; 132 } 133 134 .site-main .comment-navigation, 135 .site-main .posts-navigation, 136 .site-main .post-navigation { 137 clear: both; 138 } 139 140 .comment-navigation .nav-previous, 141 .posts-navigation .nav-previous, 142 .post-navigation .nav-previous { 143 float: left; 144 width: 180px; 145 text-align: center; 146 height: 50px; 147 border-radius: 5px; 148 line-height: 50px; 149 color: #fff; 150 transition: .3s ease-in; 151 border:1px solid #e2e2e2; 152 } 153 154 .comment-navigation .nav-next, 155 .posts-navigation .nav-next, 156 .post-navigation .nav-next { 157 float: right; 158 width: 180px; 159 border:1px solid #e2e2e2; 160 text-align: center; 161 height: 50px; 162 border-radius: 5px; 163 line-height: 50px; 164 color: #fff; 165 transition: .3s ease-in; 166 } 167 .comment-navigation .nav-previous:hover, 168 .posts-navigation .nav-previous:hover, 169 .post-navigation .nav-previous:hover, 170 .comment-navigation .nav-next:hover, 171 .posts-navigation .nav-next:hover, 172 .post-navigation .nav-next:hover{ 173 background-color: var(--main-color-one); 174 } 175 .comment-navigation .nav-previous > a, 176 .posts-navigation .nav-previous > a, 177 .post-navigation .nav-previous > a, 178 .comment-navigation .nav-next > a, 179 .posts-navigation .nav-next > a, 180 .post-navigation .nav-next > a{ 181 transition: .3s ease-in; 182 color:var(--paragraph-color); 183 } 184 185 .comment-navigation .nav-previous:hover > a, 186 .posts-navigation .nav-previous:hover > a, 187 .post-navigation .nav-previous:hover > a, 188 .comment-navigation .nav-next:hover > a, 189 .posts-navigation .nav-next:hover > a, 190 .post-navigation .nav-next:hover > a{ 191 color: #fff; 192 } 193 194 /*-------------------------------------------------------------- 195 # Accessibility 196 --------------------------------------------------------------*/ 197 /* Text meant only for screen readers. */ 198 .screen-reader-text { 199 border: 0; 200 clip: rect(1px, 1px, 1px, 1px); 201 clip-path: inset(50%); 202 height: 1px; 203 margin: -1px; 204 overflow: hidden; 205 padding: 0; 206 position: absolute !important; 207 width: 1px; 208 word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */ 209 } 210 211 .screen-reader-text:focus { 212 background-color: #f1f1f1; 213 border-radius: 3px; 214 box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); 215 clip: auto !important; 216 clip-path: none; 217 color: #21759b; 218 display: block; 219 font-size: 14px; 220 font-size: 0.875rem; 221 font-weight: bold; 222 height: auto; 223 left: 5px; 224 line-height: normal; 225 padding: 15px 23px 14px; 226 text-decoration: none; 227 top: 5px; 228 width: auto; 229 z-index: 100000; 230 /* Above WP toolbar. */ 231 } 232 233 /* Do not show the outline on the skip link target. */ 234 #content[tabindex="-1"]:focus { 235 outline: 0; 236 } 237 238 /*-------------------------------------------------------------- 239 # Alignments 240 --------------------------------------------------------------*/ 241 242 .alignleft { 243 float: left; 244 clear: both; 245 margin-right: 20px; 246 } 247 248 .alignright { 249 float: right; 250 clear: both; 251 margin-left: 20px; 252 margin-bottom: 20px; 253 } 254 255 .aligncenter { 256 clear: both; 257 display: block; 258 margin: 0 auto 1.75em; 259 } 260 261 .alignfull { 262 margin: 1.5em 0; 263 max-width: 100%; 264 } 265 266 .alignwide { 267 max-width: 1100px; 268 } 269 img.alignnone{ 270 height:auto; 271 } 272 /*-------------------------------------------------------------- 273 # Clearings 274 --------------------------------------------------------------*/ 275 .clear:before, 276 .clear:after, 277 .entry-content:before, 278 .entry-content:after, 279 .comment-content:before, 280 .comment-content:after, 281 .site-header:before, 282 .site-header:after, 283 .site-content:before, 284 .site-content:after, 285 .site-footer:before, 286 .site-footer:after { 287 content: ""; 288 display: table; 289 table-layout: fixed; 290 } 291 292 .clear:after, 293 .entry-content:after, 294 .comment-content:after, 295 .site-header:after, 296 .site-content:after, 297 .site-footer:after { 298 clear: both; 299 } 300 /*-------------------------------------------------------------- 301 # WIdgets 302 --------------------------------------------------------------*/ 303 .widget { 304 margin-bottom: 30px; 305 padding: 25px 30px 30px 30px; 306 border: 2px solid #fafafa; 307 border-radius: 3px; 308 } 309 .widget select{ 310 width: 100%; 311 height: 50px; 312 padding: 10px 20px; 313 } 314 315 .widget .widget-title { 316 font-size: 24px; 317 font-weight: 600; 318 line-height: 34px; 319 margin-bottom: 35px; 320 position: relative; 321 z-index:0; 322 } 323 .widget .widget-title:after { 324 position: absolute; 325 left: 0; 326 bottom: -10px; 327 width: 20px; 328 height: 2px; 329 background-color: var(--main-color-one); 330 content: ''; 331 transition: all 500ms; 332 } 333 334 .widget:hover .widget-title:after { 335 width: 50px; 336 } 337 338 .widget.footer-widget.widget_calendar th{ 339 padding: 7px; 340 } 341 .widget:last-child { 342 margin-bottom: 0px; 343 } 344 .widget.widget_nav_menu ul li.menu-item-has-children:after { 345 display: none; 346 } 347 .widget.footer-widget { 348 background-color: transparent !important; 349 padding: 0; 350 margin-bottom: 30px; 351 } 352 .widget ul { 353 margin: 0; 354 padding: 0; 355 list-style: none; 356 } 357 .widget ul li ul { 358 margin-left: 20px; 359 } 360 .widget ul li { 361 display: block; 362 margin: 8px 0; 363 -ms-word-wrap: break-word; 364 word-break: break-word; 365 } 366 367 .widget ul li:first-child { 368 margin-top: 0px; 369 } 370 371 .widget ul li:last-child { 372 margin-bottom: 0px; 373 } 374 375 .widget ul li a { 376 color: inherit; 377 -webkit-transition: all 0.3s ease-in; 378 -moz-transition: all 0.3s ease-in; 379 -o-transition: all 0.3s ease-in; 380 transition: all 0.3s ease-in; 381 } 382 #wp-calendar { 383 background-color: transparent; 384 } 385 .widget ul li a:hover { 386 color: var(--main-color-one) !important; 387 } 388 389 .footer-widget.widget_nav_menu ul li a { 390 position: relative; 391 padding-left: 15px; 392 } 393 394 .footer-widget.widget.widget_nav_menu ul li{ 395 margin: 0; 396 } 397 .widget img { 398 height: auto; 399 } 400 .footer-area .footer-top .footer-widget .menu li ul li:last-child{ 401 margin-bottom: 0; 402 padding-bottom: 0; 403 } 404 .widget_search .search-form { 405 position: relative; 406 } 407 408 .widget_search .search-form .form-group { 409 margin-bottom: 0; 410 } 411 412 .widget_search .search-form .form-group .form-control { 413 height: 50px; 414 border: 1px solid rgba(0, 0, 0, 0.2); 415 padding: 0 70px 0 15px; 416 } 417 418 .widget_search .search-form .submit-btn { 419 position: absolute; 420 right: 0; 421 top: 0; 422 width: 60px; 423 height: 50px; 424 line-height: 50px; 425 padding: 0; 426 font-size: 18px; 427 border-top-right-radius: 5px; 428 border-bottom-right-radius: 5px; 429 background-color: var(--secondary-color); 430 color: #fff; 431 transition: .3s ease-in; 432 } 433 .widget_search .search-form .submit-btn:hover{ 434 background-color: var(--main-color-one); 435 color: #fff; 436 } 437 .widget_author_meta { 438 text-align: center; 439 } 440 441 .widget_author_meta .thumb { 442 width: 80px; 443 height: 80px; 444 margin: 0 auto; 445 margin-bottom: 20px; 446 } 447 448 .widget_author_meta .thumb img { 449 border-radius: 50%; 450 } 451 452 .widget_author_meta .content .name { 453 font-size: 21px; 454 font-weight: 700; 455 } 456 457 .widget_author_meta .content p { 458 font-size: 16px; 459 line-height: 26px; 460 } 461 462 .widget_author_meta .content ul { 463 margin-top: 25px; 464 } 465 466 .widget_author_meta .content ul li { 467 display: inline-block; 468 margin: 0 5px; 469 } 470 471 .widget_author_meta .content ul li a { 472 display: block; 473 width: 40px; 474 height: 40px; 475 line-height: 40px; 476 text-align: center; 477 border: 1px solid rgba(0, 0, 0, 0.1); 478 border-radius: 50%; 479 -webkit-transition: all 0.3s ease-in; 480 -moz-transition: all 0.3s ease-in; 481 -o-transition: all 0.3s ease-in; 482 transition: all 0.3s ease-in; 483 } 484 485 .widget_author_meta .content ul li a:hover { 486 background-color: var(--main-color-one); 487 color: #fff; 488 } 489 490 .widget_tag_cloud .tagcloud a { 491 display: inline-block; 492 padding: 5px 15px; 493 margin: 5px; 494 -webkit-transition: all 0.3s ease-in; 495 -moz-transition: all 0.3s ease-in; 496 -o-transition: all 0.3s ease-in; 497 transition: all 0.3s ease-in; 498 border-radius: 5px; 499 font-size: 14px !important; 500 background-color: #fafafa; 501 font-weight: 400; 502 } 503 504 .widget_tag_cloud .tagcloud a:hover { 505 background-color: var(--main-color-one); 506 color: #fff !important; 507 } 508 .widget.footer-widget.widget_calendar table { 509 margin-bottom: 0; 510 } 511 512 .widget.footer-widget.widget_calendar caption { 513 padding-bottom: 0; 514 } 515 .widget ul li ul.sub-menu { 516 position: initial; 517 } 518 519 .widget ul li ul.sub-menu { 520 visibility: visible; 521 opacity: 1; 522 background-color: transparent; 523 border-top: none; 524 box-shadow: none; 525 margin-top: 10px; 526 } 527 528 .widget ul li ul.sub-menu li a { 529 padding: 0 0 0px 10px; 530 } 531 532 .widget ul li ul.sub-menu li a:hover { 533 background-color: transparent; 534 } 535 .widget.widget_nav_menu ul { 536 margin: 0; 537 padding: 0; 538 list-style: none; 539 } 540 541 .widget.widget_nav_menu ul li { 542 margin: 15px 0 543 } 544 .widget.widget_nav_menu ul li:first-child{ 545 margin-top: 0; 546 } 547 .widget.widget_nav_menu ul li:last-child{ 548 margin-bottom: 0; 549 } 550 .widget.widget_nav_menu ul li a { 551 border: none; 552 } 553 .widget.widget_nav_menu ul li>ul{ 554 margin-left:15px 555 } 556 .widget_recent_comments ul li { 557 position: relative; 558 padding-left: 25px; 559 } 560 561 .widget_recent_comments ul li:after { 562 position: absolute; 563 left: 0; 564 top: 0; 565 font-family: 'fontawesome'; 566 content: "\f27b"; 567 } 568 #wp-calendar { 569 border-collapse: collapse; 570 width: 100%; 571 } 572 573 #wp-calendar td,#wp-calendar th { 574 border: 1px solid #ddd; 575 padding: 8px; 576 } 577 578 579 #wp-calendar th { 580 padding-top: 12px; 581 padding-bottom: 12px; 582 text-align: center; 583 } 584 .widget_calendar.footer-widget .wp-calendar-nav{ 585 color: rgba(255, 255, 255, 0.8); 586 } 587 /*-------------------------------------------------------------- 588 ## Posts and pages 589 --------------------------------------------------------------*/ 590 .sticky { 591 display: block; 592 } 593 .updated:not(.published) { 594 display: none; 595 } 596 /*-------------------------------------------------------------- 597 ## Comments 598 --------------------------------------------------------------*/ 599 .comment-content a { 600 word-wrap: break-word; 601 } 602 603 .bypostauthor { 604 display: block; 605 } 606 607 .comments-area { 608 margin-top: 50px; 609 } 610 611 .comments-area .comments-title { 612 font-size: 24px; 613 line-height: 34px; 614 font-weight: 600; 615 margin-bottom: 25px; 616 } 617 .comments-area .comment-list .comment-respond { 618 margin-bottom: 30px; 619 } 620 .comments-area .comment-list { 621 margin: 0; 622 padding: 0; 623 list-style: none; 624 list-style-type: none; 625 margin-bottom: 45px; 626 } 627 .comments-area .comment-list li:last-child .single-comment-wrap .thumb .date { 628 margin-bottom: 0; 629 } 630 .comments-area .comment-list li.comment { 631 margin-bottom: 30px; 632 } 633 .comments-area .comment-list ul:not([class]), 634 .comments-area .comment-list ol:not([class]) { 635 margin-bottom:20px 636 } 637 638 .comments-area .comment-list ul:not([class]) ul, 639 .comments-area .comment-list ol:not([class]) ol{ 640 margin-bottom: 0px 641 } 642 .comments-area .comment-list li:last-child { 643 margin-bottom: 0; 644 } 645 646 .comments-area .comment-list li ul.children { 647 margin: 0; 648 padding: 0; 649 list-style: none; 650 list-style-type: none; 651 } 652 653 .comments-area .comment-list li ul.children li { 654 margin-left: 50px; 655 list-style-type: none; 656 list-style: none; 657 } 658 659 .comments-area .comment-list li .single-comment-wrap { 660 display: -webkit-box; 661 display: -ms-flexbox; 662 display: flex; 663 -ms-flex-item-align: start; 664 align-self: flex-start; 665 } 666 667 .comments-area .comment-list li .single-comment-wrap .thumb { 668 margin-right: 20px; 669 min-width: 80px; 670 } 671 672 .comments-area .comment-list li .single-comment-wrap .thumb img { 673 margin-bottom: 10px; 674 border-radius: 50%; 675 border: 2px solid #fafafa; 676 box-shadow: 0 0 50px 0 rgba(0,0,0,.06); 677 } 678 679 .comments-area .comment-list li .single-comment-wrap .thumb .date, 680 .blog-details-page-content-area .comments-area .comment-list li .single-comment-wrap .thumb .time { 681 display: block; 682 font-size: 14px; 683 line-height: 20px; 684 } 685 686 .comments-area .comment-list li .single-comment-wrap .content { 687 -webkit-box-flex: 1; 688 -ms-flex: 1; 689 flex: 1; 690 position: relative; 691 } 692 693 .comments-area .comment-list li .single-comment-wrap .content .title { 694 font-size: 16px; 695 line-height: 26px; 696 font-weight: 600; 697 font-family: var(--body-font); 698 } 699 .comments-area .comment-list li .single-comment-wrap .content .comment-content { 700 max-width: 620px; 701 } 702 .comments-area .comment-list li .single-comment-wrap .content p { 703 font-size: 16px; 704 line-height: 26px; 705 word-break: break-word; 706 } 707 708 .comments-area .comment-list li .single-comment-wrap .content p:last-child { 709 margin-bottom: 0; 710 } 711 712 .comments-area .comment-list li .single-comment-wrap .content .reply { 713 position: absolute; 714 top: 0; 715 right: 0; 716 color: #777777; 717 -webkit-transition: all 0.3s ease-in; 718 -moz-transition: all 0.3s ease-in; 719 -o-transition: all 0.3s ease-in; 720 transition: all 0.3s ease-in; 721 } 722 723 .comments-area .comment-list li .single-comment-wrap .content .reply:hover { 724 color: var(--main-color-one); 725 } 726 727 728 .comments-area .reply-title, 729 .comments-area .comment-reply-title{ 730 font-size: 24px; 731 line-height: 34px; 732 font-weight: 600; 733 margin-bottom: 20px; 734 } 735 .comments-area .comment-reply-title small{ 736 color: var(--main-color-one); 737 } 738 .comments-area .form-submit{ 739 margin-bottom: 0; 740 } 741 .comment-form .form-group.textarea .form-control { 742 min-height: 160px; 743 resize: none; 744 line-height: 26px; 745 } 746 .comment-form .form-group.textarea .form-control:focus{ 747 outline: none; 748 -webkit-box-shadow: none; 749 -moz-box-shadow: none; 750 box-shadow: none; 751 } 752 .comment-form .form-group .form-control { 753 height: 55px; 754 line-height: 50px; 755 padding: 10px 20px; 756 border: 2px solid #fafafa; 757 } 758 759 .comment-form .submit-btn { 760 height: 50px; 761 width: 200px; 762 border-radius: 5px; 763 font-weight: 600; 764 background-color: var(--secondary-color); 765 border: none; 766 cursor: pointer; 767 transition: .3s ease-in; 768 padding: 0; 769 line-height: 50px; 770 } 771 .comment-form .submit-btn:hover { 772 background-color: var(--main-color-one); 773 color: #fff; 774 } 775 776 .comments-area .comment-list .children li:last-child { 777 margin-bottom: 30px; 778 } 779 780 .comments-area .comment-list li ul.children { 781 margin-top: 30px; 782 } 783 .comment-form-cookies-consent input[type=checkbox] { 784 margin-right: 5px; 785 } 786 .full-width-content-area .comments-area .comment-list li .single-comment-wrap .content .comment-content{ 787 max-width: 100%; 788 } 789 /*-------------------------------------------------------------- 790 # Media 791 --------------------------------------------------------------*/ 792 .page-content .wp-smiley, 793 .entry-content .wp-smiley, 794 .comment-content .wp-smiley { 795 border: none; 796 margin-bottom: 0; 797 margin-top: 0; 798 padding: 0; 799 } 800 801 /* Make sure embeds and iframes fit their containers. */ 802 embed, 803 iframe, 804 object { 805 max-width: 100%; 806 } 807 /* Make sure logo link wraps around logo image. */ 808 .custom-logo-link { 809 display: inline-block; 810 } 811 812 /*-------------------------------------------------------------- 813 ## Captions 814 --------------------------------------------------------------*/ 815 .wp-caption { 816 margin-bottom: 1.5em; 817 max-width: 100%; 818 clear: both; 819 } 820 821 .wp-caption img[class*="wp-image-"] { 822 display: block; 823 margin-left: auto; 824 margin-right: auto; 825 } 826 827 .wp-caption .wp-caption-text { 828 margin: 0.8075em 0; 829 } 830 831 .wp-caption-text { 832 text-align: center; 833 } 834 835 /*-------------------------------------------------------------- 836 ## Galleries 837 --------------------------------------------------------------*/ 838 .gallery { 839 margin-bottom: 1.5em; 840 } 841 842 .gallery-item { 843 display: inline-block; 844 text-align: center; 845 vertical-align: top; 846 width: 100%; 847 } 848 849 .gallery-columns-2 .gallery-item { 850 max-width: 50%; 851 } 852 853 .gallery-columns-3 .gallery-item { 854 max-width: 33.33%; 855 } 856 857 .gallery-columns-4 .gallery-item { 858 max-width: 25%; 859 } 860 861 .gallery-columns-5 .gallery-item { 862 max-width: 20%; 863 } 864 865 .gallery-columns-6 .gallery-item { 866 max-width: 16.66%; 867 } 868 869 .gallery-columns-7 .gallery-item { 870 max-width: 14.28%; 871 } 872 873 .gallery-columns-8 .gallery-item { 874 max-width: 12.5%; 875 } 876 877 .gallery-columns-9 .gallery-item { 878 max-width: 11.11%; 879 } 880 881 .gallery-caption { 882 display: block; 883 } 884 885 /*-------------------------------------------------------------- 886 # Gutenberg Default Style 887 --------------------------------------------------------------*/ 888 889 .single-post-details-item .entry-content > .alignwide { 890 max-width: 1100px; 891 } 892 893 .single-post-details-item .entry-content > .alignfull { 894 margin: 1.5em 0; 895 max-width: 100%; 896 } 897 898 899 .wp-block-video video { 900 max-width: 636px; 901 } 902 903 .wp-block-image img { 904 display: block; 905 } 906 907 .wp-block-image.alignleft, 908 .wp-block-image.alignright { 909 width: 100% 910 } 911 912 .wp-block-image.alignfull img { 913 width: 100vw; 914 } 915 916 .wp-block-gallery:not(.components-placeholder) { 917 margin: 1.5em auto; 918 } 919 920 .wp-block-cover-text p { 921 padding: 1.5em 14px; 922 } 923 924 ul.wp-block-latest-posts.alignwide, 925 ul.wp-block-latest-posts.alignfull, 926 ul.wp-block-latest-posts.is-grid.alignwide, 927 ul.wp-block-latest-posts.is-grid.alignwide { 928 padding: 0 14px; 929 } 930 931 .wp-block-table { 932 display: block; 933 overflow-x: auto; 934 } 935 936 .wp-block-table table { 937 border-collapse: collapse; 938 width: 100% 939 } 940 941 .wp-block-table td, .wp-block-table th { 942 padding: .5em; 943 } 944 945 .wp-block-embed.type-video > .wp-block-embed__wrapper { 946 position: relative; 947 width: 100%; 948 height: 0; 949 padding-top: 56.25%; 950 } 951 952 .wp-block-embed.type-video > .wp-block-embed__wrapper > iframe { 953 position: absolute; 954 width: 100%; 955 height: 100%; 956 top: 0; 957 left: 0; 958 bottom: 0; 959 right: 0; 960 } 961 962 .wp-block-quote.is-large { 963 margin: 0 auto 16px; 964 } 965 966 .wp-block-pullquote>p:first-child { 967 margin-top: 0; 968 } 969 970 .wp-block-separator { 971 margin: 3em auto; 972 padding: 0; 973 } 974 975 @media screen and (min-width: 768px) { 976 .wp-block-cover-text p { 977 padding: 1.5em 0; 978 } 979 } 980 wp-block-video video { 981 max-width: 636px; 982 } 983 984 .wp-block-image img { 985 display: block; 986 } 987 988 .wp-block-image.alignleft, 989 .wp-block-image.alignright { 990 width: 100%; 991 } 992 993 .wp-block-image.alignfull img { 994 width: 100vw; 995 } 996 997 .wp-block-gallery:not(.components-placeholder) { 998 margin: 1.5em auto; 999 } 1000 1001 .wp-block-cover-text p { 1002 padding: 1.5em 14px; 1003 } 1004 1005 ul.wp-block-latest-posts.alignwide, 1006 ul.wp-block-latest-posts.alignfull, 1007 ul.wp-block-latest-posts.is-grid.alignwide, 1008 ul.wp-block-latest-posts.is-grid.alignwide { 1009 padding: 0 14px; 1010 } 1011 1012 .wp-block-table { 1013 display: block; 1014 overflow-x: auto; 1015 } 1016 1017 .wp-block-table table { 1018 border-collapse: collapse; 1019 width: 100%; 1020 } 1021 1022 .wp-block-table td, .wp-block-table th { 1023 padding: .5em; 1024 } 1025 1026 .wp-block-embed.type-video > .wp-block-embed__wrapper { 1027 position: relative; 1028 width: 100%; 1029 height: 0; 1030 padding-top: 56.25%; 1031 } 1032 1033 .wp-block-embed.type-video > .wp-block-embed__wrapper > iframe { 1034 position: absolute; 1035 width: 100%; 1036 height: 100%; 1037 top: 0; 1038 left: 0; 1039 bottom: 0; 1040 right: 0; 1041 } 1042 1043 .wp-block-quote.is-large { 1044 margin: 0 auto 16px; 1045 } 1046 1047 .wp-block-pullquote > p:first-child { 1048 margin-top: 0; 1049 } 1050 .wp-block-quote:not(.is-large):not(.is-style-large) { 1051 border-left: 4px solid #000; 1052 padding-left: 1em; 1053 } 1054 .wp-block-separator { 1055 margin: 3em auto; 1056 padding: 0; 1057 } 1058 1059 @media screen and (min-width: 768px) { 1060 .wp-block-cover-text p { 1061 padding: 1.5em 0; 1062 } 1063 } 1064 .wp-block-pullquote { 1065 border-top: 4px solid #555d66; 1066 border-bottom: 4px solid #555d66; 1067 color: #40464d; 1068 } 1069 /*-------------------------------------------------------------- 1070 ## Block Color Palette Colors 1071 --------------------------------------------------------------*/ 1072 .has-strong-blue-color { 1073 color: #0073aa; 1074 } 1075 1076 .has-strong-blue-background-color { 1077 background-color: #0073aa; 1078 } 1079 1080 .has-lighter-blue-color { 1081 color: #229fd8; 1082 } 1083 1084 .has-lighter-blue-background-color { 1085 background-color: #229fd8; 1086 } 1087 1088 .has-very-light-gray-color { 1089 color: #eee; 1090 } 1091 1092 .has-very-light-gray-background-color { 1093 background-color: #eee; 1094 } 1095 1096 .has-very-dark-gray-color { 1097 color: #444; 1098 } 1099 1100 .has-very-dark-gray-background-color { 1101 background-color: #444; 1102 } 1103 .has-large-font-size { 1104 font-size: 36px; 1105 line-height: 1.6; 1106 } 1107 /*---------------------------------------- 1108 # Unit test 1109 ------------------------------------------*/ 1110 .wp-link-pages a { 1111 margin: 0 5px; 1112 transition: .3s ease-in; 1113 } 1114 .wp-link-pages{ 1115 margin-bottom: 30px; 1116 margin-top: 0; 1117 clear: both; 1118 padding-top: 20px; 1119 } 1120 .wp-link-pages span,.wp-link-pages a { 1121 border: 1px solid #e2e2e2; 1122 padding: 5px 15px; 1123 display: inline-block; 1124 } 1125 .wp-link-pages .current , 1126 .wp-link-pages a:hover{ 1127 background-color: var(--main-color-one); 1128 color: #fff; 1129 border-color: var(--main-color-one); 1130 } 1131 1132 .wp-link-pages span:first-child { 1133 margin-right: 5px; 1134 } 1135 dl, ol, ul { 1136 padding-left: 15px; 1137 } 1138 1139 .post-password-form input { 1140 display: block; 1141 border: 1px solid #e2e2e2; 1142 height: 50px; 1143 border-radius: 3px; 1144 padding: 0 20px; 1145 } 1146 1147 .post-password-form label { 1148 font-weight: 600; 1149 color: #333; 1150 } 1151 1152 .post-password-form input[type=submit] { 1153 width: 100px; 1154 height: 50px; 1155 background-color: var(--main-color-one); 1156 color: #fff; 1157 font-size: 16px; 1158 font-weight: 600; 1159 letter-spacing: 1px; 1160 border: none; 1161 cursor: pointer; 1162 transition: .3s ease-in; 1163 display: inline-block; 1164 } 1165 1166 .post-password-form input[type=submit]:hover { 1167 background-color: #121A2F; 1168 } 1169 .footer-widget.widget.widget_nav_menu ul li+li { 1170 margin-top: 10px; 1171 } 1172 .blog-comment-navigation .comment-navigation{ 1173 min-height: 50px; 1174 margin-bottom: 30px; 1175 } 1176 .appside-page-content-area p:last-child .alignright { 1177 margin-top: 40px; 1178 } 1179 .comments-area .comment-list .trackback,.comments-area .comment-list .pingback { 1180 margin-bottom: 30px; 1181 } 1182 .comments-area .comment-list li .single-comment-wrap .content table{ 1183 margin-bottom: 20px; 1184 } 1185 .comments-area .comment-list li .single-comment-wrap .content table, 1186 .comments-area .comment-list li .single-comment-wrap .content td, 1187 .comments-area .comment-list li .single-comment-wrap .content th { 1188 border: 1px solid #ddd; 1189 text-align: left; 1190 } 1191 1192 .comments-area .comment-list li .single-comment-wrap .content table { 1193 border-collapse: collapse; 1194 width: 100%; 1195 } 1196 1197 .comments-area .comment-list li .single-comment-wrap .content th, 1198 .comments-area .comment-list li .single-comment-wrap .content td { 1199 padding: 15px; 1200 }