1.toggle { color: #f74037 } 2#dw__toc { background-color: rgba(0,0,0,.5); } 3.breadcrumbs, .tools { text-align: center; } 4#config__manager td.label span.outkey { background-color: #000000; } 5#writtensidebar h1 { padding: 0px; margin: 0px; } 6#writtensidebar li { display: block; margin: 0.85em; } 7#writtensidebar ul { padding-top: 0px; } 8.page li { display: block; } 9.desktop { display: block; } .mobile { display: none; } 10#mediamanager__page a:link, #mediamanager__page a:visited { color: #0066cc; } 11.entry-content { padding-right: 08.5em; } 12 13ul.sidebarmenu{ 14 float: right; 15} 16 17li:first-of-type { margin: 0px; } 18 19.sidebarmenu li { 20 21 /*display: block;*/ 22 background: rgba(0,0,0,0.15); 23display: table; 24font-size: 1em; 25font-weight: 700; 26padding: 0 9px; 27margin: 0.85em; 28/*text-transform: uppercase;*/ 29} 30/* desbest edit */ 31 32/** 33 * Theme Name: Ravel 34 * Theme URI: http://themehybrid.com/themes/ravel 35 * Description: Ravel is a responsive blog, portfolio, and professional profile theme built with the latest standards in Web design. It makes use of <abbr title="Hypertext Markup Language">HTML5</abbr>, utilizes <a href="http://schema.org">Schema.org</a> microdata, and has a beautiful responsive design that looks and performs well on any device. It also integrates with the <a href="http://wordpress.org/plugins/custom-content-portfolio">Custom Content Portfolio</a> plugin to allow you to show off your design, photography, and other artwork. 36 * Version: 1.0.0 37 * Author: Justin Tadlock 38 * Author URI: http://themehybrid.com 39 * Tags: one-column, two-columns, custom-header, custom-menu, editor-style, featured-images, post-formats, responsive-layout, right-sidebar, theme-options, threaded-comments, translation-ready 40 * License: GNU General Public License v2 or later 41 * License URI: http://www.gnu.org/licenses/gpl-2.0.html 42 * Text Domain: ravel 43 * 44 * @author Tung Do, <ttsondo@gmail.com> 45 * @author Justin Tadlock, <justin@justintadlock.com> 46 * @copyright Copyright (c) 2014, Tung Do, Justin Tadlock 47 */ 48 49/** 50 * Font Embeds 51 ************************************************/ 52 53/* Font Awesome */ 54@font-face { 55 font-family: 'FontAwesome'; 56 src: url('fonts/font-awesome/fontawesome-webfont.eot?v=4.0.0'); 57 src: url('fonts/font-awesome/fontawesome-webfont.eot?#iefix&v=4.0.0') format('embedded-opentype'), 58 url('fonts/font-awesome/fontawesome-webfont.woff?v=4.0.0') format('woff'), 59 url('fonts/font-awesome/fontawesome-webfont.ttf?v=4.0.0') format('truetype'); 60 font-weight: normal; 61 font-style: normal; 62} 63 64/** 65 * Icon Fonts 66 * This sets CSS rules for all elements using icon fonts in this theme. 67 * It's positioned early in the CSS file to prevent confusion. 68 ************************************************/ 69 70/* menu elements */ 71 72.menu-toggle::before, 73 74nav.menu li > a::before, 75nav.menu li > a::after, 76 77/* content notification styles */ 78 79.entry-content .alert::before, 80.entry-content .download::before, 81.entry-content .note::before, 82 83/* entry footer */ 84 85.entry-terms::before, 86.entry-footer .entry-permalink::before, 87 88/* additional list styles */ 89 90ul.checks li::before, 91ul.pages li::before, 92 93/* pagination */ 94 95.loop-pagination .prev::before, 96.loop-pagination .next::before, 97 98/* comment elements */ 99 100#reply-title small a::before, 101.comment-reply-link::before, 102.comment-reply-login::before, 103.comment-form-author label::before, 104.comment-form-email label::before, 105.comment-form-url label::before, 106.comment-form-comment label::before, 107 108/* widget elements */ 109 110.sidebar-toggle::before, 111.widget ul li::before, 112.tabs-nav li a::before, 113 114/* form elements */ 115 116.search-form div::before { 117 display: inline-block; 118 font-family: 'FontAwesome'; 119 font-size: 14px; 120 font-style: normal; 121 font-weight: normal; 122 font-variant: normal; 123 line-height: 1; 124 speak: none; 125 vertical-align: middle; 126 -webkit-font-smoothing: antialiased; 127 } 128 129/** 130 * Basic Resets 131 ************************************************/ 132 133*, 134::before, 135::after { 136 box-sizing: border-box; 137 -moz-box-sizing: border-box; 138 -webkit-box-sizing: border-box; 139 } 140 141html, a, abbr, acronym, address, applet, b, big, blockquote, body, caption, center, cite, code, del, dfn, div, dl, dt, dd, em, fieldset, fig, font, form, h1, h2, h3, h4, h5, h6, hr, i, iframe, img, ins, kbd, label, layer, legend, li, object, ol, p, param, pre, q, s, samp, small, span, strike, strong, sub, sup, table, tbody, tfoot, thead, tr, th, td, tt, var, u, ul, xmp, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { 142 /*background: transparent;*/ 143 border: none; 144 font-size: 100%; 145 font: inherit; 146 /*margin: 0;*/ 147 outline: none; 148 /*padding: 0;*/ /* desbest edit */ 149 text-decoration: none; 150 vertical-align: baseline; 151 } 152 153/* HTML5 defaults */ 154article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 155 display: block; 156 } 157 158audio, canvas, video { 159 display: inline-block; 160 *display: inline; 161 *zoom: 1; 162 } 163 164audio:not([controls]) {display: none;} 165 166::selection { /* Don't combine with other elements. Breaks Firefox. */} 167 168/* === Body === */ 169 170body { 171 background: #2d3a42 url(images/body_gradient.png) repeat-x; 172 color: #9cc4dd; 173 font: normal 18px/27px Roboto, Arial, Heletica, sans-serif; 174 overflow-x: hidden; 175 text-shadow: 1px 1px 0 rgba(0,0,0,.25); 176 word-wrap: break-word; 177 } 178 179 ::before, 180 ::after { 181 text-shadow: none; 182 } 183 184body[direction="ltr"] {direction: ltr;} 185body[direction="rtl"] {direction: rtl;} 186 187/* === Links === */ 188 189a { 190 color: #e3f4ff; 191} 192 a:hover { 193 color: #fff; 194 text-decoration: underline; 195 } 196 a:active {outline:0;} 197 198/* === Headers === */ 199 200h1,h2,h3,h4,h5,h6 { 201 color: #c6dbe8; 202 font-family: Lora, Georgia, serif; 203 font-style: normal; 204 font-weight: 700; 205 padding: 14px 0 13px; 206 } 207 208h1 {font-size: 48px;line-height: 58px;} 209h2 {font-size: 36px;line-height: 48px;} 210h3 {font-size: 30px;line-height: 42px;} 211h4 {font-size: 24px;line-height: 33px;} 212h5 {font-size: 18px;line-height: 27px;} 213h6 {font-size: 14px;line-height: 22px;} 214 215/* === Blockquotes, quotes, and cites === */ 216 217blockquote { 218 color: #9bc4dd; 219 font: 400 italic 27px/36px Lora, Georgia, serif; 220 margin: 20px 0; 221 padding: 18px 47px 18px 60px; 222 position: relative; 223 text-shadow: 2px 2px 0 rgba(0,0,0,.4); 224 } 225 226 blockquote::before, 227 blockquote::after { 228 content: '\201C'; 229 color: #f73f37; 230 height: 36px; 231 font: 400 italic 135px/98px Roboto, Arial, Helvetica, sans-serif; 232 font-size: 135px; 233 position: absolute; 234 text-shadow: 2px 2px 0 rgba(0,0,0,.25); 235 vertical-align: middle; 236 } 237 238 blockquote::before { 239 left: 0; 240 top: 0; 241 text-indent: -13px; 242 } 243 244 blockquote::after { 245 content: '\201D'; 246 /* positioning */ 247 bottom: 0; 248 right: 0; 249 } 250 251 blockquote p {padding: 12px 0 9px;} 252 253 blockquote blockquote { 254 color: #8d9ca6; 255 font-size: 80%; 256 line-height: 150%; 257 margin: 0 0 0 48px; 258 padding: 0; 259 text-shadow: 1px 1px 0 rgba(0,0,0,.25); 260 } 261 262 blockquote blockquote::before, 263 blockquote blockquote::after { 264 content: ''; 265 display: none; 266 } 267 268 /* Cite */ 269 270 blockquote cite { 271 font-size: 75%; 272 font-weight: 400; 273 text-shadow: 1px 1px 0 rgba(0,0,0,.25); 274 } 275 blockquote cite::before {content: '\2014';} 276 277 cite, i, em, var {font-style: italic;} 278 279 cite cite, i i, em em {font-style: normal;} 280 281/* === Acronyms, abbreviations, and miscellaneous === */ 282 283acronym, abbr { 284 border-bottom: 1px dotted rgba(255,255,255,.2); 285 cursor: help; 286} 287 288b, strong {font-weight: 700;} 289 b b, strong strong {font-weight: 400;} 290 291big {font-size: 120%;} 292 293del, s, strike {text-decoration: line-through;} 294 295dfn, ins { 296 border-bottom: 1px solid rgba(255,255,255,.1); 297 font-style: italic; 298 text-decoration: none; 299 } 300 301mark { 302 background: #141a1e; 303} 304 305p { 306 padding: 15px 0 12px; 307} 308 309p:empty, 310.entry-footer:empty { 311 margin: 0 !important; 312 padding: 0 !important; 313 } 314 315small, sup, sub {font-size: 80%;} 316 317sub, sup { 318 position: relative; 319 vertical-align: baseline; 320 } 321 322sub {bottom: -0.25em;} 323sup {top: -0.5em;} 324 325hr {border-top: 3px double rgba(255,255,255,.1);} 326 327/* === Code and Preformatted text === */ 328 329code, kbd, tt{ 330 background: rgba(0,0,0,.1); 331 color: #8dc63f; 332 display: inline-block; 333 padding: 0 5px; 334 text-shadow: 1px 1px 0 rgba(0,0,0,.25); 335 } 336 337pre, 338table pre, 339.form-allowed-tags code { 340 background: #101619; 341 color: #8d9ca6; 342 font-family: Monaco, monospace, Courier, "Courier New"; 343 font-size: 14px; 344 line-height: 21px; 345 margin: 20px 0; 346 overflow: auto; 347 padding: 6px 12px; 348 text-shadow: 1px 1px 0 rgba(0,0,0,.25); 349 word-wrap: normal; 350 } 351 352 pre code { 353 background: transparent; 354 color: inherit; 355 } 356 357/* === <address> tag === */ 358 359address { 360 font-style: italic; 361 margin: 15px 0 12px; 362 } 363 dd address, li address {margin: 0;} 364 365/* === Lists === */ 366 367ul { 368 list-style: square; 369 list-style-position: outside; 370 margin: 0 0 0 36px; 371 padding: 15px 0 12px; 372} 373 374ul.checks, 375ul.checks ul, 376ul.pages, 377ul.pages ul { 378 list-style: none; 379} 380 ul.checks li::before { 381 color: #8dc63f; 382 content: '\f05d'; 383 text-shadow: 1px 1px 0 rgba(0,0,0,.25); 384 width: 24px; 385 } 386 ul.pages li::before { 387 color: #00aeef; 388 content: '\f15c'; 389 width: 24px; 390 } 391 392ol { 393 list-style: decimal; 394 margin: 0 0 0 36px; 395 padding: 15px 0 12px; 396} 397 398 ol ol {list-style: upper-roman;} 399 ol ol ol {list-style: lower-roman;} 400 ol ol ol ol {list-style: upper-alpha;} 401 ol ol ol ol ol {list-style: lower-alpha;} 402 403dl {margin: 15px 0 12px;} 404 405 dt { 406 font-weight: 700; 407 margin: 11px 0 0; 408 } 409 410 dd {margin: 0 0 0 30px;} 411 412/* === Tables === */ 413 414table { 415 border: 6px solid rgba(0,0,0,.1); 416 border-collapse: separate; 417 border-spacing: 0; 418 margin: 20px 0; 419 width: 100%; 420 } 421 422 caption { 423 margin: 0 0 6px; 424 font-variant: small-caps; 425 padding: 6px 18px; 426 text-align: center; 427 } 428 429 th, td { 430 background: transparent; 431 border-top: 1px solid rgba(0,0,0,.1); 432 color: inherit; 433 margin: 0; 434 padding: 12px 18px; 435 text-align: left; 436 vertical-align: top; 437 } 438 439 th { 440 font-size: 75%; 441 font-weight: 700; 442 text-transform: uppercase; 443 } 444 445 /* remove top border for cells of first table row */ 446 thead tr:first-child th, 447 thead tr:first-child td, 448 tbody tr:first-child th, 449 tbody tr:first-child td { 450 border-top-width: 0; 451 } 452 453 /* restore top border for cells of first row in tbody and tfoot */ 454 455 thead ~ tbody tr:first-child th, 456 thead ~ tbody tr:first-child td, 457 tfoot:first-child th, 458 tfoot:first-child td { 459 border-top-width: 1px; 460 } 461 462/* === Forms === */ 463 464form { 465 font-family: inherit; 466 font-size: inherit; 467 } 468 469 fieldset { 470 border: 3px double rgba(255,255,255,.1); 471 margin: 20px 0; 472 padding: 0 15px; 473 } 474 legend { 475 font-size: 13px; 476 line-height: 24px; 477 } 478 479 label { 480 cursor: pointer; 481 display: inline-block; 482 font: inherit; 483 font-size: 13px; 484 line-height: 18px; 485 margin: 0; 486 padding: 0; 487 vertical-align: baseline; 488 } 489 490 /* Checkbox or Radio inside of a label tag */ 491 label input[type="checkbox"], 492 label input[type="radio"]{ 493 margin: 0; 494 } 495 496 .protected label { 497 line-height: 36px; 498 margin: 6px; 499 padding: 0; 500 vertical-align: middle; 501 } 502 503 /* Basic reset */ 504 505 button, 506 input, 507 select, 508 textarea { 509 border: 0; 510 box-sizing: border-box; 511 -ms-box-sizing: border-box; 512 -moz-box-sizing: border-box; 513 -webkit-box-sizing: border-box; 514 color: inherit; 515 font: inherit; 516 margin: 0; 517 padding: 0; 518 } 519 520 input { display: block; } 521 522 /* Checkbox & Radio */ 523 input[type="checkbox"], 524 input[type="radio"] { 525 display: inline-block; 526 vertical-align: middle; 527 } 528 529 /* Label with checkbox or radio before them */ 530 input[type="checkbox"] + label, 531 input[type="radio"] + label { 532 padding-left: 8px; 533 vertical-align: middle; 534 } 535 536 input[type="file"]:focus, 537 input[type="file"]:active, 538 input[type="radio"]:focus, 539 input[type="radio"]:active, 540 input[type="checkbox"]:focus, 541 input[type="checkbox"]:active { 542 box-shadow: none; 543 } 544 545 /* Search type for webkit browsers */ 546 input[type="search"]::-webkit-search-decoration {display: none;-webkit-appearance: textfield;} 547 input[type="search"]::-webkit-search-cancel-button{-webkit-appearance: none;} 548 549 input[type="date"], 550 input[type="datetime"], 551 input[type="datetime-local"], 552 input[type="email"], 553 input[type="month"], 554 input[type="number"], 555 input[type="password"], 556 input[type="search"], 557 input[type="tel"], 558 input[type="text"], 559 input[type="time"], 560 input[type="url"], 561 input[type="week"], 562 textarea, 563 select { 564 565 -webkit-appearance: none; 566 background-clip: padding-box; 567 -moz-background-clip: padding; 568 -ms-background-clip: padding-box; 569 -o-background-clip: padding-box; 570 -webkit-background-clip: padding; 571 background-color: #161d21; 572 border-radius: 0; 573 box-shadow: inset 0 1px 3px rgba(0,0,0,0.24); 574 display: inline-block; 575 height: 36px; 576 font-size: 13px; 577 line-height: 24px; 578 margin: 6px 0; 579 max-width: 100%; 580 outline: 0; 581 padding: 6px 15px; 582 vertical-align: middle; 583 } 584 585 textarea { 586 height: auto; 587 line-height: 22px; 588 min-height: 31px; 589 overflow: auto; 590 resize: vertical; 591 vertical-align: top; 592 width: 100%; 593 } 594 595 /* Select field */ 596 select { 597 padding: 6px 15px; 598 } 599 600 /* Select, multi-visible entries */ 601 select[size], 602 select[multiple], 603 select[multiple][size] { 604 height: auto; 605 } 606 607 select optgroup, 608 select option { 609 font: inherit; 610 } 611 612 /* select fields in Webkit browsers */ 613 @media ( -webkit-min-device-pixel-ratio: 0 ) { 614 615 select, 616 select[size="0"], 617 select[size="1"] { 618 background-image: url(images/arrow-select.png); 619 background-position: right center; 620 background-repeat: no-repeat; 621 background-size: 27px 4px; 622 padding-right: 30px; 623 } 624 625 select[size], 626 select[multiple], 627 select[multiple][size] { 628 background-image: none; 629 height: auto; 630 } 631 } /* end select fields in Webkit browsers */ 632 633 /* File type */ 634 input[type="file"] { 635 height: 36px; 636 margin: 6px 0; 637 vertical-align: middle; 638 } 639 input[type="file"]:focus, 640 input[type="file"]:active { 641 box-shadow: none; 642 } 643 644 button.toolbutton{ background-color: #EFE9E6; } /* desbest edit */ 645 646 .button, 647 button, 648 input[type="submit"], 649 input[type="reset"], 650 input[type="button"] { 651 -webkit-appearance: none; 652 background-clip: padding-box; 653 -webkit-background-clip: padding; 654 -moz-background-clip: padding; 655 -ms-background-clip: padding-box; 656 -o-background-clip: padding-box; 657 background-color: #161d21; 658 border: 2px solid #3d484e; 659 box-shadow: 7px 7px 0 rgba(0,0,0,.08); 660 color: #fff; 661 cursor: pointer; 662 display: inline-block; 663 font-size: 13px; 664 font-weight: 700; 665 line-height: 32px; 666 height: 36px; 667 margin: 6px 0; 668 max-width: 100%; 669 outline: 0; 670 padding: 0 13px; 671 vertical-align: middle; 672 width: auto; 673 } 674 675 /* General Buttons hover */ 676 .button:hover, 677 button:hover, 678 input[type="button"]:hover, 679 input[type="reset"]:hover, 680 input[type="submit"]:hover { 681 border-color: #4e5d65; 682 } 683 684 /* Media Player Buttons */ 685 .mejs-button button {box-shadow: none;} 686 687 /* Link Buttons */ 688 a.button { 689 height: auto; 690 line-height: 22px; 691 min-height: 32px; 692 padding: 5px 13px; 693 text-transform: none; 694 } 695 /* Link Buttons Hover */ 696 a.button:hover { 697 text-decoration: none; 698 } 699 700 /* === Reset alternate form field states === */ 701 702 /* Disabled state */ 703 button[disabled], 704 input[disabled], 705 input.disabled, 706 select[disabled], 707 select[disabled] option, 708 select[disabled] optgroup, 709 textarea[disabled], 710 textarea.disabled { 711 color: #788690; 712 cursor: default; 713 user-select: none; 714 -moz-user-select: -moz-none; 715 -webkit-user-select: none; 716 -khtml-user-select: none; 717 } 718 719 /* Focused or Active state */ 720 button:focus, 721 input:focus, 722 select:focus, 723 textarea:focus { 724 z-index: 1; 725 } 726 input[type="file"]:focus, 727 input[type="file"]:active, 728 input[type="radio"]:focus, 729 input[type="radio"]:active, 730 input[type="checkbox"]:focus, 731 input[type="checkbox"]:active { 732 box-shadow: none; 733 } 734 735 /* Invalid state */ 736 button:invalid, 737 input:invalid, 738 select:invalid, 739 textarea:invalid { 740 background-color: #f74037; 741 box-shadow: none; 742 color: #fff; 743 } 744 745 /* Reset Firefox browser spacing rules */ 746 button::-moz-focus-inner, 747 input::-moz-focus-inner, 748 select::-moz-focus-inner, 749 textarea::-moz-focus-inner { 750 border: 0; 751 padding: 0; 752 } 753 754 /* place holders, cannot combine placeholder rules or they will be ignored completely */ 755 input::-webkit-input-placeholder, 756 textarea::-webkit-input-placeholder { 757 color: #8d9ca6; 758 } 759 input::-moz-placeholder, 760 textarea::-moz-placeholder { 761 color: #8d9ca6; 762 opacity: 1; 763 } 764 input:-moz-placeholder, 765 textarea:-moz-placeholder { 766 /* Older versions of Firefox */ 767 color: #8d9ca6; 768 opacity: 1; 769 } 770 input:-ms-input-placeholder, 771 textarea:-ms-input-placeholder { 772 color: #8d9ca6; 773 } 774 775 /* Search Form */ 776 777 .search-form, 778 .search-form div { 779 position: relative; 780 width: 288px; 781 } 782 .search-form::before, 783 .search-form::after, 784 .search-form div::after { 785 border: 6px solid rgba(0,0,0,.25); 786 content: ''; 787 height: 48px; 788 position: absolute; 789 left: 17px; 790 top: 0; 791 transform: rotate(45deg); 792 -webkit-transform: rotate(45deg); 793 -moz-transform: rotate(45deg); 794 -ms-transform: rotate(45deg); 795 -o-transform: rotate(45deg); 796 width: 48px; 797 } 798 799 .search-form::before, 800 .search-form::after {border: 1px solid rgba(255,255,255,.08);} 801 .search-form::before {margin-left: -7px;} 802 .search-form::after {margin-left: 7px;} 803 804 /* search form DIV */ 805 806 .search-form div::before { 807 color: #8d9ca6; 808 content: '\f002'; 809 font-size: 18px; 810 height: 48px; 811 line-height: 48px; 812 position: absolute; 813 left: 17px; 814 top: 0; 815 text-align: center; 816 width: 48px; 817 z-index: 2; 818 } 819 820 /* search label */ 821 .search-form label { 822 margin: 0; 823 padding: 0; 824 vertical-align: middle; 825 } 826 827 /* search form fields */ 828 829 .search-form input[type="text"], 830 .search-form input[type="search"]{ 831 background: transparent; 832 box-shadow: none; 833 color: #8d9ca6; 834 font: 700 italic 16px/24px Lora, Georiga, sans-serif; 835 padding-left: 6px; 836 margin-left: 82px; 837 text-shadow: 1px 1px 0 rgba(0,0,0,0.25); 838 width: 206px; 839 } 840 .search-form input[type="submit"] { 841 background: transparent; 842 border: 0; 843 box-shadow: none; 844 font-size: 0; 845 height: 0; 846 line-height: 0; 847 margin: 0; 848 min-height: 0; 849 padding: 0; 850 width: 0; 851 } 852 853/** 854 * Images 855 * --------------------------------------------------------------------------- */ 856 857img.size-full, 858.attachment-full, 859.ravel-full { 860 height: auto !important; 861 max-width: 100% !important; 862 width: auto !important; 863 } 864 865img.wp-smiley, 866.widget .wp-smiley { 867 background: transparent; 868 border: 0; 869 border-radius: 0; 870 box-shadow: 0; 871 height: auto; 872 margin: 0; 873 max-height: none; 874 max-width: none; 875 min-height: 0; 876 min-width: 0; 877 padding: 0; 878 width: auto; 879 } 880 881/* Image Alignment */ 882 883.aligncenter { 884 clear: both; 885 display: block; 886 margin: 20px auto; 887 } 888 889.alignnone { 890 clear: both; 891 margin: 14px 0; 892 } 893 894.alignleft { 895 float: left; 896 margin: 18px 24px 12px 0; 897 max-width: 50%; 898 } 899 900.alignright { 901 float: right; 902 margin: 18px 0 12px 24px; 903 max-width: 50%; 904 } 905 906img.aligncenter, 907img.alignnone, 908img.alignleft, 909img.alignright{ 910 margin-top: 5px; 911 margin-bottom: 8px; 912 } 913 914img.aligncenter:only-child, 915img.alignnone:only-child { 916 margin-bottom: 8px; 917 } 918 919/* === Captions === */ 920 921.wp-caption {max-width: 100%;} 922 923 .wp-caption img {height: auto;} 924 925 .wp-caption-text, 926 .gallery-caption { 927 border: 0; 928 display: block; 929 font-size: 13px; 930 line-height: 18px; 931 margin: 0; 932 padding: 6px 12px 0; 933 text-align: center; 934 } 935 936/* === Gallery === */ 937 938.gallery { 939 clear: both; 940 float: left; 941 margin: 15px auto 12px; 942 width: 100%; 943 } 944.gallery + p {clear: both;} 945 946 .gallery-row { 947 clear: both; 948 float: left; 949 width: 100%; 950 word-spacing: -4px; 951 } 952 953 .gallery-item { 954 display: inline-block; 955 padding: 0; 956 text-align: center; 957 vertical-align: top; 958 width: 33.3%; 959 word-spacing: 0; 960 } 961 962 .gallery-col-1 .gallery-item, 963 .gallery-columns-1 .gallery-item {width: 100%;} 964 .gallery-col-2 .gallery-item, 965 .gallery-columns-2 .gallery-item {width: 50%;} 966 /* .gallery-col-3 is the default one above */ 967 .gallery-col-4 .gallery-item, 968 .gallery-columns-4 .gallery-item {width: 25%;} 969 .gallery-col-5 .gallery-item, 970 .gallery-columns-5 .gallery-item {width: 20%;} 971 .gallery-col-6 .gallery-item, 972 .gallery-columns-6 .gallery-item {width: 16%;} 973 .gallery-col-7 .gallery-item, 974 .gallery-columns-7 .gallery-item {width: 14%;} 975 .gallery-col-8 .gallery-item, 976 .gallery-columns-8 .gallery-item {width: 12.5%;} 977 .gallery-col-9 .gallery-item, 978 .gallery-columns-9 .gallery-item {width: 11%;} 979 .gallery-col-10 .gallery-item, 980 .gallery-columns-10 .gallery-item { width: 10%;} 981 .gallery-col-11 .gallery-item, 982 .gallery-columns-11 .gallery-item { width: 9.09%;} 983 .gallery-col-12 .gallery-item, 984 .gallery-columns-12 .gallery-item { width: 8.33%;} 985 .gallery-col-13 .gallery-item, 986 .gallery-columns-13 .gallery-item { width: 7.69%;} 987 .gallery-col-14 .gallery-item, 988 .gallery-columns-14 .gallery-item { width: 7.14%;} 989 .gallery-col-15 .gallery-item, 990 .gallery-columns-15 .gallery-item { width: 6.66%;} 991 .gallery-col-16 .gallery-item, 992 .gallery-columns-16 .gallery-item { width: 6.25%;} 993 .gallery-col-17 .gallery-item, 994 .gallery-columns-17 .gallery-item { width: 5.88%;} 995 .gallery-col-18 .gallery-item, 996 .gallery-columns-18 .gallery-item { width: 5.55%;} 997 .gallery-col-19 .gallery-item, 998 .gallery-columns-19 .gallery-item { width: 5.26%;} 999 .gallery-col-20 .gallery-item, 1000 .gallery-columns-20 .gallery-item { width: 5%;} 1001 .gallery-col-21 .gallery-item, 1002 .gallery-columns-21 .gallery-item { width: 4.76%;} 1003 .gallery-col-22 .gallery-item, 1004 .gallery-columns-22 .gallery-item { width: 4.54%;} 1005 .gallery-col-23 .gallery-item, 1006 .gallery-columns-23 .gallery-item { width: 4.34%;} 1007 .gallery-col-24 .gallery-item, 1008 .gallery-columns-24 .gallery-item { width: 4.16%;} 1009 .gallery-col-25 .gallery-item, 1010 .gallery-columns-25 .gallery-item { width: 4%;} 1011 .gallery-col-26 .gallery-item, 1012 .gallery-columns-26 .gallery-item { width: 3.84%;} 1013 .gallery-col-27 .gallery-item, 1014 .gallery-columns-27 .gallery-item { width: 3.7%;} 1015 .gallery-col-28 .gallery-item, 1016 .gallery-columns-28 .gallery-item { width: 3.57%;} 1017 .gallery-col-29 .gallery-item, 1018 .gallery-columns-29 .gallery-item { width: 3.44%;} 1019 .gallery-col-30 .gallery-item, 1020 .gallery-columns-30 .gallery-item { width: 3.33%;} 1021 1022 .gallery-icon { 1023 margin: 0; 1024 padding: 0; 1025 } 1026 1027 .gallery-icon a { 1028 display: block; 1029 line-height: 18px; /* should match .gallery-caption line-height */ 1030 } 1031 1032 .gallery-icon img { 1033 display: inline-block; 1034 height: auto; 1035 margin: 6px auto; 1036 max-width: 100%; 1037 width: auto; 1038 } 1039 1040 .gallery-caption { 1041 padding: 0 12px; 1042 } 1043 1044 /* .gallery-caption {} goes here, view .wp-caption */ 1045 1046 .singular-attachment .gallery-caption {display: none;} 1047 1048/* === Embeds === */ 1049 1050.twitter-tweet {width: 100%;} 1051 1052.embed-wrap { 1053 height: 0; 1054 margin: 5px 0 8px; 1055 overflow: hidden; 1056 padding-bottom: 56.25%; 1057 padding-top: 30px; 1058 position: relative; 1059 } 1060 1061 .embed-wrap iframe, 1062 .embed-wrap object, 1063 .embed-wrap embed { 1064 height: 100%; 1065 max-width: 100%; 1066 position: absolute; 1067 left: 0; 1068 top: 0; 1069 width: 100%; 1070 } 1071 1072 iframe.twitter-tweet {margin: 20px 0 !important;} 1073 1074 .mejs-audio, 1075 .mejs-video {margin: 20px 0;} 1076 1077 .mejs-container, 1078 .mejs-container video, 1079 .mejs-layer { 1080 max-width: 100% !important; 1081 } 1082 1083 1084/* === Clearing Floats === */ 1085 1086.clearfix::after, 1087#branding::after, 1088.content-container::after, 1089.entry::after, 1090#footer::after, 1091#comments::after 1092.comment-respond::after, 1093li.comment::after, 1094li.comment > article::after, 1095li.ping::after { 1096 content: "."; 1097 display: block; 1098 height: 0; 1099 clear: both; 1100 visibility: hidden; 1101} 1102 1103/** 1104 * Layout 1105 * 1106 * This section of the stylesheet defines the overall layout of the theme's major structural elements. It is essentially the foundation for the entire design. 1107 * --------------------------------------------------------------------------- */ 1108 1109.page-container > .wrap { 1110 margin: 0 auto; 1111 max-width: 1200px; 1112 position: relative; 1113 } 1114 1115 /* start background decoration shapes */ 1116 .page-container > .wrap::before, 1117 .page-container > .wrap::after { 1118 background: transparent; 1119 border: 700px solid rgba(0,0,0,0.07); 1120 content: ''; 1121 /*height: 3200px;*/ /* desbest edit */ 1122 margin: -1600px -128px 0 0; 1123 position: absolute; 1124 right: 50%; 1125 top: 0; 1126 transform: rotate(45deg); 1127 -webkit-transform: rotate(45deg); 1128 -moz-transform: rotate(45deg); 1129 -ms-transform: rotate(45deg); 1130 -o-transform: rotate(45deg); 1131 width: 3200px; 1132 z-index: -1; 1133 } 1134 1135 .page-container > .wrap::after { 1136 margin-left: -128px; 1137 margin-right: 0; 1138 left: 50%; 1139 right: auto; 1140 } 1141 /* end background decoration shapes */ 1142 1143 /* macro layout grouping */ 1144 #header, 1145 .content-container, 1146 .entry, 1147 #comments-template, 1148 #footer { 1149 clear: both; 1150 float: left; 1151 width: 100%; 1152 } 1153 1154 .content-container { 1155 padding: 24px 0 0; 1156 } 1157 .page-template-intro .content-container { 1158 padding: 9px 0 0; 1159 } 1160 1161 /* content area is 64% by default */ 1162 .content { 1163 float: left; 1164 margin-left: 4%; 1165 width: 64%; 1166 } 1167 1168 /* on specific pages, the content area is 100% */ 1169 .page-template-intro .content, 1170 .archive-portfolio_item .content, 1171 .taxonomy-portfolio .content, 1172 .singular-portfolio_item .content { 1173 margin: 0; 1174 width: 100%; 1175 } 1176 1177 .entry {/* view "macro layout grouping" */} 1178 1179 1180 /* micro layout grouping */ 1181 .entry-byline, 1182 .singular-page .entry-header, 1183 #comments-header { 1184 border-right: 3px double rgba(255,255,255,.1); 1185 color: #8d9ca6; 1186 float: left; 1187 font: normal normal 16px/24px Lora, Georgia, serif; 1188 padding: 18px 24px 18px 0; 1189 text-align: right; 1190 width: 26.562%; 1191 } 1192 .entry-title, 1193 .featured-media, 1194 .entry-content, 1195 .entry-summary, 1196 .entry-footer, 1197 .loop-pagination, 1198 .comment-list, 1199 .comment-respond, 1200 .comments-closed { 1201 clear: right; 1202 float: right; 1203 width: 70.315%; 1204 } 1205 1206 /* sidebar */ 1207 #sidebar-primary { 1208 float: right; 1209 margin-right: 4%; 1210 width: 24%; 1211 } 1212 .sidebar-toggle { 1213 font-size: 0; 1214 line-height: 0; 1215 padding: 0; 1216 } 1217 1218 1219 1220/** 1221 * Header and Footer 1222 * 1223 * Handles the output of the main site header and footer content. 1224 * --------------------------------------------------------------------------- */ 1225 1226 1227/** 1228 * Handles the output of the header content. 1229 */ 1230 1231#header { 1232 clear: both; 1233 float: left; 1234 padding: 70px 0 0; 1235 position: relative; 1236 width: 100%; 1237 } 1238 1239 #branding { 1240 margin: 32px 0 30px; 1241 padding: 0 15%; 1242 text-align: center; 1243 } 1244 1245 #branding img { 1246 height: auto; 1247 max-width: 100%; 1248 width: auto; 1249 } 1250 1251 #site-title { 1252 color: #a0cfeb; 1253 display: inline-block; 1254 font-size: 72px; 1255 font-weight: 700; 1256 font-style: italic; 1257 letter-spacing: -0.02em; 1258 line-height: 90px; 1259 margin: 0 auto; 1260 text-shadow: 9px 9px 0 rgba(0,0,0,.2); 1261 } 1262 1263 #site-title a { 1264 color: #a0cfeb; 1265 display: inline-block; 1266 } 1267 #site-title a:hover { 1268 color: #e3f4ff; 1269 text-decoration: none; 1270 } 1271 1272 /* single letter site-title version */ 1273 .single-letter #site-title a { 1274 border: 9px solid #a0cfec; 1275 box-shadow: 9px 9px 0 rgba(0,0,0,.2), inset 9px 9px 0 rgba(0,0,0,.2); 1276 display: inline-block; 1277 font-size: 0; 1278 height: 108px; 1279 overflow: hidden; 1280 width: 108px; 1281 } 1282 .single-letter #site-title a:hover { 1283 border-color: #e3f4ff; 1284 } 1285 .single-letter #site-title a:first-letter { 1286 font-size: 72px; 1287 line-height: 90px; 1288 } 1289 1290 /* === Menu: Primary === */ 1291 1292 nav#menu-primary { 1293 padding: 9px 0; 1294 text-align: center; 1295 z-index: 4; 1296 } 1297 1298 /* skip to content link */ 1299 .assistive-text, 1300 .screen-reader-text { 1301 left: -9999em; 1302 overflow: hidden; 1303 position: absolute; 1304 top: -9999em; 1305 } 1306 1307 /* Hide menu toggle */ 1308 .menu-toggle {display: none;} 1309 1310 /* === 1ST LEVEL STRUCTURE === */ 1311 1312 nav.menu ul { 1313 list-style: none; 1314 margin: 0; 1315 padding: 0; 1316 word-spacing: -4px; 1317 } 1318 1319 /* === 2ND LEVEL STRUCTURE === */ 1320 1321 nav.menu ul ul { 1322 background: #101619; 1323 left: 0; 1324 margin: 0; 1325 min-width: 220px; 1326 opacity: 0; 1327 position: absolute; 1328 top: 48px; 1329 visibility: hidden; 1330 z-index: 99; 1331 } 1332 nav.menu li > ul::before { 1333 border-bottom: 4px solid #101619; 1334 border-left: 4px solid transparent; 1335 border-right: 4px solid transparent; 1336 content: ''; 1337 left: 24px; 1338 position: absolute; 1339 top: -4px; 1340 } 1341 nav.menu li:hover > ul { 1342 opacity: 1; 1343 visibility: visible; 1344 } 1345 1346 /* === 3RD LEVEL STRUCTURE === */ 1347 nav.menu ul ul ul { 1348 left: 100%; 1349 margin: 0 0 0 20px; 1350 top: 0; 1351 } 1352 nav.menu li li > ul::before { 1353 border-right: 4px solid #101619; 1354 border-bottom: 4px solid transparent; 1355 border-top: 4px solid transparent; 1356 left: -8px; 1357 position: absolute; 1358 top: 10px; 1359 } 1360 nav.menu li li:hover > ul { 1361 margin: 0 0 0 6px; 1362 } 1363 1364 /* === 1ST LEVEL CONTENT === */ 1365 1366 .menu-items {zoom: 1;} 1367 1368 /* menu item */ 1369 nav.menu li { 1370 display: inline-block; 1371 position: relative; 1372 text-align: left; 1373 word-spacing: 0; 1374 } 1375 1376 /* links */ 1377 nav.menu li a { 1378 color: #e3f4ff; 1379 display: block; 1380 font-size: 24px; 1381 font-weight: 700; 1382 line-height: 36px; 1383 margin: 0; 1384 padding: 6px 18px 5px; 1385 text-transform: uppercase; 1386 text-shadow: 2px 2px 0 rgba(0,0,0,.2); 1387 } 1388 /* link hovers */ 1389 nav.menu li a:hover { 1390 background: rgba(0,0,0,.1); 1391 text-decoration: none; 1392 } 1393 1394 /* current links */ 1395 nav.menu li.current-menu-item > a {color: #a0cfec;} 1396 1397 /* drop-down indicator */ 1398 nav.menu li > a::after { 1399 color: #f73f37; 1400 content: "\f0d7"; 1401 font-size: 24px; 1402 line-height: 36px; 1403 margin: 0 0 0 10px; 1404 text-shadow: 2px 2px 0 rgba(0,0,0,.2); 1405 vertical-align: baseline; 1406 } 1407 1408 /* === 2ND LEVEL CONTENT === */ 1409 1410 nav.menu li li {width: 100%;} 1411 1412 nav.menu li li a { 1413 border-bottom: 1px solid #1d2529; 1414 display: block; 1415 font-size: 17px; 1416 font-weight: 400; 1417 line-height: 24px; 1418 margin: 0; 1419 padding: 8px 18px; 1420 position: relative; 1421 text-transform: none; 1422 text-shadow: none; 1423 } 1424 nav.menu li li a:hover { 1425 background: #000; 1426 } 1427 nav.menu li li > a::after { 1428 content: '\f0da'; 1429 font-size: 18px; 1430 line-height: 24px; 1431 position: absolute; 1432 right: 20px; 1433 } 1434 .rtl nav.menu li li > a::after { 1435 content: '\f0d9'; 1436 left: 20px; 1437 right: auto; 1438 } 1439 1440 /* === ALL LEVELS RESET === */ 1441 1442 /* no drop-down indicator for single items */ 1443 nav.menu li a:only-child::after { 1444 content: ''; 1445 margin: 0; 1446 } 1447 1448 /* === Social Media Icons === */ 1449 1450 /* email icon*/ 1451 nav.menu li > a[href*="mailto:"]:only-child::after, 1452 1453 /* social media menu icons */ 1454 nav.menu li > a[href*="dribbble.com"]:only-child::after, 1455 nav.menu li > a[href*="facebook.com"]:only-child::after, 1456 nav.menu li > a[href*="flickr.com"]:only-child::after, 1457 nav.menu li > a[href*="foursquare.com"]:only-child::after, 1458 nav.menu li > a[href*="github.com"]:only-child::after, 1459 nav.menu li > a[href*="plus.google.com"]:only-child::after, 1460 nav.menu li > a[href*="instagram.com"]:only-child::after, 1461 nav.menu li > a[href*="linkedin.com"]:only-child::after, 1462 nav.menu li > a[href*="pinterest.com"]:only-child::after, 1463 nav.menu li > a[href$="/feed"]:only-child::after, 1464 nav.menu li > a[href$="/feed/"]:only-child::after, 1465 nav.menu li > a[href*="skype.com"]:only-child::after, 1466 nav.menu li > a[href*="tumblr.com"]:only-child::after, 1467 nav.menu li > a[href*="twitter.com"]:only-child::after, 1468 nav.menu li > a[href*="vimeo.com"]:only-child::after, 1469 nav.menu li > a[href*="youtube.com"]:only-child::after { 1470 color: #9cc4dd; 1471 content: '\f09e'; 1472 font-size: 16px; 1473 margin: 0 0 0 8px; 1474 } 1475 1476 /* dribbble */ 1477 nav.menu li > a[href*="dribbble"]:only-child::after { 1478 content: '\f17d'; 1479 } 1480 1481 /* email */ 1482 nav.menu li > a[href*="mailto"]:only-child::after { 1483 content: '\f0e0'; 1484 } 1485 /* facebook */ 1486 nav.menu li > a[href*="facebook.com"]:only-child::after { 1487 color: #3b5998; 1488 content: '\f09a'; 1489 } 1490 /* flickr */ 1491 nav.menu li > a[href*="flickr.com"]:only-child::after { 1492 color: #ff0084; 1493 content: '\f16e'; 1494 } 1495 /* foursquare */ 1496 nav.menu li > a[href*="foursquare.com"]:only-child::after { 1497 color: #1eaeeb; 1498 content: '\f180'; 1499 } 1500 /* google plus */ 1501 nav.menu li > a[href*="github.com"]:only-child::after { 1502 color: #444; 1503 content: '\f09b'; 1504 } 1505 /* google plus */ 1506 nav.menu li > a[href*="plus.google.com"]:only-child::after { 1507 color: #dd4b39; 1508 content: '\f0d5'; 1509 } 1510 /* instagram */ 1511 nav.menu li> a[href*="instagram.com"]:only-child::after { 1512 color: #ab8163; 1513 content: '\f16d'; 1514 } 1515 /* linkedin */ 1516 nav.menu li > a[href*="linkedin.com"]:only-child::after { 1517 color: #0077b5; 1518 content: '\f0e1'; 1519 } 1520 /* pinterest */ 1521 nav.menu li > a[href*="pinterest.com"]:only-child::after { 1522 color: #cb2027; 1523 content: '\f0d2'; 1524 } 1525 /* rss icon */ 1526 nav.menu li > a[href$="/feed"]:only-child::after, 1527 nav.menu li > a[href$="/feed/"]:only-child::after { 1528 color: #f0bd89; 1529 } 1530 /* skype */ 1531 nav.menu li > a[href*="skype.com"]:only-child::after { 1532 color: #04b1f5; 1533 content: '\f17e'; 1534 } 1535 /* tumblr */ 1536 nav.menu li > a[href*="tumblr.com"]:only-child::after { 1537 color: #444; 1538 content: '\f173'; 1539 } 1540 /* twitter */ 1541 nav.menu li > a[href*="twitter.com"]:only-child::after { 1542 color: #55acee; 1543 content: '\f099'; 1544 } 1545 /* vimeo */ 1546 nav.menu li > a[href*="vimeo.com"]:only-child::after { 1547 color: #444; 1548 content: '\f194'; 1549 } 1550 /* youtube */ 1551 nav.menu li > a[href*="youtube.com"]:only-child::after { 1552 color: #cc181e; 1553 content: '\f166'; 1554 } 1555 1556 1557 1558/* === Header/Footer Dividers === */ 1559 1560 #header::after, 1561 #footer::before { 1562 background: url(images/divider.png) center center no-repeat; 1563 clear: both; 1564 content: ''; 1565 display: block; 1566 height: 57px; 1567 margin: 0 auto; 1568 width: 50%; 1569 } 1570 1571 @media (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { 1572 #header::after, 1573 #footer::before { 1574 background-image: url(images/divider-2x.png); 1575 background-size: 1200px 9px; 1576 } 1577 } 1578 1579 #footer::before {width: 80%;} 1580 1581/* === Footer === */ 1582 1583 /* social media menu */ 1584 #menu-social { 1585 float: left; 1586 padding: 15px 0 24px 10%; 1587 text-align: right; 1588 vertical-align: top; 1589 width: 50%; 1590 word-spacing: 0; 1591 } 1592 #menu-social ul {word-spacing: 0;} 1593 1594 #menu-social li a { 1595 font-size: 0; 1596 line-height: 0; 1597 padding: 0; 1598 } 1599 #menu-social li a:hover { 1600 background: transparent; 1601 } 1602 #menu-social li a::after { 1603 border: 3px solid #8d9ca6; 1604 border-radius: 50%; 1605 color: inherit; 1606 font-size: 18px; 1607 line-height: 36px; 1608 margin: 9px 9px 0 0; 1609 min-width: 42px; 1610 opacity: .6; 1611 text-align: center; 1612 text-shadow: none; 1613 } 1614 #menu-social li a:hover::after { 1615 opacity: 1; 1616 } 1617 #menu-social ul ul {display: none;} 1618 1619 .footer-content { 1620 float: left; 1621 font-size: 13px; 1622 line-height: 18px; 1623 padding: 37px 15% 40px; 1624 text-align: center; 1625 text-transform: uppercase; 1626 width: 100%; 1627 } 1628 1629 #menu-social + .footer-content { 1630 padding-left: 12px; 1631 text-align: left; 1632 width: 50%; 1633 } 1634 .footer-content p { 1635 display: inline-block; 1636 padding: 0; 1637 } 1638 1639/** 1640 * Main and Content 1641 * 1642 * This section deals with the #main section of the site, which wraps the content. 1643 * --------------------------------------------------------------------------- */ 1644 1645 .content img, 1646 .widget img {max-width: 100%;} 1647 1648 .entry-content img, 1649 .featured-media > img, 1650 .featured-media > a > img, 1651 .featured-media figure, 1652 .chat-transcript, 1653 .widget, 1654 .page-template-intro .content p img, 1655 .archive-portfolio_item .content figure, 1656 .taxonomy-portfolio .content figure { 1657 background: #161d21; 1658 border: 1px solid #333b41; 1659 box-shadow: 12px 12px 0 rgba(0,0,0,.08); 1660 padding: 11px; 1661 } 1662 1663 .entry-content img {box-shadow: none;} 1664 1665/** 1666 * Posts Listing 1667 ************************************************/ 1668 1669.entry { 1670 margin-bottom: 24px; 1671 } 1672 1673 /* === entry footer === */ 1674 1675 .entry-footer { 1676 color: #8d9ca6; 1677 font: normal normal 11px/18px Arial, Helvetica, sans-serif; 1678 padding: 14px 0 19px; 1679 text-shadow: none; 1680 word-spacing: -4px; 1681 } 1682 .entry-footer a {color: #8d9ca6;} 1683 .entry-footer a:hover {color: #e3f4ff;text-decoration: none;} 1684 1685 .entry-footer .entry-permalink { 1686 float: right; 1687 font-size: 0; 1688 line-height: 0; 1689 opacity: 0.2; 1690 text-align: right; 1691 width: 10%; 1692 } 1693 .entry-footer .entry-permalink:hover { 1694 opacity: 1; 1695 } 1696 .entry-footer .entry-permalink::before { 1697 content: '\f0c1'; 1698 font-size: 15px; 1699 margin-top: 6px; 1700 line-height: 24px; 1701 vertical-align: top; 1702 width: 30px; 1703 } 1704 1705 .entry-terms { 1706 margin-right: 9px; 1707 vertical-align: top; 1708 } 1709 1710 .entry-terms.category::before, 1711 .entry-terms.post_tag::before, 1712 .entry-terms.portfolio::before { 1713 content: '\f02c'; 1714 font-size: 18px; 1715 margin: 6px 7px 0 0; 1716 line-height: 24px; 1717 vertical-align: top; 1718 } 1719 1720 .entry-terms.category::before { 1721 content: '\f07c'; 1722 } 1723 1724 .entry-terms a { 1725 background: rgba(0,0,0,.1); 1726 display: inline-block; 1727 margin: 6px 3px 0; 1728 padding: 3px 10px; 1729 vertical-align: top; 1730 word-spacing: 0; 1731 } 1732 .entry-terms a:hover { 1733 background: rgba(0,0,0,.3); 1734 } 1735 1736 /* === byline === */ 1737 1738 .entry-byline { 1739 margin-bottom: 18px; 1740 } 1741 1742 .entry-byline .entry-published { 1743 display: block; 1744 color: #f74037; 1745 font-weight: 700; 1746 text-transform: uppercase; 1747 } 1748 .entry-byline .comments-link { 1749 display: block; 1750 } 1751 1752 /* edit link */ 1753 .post-edit-link { 1754 background: rgba(0,0,0,.15); 1755 display: inline-block; 1756 font-size: 12px; 1757 font-weight: 700; 1758 padding: 0 9px; 1759 text-transform: uppercase; 1760 } 1761 .post-edit-link:hover { 1762 background: rgba(0,0,0,.5); 1763 text-decoration: none; 1764 } 1765 1766 /* === entry title === */ 1767 1768 .entry-title { 1769 font-size: 48px; 1770 font-style: italic; 1771 letter-spacing: -0.025em; 1772 line-height: 58px; 1773 padding: 3px 24px 8px; 1774 text-align: center; 1775 } 1776 .entry-title a:hover { 1777 text-decoration: none; 1778 } 1779 1780 /* === featured media === */ 1781 1782 .featured-media { 1783 padding-bottom: 16px; 1784 position: relative; 1785 } 1786 .entry-title + .featured-media { 1787 margin-top: 18px; 1788 } 1789 /* reset child floats and margins */ 1790 .featured-media > *, 1791 .featured-media img[class*="align"], 1792 .featured-media .wp-video .mejs-video { 1793 float: none; 1794 margin: 0; 1795 } 1796 1797 /* removed extra spacing */ 1798 .featured-media > a, 1799 .featured-media > figure > a, 1800 .featured-media > figure > img, 1801 .featured-media > figure > a > img { 1802 display: block; 1803 } 1804 1805 /* for targetted images in featured-media */ 1806 .featured-media > a > img, 1807 .featured-media > figure > img, 1808 .featured-media > figure > a > img { 1809 height: auto; 1810 max-width: 100%; 1811 } 1812 1813 .post .featured-media .wp-caption-text { 1814 padding: 12px 12px 0; 1815 } 1816 1817 /* === Entry Content === */ 1818 1819 /* === Paragraph styles === */ 1820 .entry-content .alert, 1821 .entry-content .download, 1822 .entry-content .note { 1823 border: 6px solid rgba(0,0,0,.1); 1824 clear: both; 1825 margin: 20px 0; 1826 padding: 11px 20px 10px; 1827 } 1828 1829 /* icons */ 1830 .entry-content .alert::before, 1831 .entry-content .download::before, 1832 .entry-content .note::before { 1833 display: inline-block; 1834 float: left; 1835 font-size: 36px; 1836 margin: 9px 30px 12px 0; 1837 text-shadow: 1px 1px 1px rgba(0,0,0,.20); 1838 } 1839 1840 .entry-content .alert::before {color: #f74037;content: '\f071';} 1841 .entry-content .download::before {color: #8dc63f;content: '\f019';} 1842 .entry-content .note::before {color: #00aeef;content: '\f05a';} 1843 1844/* === Post Format: Chat */ 1845 1846 .chat-transcript { 1847 color: #8d9ca6; 1848 font: normal normal 15px/22px "Courier", Monaco, monospace, Courier; 1849 margin: 20px 0; 1850 } 1851 1852 .chat-row { 1853 border-top: 1px solid #1d2529; 1854 border-bottom: 1px solid #101517; 1855 padding: 11px 18px; 1856 word-spacing: -4px; 1857 } 1858 .chat-row:first-child {border-top: 0;} 1859 .chat-row:last-child {border-bottom: 0;} 1860 .chat-row:nth-child(odd) { 1861 background-color: rgba(0,0,0,.1); 1862 } 1863 1864 .chat-author, 1865 .chat-text { 1866 display: inline-block; 1867 vertical-align: top; 1868 word-spacing: 0; 1869 } 1870 1871 /* chat author */ 1872 .chat-author { 1873 font-weight: 700; 1874 padding-right: 18px; 1875 text-align: right; 1876 width: 22%; 1877 } 1878 .chat-speaker-1 .chat-author {color: #8dc63f;} 1879 .chat-speaker-2 .chat-author {color: #00aeef;} 1880 .chat-speaker-3 .chat-author {color: #3877eb;} 1881 .chat-speaker-4 .chat-author {color: #aa38eb;} 1882 .chat-speaker-5 .chat-author {color: #eb38e9;} 1883 .chat-speaker-6 .chat-author {color: #e6a4ff;} 1884 .chat-speaker-7 .chat-author {color: #ef4f00;} 1885 .chat-speaker-8 .chat-author {color: #efae00;} 1886 .chat-speaker-9 .chat-author {color: #ecef00;} 1887 .chat-speaker-10 .chat-author {color: #c50505;} 1888 1889 .chat-author cite {font-style: normal;} 1890 1891 /* chat text */ 1892 .chat-text { 1893 width: 76%; 1894 } 1895 .chat-text p {padding: 0;} 1896 .chat-text p + p {padding-top: 14px;} 1897 1898/* === Post Format: Gallery */ 1899 .gallery-items-count { 1900 background: rgba(0,0,0,.3); 1901 display: inline-block; 1902 color: #fff; 1903 font-size: 13px; 1904 line-height: 24px; 1905 padding: 0 9px; 1906 position: absolute; 1907 left: 12px; 1908 top: 12px; 1909 text-shadow: none; 1910 } 1911 1912/* === Entry Content Pagination */ 1913 1914.page-links { 1915 font-weight: 700; 1916 line-height: 42px; 1917 padding: 17px 0 16px; 1918 text-transform: uppercase; 1919 word-spacing: -4px; 1920} 1921 /* page links text */ 1922 .page-links-text { 1923 background: rgba(0,0,0,.1); 1924 display: inline-block; 1925 margin: 3px 24px 3px 0; 1926 padding: 0 10px 0 18px; 1927 position: relative; 1928 vertical-align: top; 1929 word-spacing: 0; 1930 } 1931 .page-links-text::before { 1932 border-top: 21px solid transparent; 1933 border-bottom: 21px solid transparent; 1934 border-left: 21px solid rgba(0,0,0,.1); 1935 display: block; 1936 content: ''; 1937 height: 0; 1938 margin-right: -21px; 1939 position: absolute; 1940 right: 0; 1941 top: 0; 1942 width: 0; 1943 } 1944 1945 /* page numbers */ 1946 .page-links a, 1947 .page-links .page-numbers { 1948 border-bottom: 0; 1949 color: #e3f4ff; 1950 display: inline-block; 1951 margin: 3px; 1952 position: relative; 1953 text-align: center; 1954 vertical-align: top; 1955 width: 42px; 1956 word-spacing: 0; 1957 } 1958 1959 .page-links a:hover { 1960 text-decoration: none; 1961 } 1962 1963 .page-links a::before, 1964 .page-links .page-numbers::before { 1965 background: rgba(0,0,0,.1); 1966 content: ''; 1967 height: 30px; 1968 margin-left: -15px; 1969 position: absolute; 1970 left: 50%; 1971 top: 6px; 1972 transform: rotate(45deg); 1973 -webkit-transform: rotate(45deg); 1974 -moz-transform: rotate(45deg); 1975 -ms-transform: rotate(45deg); 1976 -o-transform: rotate(45deg); 1977 width: 30px; 1978 z-index: -1; 1979 } 1980 .page-links a:hover::before { 1981 background: rgba(0,0,0,.3); 1982 } 1983 1984 .page-links .page-numbers::before { 1985 background: rgba(0,0,0,.3); 1986 } 1987 1988/* === Archive Pagination */ 1989 1990.loop-pagination { 1991 clear: both; 1992 font: 700 normal 16px/36px Lora, Georgia, serif; 1993 padding: 0 0 24px; 1994 word-spacing: -4px; 1995 } 1996 1997 .loop-pagination .page-numbers { 1998 display: inline-block; 1999 margin: 0 1px 0 0; 2000 min-width: 48px; 2001 padding: 0; 2002 position: relative; 2003 text-align: center; 2004 text-transform: uppercase; 2005 vertical-align: top; 2006 word-spacing: 0; 2007 } 2008 .loop-pagination a:hover { 2009 text-decoration: none; 2010 } 2011 /* use ::after as background to later skew it */ 2012 .loop-pagination .page-numbers::after { 2013 background: rgba(0,0,0,.1); 2014 display: inline-block; 2015 content: ''; 2016 position: absolute; 2017 bottom: 0; 2018 left: 0; 2019 right: 0; 2020 top: 0; 2021 z-index: -1; 2022 } 2023 .loop-pagination .page-numbers:hover::after, 2024 .loop-pagination .current::after { 2025 background: rgba(0,0,0,.3); 2026 } 2027 2028 .loop-pagination .prev, 2029 .loop-pagination .next { 2030 font-size: 0; 2031 padding: 0; 2032 } 2033 .loop-pagination .prev::before, 2034 .loop-pagination .next::before { 2035 content: '\f0da'; 2036 } 2037 .loop-pagination .prev::before { 2038 content: '\f0d9'; 2039 } 2040 2041/** 2042 * Singular Page 2043 ************************************************/ 2044 2045.singular-page .entry-header .entry-title { 2046 color: #f74037; 2047 font-size: 16px; 2048 font-style: normal; 2049 letter-spacing: 0; 2050 line-height: 24px; 2051 padding: 0; 2052 text-align: right; 2053 text-transform: uppercase; 2054} 2055 2056/** 2057 * Comments Template 2058 * 2059 * This section handles the output of the comments template. In particular, it styles the output of the 2060 * comments section (comments list) and the respond section (comment form). 2061 * --------------------------------------------------------------------------- */ 2062 2063/** 2064 * Comments 2065 * 2066 * Handles the output of the comments list and related elements. 2067 */ 2068 2069#comments-template { 2070 margin-bottom: 24px; 2071} 2072 2073 /** 2074 * Comments 2075 * 2076 * Handles the output of the main comments area. 2077 */ 2078 2079 /* === Comments Header === */ 2080 2081 #comments-header { 2082 /* view '.entry .byline' */ 2083 padding-top: 3px; 2084 padding-bottom: 6px; 2085 } 2086 #comments-number { 2087 color: #f73f37; 2088 font-size: 25px; 2089 letter-spacing: -0.02em; 2090 line-height: 36px; 2091 padding: 0; 2092 text-shadow: 2px 2px 0 rgba(0,0,0,.2); 2093 } 2094 2095 /* Comments Nav */ 2096 2097 .comments-nav { 2098 color: #8d9ca6; 2099 font: 400 normal 16px/24px Lora, Georgia, sans-serif; 2100 text-transform: uppercase; 2101 } 2102 .comments-nav a { 2103 display: block; 2104 font-weight: 700; 2105 } 2106 2107 /* === Comment list === */ 2108 2109 .comment-list, 2110 .comment-list ul.children { 2111 list-style: none; 2112 margin: 0; 2113 padding: 0; 2114 } 2115 2116 .comment-list li.comment, 2117 .comment-list li.ping { 2118 clear: both; 2119 display: block; 2120 margin-bottom: 12px; 2121 } 2122 2123 .comment-wrap { 2124 position: relative; 2125 } 2126 2127 /* === START threaded comments === */ 2128 2129 .comment-list li li.comment { 2130 margin-bottom: 0; 2131 margin-top: 12px; 2132 } 2133 2134 .comment-list li li .comment-wrap { 2135 margin-left: 60px; 2136 } 2137 2138 .comment-list li li li .comment-wrap {margin-left: 120px;} 2139 .comment-list li li li li .comment-wrap {margin-left: 180px;} 2140 .comment-list li li li li li .comment-wrap{margin-left: 240px;} 2141 .comment-list li li li li li li .comment-wrap{margin-left: 300px;} 2142 2143 /* === END threaded comments === */ 2144 2145 /* === Comment Meta === */ 2146 2147 .comment-meta { 2148 background: rgba(0,0,0,.1); 2149 float: left; 2150 clear: both; 2151 color: #8d9ca6; 2152 font-size: 13px; 2153 line-height: 21px; 2154 padding: 10px 42px 10px 18px; 2155 width: 100%; 2156 } 2157 2158 .has-avatar .comment-meta { 2159 padding-left: 60px; 2160 position: relative; 2161 } 2162 2163 /* comment meta background color for comments by the post author */ 2164 .bypostauthor > .comment-wrap .comment-meta { 2165 background: rgba(0,0,0,.3); 2166 } 2167 2168 .comment-meta a {color: #8d9ca6;} 2169 2170 .comment-meta br {display: none;} 2171 2172 /* === Meta Elements === */ 2173 2174 .comment-wrap .avatar { 2175 box-shadow: 1px 0 0 rgba(255,255,255,0.05); 2176 float: left; 2177 height: 42px; 2178 padding: 10px; 2179 position: absolute; 2180 left: 0; 2181 top: 0; 2182 width: 42px; 2183 } 2184 2185 .comment-author { 2186 display: inline-block; 2187 font: 700 normal 14px/22px Lora, Georgia, serif; 2188 margin-right: 18px; 2189 vertical-align: top; 2190 } 2191 2192 .comment-author a {color: #e3f4ff;} 2193 2194 .comment-published, 2195 .comment-edit-link { 2196 display: inline-block; 2197 font-family: Verdana, Arial, Helvetica, sans-serif; 2198 font-size: 11px; 2199 line-height: 22px; 2200 margin-right: 18px; 2201 vertical-align: top; 2202 text-shadow: none; 2203 } 2204 2205 /* === .comment-content {} === */ 2206 2207 .has-avatar .comment-content { 2208 clear: both; 2209 padding-left: 60px; 2210 } 2211 2212 /* Ordered lists style reset */ 2213 .comment-content ul, 2214 .comment-content ol { 2215 margin: 0 0 0 36px; 2216 padding: 15px 0 12px; 2217 } 2218 .comment-content ol { 2219 list-style: decimal; 2220 } 2221 .comment-content ol ol {list-style: upper-roman;} 2222 .comment-content ol ol ol {list-style: lower-roman;} 2223 .comment-content ol ol ol ol {list-style: upper-alpha;} 2224 .comment-content ol ol ol ol ol {list-style: lower-alpha;} 2225 2226 /* === Reply link === */ 2227 2228 .comment-reply-link, 2229 .comment-reply-login { 2230 background: rgba(0,0,0,.05); 2231 font-size: 0; 2232 line-height: 42px; 2233 position: absolute; 2234 right: 0; 2235 top: 0; 2236 text-align: center; 2237 width: 42px; 2238 } 2239 .comment-reply-link:hover, 2240 .comment-reply-login:hover { 2241 background: rgba(0,0,0,.15); 2242 color: #fff; 2243 text-decoration: none; 2244 } 2245 2246 /* reply icon */ 2247 .comment-reply-link::before, 2248 .comment-reply-login::before { 2249 content: '\f112'; 2250 font-size: 12px; 2251 } 2252 2253 /** 2254 * Closed Comments 2255 * 2256 */ 2257 2258 .comments-closed { 2259 color: #f74037; 2260 font-weight: 700; 2261 margin-bottom: 12px; 2262 text-align: center; 2263 } 2264 2265 /** 2266 * Respond 2267 * 2268 * Handles the output of the comment form. 2269 */ 2270 2271 /* normal respond form container when there are no comments yet */ 2272 .comment-respond { 2273 border: 6px solid rgba(0,0,0,.1); 2274 font-size: 13px; 2275 line-height: 21px; 2276 padding: 12px 30px 18px; 2277 } 2278 /* comment respond within threaded .comments-list */ 2279 .comment-list .comment-respond { 2280 margin: 0 0 24px; 2281 width: 100%; 2282 } 2283 2284 .comment-respond .required {color: #c00;} 2285 2286 /* reply title */ 2287 #reply-title { 2288 color: #e3f3ff; 2289 font-size: 16px; 2290 font-style: italic; 2291 line-height: 24px; 2292 padding: 6px 18px 12px; 2293 position: relative; 2294 text-align: center; 2295 } 2296 2297 /* cancel reply link container positioning */ 2298 2299 #reply-title small { 2300 height: 36px; 2301 margin-top: -12px; 2302 margin-right: -30px; 2303 position: absolute; 2304 right: 0; 2305 top: 0; 2306 width: 36px; 2307 } 2308 2309 /* cancel reply link*/ 2310 #reply-title small a { 2311 font-size: 0; 2312 padding-right: 6px; 2313 position: absolute; 2314 right: 0; 2315 top: 0; 2316 text-align: right; 2317 } 2318 2319 #reply-title small a:hover {text-decoration: none;} 2320 2321 /* cancel icon */ 2322 #reply-title small a::before { 2323 color: #fff; 2324 content: '\f00d'; 2325 line-height: 20px; 2326 vertical-align: top; 2327 } 2328 #reply-title small a:hover::before { 2329 text-shadow: 2px 2px 0 rgba(0,0,0,.2); 2330 } 2331 2332 /* cancel icon background */ 2333 #reply-title small a::after { 2334 border-color: transparent #f74137 transparent transparent; 2335 border-style: solid; 2336 border-width: 0 36px 36px 0; 2337 content: ''; 2338 height: 0; 2339 position: absolute; 2340 right: 0; 2341 top: 0; 2342 width: 0; 2343 z-index: -1; 2344 } 2345 2346 /* comment form */ 2347 2348 .comment-form { 2349 clear: both; 2350 } 2351 2352 .comment-form p { 2353 padding: 0; 2354 } 2355 2356 .comment-form .comment-notes, 2357 .comment-form .logged-in-as { 2358 background: rgba(0,0,0,0.05); 2359 color: #8d9ba5; 2360 font: 400 italic 12px/18px Lora, Georga, sans-serif; 2361 margin: 6px 0; 2362 padding: 9px 18px; 2363 text-align: center; 2364 } 2365 2366 /* comment form field containers */ 2367 .comment-form-author, 2368 .comment-form-email, 2369 .comment-form-url, 2370 .comment-form-comment { 2371 position: relative; 2372 } 2373 2374 /* comment form labels */ 2375 .comment-form-author label, 2376 .comment-form-email label, 2377 .comment-form-url label, 2378 .comment-form-comment label { 2379 display: block; 2380 font-size: 1px; /* allow screen reader to read text */ 2381 height: 36px; 2382 line-height: 1px; 2383 margin: 6px 0; 2384 overflow: hidden; 2385 position: absolute; 2386 right: 0; 2387 top: 0; 2388 text-align: center; 2389 visibility: hidden; 2390 width: 36px; 2391 z-index: 2; 2392 } 2393 /* label icons */ 2394 .comment-form-author label::before, 2395 .comment-form-email label::before, 2396 .comment-form-url label::before, 2397 .comment-form-comment label::before { 2398 /* place icons on top of invisible label texts instead of completely hiding label texts from screen readers */ 2399 color: rgba(255,255,255,.15); 2400 line-height: 36px; 2401 position: absolute; 2402 left: 0; 2403 top: 0; 2404 visibility: visible; 2405 width: 36px; 2406 z-index: 2; 2407 } 2408 .comment-form-author label::before {content: '\f007';} 2409 .comment-form-email label::before {content: '\f0e0';} 2410 .comment-form-url label::before {content: '\f0c1';} 2411 .comment-form-comment label::before {content: '\f075';} 2412 2413 /* comment form fields */ 2414 .comment-form input[type="text"], 2415 .comment-form input[type="email"], 2416 .comment-form input[type="url"], 2417 .comment-form textarea { 2418 padding-right: 36px; 2419 width: 100%; 2420 } 2421 2422 /* comment allowed HTML */ 2423 .comment-form .form-allowed-tags { 2424 background: rgba(0,0,0,.1); 2425 font-size: 13px; 2426 margin: 6px 0; 2427 padding: 9px 15px 0; 2428 } 2429 .comment-form .form-allowed-tags code { 2430 display: block; 2431 margin: 9px -15px 0; 2432 } 2433 2434/** 2435 * Widgets 2436 * 2437 * This section handles the output of the sidebar content. 2438 * --------------------------------------------------------------------------- */ 2439 2440.widget { 2441 clear: both; 2442 float: left; 2443 font-size: 13px; 2444 line-height: 21px; 2445 margin-bottom: 24px; 2446 padding: 0; 2447 width: 100%; 2448 /* find '.entry img' for rest of widget styles */ 2449} 2450 2451 /* Widget headings */ 2452 2453 .widget h1, 2454 .widget h2, 2455 .widget h3, 2456 .widget h4, 2457 .widget h5, 2458 .widget h6, 2459 .comment-content h1, 2460 .comment-content h2, 2461 .comment-content h3, 2462 .comment-content h4, 2463 .comment-content h5, 2464 .comment-content h6 { 2465 line-height: 1.5em; 2466 padding: 12px 0 11px; 2467 } 2468 2469 .widget h1, 2470 .comment-content h1 {font-size: 30px;} 2471 .widget h2, 2472 .comment-content h2 {font-size: 24px;} 2473 .widget h3, 2474 .comment-content h3 {font-size: 16px;} 2475 .widget h4, 2476 .comment-content h4 {font-size: 13px;} 2477 .widget h5, 2478 .comment-content h5 {font-size: 12px;} 2479 .widget h6 2480 .comment-content h6 {font-size: 11px;} 2481 2482 .widget .widget-title { 2483 background: #101619 url(images/pattern-triangles.png) left bottom repeat-x; 2484 background-size: 10px 4px; 2485 color: #8d9ca6; 2486 font: 700 normal 16px/24px Roboto, Arial, Helvetica, sans-serif; 2487 padding: 11px 23px 12px; 2488 text-shadow: 2px 2px 0 rgba(0,0,0,.2); 2489 text-transform: uppercase; 2490 } 2491 2492 /* Widget images */ 2493 2494 .widget img { 2495 background: #000; 2496 border: 1px solid #1f262b; 2497 height: auto; 2498 padding: 5px; 2499 } 2500 .widget-title img { 2501 background: transparent; 2502 border: 0; 2503 padding: 0; 2504 } 2505 2506 /* Widget paragraphs */ 2507 2508 .widget p { 2509 padding: 12px 23px 11px; 2510 } 2511 2512 .widget .widget_authors .authors, 2513 .widget .style-none, 2514 .widget .term-cloud, 2515 .widget .post_tag-cloud { 2516 padding-bottom: 14px; 2517 } 2518 2519 /* Widget Lists */ 2520 2521 .widget ul { 2522 list-style: none; 2523 font-size: 16px; 2524 line-height: 24px; 2525 margin: 0; 2526 padding: 0; 2527 } 2528 .widget ul li { 2529 border-top: 1px solid #1d2529; 2530 border-bottom: 1px solid #101517; 2531 padding: 11px 23px 11px 41px; 2532 position: relative; 2533 } 2534 .widget ul li:first-child {border-top: 0;} 2535 .widget ul li:last-child {border-bottom: 0;} 2536 .widget ul li:nth-child(even) {background: rgba(0,0,0,.1);} 2537 2538 .widget ul li::before { 2539 color: #f74037; 2540 content: '\f0da'; 2541 position: absolute; 2542 left: 23px; 2543 top: 15px; 2544 } 2545 2546 .widget ul ul { 2547 border-left: 1px dotted rgba(255,255,255,.1); 2548 font-size: 13px; 2549 line-height: 21px; 2550 margin: 6px 0; 2551 padding-left: 18px; 2552 } 2553 .widget ul ul li { 2554 border: 0; 2555 padding: 0; 2556 } 2557 .widget ul ul li:nth-child(even) {background: transparent;} 2558 .widget ul ul li::before { 2559 content: '' 2560 } 2561 2562 /* Widget Forms */ 2563 2564 .widget input[type="date"], 2565 .widget input[type="datetime"], 2566 .widget input[type="datetime-local"], 2567 .widget input[type="email"], 2568 .widget input[type="month"], 2569 .widget input[type="number"], 2570 .widget input[type="password"], 2571 .widget input[type="search"], 2572 .widget input[type="tel"], 2573 .widget input[type="text"], 2574 .widget input[type="time"], 2575 .widget input[type="url"], 2576 .widget input[type="week"], 2577 .widget textarea, 2578 .widget select { 2579 background-color: #2a363d; 2580 } 2581 2582 .button, 2583 button, 2584 input[type="submit"], 2585 input[type="reset"], 2586 input[type="button"] { 2587 background-color: #101619; 2588 } 2589 2590 /* Widget Tables */ 2591 2592 .widget table, 2593 .comment-content table { 2594 border-width: 3px; 2595 margin: 12px 0 11px; 2596 } 2597 2598 .widget caption, 2599 .widget th, 2600 .widget td, 2601 .comment-content caption 2602 .comment-content th, 2603 .comment-content td { 2604 padding: 2px 6px; 2605 } 2606 2607/* === Calendar === */ 2608 2609.calendar-wrap { 2610 padding: 9px 23px 23px; 2611} 2612 .widget .wp-calendar { 2613 margin: 0; 2614 width: 100%; 2615 } 2616 2617/* === Recent Entries === */ 2618 2619.widget_recent_entries .post-date { 2620 color: #8d9ca6; 2621 display: block; 2622 font-size: 13px; 2623 line-height: 21px; 2624} 2625 2626/* === RSS === */ 2627 2628.widget_rss .widget-title .rsswidget img { 2629 display: inline-block; 2630 height: 12px; 2631 margin-right: 6px; 2632 width: 12px; 2633} 2634 2635 .widget_rss ul li { 2636 padding-left: 23px; 2637 } 2638 .widget_rss ul li::before { 2639 display: none; 2640 } 2641 2642 .widget_rss ul li .rsswidget { 2643 display: block; 2644 padding-right: 24px; 2645 } 2646 2647 .widget_rss ul li .rssSummary { 2648 font-size: 13px; 2649 line-height: 21px; 2650 } 2651 2652 .widget_rss ul li .rss-date, 2653 .widget_rss ul li cite { 2654 color: #8d9ca6; 2655 display: block; 2656 font: 400 italic 13px/21px Lora, Georgia, serif; 2657 } 2658 2659/* === Search === */ 2660 2661.widget_search { 2662 background: transparent; 2663 border: 0; 2664 box-shadow: none; 2665 padding: 10px 0 0; 2666 margin: 0 0 34px; 2667} 2668 2669 .widget_search .widget-title { 2670 display: none; 2671 } 2672 2673 .widget_search input[type="text"], 2674 .widget_search input[type="search"]{ 2675 background: transparent; 2676 } 2677 2678/* === Text Widget === */ 2679 2680.textwidget { 2681 padding: 6px 23px; 2682} 2683 2684 .widget .textwidget p { 2685 padding-left: 0; 2686 padding-right: 0; 2687 } 2688 2689 .widget .textwidget ul { 2690 list-style: square; 2691 list-style-position: outside; 2692 font-size: 13px; 2693 line-height: 21px; 2694 margin: 0 0 0 18px; 2695 padding: 12px 0 11px; 2696 } 2697 .widget .textwidget ul li { 2698 border: 0; 2699 padding: 0; 2700 } 2701 .widget .textwidget ul li:nth-child(even) {background: transparent;} 2702 2703 .widget .textwidget ul li::before { 2704 content: ''; 2705 width: auto; 2706 } 2707 2708 .widget .textwidget ul ul, 2709 .widget .textwidget ol { 2710 border-left: 0; 2711 margin: 0 0 0 18px; 2712 padding: 12px 0 11px; 2713 } 2714 2715/** 2716 * Ravel Utility Tabs (based on Alx Tabs) 2717 * 2718 * --------------------------------------------------------------------------- */ 2719 2720 2721 /* reset styles inherited from .widget ul */ 2722 .widget_util_tabs ul { 2723 font-size: 13px; 2724 line-height: 21px; 2725 } 2726 2727 .widget_util_tabs ul li { 2728 clear: both; 2729 float: left; 2730 padding: 23px 23px 18px; 2731 width: 100%; 2732 } 2733 .widget_util_tabs ul li::before { 2734 display: none; 2735 } 2736 2737 /* === Tabs Nav === */ 2738 2739 .widget_util_tabs .tabs-nav { 2740 background: #141a1e; 2741 border-bottom: 1px solid #242b30; 2742 clear: both; 2743 float: left; 2744 width: 100%; 2745 } 2746 /* reset widget list style for Tabs Nav list */ 2747 .widget_util_tabs .tabs-nav li { 2748 clear: none; 2749 float: left; 2750 border: 0; 2751 padding: 0; 2752 width: 25%; 2753 } 2754 .widget_util_tabs .tabs-nav li:nth-child(even) {background: transparent;} 2755 2756 /* Tabs Nav link */ 2757 .widget_util_tabs .tabs-nav li a{ 2758 border: 1px solid transparent; 2759 color: #8d9ca6; 2760 display: block; 2761 font-size: 0; 2762 margin: -1px 0; 2763 position: relative; 2764 text-align: center; 2765 z-index: 2; 2766 } 2767 .widget_util_tabs .tabs-nav li a:hover { 2768 color: #e3f4ff; 2769 text-decoration: none; 2770 } 2771 2772 /* Tabs Nav link icon */ 2773 .widget_util_tabs .tabs-nav li a::before { 2774 font-size: 18px; 2775 line-height: 46px; 2776 } 2777 .widget_util_tabs .tabs-nav li.tab-recent a::before {content: '\f017';} 2778 .widget_util_tabs .tabs-nav li.tab-popular a::before {content: '\f005';} 2779 .widget_util_tabs .tabs-nav li.tab-comments a::before {content: '\f086';} 2780 .widget_util_tabs .tabs-nav li.tab-tags a::before {content: '\f02c';} 2781 2782 /* Tabs Nav link */ 2783 .widget_util_tabs .tabs-nav li[aria-selected="true"] a { 2784 background: #161d21; 2785 border-color: #f74037 #252d31 #161d21 #252d31; 2786 } 2787 .widget_util_tabs .tabs-nav li:first-child a {border-left: 0; } 2788 .widget_util_tabs .tabs-nav li:last-child a {border-right: 0;} 2789 2790 /* === Tabs Container === */ 2791 2792 .tabs-container {clear: both;} 2793 2794 /* thumbnail */ 2795 .tab-thumbnail { 2796 float: left; 2797 } 2798 .tab-thumbnail img { 2799 background: #000; 2800 border: 1px solid #1f262b; 2801 display: block; 2802 height: 60px; 2803 padding: 5px; 2804 width: 60px; 2805 } 2806 .tab-thumbnail.avatar img { 2807 height: 48px; 2808 width: 48px; 2809 } 2810 2811 /* title and byline */ 2812 .tab-thumbnail + .tab-content {padding-left: 78px;} 2813 .tab-thumbnail.avatar + .tab-content {padding-left: 66px;} 2814 2815 .tab-author, 2816 .tab-post-format, 2817 .tab-date { 2818 font-family: Lora, Georgia, sans-serif; 2819 font-size: 12px; 2820 } 2821 .tab-author cite { 2822 font-style: normal; 2823 font-weight: 700; 2824 } 2825 2826 .tab-post-format a { 2827 color: #8d9ca6; 2828 text-transform: uppercase; 2829 } 2830 2831/** 2832 * Template 404 / Error 2833 * --------------------------------------------------------------------------- */ 2834 2835.error-404 .content { 2836 width: 92%; 2837} 2838 2839 .error-404 .entry { 2840 margin: 0 auto; 2841 text-align: center; 2842 width: auto; /* desbest edit */ 2843 } 2844 .entry.error .entry-title { 2845 color: #9cc4dd; 2846 font: 700 italic 145px/1 Lora, Georgia, serif; 2847 letter-spacing: -0.02em; 2848 padding: 0 0 27px; 2849 text-shadow: 12px 12px 0 rgba(0,0,0,.2); 2850 } 2851 2852 2853 .entry.error .entry-title, 2854 .entry.error .entry-content { 2855 text-align: center; 2856 width: 100%; 2857 } 2858 2859 .entry.error .entry-content .search-form { 2860 margin: 24px auto; 2861 } 2862 2863 2864/** 2865 * Template Intro 2866 * --------------------------------------------------------------------------- */ 2867 2868.page-template-intro .content { 2869 margin: 0 0 12px; 2870 text-align: center; 2871 word-spacing: -4px; 2872} 2873 2874 .page-template-intro .col, 2875 .page-template-intro .col { 2876 display: inline-block; 2877 padding: 0 12px; 2878 text-align: left; 2879 vertical-align: top; 2880 width: 564px; 2881 word-spacing: 0; 2882 } 2883 2884 #hero-image-container img { 2885 display: block; 2886 height: auto; 2887 max-width: 100%; 2888 } 2889 2890 2891/** 2892 * Template Portfolio Archive Pages 2893 * --------------------------------------------------------------------------- */ 2894 2895 /* === Menu Portfolio === */ 2896 2897 #menu-portfolio { 2898 clear: both; 2899 float: left; 2900 padding: 0 0 36px; 2901 text-align: center; 2902 width: 100%; 2903 } 2904 2905 #menu-portfolio li { 2906 margin: 0 1px 0 0; 2907 text-align: left; /* check this */ 2908 } 2909 #menu-portfolio li a { 2910 display: block; 2911 font: 400 normal 16px/36px Lora, Georgia, serif; 2912 margin: 0; 2913 min-width: 48px; 2914 padding: 0 18px; 2915 text-align: center; 2916 text-transform: none; 2917 text-shadow: none; 2918 } 2919 /* link hovers */ 2920 #menu-portfolio li a:hover { 2921 background: transparent; 2922 text-decoration: none; 2923 } 2924 2925 /* use ::after as background to later skew it */ 2926 #menu-portfolio li a::after { 2927 background: rgba(0,0,0,.2); 2928 display: inline-block; 2929 content: ''; 2930 position: absolute; 2931 bottom: 0; 2932 left: 0; 2933 right: 0; 2934 top: 0; 2935 transform: skew(-45deg); 2936 -webkit-transform: skew(-45deg); 2937 -moz-transform: skew(-45deg); 2938 -ms-transform: skew(-45deg); 2939 -o-transform: skew(-45deg); 2940 z-index: -1; 2941 } 2942 #menu-portfolio li a:hover::after { 2943 background: rgba(0,0,0,.3); 2944 } 2945 2946 /* === Loop Entries Gallery === */ 2947 2948 .loop-entries-gallery { 2949 clear: both; 2950 float: left; 2951 list-style: none; 2952 margin: 0 0 12px; 2953 padding: 0 3%; 2954 text-align: center; 2955 width: 100%; 2956 word-spacing: -4px; 2957 } 2958 .loop-entries-gallery li { 2959 display: inline-block; 2960 margin: 12px; 2961 position: relative; 2962 vertical-align: top; 2963 width: 28%; 2964 word-spacing: 0; 2965 } 2966 2967 2968 2969 .loop-entries-gallery figure { 2970 z-index: 1; 2971 } 2972 2973 .loop-entries-gallery li figure a, 2974 .loop-entries-gallery li figure a img { 2975 /* remove additional spacing at the bottom of each entry */ 2976 display: block; 2977 } 2978 2979 .loop-entries-gallery li figure a img { 2980 height: auto; 2981 max-width: 100%; 2982 } 2983 2984 .loop-entries-gallery .entry-title { 2985 background: rgba(0,0,0,.8); 2986 clear: none; 2987 float: none; 2988 font: normal 18px/27px Roboto, Arial, Heletica, sans-serif; 2989 letter-spacing: 0; 2990 margin: 0; 2991 opacity: 0; 2992 padding: 10px 18px; 2993 position: absolute; 2994 right: 12px; 2995 bottom: 12px; 2996 left: 12px; 2997 text-align: center; 2998 width: auto; 2999 z-index: 1; 3000 } 3001 3002 .loop-entries-gallery li:hover .entry-title { 3003 opacity: 1; 3004 } 3005 3006 /* === Pagination === */ 3007 3008 .archive-portfolio_item .loop-pagination, 3009 .taxonomy-portfolio .loop-pagination { 3010 padding: 24px 0; 3011 text-align: center; 3012 width: 100%; 3013 } 3014 3015 /* skew the background on portfolio pages */ 3016 .archive-portfolio_item .loop-pagination .page-numbers::after, 3017 .taxonomy-portfolio .loop-pagination .page-numbers::after { 3018 transform: skew(-45deg); 3019 -webkit-transform: skew(-45deg); 3020 -moz-transform: skew(-45deg); 3021 -ms-transform: skew(-45deg); 3022 -o-transform: skew(-45deg); 3023 } 3024 3025/** 3026 * Template Singular Portfolio Item 3027 * --------------------------------------------------------------------------- */ 3028 3029.singular-portfolio_item .content { 3030 padding: 0 3%; 3031 } 3032 3033 .singular-portfolio_item .featured-media { 3034 clear: left; 3035 float: left; 3036 margin: 0 12px; 3037 padding: 0; 3038 width: 64.54%; 3039 } 3040 /* reset margin bottom for all first level childs */ 3041 .singular-portfolio_item .featured-media > *{ 3042 margin-bottom: 24px; 3043 } 3044 3045 /* reset all `figure` tags */ 3046 .singular-portfolio_item .featured-media figure, 3047 .singular-portfolio_item .featured-media figure[class*="align"]{ 3048 margin: 0 0 24px; 3049 overflow: hidden; 3050 position: relative; 3051 } 3052 3053 .singular-portfolio_item .featured-media figcaption { 3054 background: rgba(0,0,0,0.5); 3055 color: #fff; 3056 display: block; 3057 font: 400 normal 11px/18px Arial, Helvetica, sans-serif; 3058 margin: 0 0 -30px; 3059 overflow: hidden; 3060 padding: 6px 15px; 3061 position: absolute; 3062 bottom: 0; 3063 left: 11px; 3064 right: 11px; 3065 text-align: left; 3066 z-index: 2; 3067 } 3068 3069 .singular-portfolio_item .featured-media figure:hover figcaption {margin-bottom: 11px;} 3070 3071 .singular-portfolio_item .entry { 3072 clear: right; 3073 float: right; 3074 margin: 0 12px 12px; 3075 width: 29.8%; 3076 } 3077 3078 .singular-portfolio_item .entry-title { 3079 font-size: 24px; 3080 line-height: 36px; 3081 padding-left: 0; 3082 padding-right: 0; 3083 text-align: left; 3084 width: 100%; 3085 } 3086 .singular-portfolio_item .entry-content, 3087 .singular-portfolio_item .entry-footer { 3088 width: 100%; 3089 } 3090 3091 .button.portfolio-item-link {text-transform: uppercase;} 3092 3093 3094 3095 3096/** 3097 * Plugins 3098 * --------------------------------------------------------------------------- */ 3099 3100/* === Clean My Archives === */ 3101 3102 .clean-my-archives ul {list-style: none;} 3103 3104 .clean-my-archives li { 3105 padding-left: 40px; 3106 position: relative; 3107 } 3108 3109 .clean-my-archives .day, 3110 .clean-my-archives .comments-number { 3111 display: inline-block; 3112 font-size: 18px; 3113 } 3114 3115 .clean-my-archives .day { 3116 font-weight: 700; 3117 left: 0; 3118 position: absolute; 3119 } 3120 3121 .clean-my-archives .day-duplicate .day { 3122 border-left: 1px dotted rgba(255,255,255,.2); 3123 margin-left: 12px; 3124 text-indent: -9999em; 3125 } 3126 3127/** 3128 * Grouping for Convenience 3129 * --------------------------------------------------------------------------- */ 3130 3131a, 3132button, 3133input, 3134select, 3135textarea, 3136.menu-toggle::before, 3137nav.menu a::after, 3138nav.menu ul ul, 3139.page-links a::before, 3140.loop-pagination .page-numbers::after, 3141#sidebar-primary, 3142.sidebar-toggle:hover::before, 3143.loop-entries-gallery .entry-title, 3144.singular-portfolio_item .featured-media figcaption { 3145 transition: all 0.3s ease-in-out; 3146 -webkit-transition: all 0.3s ease-in-out; 3147 -ms-transition: all 0.3s ease-in-out; 3148 -moz-transition: all 0.3s ease-in-out; 3149 -o-transition: all 0.3s ease-in-out; 3150} 3151 3152
