.whizzie-wrap { opacity: 0; position: relative; } .whizzie-wrap.loaded { opacity: 1; max-width: 700px !important; } .whizzie-wrap.spinning .step-loading { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(255,255,255,0.8); } .spinning .step-loading .spinner { float: none; position: absolute; top: 50%; left: 50%; visibility: visible; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); } .spinning a.do-it { visibility: hidden; } .whizzie-menu li.step { visibility: hidden; } .whizzie-menu li.active-step { visibility: visible; } .loaded .whizzie-menu li.step { visibility: visible; display: none; } .loaded .whizzie-menu li.active-step { display: list-item; } .spinning .spinner { visibility: visible; float: none; text-align: center; } .button-wrap { display: inline-block; margin: 1em 0; } .detail { display: none; opacity: 0; transition: all 1s; } .show-detail .detail { display: block; opacity: 1; transform: scaleY(1); transform-origin: top; transition: all 0.5s; } .detail.scale-down { transform: scaleY(0); } .whizzie-menu .detail ul { margin: 1em 0; } a.more-info { text-decoration: none; text-transform: uppercase; font-weight: bold; color: #ccc; } a.more-info:after { font-family: Dashicons; content: "\f347"; padding-left: 0.25em; vertical-align: middle; } ul.whizzie-do-plugins li { padding: 0.5em 1em; } ul.whizzie-do-plugins li:nth-child(odd) { background: #f9f9f9; } ul.whizzie-do-plugins li span { float: right; } ul.whizzie-nav { list-style: none; display: grid; grid-template-columns: auto auto auto auto; justify-content: space-around; } ul.whizzie-nav li { opacity: 1; transition: all 0.25s; } ul.whizzie-nav li.active-step { color: #0073aa; } ul.whizzie-nav li.done-step { opacity: 0.5; } ul.whizzie-nav .dashicons { font-size: 2em; } .whizzie-wrap.loaded .summary p{ font-size: 18px; } .whizzie-menu h2{ font-size: 27px; } .step-done h2:before{ content: "\f529"; font-family: dashicons; font-weight: 400; display: inline-block; position: relative; top: 4px; padding-right: 10px; } /* ------- Setup Guid --------- */ #ti-demo-setup-guid .ti-setup-contact{ display: none; } #ti-demo-setup-guid .ti-setup-widget{ display: none; } #ti-demo-setup-guid .ti-setup-dots{ text-align: center; padding-top: 25px; } #ti-demo-setup-guid .ti-setup-finish{ text-align: center; padding-top: 20px; margin: 0 5px; } #ti-demo-setup-guid ol li{ list-style: decimal; font-size: 15px; font-weight: 600; } #ti-demo-setup-guid h4{ font-size: 17px; } #ti-demo-setup-guid h3{ font-weight: 900; font-size: 19px; } #ti-demo-setup-guid h3:before{ content: "\f155"; font-family: dashicons; font-weight: 400; display: inline-block; position: relative; top: 2px; padding-right: 6px; } #ti-demo-setup-guid p{ font-size: 15px; } .whizzie-menu .step-plugins{ height: 100% !important; } #ti-demo-setup-guid .ti-setup-social-icon{ display: none; } @media screen and (max-width: 991px) { .whizzie-menu .step-intro .button-wrap .button, .whizzie-menu .step-plugins .button-wrap .button, div#demo_offer .card .whizzie-menu .step-widgets .button-wrap .button{ padding: 10px 40px !important; } .ti-setup-finish .button { padding: 10px 15px !important; } .ti-setup{ flex-wrap: wrap; } } @media screen and (max-width: 767px) { ul.whizzie-nav { grid-template-columns: auto auto; } } @media screen and (max-width: 400px) { ul.whizzie-nav { grid-template-columns: auto; justify-content: start; margin-left: 65px; } }