.tp-body{color:#000000;border-radius:5px;display:grid;grid-template-columns: 250px 1fr 320px;padding-right:20px;}
.tp-body .tp-content{background:#ffffff;padding:20px 20px 0;border-radius:4px;}
.tp-body *{box-sizing:border-box;}
.tp-body *:last-child{margin-bottom:0 !important;}
.tp-body h1, .tp-body h2, .tp-body h3, .tp-body h4, .tp-body h5{color:#000000;letter-spacing:-1px;font-weight:500;}
.tp-body p{margin-top:0;margin-bottom:10px;}

/**Header**/
.tp-header{display:inline-block;vertical-align:top;}
.tp-header .tp-header-sticky{position:sticky;top:50px;}
.tp-header .logo{padding:35px 15px;position:relative;z-index:1;border-bottom:2px solid rgba(255, 255, 255, 0.1);display:grid;grid-template-columns:52px 1fr;grid-gap:20px;text-decoration:none;align-items:center;}
.tp-header img{width:100%;}
.tp-header .logo .logo-strapline{font-size:20px;color:#000000;text-decoration:none;font-weight:bold;line-height:1.1;}

.tp-header .header-nav{list-style-type:none;margin:0;}
.tp-header .header-nav li{transition:all .1s;display:block;border-bottom:1px solid rgba(0,0,0,0.05) !important;border-left:2px solid transparent;padding:15px 20px;margin-bottom:0;cursor:pointer;opacity:0.7;display:grid;grid-template-columns:1fr 25px;grid-gap:20px;align-items:center;font-size:12px;line-height:1.3;}
.tp-header .header-nav li:hover{opacity:0.75;border-left:2px solid rgb(233, 139, 57, 0.2) !important;}
.tp-header .header-nav li.active{border-left:2px solid #e98b39 !important;opacity:1 !important;}
.tp-header .header-nav li h3{margin:0;text-transform:uppercase;font-size:13px;font-weight:bold;transition:all .15s;color:inherit}
.tp-header .header-nav li.active, .tp-header .header-nav li:hover{color:#000000;background:#ffffff;}
.tp-header .header-nav li.active h3, .tp-header .header-nav li:hover h3{color:#000000}
.tp-header .header-nav li .icon{position: relative;order:2;}

/**Content area**/
.tp-content .page-title{font-size:25px;margin:0;padding:17px 0 42px;color:#000000;line-height:32px;}
.tp-content img{max-width:100%;}

.tp-content .page{display:none;}
.tp-content .page[data-name="comprehensive"]{padding:50px 0 !important;}
.tp-content .page.active{display:block;}
.tp-content h3{font-size:18px;border-bottom:1px solid #efefef;padding-bottom:10px;margin-bottom:10px;}

.area-wrap + .area-wrap{margin-top:50px;}

/**Options**/
.option-area .icons-title{font-size:18px;font-weight:500;margin-bottom:18px;}
.tp-body .option-area{background:#F9FAFB;border:1px solid #E8EBEE;border-radius:2px;padding:8px 16px;position:relative;margin-bottom:20px !important;border-radius:4px;}
.option-area .option{padding:15px 8px;position:relative}
.option-area .option.indent{padding-left:50px;}

.option-area .option.checkbox-area{display:grid;grid-template-columns:24px 1fr;grid-gap:20px;}
.option-area label.option{cursor: pointer;}
.option-area .option .option-title{font-size:20px;margin-bottom:5px;color:#000000;text-transform: uppercase;font-size: 14px;font-weight: bold;}

.option-area .option input[type="checkbox"]{width:0;height:0;visibility:hidden;}
.option-area .option input[type="checkbox"]:before{display:none !important;}
.option-area .option input[type="checkbox"]:after{content:'';visibility:visible;width:22px;height:22px;background:#ffffff;border:1px solid #e0e6ee;border-radius:50%;display:inline-block;vertical-align:middle;cursor:pointer;transition:all .15s;margin-top:5px;}
.option-area .option input[type="checkbox"]:checked:after{background:#e98b39;border-color:#e98b39;}

.option-area .option input[type="text"]:not(.wp-color-picker-init, .color-input-init), .option-area .option input[type="number"], .option-area .option select{width:100%;border:2px solid #e0e6ee;border-radius:5px;padding:0px 15px;height:40px;outline:none !important;box-shadow:none !important;line-height:40px;font-size:16px;max-width:none;}
.option-area .option textarea:not(.wp-editor-area){width:100%;border:2px solid #e0e6ee;border-radius:5px;padding:5px 15px;outline:none !important;box-shadow:none !important;line-height:20px;font-size:16px;max-width:none;}
.option-area .option select[multiple]{height:130px;}
.option-area .option input[type="number"]::-webkit-inner-spin-button, .option-area .option input[type="number"]::-webkit-outer-spin-button{opacity:0;}
.option-area .option input[type="text"]::placeholder, .option-area .option input[type="number"]::placeholder{color:#9fa0a2;}
.option-area .option .append-px{max-width:300px;position: relative;}
.option-area .option .append-px::after{content:'px';position:absolute;right:0px;top:50%;transform:translateY(-50%);font-size:16px;color:#000000;line-height:1;padding:0 10px;height:100%;display:flex;align-items:center;font-size:14px;}

.option-area .option.grid{grid-template-columns:repeat(12, 1fr);display:grid;}
.option-area .option .option-half{grid-column:span 6;}
.option-area .option .option-third{grid-column:span 4;}

.option-area .option .image-select-area{position: relative;width:max-content;}
.option-area .option .image-select-area .image-preview{width:auto;background:#ebebeb;max-width:400px;height:200px;}
.option-area .option .image-select-area:hover .remove-image{opacity:1;}
.option-area .option .image-select-area .remove-image{width:28px;height:28px;background:#23282d;position:absolute;top:10px;right:10px;cursor: pointer;border-radius:100px;opacity:0;background-image:var(--toastmm-close);background-size:70%;background-position:center;background-repeat:no-repeat;}

.option-area .option .image-select-area.has-image .upload-logo-trigger{display:none;}
.option-area .option .image-select-area:not(.has-image) .remove-image, .option-area .option .image-select-area:not(.has-image) .image-preview{display:none;}

.option-area .option .custom-icon-list{display:grid;grid-gap:20px;}
.option-area .option .custom-icon-row{display:grid;grid-template-columns:200px 1fr 1fr 1fr 1fr 50px;grid-gap:20px;position: relative;}
.option-area .option .custom-icon-list.no-functions .custom-icon-row{grid-template-columns:200px 1fr 1fr 1fr 50px;}
.option-area .option .custom-icon-row:nth-child(1){z-index:999;}
.option-area .option .custom-icon-row:nth-child(2){z-index:998;}
.option-area .option .custom-icon-row:nth-child(3){z-index:997;}
.option-area .option .custom-icon-row:nth-child(4){z-index:996;}
.option-area .option .custom-icon-row:nth-child(5){z-index:995;}
.option-area .option .custom-icon-row:nth-child(6){z-index:994;}
.option-area .option .custom-icon-row:nth-child(7){z-index:993;}
.option-area .option .custom-icon-row:nth-child(8){z-index:992;}
.option-area .option .custom-icon-row:nth-child(9){z-index:991;}
.option-area .option .custom-icon-row.duplication-row{display:none;}
.option-area .option .custom-icon-row:last-child{margin-bottom:20px !important;}
.option-area .option .custom-icon-list.no-functions .function-area{display:none;}
.option-area .option .custom-icon-row .remove-row{margin-top:33px !important;cursor: pointer;background-size:cover;background-position:center;color:red;}
.option-area .option .custom-icon-row .wp-picker-container .wp-color-result.button{height:34px !important;margin-top:2px !important;margin-bottom:2px !important;}
.option-area .option .custom-icon-row .wp-picker-container .wp-color-result.button .wp-color-result-text{height:32px !important;display:flex !important;align-items:center !important;}

.tp-button{background:#e98b39;color:#ffffff !important;border:none;padding:10px 26px;border-radius:5px;font-weight:500;cursor:pointer;font-size:15px;transition:all .25s;text-decoration:none;display:inline-block;border:1px solid #e98b39;outline:none !important;box-shadow:none !important;}
.tp-button.tp-outline{background:transparent;color:#e98b39 !important;border:1px solid #e98b39;}
.tp-button.dark, .tp-button.dark:hover{background:#000000;color:#ffffff !important;border:1px solid #000000;}
.tp-button.inline{padding:5px 13px;font-size:12px;}
.tp-button:hover{background:#c86710;color:#ffffff !important;}
.tp-button + .tp-button{margin-left:20px;}

/**TP Select**/
.tp-select{position: relative;z-index:9;padding:0 6px;}
.tp-select .tp-select-bg{position:fixed;top:0;left:0;width:100%;height:100%;display:none;z-index:1;}
.tp-select .tp-select-value{position: relative;cursor: pointer;background:#ffffff;border:2px solid #e0e6ee;border-radius:5px;height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 15px;box-sizing:border-box;z-index:9999;position: relative;}
.tp-select .tp-select-options{position:absolute;top:-6px;z-index:2;background:#ffffff;width:100%;opacity:0;pointer-events:none;transition:all .25s;border-radius:5px;border:1px solid #e0e6ee;padding-top:49px !important;left:0;}
.tp-select .tp-select-options .tp-select-options-scroll{max-height:300px;overflow:scroll;}
.tp-select .tp-select-options .tp-select-option{width:100%;position:relative;cursor: pointer;transition:all .25s;height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 15px;}
.tp-select .tp-select-options .tp-select-option:hover{background:#e0e6ee}
.tp-select .tp-select-options .tp-select-option:after{content:'';position:absolute;right:18px;top:50%;transform:translateY(-50%);width:16px;height:16px;background-image:url('/wp-content/themes/cg/assets/images/check.svg');background-size:contain;background-position:center;background-repeat:no-repeat;opacity:0;transition:all .25s;}
.tp-select .tp-select-options .tp-select-option.active:after{opacity:1;}
.tp-select .tp-select-options .tp-select-search{width:calc(100% - 10px);height:40px;margin:0 5px 5px;border:1px solid #e0e6ee;border-radius:5px;padding:0 15px;}

.tp-select.active .tp-select-bg{display:block;}
.tp-select.active .tp-select-options{opacity:1;pointer-events:all;}

.tp-select .tp-select-grid{grid-template-columns:25px 1fr;display:grid;grid-gap:10px;align-items:center;}
.tp-select .tp-select-grid svg{vertical-align:middle;}

/**Device Preview**/
.preview-column{padding:0px 0 100px 20px;}
.tp-body.desktop-preview .preview-column{padding:0px 0 150px 20px;}
.preview-column .preview-sticky-area{position:sticky;top:50px;}
.preview-devices{display:flex;justify-content:center;align-items:center;margin-bottom:30px;grid-gap:20px;}
.preview-devices img{width:40px;padding:6px;cursor: pointer;border-radius:4px;transition:all .25s;}
.preview-devices img.active{background:#ffffff;}

.device-area{display: flex;flex-direction: row;justify-content: center;align-items: center;position: relative;}
.device-area .device {width: 100%;height: 570px;background-color: #ffffff;border: 6px solid #121212;border-radius: 25px;box-shadow: 0px 0px 8px rgba(0,0,0,0.3);overflow: hidden;position: relative;}
.device-area .device .device-screen{width:550px;transform:scale(0.509);height:200%;position:absolute;top:0;left:0;transform-origin:top left;}
.device-area .device iframe{height:100%;width:100%;position:absolute;top:0;left:0;}
.device-area .volume {display: flex;flex-direction: column;height: 170px;justify-content: space-between;}
.device-area .up, .device-area .down {width: 1px;height: 75px;border: 2px solid #121212;border-radius: 10px 0px 0px 10px;background-color: #121212;}
.device-area .power {width: 1px;height: 75px;border: 2px solid #121212;border-radius: 0px 10px 10px 0px;background-color: #121212;}

.tp-body.desktop-preview .device-area .volume{display:none;}
.tp-body.desktop-preview .device-area .power{position:absolute;bottom:0;left:50%;transform:translate(-50%, 100%);width:30px;border-radius:0px !important;}
.tp-body.desktop-preview .device-area .power:after{content:'';width:200px;height:30px;position:absolute;bottom:0;left:50%;transform:translate(-50%, 100%);background-color:#121212;border-radius:100%;}

.tp-body.tablet-preview, .tp-body.desktop-preview{grid-template-columns:70px 1fr 440px;}
.tp-body.tablet-preview .device-area .device .device-screen{width:1023px;transform:scale(0.391);height:250%;}
.tp-body.desktop-preview .device-area .device{height:300px;box-shadow:none;border-radius:0 !important;}
.tp-body.desktop-preview .device-area .device .device-screen{width:1400px;transform:scale(0.307);height:325%;}

.tp-body.tablet-preview .tp-header .logo, .tp-body.desktop-preview .tp-header .logo{padding:20px;display:block;}
.tp-body.tablet-preview .tp-header .logo img, .tp-body.desktop-preview .tp-header .logo img{width:32px;}
.tp-body.tablet-preview .menu-content, .tp-body.tablet-preview .logo-strapline, .tp-body.desktop-preview .menu-content, .tp-body.desktop-preview .logo-strapline{display:none;}

.tp-body.tablet-preview .tp-header .header-nav li, .tp-body.desktop-preview .tp-header .header-nav li{padding:20px;grid-template-columns:1fr;}

/**Save Button**/
.tp-save-button-area{position:sticky;bottom:0;padding:20px;background:#ffffff;z-index:9;margin-left:-20px;width:calc(100% + 40px);z-index:99;}

/**TP Pro Upgrade table**/
.tp-pro-upgrade-table{max-width:695px;}
.tp-pro-upgrade-table .tp-pro-row{grid-template-columns:1fr 110px 110px;display:grid;grid-gap:20px;padding:7px 0;align-items:center;font-size:15px;}
.tp-pro-upgrade-table .tp-pro-row .tp-pro-upgrade-table .tp-pro-row-label{font-weight:bold;}
.tp-pro-upgrade-table .tp-pro-row:last-of-type, .tp-pro-upgrade-table .tp-pro-row-head{border-bottom:none;}
.tp-pro-upgrade-table .tp-pro-row-head{font-size:15px;font-weight:bold;}
.tp-pro-upgrade-table .tp-pro-row-head h3{border:none;margin:0;padding:0;}
.tp-pro-upgrade-table .tp-pro-row-header:not(:first-child){text-align:center;font-weight:500;width:100%;margin:0;padding:8px 15px;background:rgba(0,0,0,0.1);border-radius:5px;}
.tp-pro-upgrade-table .tp-pro-row-header.pro{background:#e98b39;color:#fff;}
.tp-pro-upgrade-table .tp-pro-row-value{text-align:center;}
.tp-pro-upgrade-table .tp-pro-row-value.ab-yes:after{content:'';width:24px;height:24px;display:inline-block;background-image:var(--tp-check);background-size:contain;background-position:center;background-repeat:no-repeat;}
.tp-pro-upgrade-table .tp-pro-row-value.ab-yes:last-child:after{background-image:var(--tp-check-orange);}

.pro-description{margin-bottom:30px;font-size:18px;line-height:1.2;}

/**Tooltips**/
.tooltip-indicator{width:15px;height:15px;background-size:cover;background-position:center;display:inline-block;position: relative;margin-left:2px;background-image:var(--tp-tooltip-i);}
.tooltip-indicator:after{content:attr(data-tooltip);position:absolute;background:#090b0d;color:#ffffff;padding:7px 10px;border-radius:4px;z-index:9999;top:-10px;transform:translatex(100%);right:-10px;text-transform:none;max-width:220px;width:100vw;line-height:1.4;opacity:0;pointer-events:none;font-size:13px}
.tooltip-indicator:before{content:'';width:8px;height:8px;background:#090b0d;position:absolute;right:-6px;top:2px;transform:translateX(100%) rotate(45deg);z-index:99999;opacity:0;}
.tooltip-indicator:hover:after, .tooltip-indicator:hover:before{opacity:1;}

/**Pro Options**/
.option.pro .option-title:after, .option-inline.pro .option-title:after{content:'PRO' !important;background:#e98b39 !important;color:#fff !important;margin-left:10px !important;padding:1px 7px !important;border-radius:4px !important;display:inline-block !important;position:relative !important;z-index:99 !important;font-size:11px !important;}
.preview-column .preview-sticky-area.pro-preview .device-area:after{content:'Preview contains PRO configurations' !important;background:#e98b39 !important;color:#ffffff !important;position:absolute !important;top:0 !important;left:50% !important;transform:translate(-50%, -100%) !important;padding:3px 10px !important;border-radius:5px 5px 0px 0px !important;width:max-content !important;font-size:11px !important;line-height:1 !important;font-weight:bold !important;}

.upgrade-button, .upgrade-button:hover{background:#e98b39;border:1px solid #e98b39;font-weight:bold;font-size:18px;padding:15px 50px;}

/**Pro Page**/
.pro-page .tp-header .header-nav li.active{background:#e7e7e7;}
.pro-page .tp-content{background:#e7e7e7;}
.pro-page .tp-save-button-area{background:#e7e7e7;}