AlkantarClanX12
Current Path : /home/thanudqk/shenpokertour.com/wp-content/plugins/easy-google-fonts/src/styles/ |
Current File : //home/thanudqk/shenpokertour.com/wp-content/plugins/easy-google-fonts/src/styles/about.css |
.egf-about__container { --background: #fff; --subtle-background: #fff; --text: #322d2b; --text-light: #f2edd4; --accent-1: #2c2a6c; --accent-2: #007cba; --accent-3: #b04329; --nav-background: var(--subtle-background); --nav-border: var(--accent-1); --nav-color: var(--accent-3); --nav-current: var(--accent-3); } .egf-about__container { clear: both; } .egf-about__container .alignleft { float: left; } .egf-about__container .alignright { float: right; } .egf-about__container .aligncenter { text-align: center; } .egf-about__container .is-vertically-aligned-top { -ms-grid-row-align: start; align-self: start; } .egf-about__container .is-vertically-aligned-center { -ms-grid-row-align: center; align-self: center; } .egf-about__container .is-vertically-aligned-bottom { -ms-grid-row-align: end; align-self: end; } .egf-about__section { background: #f3f4f5; background: var(--background); clear: both; } .egf-about__container .has-accent-background-color { color: #f3f4f5; color: var(--text-light); background-color: #1730e5; background-color: var(--accent-1); } .egf-about__container .has-subtle-background-color { background-color: #bde7f0; background-color: var(--subtle-background); } /* 1.1 - Layout */ .egf-about__section { margin: 0; } .egf-about__section .column { padding: 32px; } .egf-about__section .column.is-edge-to-edge { padding: 0; } .egf-about__section .column p:first-of-type { margin-top: 0; } .egf-about__section .column p:last-of-type { margin-bottom: 0; } .egf-about__section .is-section-header { margin-bottom: 0; padding: 32px 32px 0; } /* Section header is alone in a container. */ .egf-about__section .is-section-header:first-child:last-child { padding: 0; } .egf-about__section.is-feature { padding: 32px; } .egf-about__section.is-feature p { margin: 0; } .egf-about__section.is-feature p + p { margin-top: 1rem; } .egf-about__section.has-2-columns, .egf-about__section.has-3-columns, .egf-about__section.has-4-columns { display: -ms-grid; display: grid; } .egf-about__section.has-2-columns { grid-template-columns: 1fr 1fr; } .egf-about__section.has-2-columns.is-wider-right { grid-template-columns: 1fr 2fr; } .egf-about__section.has-2-columns.is-wider-left { grid-template-columns: 2fr 1fr; } .egf-about__section.has-2-columns .is-section-header { grid-column-start: 1; grid-column-end: span 2; } .egf-about__section.has-2-columns .column:nth-of-type(2n + 1) { grid-column-start: 1; } .egf-about__section.has-2-columns .column:nth-of-type(2n) { grid-column-start: 2; } .egf-about__section.has-3-columns { grid-template-columns: repeat(3, 1fr); } .egf-about__section.has-3-columns .is-section-header { grid-column-start: 1; grid-column-end: span 3; } .egf-about__section.has-3-columns .column:nth-of-type(3n + 1) { grid-column-start: 1; } .egf-about__section.has-3-columns .column:nth-of-type(3n + 2) { grid-column-start: 2; } .egf-about__section.has-3-columns .column:nth-of-type(3n) { grid-column-start: 3; } .egf-about__section.has-4-columns { grid-template-columns: repeat(4, 1fr); } .egf-about__section.has-4-columns .is-section-header { grid-column-start: 1; grid-column-end: span 4; } .egf-about__section.has-4-columns .column:nth-of-type(4n + 1) { grid-column-start: 1; } .egf-about__section.has-4-columns .column:nth-of-type(4n + 2) { grid-column-start: 2; } .egf-about__section.has-4-columns .column:nth-of-type(4n + 3) { grid-column-start: 3; } .egf-about__section.has-4-columns .column:nth-of-type(4n) { grid-column-start: 4; } /* Any columns following a section header need to be expicitly put into the second row, for IE support. */ .egf-about__section.has-2-columns .is-section-header ~ .column, .egf-about__section.has-3-columns .is-section-header ~ .column, .egf-about__section.has-4-columns .is-section-header ~ .column { grid-row-start: 2; } @media screen and (max-width: 782px) { .egf-about__section.has-3-columns, .egf-about__section.has-4-columns { display: block; padding-bottom: 16px; } .egf-about__section.has-3-columns .column:nth-of-type(n), .egf-about__section.has-4-columns .column:nth-of-type(n) { padding-top: 16px; padding-bottom: 16px; } } @media screen and (max-width: 600px) { .egf-about__section.has-2-columns { display: flex; /* This is flex, not block, so we can use order below. */ flex-wrap: wrap; align-content: stretch; padding-bottom: 16px; } .egf-about__section.has-2-columns .column:nth-of-type(n) { padding-top: 16px; padding-bottom: 16px; width: 100%; } .egf-about__section.has-2-columns .is-edge-to-edge { order: -1; } } /* 1.2 - Typography & Elements */ .egf-about__container { line-height: 1.4; } .egf-about__container h1 { margin: 0 0 1em; padding: 0; font-weight: 600; color: inherit; } .egf-about__container h1, .egf-about__container h2 { margin-top: 0; font-size: 1.4em; line-height: 1.4; } .egf-about__container h3, .egf-about__container h2.is-smaller-heading { margin-top: 0; font-size: 1em; } .egf-about__container p { font-size: inherit; line-height: inherit; } .egf-about__section a { color: #1730e5; color: var(--accent-1); text-decoration: underline; } .egf-about__section a:hover, .egf-about__section a:active, .egf-about__section a:focus { text-decoration: none; } .wp-credits-list a { text-decoration: none; } .wp-credits-list a:hover, .wp-credits-list a:active, .wp-credits-list a:focus { text-decoration: underline; } .egf-about__container ul { list-style: disc; margin-left: 16px; } .egf-about__container img { margin: 0; vertical-align: middle; } .egf-about__container .egf-about__image { display: -ms-grid; display: grid; align-items: center; justify-content: center; height: 100%; overflow: hidden; } .egf-about__container .egf-about__image img { max-width: 100%; width: 100%; height: auto; } .egf-about__container hr { margin: 0; height: 32px; border: none; } .egf-about__container hr.is-small { height: 8px; } .egf-about__container div.updated, .egf-about__container div.error, .egf-about__container .notice { display: none !important; } .egf-about__section { font-size: 1.2em; } .egf-about__section.is-feature { font-size: 1.6em; font-weight: 600; text-align: center; } @media screen and (max-width: 480px) { .egf-about__section.is-feature { font-size: 1.4em; font-weight: 500; } } /* 1.3 - Header */ .egf-about__header { color: #fff; } .egf-about__header-bg { background-color: #2c2a6c; border-top-left-radius: 4px; border-top-right-radius: 4px; } .egf-about__header-title p { margin: 0; padding: 0; font-size: 4em; line-height: 1; font-weight: 500; color: #fff; } .egf-about__header-title p span { display: inline-block; } .egf-about__header-text { font-size: 1.5em; line-height: 1.4; } .egf-about__header-text p { margin: 0; } .egf-about__header-text a { color: #fff; } .egf-about__header-text span { padding: 4px 8px; background: #fff; color: #2c2a6c; border-radius: 4px; margin-left: 8px; font-size: 16px; font-weight: bold; } .egf-about__header-text a:hover { text-decoration: none; } .egf-about__header-navigation { padding-top: 0; background: #216bce; background: var(--nav-background); color: #f3f4f5; color: var(--nav-color); border-bottom: 3px solid #1730e5; border-bottom: 3px solid var(--nav-border); } /* Header Tab Panel */ .egf-about__header-tab-panel { float: none; display: block !important; } .egf-about__header-tab-panel-content { margin-top: 24px; } .egf-about__header-tab-panel > .components-tab-panel__tabs { margin: 0; padding-top: 0; background: #673ab7; color: #f3f4f5; border-bottom: 3px solid #673ab7; } .egf-about__header-tab-panel .components-tab-panel__tabs .components-button { color: inherit; font-size: 1.4em; font-weight: 600; height: auto; line-height: 1; padding: 24px 32px; border-radius: 0; border-bottom: 3px solid #673ab7; } .egf-about__header-tab-panel .components-tab-panel__tabs .components-button:focus:not(:disabled) { background-color: inherit; color: inherit; box-shadow: none; outline: 2px solid transparent; } .egf-about__header-tab-panel .components-tab-panel__tabs .egf-tab-active { margin-bottom: -3px; border-width: 0 0 6px; border-color: #b39dd2; border-style: solid; } .egf-about__header-tab-panel .components-tab-panel__tabs .components-button:not(.egf-tab-active):hover { border-bottom: 3px solid #fff; } .egf-about__header-tab-panel .components-tab-panel__tabs .components-button:not(:disabled):not([aria-disabled='true']):not(.is-secondary):not(.is-primary):not(.is-tertiary):not(.is-link):hover { background-color: #fff; box-shadow: none; color: #2d2a6c; } @media screen and (max-width: 782px) { .egf-about__container .egf-about__header-text { font-size: 1.4em; } .egf-about__header-title { min-height: 0; max-height: none; height: auto; /* * 60% is a "magic" number to create a top offset approx-equal to the height of the background image, * which scales to match the container width. */ padding-top: 60%; } .egf-about__header-tab-panel .components-tab-panel__tabs .components-button { margin-top: 0; margin-right: 0; padding: 24px 16px; } } @media screen and (max-width: 480px) { .egf-about__header-title p { font-size: 3.2em; } .egf-about__header-tab-panel .components-tab-panel__tabs .components-button { float: none; display: block; margin-bottom: 0; padding: 16px 16px; border-left: 6px solid #216bce; border-left: 6px solid var(--nav-background); border-bottom: none !important; width: 100%; text-align: left; } .egf-about__header-tab-panel .components-tab-panel__tabs .egf-tab-active { border-left: 6px solid #bde7f0; border-left: 6px solid var(--accent-3); } .egf-about__header-tab-panel .components-tab-panel__tabs .components-button:not(.egf-tab-active):hover { border-left: 6px solid #1730e5; border-left: 6px solid var(--nav-border); } }