.clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both } .clearfix { zoom: 1 } .getting-started * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .getting-started { overflow: hidden; } .getting-started .panels { margin: 60px 0 0 0; } a.button.button-primary.solo1,a.button.button-primary.solo2 { padding: 9px !important; } .business-networking-conference-button-container{ text-align: center; } .getting-started .panel { display: inline-block; width: 100%; padding: 4%; background: #fff; font-size: 16px; animation: smoothFade .3s; -moz-animation: smoothFade .3s; -webkit-animation: smoothFade .3s; -o-animation: smoothFade .3s; } @keyframes smoothFade { from { opacity:0; } to { opacity:1; } } @-moz-keyframes smoothFade { from { opacity:0; } to { opacity:1; } } @-webkit-keyframes smoothFade { from { opacity:0; } to { opacity:1; } } .getting-started .panel-left.visible { display: inline-block; animation: smoothFade .3s; -moz-animation: smoothFade .3s; -webkit-animation: smoothFade .3s; -o-animation: smoothFade .3s; } .getting-started .panel p { font-size: 18px; line-height: 1.7; color: #5B616B; margin-top: 20px; margin-bottom: 0; } .getting-started .panel p a { color: #0095c8; border-bottom: 1px dotted #0095c8; } .getting-started .panel p a:hover { border-bottom-color: transparent; } .getting-started .panel a { text-decoration: none; } .getting-started .panel a:focus, .getting-started .panel a:active { outline: none; box-shadow: none; border: none; } .getting-started .panel a.button, .getting-started input.button-primary { background: #0095c8; border: 1px solid #0095c8; text-shadow: none; box-shadow: none; height: auto; font-size: 16px; font-weight: 600; color: #fff; padding: 10px 20px; border-radius: 4px; } .getting-started .panel-aside p + a.button { margin-top: 20px; } .getting-started .panel a.button:focus, .getting-started .panel a.button:active, .getting-started .panel a.button:hover, .getting-started input.button-primary:hover, .getting-started input.button-primary:focus { color: #0095c8; background: none; border-color: #0095c8; } .getting-started .panel hr { height: 1px; margin: 2em 0; border: 0; border-top: solid 1px #E2E6EC; } #plugins-panel hr { padding-bottom: 0; display: inline-block; width: 100%; } .getting-started .panel h4 { font-size: 20px; font-weight: 700; margin-top: 0; margin-bottom: 20px; color: #354052; } .getting-started .panel-left ul, .getting-started .panel-left ol { margin: 0 0 5% 0; background: #F8F8F8; padding: 5% 5% 5% 8%; list-style-type: square; font-size: 16px; line-height: 1.8; } .getting-started .panel-left ul li, .getting-started .panel-left ol li { border-bottom: dotted 1px #ddd; margin-bottom: 20px; padding-bottom: 20px; } .getting-started .panel-left ul li:last-child, .getting-started .panel-left ol li:last-child { border: none; margin-bottom: 0; padding-bottom: 0; } .getting-started .panel-left { display: inline-block; display: none; width: 58%; } .getting-started .panel-left img { max-width: 100%; height: auto; /*border: solid 1px #E6EAED;*/ } .getting-started #help-panel h3 { width: 100%; position: relative; padding-right: 90px; margin-top: 0; } .getting-started #help-panel h3 { float: right; } .getting-started .panel-right { display: inline-block; width: 35%; float: right; vertical-align: top; } .getting-started .panel-aside { margin-bottom: 40px; background: #F8F8F8; padding: 40px; } .getting-started .panel-right .panel-aside { background: none; border: 2px solid #ff4719; } .getting-started .panel-aside:last-child { margin-bottom: 0; margin-top: 25px; } .getting-started .panel-aside h4 { margin-top: 0; font-size: 20px; line-height: 1.4; margin-bottom: 20px; font-weight: 700; color: #354052; } .getting-started .panel-aside ul { margin-bottom: 25px; } .getting-started .panel-aside li { list-style-type: square; margin-left: 18px; } .notices { margin: 0; display: none; } #wpbody-content .getting-started .updated, #wpbody-content .getting-started .error { margin-top: 2%; } .getting-started .updated + .intro-wrap, .getting-started .error + .intro-wrap { padding-top: 2%; } .getting-started .intro-wrap { padding: 2% 0 0 0; } .getting-started .intro { display: inline-block; text-align: center; width: 100%; vertical-align: top; } .getting-started .intro h3 { font-size: 40px; line-height: 1.2; font-weight: 400; margin: 0 0 20px 0; } .getting-started .intro h4 { color: #5B616B; font-weight: 400; font-size: 18px; line-height: 1.6; margin: 0; } .getting-started .inline-list { display: inline-block; width: 100%; margin: 0; border-bottom: 2px solid #E2E6EC; } span.theme-name { background: #ffb200; padding: 4px 15px; border-radius: 8px; color: #fff; } thead.table-book { background: #ffb200; } td:first-of-type { padding-top: 10px; } td { padding: 15px; font-size: 18px; } strong { color: #fff; } span.tick { color: #24b751; } span.cross { color: #ca2424; } tr:nth-of-type(even) { background: #f7f7f7; } td:first-of-type { padding-top: 10px; } td { padding: 15px; font-size: 18px; } a.button.button-primary.solo1 { background: #ff4719; border-color: #ff4719; } a.button.button-primary.solo2 { background: #ffb200; border-color: #ffb200; } .getting-started .inline-list li { display: inline-block; margin: 0 0 0 0; } .getting-started .inline-list li:last-child { margin-right: 0; padding-right: 0; } .getting-started .inline-list li a { font-size: 20px; text-decoration: none; padding: 20px 30px; display: inline-block; color: #354052; background: #F8F8F8; border: 1px solid #E6E6E6; border-bottom: none; border-radius: 5px 5px 0 0; position: relative; } .getting-started .inline-list li.current a::after { content: ""; background: #fff; height: 3px; position: absolute; bottom: -2px; left: -1px; right: -1px; } .getting-started .inline-list li a:active, .getting-started .inline-list li a::-moz-focus-inner, .getting-started ul.inline-list a:focus { outline: none; /*border: 0;*/ box-shadow: none; } .getting-started .inline-list li a:hover { color: #ffb200; } .getting-started .inline-list li.current a { background: #fff; outline: none; border-color: #fff; box-shadow: none; color: #ff4719; font-weight: 600; } .getting-started .inline-list li a svg { width: 19px; display: inline-block; vertical-align: middle; height: 19px; margin-right: 5px; } .getting-started .inline-list li a:not(#themeclub) svg .a { fill: #354052; } .getting-started .inline-list li a:not(#themeclub):hover svg .a{ fill: #ffb200; } .getting-started .inline-list li.current a:not(#themeclub) svg .a { fill: #ff4719; } ::-webkit-input-placeholder { color: #C0C4CC; } :-moz-placeholder { color: #C0C4CC; } ::-moz-placeholder { color: #C0C4CC; } :-ms-input-placeholder { color: #C0C4CC; } h4 .button { float: right; background: #5AC779; color: #fff; border-radius: 3px; font-size: 14px; padding: 3px 6px; vertical-align: middle; } .getting-started .theme-list { display: flex; flex: 1; flex-wrap: wrap; } .toggle-block { border-bottom: 1px solid rgba(0,0,0,0.1); margin-bottom: 25px; padding-bottom: 25px; } .toggle-title { margin-top: 0; margin-bottom: 0; line-height: 1.4; cursor: pointer; } .toggle-title:hover, .active .toggle-title { color: #0095c8; } .getting-started .panel .toggle-content p:first-child { margin-top: 15px; } #themes-panel { width: 100%; } #themes-panel.visible + .panel-right { display: none; } @media only screen and (max-width:768px) { .getting-started .intro, .theme-image, .getting-started .panel-left, .getting-started .panel-right { width: 100%; float: none; } .getting-started .intro { padding: 0; margin: 0; } .getting-started .intro h2 { font-size: 34px; } .getting-started .intro h3 { margin-bottom: 10px; font-size: 28px; } .getting-started .inline-list { margin-bottom: 5%; } .getting-started .inline-list li { width: 100%; } .getting-started .inline-list li a { width: 100%; display: block; } } .button-wrap{ padding: 7px 15px; background: #f6f6f6; display: block; border-bottom: 1px solid #e6e6e6; } .recom-plugin-wrap:hover .button-wrap { background: #2D3645; } .getting-started .panel .button-wrap a.button { background: #fff; color: #7F8FA4; border-color: #E2E6EC; padding: 5px 10px; font-size: 14px; font-weight: 600; } .getting-started .panel .button-wrap a.button:hover { background: #0095c8; border-color: #0095c8; color: #fff; } #free-pro-panel .panel-aside { display: flex; flex: 1; flex-direction: column; align-items: center; } #free-pro-panel .panel-aside img { display: flex; flex: auto; align-self: center; } #free-pro-panel .button.button-primary { margin-top: 40px; text-align: center; padding: 18px 40px; text-transform: uppercase; font-size: 18px; min-width: 50%; } .updated.notice.notice-success.is-dismissible.notice-get-started-class { display: none !important; } .business-networking-conference-button-container { DISPLAY: grid; grid-template-columns: 1fr 1fr; place-content: center; place-items: center; grid-gap: 20px; } .business-networking-conference-button-container a{ width: 100%; text-align: center; }