/* Theme Name: Razzi Description: Used to style the TinyMCE editor. */ /** * Table of Contents: * * 1.0 - Body * 2.0 - Typography * 3.0 - Elements * 4.0 - Alignment * 5.0 - Galleries */ /** * 1.0 - Body */ :root { --rz-color-primary: #FF6F61; --rz-color-light: #e3e7e8; --rz-color-lighter: #ffffff; --rz-color-dark: #111111; --rz-color-darker: #1f1f1f; --rz-color-gray: #838889; --rz-border-color: #cccccc; --rz-border-color-gray:#cdcdcd; --rz-text-color: #525252; --rz-font-family-primary: 'Jost', Arial, sans-serif; --rz-font-family-code: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; --rz-font-family-pre: "Courier 10 Pitch", Courier, monospace; } body { color:var(--rz-text-color); font-family: var(--rz-font-family-primary); font-size: 16px; line-height: 1.5; -ms-word-wrap: break-word; word-wrap: break-word; box-sizing: border-box; font-weight: 400; } /** * 2.0 - Typography */ a { transition: .5s; text-decoration: underline; } a, a:hover, a:focus, a:active,a:visited { outline: 0; color: var(--rz-color-dark); } a img { border: none; } img { max-width: 100%; height: auto; } h1, h2, h3, h4, h5, h6 { font-weight: 500; color: var(--rz-color-dark); } h1 { font-size: 60px; } h2 { font-size: 40px; } h3 { font-size: 32px; } h4 { font-size: 24px; } h5 { font-size: 20px; } h6 { font-size: 16px; } .wp-block-freeform.block-library-rich-text__tinymce h1 { font-size: 60px; } .wp-block-freeform.block-library-rich-text__tinymce h2 { font-size: 40px; } .wp-block-freeform.block-library-rich-text__tinymce h3 { font-size: 32px; } .wp-block-freeform.block-library-rich-text__tinymce h4 { font-size: 24px; } .wp-block-freeform.block-library-rich-text__tinymce h5 { font-size: 20px; } .wp-block-freeform.block-library-rich-text__tinymce h6 { font-size: 16px; } ul { list-style: disc; } ul ul { list-style: disc; } div.block-library-list ol, div.block-library-list ul, ul, ol { margin: 0 0 1.5em; padding-left: 1.5em; } dd, li { margin-bottom: 0; } div.block-library-list li > ol, div.block-library-list li > ul, li > ul, li > ol { margin-bottom: 0; } p { margin-top: 1em; margin-bottom: 1.5em; } .mce-content-body { line-height: 1.5; } .has-small-font-size { font-size: 13px; } .has-normal-font-size, .has-regular-font-size { font-size: 16px; } .has-large-font-size { font-size: 36px; } /** * 3.0 - Elements */ hr { background-color: #bbb; border: 0; height: 1px; margin-bottom: 1.5em; } mark, ins { background-color: #fff9c0; text-decoration: none; } b, strong{ font-weight: 700; } pre { background: #eee; font-family: var(--rz-font-family-pre); font-size: 13px; line-height: 1.6; margin-bottom: 1.6em; overflow: auto; padding: 1.6em; } code, kbd, tt, var { font-family: var(--rz-font-family-code); font-size: 13px; } code { padding: 2px 4px; color: #c7254e; background-color: #f9f2f4; display: initial; } input[type=text], textarea { border: 1px solid var(--rz-border-color); background: var(--rz-color-lighter); } figure { margin: 1em 0; } blockquote { font-size: 20px; color: var(--rz-color-dark); margin-left: 0; padding: 20px 30px; border-left: 3px solid var(--rz-color-primary); } blockquote span { background-color: #f5f5f5; } blockquote cite, blockquote cite a .wp-block-pullquote .wp-block-pullquote__citation, blockquote .wp-block-quote__citation { display: block; font-size: 14px; color: var(--rz-color-gray); margin-top: 1em; text-transform: capitalize; font-style: italic; margin-top: 26px; } blockquote p { margin: 0 0 10px; } .wp-caption .wp-caption-dd { margin: 0.8075em 0; } .wp-block-quote.is-large cite, .wp-block-quote.is-large .wp-block-quote__citation, .wp-block-quote.is-style-large cite, .wp-block-quote.is-style-large .wp-block-quote__citation { font-size: 18px; } .wp-block-quote.has-text-align-right{ padding: 20px 30px; border-right: 3px solid #FF6F61; } .wp-block-freeform.block-library-rich-text__tinymce blockquote { border-left-color: var(--rz-color-primary); padding-left: 30px; margin: 0; } .wp-block-quote.is-large, .wp-block-quote.is-style-large{ padding: 20px 30px; border-left: 3px solid #FF6F61; } /* pullquote */ .wp-block-pullquote { padding: 0; } .wp-block-pullquote blockquote { margin: 0; border: none; padding: 40px 30px; } .wp-block-pullquote:not(.is-style-solid-color) { background-color: #f7f7f7; } .wp-block-pullquote.is-style-solid-color blockquote { background-color: transparent; max-width: 100%; } .wp-block-pullquote.alignright{ text-align: right; } .wp-block-pullquote.alignleft p, .wp-block-pullquote.alignright p, .wp-block-pullquote.alignleft blockquote > .editor-rich-text p, .wp-block-pullquote.alignright blockquote > .editor-rich-text p { font-size: 20px; } .wp-block-pullquote cite, .wp-block-pullquote footer, .wp-block-pullquote__citation { margin-top: 10px; } .wp-block-pullquote .wp-block-pullquote__citation { color: var(--rz-color-gray); text-transform: capitalize; font-size: 14px; font-style: italic; } .wp-block-code { font-family: var(--rz-font-family-code); font-size: 15px; color: var(--rz-color-darker); padding: .8em 1em; border: 1px solid #ddd; border-radius: 4px; } .wp-block-code .block-editor-plain-text { background-color: #eee !important; } .wp-block-freeform.block-library-rich-text__tinymce li, .wp-block-freeform.block-library-rich-text__tinymce p{ line-height: 1.5; } .wp-block-freeform.block-library-rich-text__tinymce code { font-family: var(--rz-font-family-code); font-size: 13; border-radius: 4px; padding: 2px 4px; color: #c7254e; background-color: #f9f2f4; } .wp-block-freeform.block-library-rich-text__tinymce a { color: var(--rz-color-dark); } .wp-block-freeform.block-library-rich-text__tinymce blockquote cite a { color: var(--rz-color-gray); } .wp-block-search__button{ font-size: 16px; color: #fff; font-weight: 500; line-height: 50px; border: 0; padding: 0 30px; background-color: var(--rz-color-dark); transition: 0.5s; outline: 0; } .wp-block-tag-cloud a{ border: 1px solid var(--rz-border-color-gray); display: inline-block; padding: 9px 21px; font-size: 14px ! important; color: var(--rz-text-color); margin: 4px 2px; text-decoration: none; } .wp-block-tag-cloud a:hover{ border-color: var(--rz-color-dark); } .wp-caption-text, .wp-caption-dd { text-align: center; } .wp-block-gallery { padding: 0; margin: 0; } .wp-block-preformatted pre { white-space: nowrap; } table { margin: 0 0 1.5em; width: 100%; border-collapse: collapse; border-spacing: 0; border-width: 1px 0 0 1px; } caption, td, th { padding: 0; font-weight: normal; text-align: left; } table, th, td { border: 1px solid var(--rz-border-color-gray); } th { border-width: 0 1px 1px 0; } thead th{ font-weight: 500; } td { border-width: 0 1px 1px 0; } th, td { padding: 10px; } dl { margin: 0 0 1.75em; } dt { font-weight: 700; } dd { margin: 0 1.5em 1.5em; } .wp-block-button__link { padding: 12px 25px; line-height: 1.5; font-size: 16px; border-radius: 0; font-weight: 500; } .is-style-outline .wp-block-button__link { border-width: 1px; background: 0 0; color: var(--rz-color-dark); } ul.wp-block-archives, .wp-block-archives ul, ul.wp-block-categories, .wp-block-categories ul { list-style: none; margin: 0; padding: 0; } .wp-block-archives li, .wp-block-categories li { padding: 7px 0; margin-bottom: 0; } .wp-block-archives li:last-child, .wp-block-categories li:last-child { padding-bottom: 0; } input, textarea { color: var(--rz-color-dark); border: 1px solid var(--rz-border-color); box-sizing: border-box; padding: 12px 15px; font-size: 16px; width: 100%; transition: all .1s ease-in-out; outline: none; } input[type=checkbox], input[type=radio] { width: 1rem; } input:focus, textarea:focus{ color: var(--rz-color-dark); border-color: var(--rz-color-darker); outline: none; } select{ border: 1px solid var(--rz-border-color); padding: 12px 25px; font-size: 16px; line-height: 1.5; color: var(--rz-color-dark); cursor: pointer; -moz-appearance:none; /* Firefox */ -webkit-appearance:none; /* Safari and Chrome */ appearance:none; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNSIgdmlld0JveD0iMCAwIDEwIDUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+DQo8cGF0aCBkPSJNNC41MDQ5NSA0LjgyMDExTDAuMjA1MjQxIDEuMDQ4NTZDLTAuMDY4NDEzNyAwLjgwODY0NiAtMC4wNjg0MTM3IDAuNDE5NjYzIDAuMjA1MjQxIDAuMTc5ODY0QzAuNDc4NjUyIC0wLjA1OTk1NDcgMC45MjIwOTggLTAuMDU5OTU0NyAxLjE5NTQ5IDAuMTc5ODY0TDUuMDAwMDcgMy41MTcxTDguODA0NTIgMC4xNzk5NjFDOS4wNzgwNSAtMC4wNTk4NTc3IDkuNTIxNDUgLTAuMDU5ODU3NyA5Ljc5NDg2IDAuMTc5OTYxQzEwLjA2ODQgMC40MTk3OCAxMC4wNjg0IDAuODA4NzQzIDkuNzk0ODYgMS4wNDg2Nkw1LjQ5NTA4IDQuODIwMkM1LjM1ODMxIDQuOTQwMTEgNS4xNzkyNSA1IDUuMDAwMDkgNUM0LjgyMDg1IDUgNC42NDE2NSA0Ljk0IDQuNTA0OTUgNC44MjAxMVoiIGZpbGw9IiM3Njc2NzYiLz4NCjwvc3ZnPg0K); background-repeat: no-repeat; background-size: auto; background-position: calc(100% - 20px) 50%; } select:focus { border-color: var(--rz-color-darker); outline: none; box-shadow: none; } select:focus, select:hover{ color: var(--rz-color-dark); } .wp-block-archives-dropdown select:disabled{ background-image: none; -webkit-appearance: menulist-button; } ul.wp-block-latest-posts, .wp-block-latest-posts ul { list-style: none; padding: 0; } ul.wp-block-latest-posts li { padding: 5px 0; margin-bottom: 0; } ul.wp-block-latest-posts li:last-child { padding-bottom: 0; } /* remove */ .wp-block-archives li a, .wp-block-categories li a, ul.wp-block-latest-posts li a{ text-decoration: none; } .wp-block-latest-comments__comment{ font-size: 15px; margin-bottom: 1em; } .alignleft { display: inline; float: left; margin-right: 1.5em; } .alignright { display: inline; float: right; margin-left: 1.5em; } /** * 4.0 - Alignment */ img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ } embed, iframe, object { margin-bottom: 1.5em; max-width: 100%; } /** * 5.0 - Galleries */ .gallery-caption { display: block; margin-top: 15px; } .gallery { margin-bottom: 1.5em; margin-left: -7px; margin-right: -7px; } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; margin: 0; padding: 7px; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66%; } .gallery-columns-7 .gallery-item { max-width: 14.28%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11%; } .gallery-columns-6 .gallery-caption, .gallery-columns-7 .gallery-caption, .gallery-columns-8 .gallery-caption, .gallery-columns-9 .gallery-caption { display: none; }