/* Table of contents –––––––––––––––––––––––––––––––––––––––––––––––––– - Grid - Typography - Code - Tables - Spacing - Utilities - Clearing - General */ /* Grid –––––––––––––––––––––––––––––––––––––––––––––––––– */ .container { position : relative; width : 90%; max-width : 1140px; margin : 0 auto; box-sizing: border-box; } .column, .columns { width : 100%; float : left; box-sizing: border-box; } /* For devices larger than 400px */ @media (min-width: 400px) { .container { padding: 0; } } /* For devices larger than 550px */ @media (min-width: 992px) { .column, .columns { margin-left: 4%; } .column:first-child, .columns:first-child { margin-left: 0; } .one.column, .one.columns { width: 4.66666666667%; } .two.columns { width: 13.3333333333%; } .three.columns { width: 22%; } .four.columns { width: 30.6666666667%; } .five.columns { width: 39.3333333333%; } .six.columns { width: 46%; } .seven.columns { width: 56.6666666667%; } .eight.columns { width: 65.3333333333%; } .nine.columns { width: 74.0%; } .ten.columns { width: 82.6666666667%; } .eleven.columns { width: 91.3333333333%; } .twelve.columns { width : 100%; margin-left: 0; } .one-third.column { width: 30.6666666667%; } .two-thirds.column { width: 65.3333333333%; } .one-half.column { width: 48%; } /* Offsets */ .offset-by-one.column, .offset-by-one.columns { margin-left: 8.66666666667%; } .offset-by-two.column, .offset-by-two.columns { margin-left: 17.3333333333%; } .offset-by-three.column, .offset-by-three.columns { margin-left: 26%; } .offset-by-four.column, .offset-by-four.columns { margin-left: 34.6666666667%; } .offset-by-five.column, .offset-by-five.columns { margin-left: 43.3333333333%; } .offset-by-six.column, .offset-by-six.columns { margin-left: 52%; } .offset-by-seven.column, .offset-by-seven.columns { margin-left: 60.6666666667%; } .offset-by-eight.column, .offset-by-eight.columns { margin-left: 69.3333333333%; } .offset-by-nine.column, .offset-by-nine.columns { margin-left: 78.0%; } .offset-by-ten.column, .offset-by-ten.columns { margin-left: 86.6666666667%; } .offset-by-eleven.column, .offset-by-eleven.columns { margin-left: 95.3333333333%; } .offset-by-one-third.column, .offset-by-one-third.columns { margin-left: 34.6666666667%; } .offset-by-two-thirds.column, .offset-by-two-thirds.columns { margin-left: 69.3333333333%; } .offset-by-one-half.column, .offset-by-one-half.columns { margin-left: 52%; } } /* Typography –––––––––––––––––––––––––––––––––––––––––––––––––– */ .about-theme h1, .about-theme h2, .about-theme h3, .about-theme h4, .about-theme h5, .about-theme h6 { margin-top : 0; margin-bottom: 2rem; font-weight : 300; font-family : 'Poppins', sans-serif; color : #333; } .about-theme h1 { font-size : 2.8rem; font-weight : 500; line-height : 1.2; letter-spacing: -.1rem; } .about-theme h2 { font-size : 2rem; line-height : 1.25; letter-spacing: -.1rem; } .about-theme h3 { font-size : 1.8rem; line-height : 1.3; letter-spacing: -.1rem; } .about-theme h4 { font-size : 1.4rem; line-height : 1.35; letter-spacing: -.08rem; } .about-theme h5 { font-size : .8rem; line-height : 1.5; letter-spacing: -.05rem; } .about-theme h6 { font-size : .5rem; line-height : 1.6; letter-spacing: 0; } .about-theme p { margin-top : 0; font-weight: 400; font-size : 1rem; font-family: 'Poppins', sans-serif; color : #32373c; } /* Code –––––––––––––––––––––––––––––––––––––––––––––––––– */ .about-theme code { color : #1f1f1f; font-weight : 700; padding : .2rem .5rem; margin : 0 .2rem; font-size : 90%; border-radius: 4px; white-space: pre-wrap; /* Since CSS 2.1 */ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap : break-word; } .about-theme pre>code { display : block; padding : 1rem 1.5rem; white-space: pre; } /* Tables –––––––––––––––––––––––––––––––––––––––––––––––––– */ .about-theme th, .about-theme td { padding : 12px 12px; text-align : left; border-bottom: 1px solid #E1E1E1; } .about-theme th:first-child, .about-theme td:first-child { padding-left: 0; } .about-theme th:last-child, .about-theme td:last-child { padding-right: 0; } /* Spacing –––––––––––––––––––––––––––––––––––––––––––––––––– */ .about-theme button, .about-theme .button { margin-bottom: 1rem; } .about-theme input, .about-theme textarea, .about-theme select, .about-theme fieldset { margin-bottom: 1.5rem; } .about-theme pre, .about-theme blockquote, .about-theme dl, .about-theme figure, .about-theme table, .about-theme p, .about-theme ul, .about-theme ol, .about-theme form { margin-bottom: 2.4rem; } /* Utilities –––––––––––––––––––––––––––––––––––––––––––––––––– */ .u-full-width { width : 100%; box-sizing: border-box; } .u-max-full-width { max-width : 100%; box-sizing: border-box; } .u-pull-right { float: right; } .u-pull-left { float: left; } /* Clearing –––––––––––––––––––––––––––––––––––––––––––––––––– */ /* Self Clearing Goodness */ .container:after, .row:after, .block:after, .sub-block:after, .clearfix { content: ""; display: table; clear : both; } /* General –––––––––––––––––––––––––––––––––––––––––––––––––– */ .about-theme { margin: 2rem; } .columns img { width: 100%; } .about-title { text-align: center; margin : 0 auto !important; } .desc-button-container { text-align: center; margin : 2rem; } .about-pro th { padding : 15px; font-size: 16px; } .about-pro td { padding: 5px 15px; } .about-pro tr:nth-of-type(even) { background: #f7f7f7; } .about-pro td:first-of-type { padding-top: 10px; } .about-pro td:nth-of-type(2), .about-pro td:nth-of-type(3), .about-pro th:nth-of-type(2), .about-pro th:nth-of-type(3) { text-align: center; } .checkmark { color : #24b751; font-size: 17px; } .ct-action-buttons { display : flex; align-items : center; margin-bottom: 15px; } .pro-notice-dismiss { line-height: 2; margin-left: .5rem; } .left-margin-compare { margin-left: .3rem; } .right-margin-compare { margin-right: .3rem; } /* Get Started Button –––––––––––––––––––––––––––––––––––––––––––––––––– */ .notice .ct-button-padding { margin-bottom: 1em; } .apex-screenshot { background-color: #fff; padding : 20PX; border : 1px solid rgba(0, 0, 0, .125); box-shadow : 0 0 10px #dad3d3; border-radius : 3px; } .apex-screenshot img { margin-bottom: 20PX; } .apex-screenshot p { margin-bottom: 1.4rem; } .apex-screenshot .button.button-primary.button-hero { text-align: center; margin : 0 auto; display : block; } .apex-desh-hl { background-color: #fff; padding : 20PX; border : 1px solid rgba(0, 0, 0, .125); margin-bottom : 20px; box-shadow : 0 0 10px #dad3d3; border-radius : 3px; } .apex-desh-hl h1 { margin-bottom: 1.4rem; color : #309cf4; } .apex-n-doc { background-color: #fff; padding : 20PX; border : 1px solid rgba(0, 0, 0, .125); margin-bottom : 20px; box-shadow : 0 0 10px #dad3d3; border-radius : 3px; } .apex-n-doc p { margin-bottom: 0; } .apex-n-doc h3 { margin-bottom: 1.4rem; } .apex-n-doc h3 a { text-decoration: none; color : #309cf4; } .ct-button-padding.updating-message::before { margin-top: 12px; } .crafthemes-getting-started-notice { display : flex; align-items: center; } .notice.ct-getstarted { text-align : center; padding : 40px !important; background-color: #f5f5f5; border : 6px solid #fff; } .ct-getstarted .ct-notice-h2, .ct-getstarted .plugin-install-notice { margin-bottom: 15px; } .ct-small { display : block; text-align: center; } .ct-theme-screenshot { /* float: left; */ margin: 10px 20px 10px 0; } .ct-theme-screenshot img { width: 210px; } .ct-theme-notice-content { width: 65%; } .ct-theme-notice-content h2 { line-height: 1.4; } .ct-re-plugin { margin-bottom: 20px; } .ct-content h3 { margin-bottom: 10px; } .ct-push-down { padding-top : 15px; display : inline-block; padding-left: 8px; } .pro-notice h2 { margin-top: 0; } .pro-notice { padding-top: 1em; padding-bottom: 1em; }