/********************************** heading **********************************/ .sc_headline-design .components-radio-control { border: 1px solid #ccc; background: #f9f9f9; padding: 15px; white-space: nowrap; overflow: auto; } .sc_headline-design .components-base-control__field{ width: 720px; display: flex; flex-wrap: wrap; white-space: normal; } .sc_headline-design .components-radio-control__option{ padding: 0 10px; width: 140px; text-align: center; display: inline-block; vertical-align: top; margin: 10px 0; } .sc_headline-design .components-radio-control__option input { margin: 0 auto; margin-bottom: 15px; display: block; } .sc_headline-design .sc_title_wrap{ margin: 0em; font-size: .8em; text-align: left; } .sc_title_wrap { padding: .8em 1em; font-size: 1em; font-weight: bold; } .sc_title_wrap.solid{ background: #000; color: #fff; border-radius: 3px; } .sc_title_wrap.bborder{ border-width: 3px; border-color: #000; border-style: solid; color: #000; } .sc_title_wrap.bborder.a{ border-width: 3px; border-radius: 3px; } .sc_title_wrap.bborder.tb{ border-width: 3px 0 3px 0; } .sc_title_wrap.bborder.b{ border-width:0 0 3px 0; } .sc_title_wrap.stech{ background: #000; box-shadow: 0px 0px 0px 5px #000; border: dashed 2px #fff; color: #fff; border-radius: 3px; } .sc_title_wrap.bborder.l{ border-width: 0 0 0 8px; background-color: #eee; } .sc_title_wrap.rlborder{ position: relative; text-align: center; } .sc_title_wrap.rlborder .before{ content: ''; position: absolute; top: 50%; width: 100%; height: 2px; left: 0; background-color: black; } .sc_title_wrap.rlborder .sc_title { background: #fff; position: relative; display: inline-block; padding: 0 2em; } .sc_title_wrap.fukidasi { position: relative; background-color: #000; border-radius: 6px; color: #fff; margin-bottom: 20px; } .sc_title_wrap.fukidasi .before,.sc_title_wrap.fukidasi .after { position: absolute; top: 100%; left: 30px; content: ''; width: 0; height: 0; border: 10px solid transparent; border-top: 10px solid #000; } .sc_title_wrap.count { position: relative; background: #efefef; padding-left: 25px; } .sc_title_wrap.count .before { line-height: 30px; position: absolute; color: white; background: #000; font-size: 1.2em; width: 30px; text-align: center; left: -1.1em; top:0; bottom: 0; display: flex; align-items: center; justify-content: center; } .sc_title_wrap.countrad { position: relative; background: #eee; border-radius: 0 5px 5px 0; padding-left: 25px; } .sc_title_wrap.countrad .before { line-height: 30px; position: absolute; color: white; background: #000; font-size: 1.2em; width: 35px; text-align: center; left: -1.1em; top: 50%; bottom: -50%; transform: translateY(-50%); border: solid 3px white; border-radius: 50%; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; } .sc_title_wrap.headtag { background:#000; color: #fff; vertical-align: middle; border-radius: 25px 0px 0px 25px; } .sc_title_wrap.headtag .before {color: #ccc;margin-right: 8px;float: left;font-size: 1.05em;} /********************************** frame **********************************/ .sc_frame-design .components-radio-control { border: 1px solid #ccc; background: #f9f9f9; padding: 15px; white-space: nowrap; overflow: auto; } .sc_frame-design .components-flex{ display: flex; white-space: normal; flex-direction: row; flex-wrap: nowrap; } .sc_frame-design .components-radio-control__option{ padding: 0 5px; width: 140px; text-align: center; display: inline-block; vertical-align: top; margin: 10px 0; flex:1 0 auto; } .sc_frame-design .components-radio-control__option input { margin: 0 auto; margin-bottom: 5px; display: block; } .gutenberg .sc_frame{ overflow: inherit; } .sc_frame-design .sc_frame_wrap{ margin: 0em; font-size: .8em; text-align: left; } .sc_frame-design .sc_frame{ border: 2px solid #777; padding: .8em; } .sc_frame-design .sc_frame_title { background: #777; } .sc_frame_wrap.onframe .sc_frame_title { left: 1em; color: #777; } .sc_frame_wrap.solid .sc_frame{ background-color: #777; } /********************************** button **********************************/ .button-design .components-radio-control__option { width: 90px; text-align: center; display: inline-block; vertical-align: top; margin: 10px 0; flex:1 0 auto; } .button-design .components-radio-control__option input { margin: 0 auto; margin-bottom: 5px; display: block; } .button-design .components-radio-control { border: 1px solid #ccc; background: #f9f9f9; padding: 15px; white-space: nowrap; overflow: auto; } .button-design .components-flex{ display: flex; flex-direction: row; flex-wrap: nowrap; } .button-design .components-radio-control__option .button { box-shadow: none; border: none; background: none; } /********************************** button **********************************/ .button span.dvaux-button_link,.button-design .button span.dvaux-button_link{ padding: .6em 1.3em; letter-spacing: 2px; display: inline-block; background: #82bbda; color: #fff; font-weight: bold; border-radius: 3px; } .button span.dvaux-button_link.medium {font-size: 16px;} .button span.dvaux-button_link.big {padding: .8em 2.5em;font-size: 18px;} .button span.dvaux-button_link.small {padding: 0.5em 1.3em;font-size: 13px;} .button-design .button span.dvaux-button_link{ font-size: .8em; padding: .4em 1.3em; } .button.shadow span.dvaux-button_link{ box-shadow: 0px 2px 10px 1px #ccc; } .button.radius span.dvaux-button_link{ border-radius: 50px; } .button.bborder span.dvaux-button_link{ border:2px solid #6894b7; margin: 0px; } .button.solid span.dvaux-button_link{ position: relative; box-shadow: 0 5px 0 #5c96cc; top:0px; text-shadow: 0 1px 1px rgba(0, 0, 0, .4); } .button.oborder span.dvaux-button_link{ border:2px solid #70b8f1; background:#fff; color: #70b8f1; } .button.frame span.dvaux-button_link{ box-shadow: 0px 0px 0px 2px #70b8f1; border: 2px solid #ffffff; margin: 0px; } /********************************** sc_voice **********************************/ .sc_voice-design .components-radio-control { border: 1px solid #ccc; background: #efefef; padding: 5px; white-space: nowrap; overflow: auto; } .sc_voice-design .components-flex{ display: flex; white-space: normal; flex-direction: row; flex-wrap: nowrap; } .sc_voice-design .components-radio-control__option{ padding: 0 5px; width: 90px; text-align: center; display: inline-block; vertical-align: top; margin: 10px 0; flex:1 0 auto } .sc_voice-design .components-radio-control__option input { margin: 0 auto; margin-bottom: 5px; display: block; } .voice_icon { width: 70px; height: 70px; } .voice_icon img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; } button.icon-button { margin: 0 auto 10px auto; } /********************************** sc_design_list **********************************/ .components-radio-control__option .sc_designlist ul li:before{ left: 0em; } .list-design .components-flex{ display: flex; flex-direction: row; flex-wrap: nowrap; } .list-design .components-radio-control__option { width: 90px; text-align: center; display: inline-block; vertical-align: top; margin: 10px 0; flex: 1 0 auto; } .list-design .components-radio-control__option input { margin: 0 auto; margin-bottom: 5px; display: block; } .list-design .components-radio-control { border: 1px solid #ccc; background: #f9f9f9; padding: 15px; white-space: nowrap; overflow: auto; } .list-design .components-radio-control__option .button { box-shadow: none; border: none; background: none; } .sc_voice-design .components-radio-control label{ display: inline-block; padding: 5px; border-radius: 3px; margin: 5px; background: #fff; border:2px solid #fff; } .sc_voice-design .components-radio-control input[type="radio"]:checked + label{ border-color:#3ca3ff; box-shadow: inset 0px 0px 5px #999; background: #fff; } .voice-settings .components-radio-control input[type="radio"], .button-settings .components-radio-control input[type="radio"], .icon-settings .components-radio-control input[type="radio"], .sc_voice-design .components-radio-control input[type="radio"], .list-settings .components-radio-control input[type="radio"], .headline-settings .components-radio-control input[type="radio"]{ display:none; } .voice-settings .components-radio-control label, .button-settings .components-radio-control label, .headline-settings .components-radio-control label, .icon_select_area .components-radio-control__option label{ color: #555; border:1px solid #ccc; background: #f7f7f7; box-shadow: inset 0 -1px 0 #ccc; vertical-align: top; height: 30px; line-height: 28px; padding: 0 12px 2px; display: inline-block; } .setting-flex > .components-base-control__field{ display: flex; justify-content: space-between; align-items: center; } .setting-flex .components-flex{ display: flex; flex-direction: row; gap: 0; } .icon_select_area .components-flex{ display:flex; flex-wrap:wrap; border:1px solid #ccc; background: #f7f7f7; box-shadow: inset 0 -1px 0 #ccc; height: 200px; overflow: auto; flex-direction: row; gap: 0; } .icon_select_area .components-flex .components-radio-control__option { width: 20%; margin: 0; } .icon_select_area .components-radio-control__option label { width: 100%; height: auto; font-size: 1.2em; box-shadow: none; height: auto; display: flex; align-items: center; justify-content: center; padding: 8px; } .radio-button.components-radio-control .components-radio-control__option{ margin: 0; } .radio-button.components-radio-control .components-radio-control__option:first-child label{ border-radius: 3px 0 0 3px; } .radio-button.components-radio-control .components-radio-control__option:last-child label{ border-radius: 0 3px 3px 0; } .radio-button.components-radio-control input[type="radio"]:checked + label, .icon_select_area .components-radio-control__option input[type="radio"]:checked + label{ background: #0085ba; border-color: #006a95 #00648c #00648c; box-shadow: inset 0 -1px 0 #00648c; color: #fff; text-decoration: none; text-shadow: 0 -1px 1px #005d82, 1px 0 1px #005d82, 0 1px 1px #005d82, -1px 0 1px #005d82; } figure.section_bg_preview { margin: 0; } .components-base-control.components-toggle-control .components-base-control__field { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; align-items: center; } .components-base-control.components-toggle-control span.components-form-toggle { -webkit-box-ordinal-group: 2; -ms-flex-order: 2; -webkit-order: 2; order: 2; } /********************************** dvaux_section **********************************/ .wp-block[data-type="dvaux/section"]{ min-width: 100%; } .dvaux_section_inner{ background-color: #eee; position: relative; background-repeat: no-repeat; padding:60px 40px; margin: 0 -20px; & > .block-editor-inner-blocks > .block-editor-block-list__layout{ max-width: 800px; margin-right: 0; margin-left: 0; } } .dvaux_section_environ .dvaux_section_inner::after { position: absolute; content: ''; pointer-events: none; content: ''; position: absolute; z-index: 1; } .dvaux_section_environ.balloon .dvaux_section_inner::after { bottom: -35px; background: inherit; left: 50%; width: 70px; height: 70px; -webkit-transform: translateX(-50%) rotate(45deg); transform: translateX(-50%) rotate(45deg); } .dvaux_section_environ.slope1 .dvaux_section_inner::after{ bottom: 0; left: 0; right: 0; height: 50px; background: inherit; -webkit-transform-origin: bottom right; -ms-transform-origin: bottom right; transform-origin: bottom right; -webkit-transform: skewY(-3deg); -ms-transform: skewY(-3deg); transform: skewY(-3deg); transform-origin: bottom right; } .dvaux_section_environ.slope1 .dvaux_section_inner::after { margin: 0; bottom: -70px; } .dvaux_section_environ.slope2 .dvaux_section_inner::after{ bottom: 0; left: 0; right: 0; height: 50px; background: inherit; -webkit-transform-origin: bottom left; -ms-transform-origin: bottom left; transform-origin: bottom left; -webkit-transform: skewY(3deg); -ms-transform: skewY(3deg); transform: skewY(3deg); transform-origin: bottom left; } .dvaux_section_environ.slope2 .dvaux_section_inner::after { margin: 0; bottom: -20px; } .dvaux_section_environ.radius .dvaux_section_inner::after { bottom: -60px; left: 0; width: 100%; height: 60px; margin: 3% -10% 0; background: inherit; border-radius: 0 0 50% 50%; } .dvaux_section_environ.radius .dvaux_section_inner::after{ margin: 0; } .dvaux_section_environ.zigzag .dvaux_section_inner { padding-bottom: 60px; margin-bottom: -30px; position: relative; -webkit-mask-image: linear-gradient(0deg,transparent 30px,#fff 30px),linear-gradient(-135deg,#fff 15px,transparent 15px),linear-gradient(135deg,#fff 15px,transparent 15px); -webkit-mask-position: left bottom; -webkit-mask-repeat: repeat-x; -webkit-mask-size: 100% 100%,30px 30px,30px 30px; z-index: 1; }