Server : Apache System : Linux server2.corals.io 4.18.0-348.2.1.el8_5.x86_64 #1 SMP Mon Nov 15 09:17:08 EST 2021 x86_64 User : corals ( 1002) PHP Version : 7.4.33 Disable Function : exec,passthru,shell_exec,system Directory : /home/corals/hessa.corals.io/wp-content/plugins/trx_addons/components/shortcodes/form/ |
@import "../../../css/_mixins.scss";
@import "../../../css/_trx_addons.vars.scss";
/* Contact form */
.sc_form {
position: relative;
padding-top: 0.0001px;
}
.trx_addons_field_error {
border-color:#CC0000 !important;
@include box-shadow(0px 0px 8px 0px rgba(200, 0, 0, 0.2));
}
.sc_form form input.filled.trx_addons_field_error,
.sc_form form input.filled.trx_addons_field_error:hover,
.sc_form form input.filled.trx_addons_field_error:focus {
color: #ff0000 !important;
@include box-shadow(none);
}
.sc_form.sc_align_left .sc_form_field { text-align:left; }
.sc_form.sc_align_center .sc_form_field { text-align:center; }
.sc_form.sc_align_right .sc_form_field { text-align:right; }
.sc_form.sc_align_justify .sc_form_field { text-align:justify; }
.sc_form_title,
.sc_form_description {
margin-bottom: 2rem;
}
.sc_form_form {
position:relative;
}
.sc_form_field {
display:block;
margin-bottom:1.3em;
}
span.sc_form_field_title {
display:block;
@include font(1em, 1.8em, normal);
margin-bottom:0.7em;
color: #292929;
}
label.required span.sc_form_field_title:after {
content:'*';
display:inline-block;
vertical-align:text-top;
margin:-0.5em 0 0 0.5em;
font-size:80%;
color:#da6f5b;
}
.sc_form_field_tooltip {
position:relative;
font-size: 10px;
display: inline-block;
vertical-align:top;
@include square(1em);
background-color: #000;
color: #fff;
padding: 2px;
margin: -2px 0 0 2px;
cursor:help;
@include border-round;
}
.sc_form_field_tooltip:before {
content: ' ';
display:block;
@include abs-lt(18px, -4px, 1000);
@include box(0, 0);
opacity: 0;
border: 5px solid #000;
border-color: transparent transparent #000;
}
.sc_form_field_tooltip:after {
content:attr(data-tooltip-text);
display:block;
text-align:left;
line-height:13px;
width: 150px;
background-color: #000;
color: #fff;
padding: 6px 10px;
@include border-radius(3px);
display:none;
opacity: 0;
pointer-events: none;
@include abs-lt(23px, -10px, 1000);
}
.sc_form_field_title:hover .sc_form_field_tooltip:before,
.sc_form_field_title:hover .sc_form_field_tooltip:after {
opacity: 1;
display: block;
}
.sc_form_field_range .sc_form_field_wrap,
.sc_form_field_slider .sc_form_field_wrap {
display: block;
margin:0 0.6em;
}
.sc_form_field_checklist .sc_form_field_choises_dir_vertical {
max-height:12em;
overflow-y: auto;
}
.sc_form_field_checklist .sc_form_field_choises_dir_vertical .sc_form_field_choises_item {
display:block;
}
.sc_form input[type="text"],
.sc_form select,
.sc_form textarea {
width:100%;
@include border-box;
}
.sc_form.sc_align_left input,
.sc_form.sc_align_left textarea {
text-align:left;
}
.sc_form.sc_align_center input,
.sc_form.sc_align_center textarea {
text-align:center;
}
.sc_form.sc_align_right input,
.sc_form.sc_align_right textarea {
text-align:right;
}
.sc_form .sc_form_info_data > a,
.sc_form .sc_form_info_data > span {
display:block;
color: #000;
}
.sc_form .sc_form_info_data > a:hover {
color: #efa758;
}
.sc_form button:after {
content:' ';
}
/* Default form */
.sc_form_default .sc_form_field_button:before {
content:' ';
@include clear;
}
.sc_form_default .sc_form_field_button {
text-align:left;
}
/* Detailed form */
.sc_form_detailed .sc_form_form {
width: 90%;
}
.sc_form_detailed .sc_form_title,
.sc_form_detailed .sc_form_description {
text-align: left;
}
.sc_form_detailed button {
width:100%;
}
.sc_form_detailed .sc_form_info_item {
overflow:hidden;
}
.sc_form_detailed .sc_form_info_item + .sc_form_info_item {
margin-top: 3.5em;
}
.sc_form_detailed .sc_form_info_icon {
float: left;
color: #c7c7c7;
display:block;
width: 2em;
text-align:center;
}
.sc_form_detailed .sc_form_info_icon:before {
font-family: $trx_addons_icons;
@include font(2.3em, 1.2em);
}
.sc_form_detailed .sc_form_info_item_phone .sc_form_info_icon:before { content: '\e893'; }
.sc_form_detailed .sc_form_info_item_email .sc_form_info_icon:before { content: '\e86d'; }
.sc_form_detailed .sc_form_info_item_address .sc_form_info_icon:before { content: '\e88a'; }
.sc_form_detailed .sc_form_info_area {
float:left;
display:block;
width:100%;
@include border-box;
margin-left:-3em;
padding-left: 4.5em;
font-size:0.9231em;
text-transform:uppercase;
color: #292929;
}
.sc_form_detailed .sc_form_info_area > span {
display:block;
line-height:1.5em;
}
.sc_form_detailed .sc_form_info_area .sc_form_info_title {
font-weight:600;
}
.sc_form_detailed button {
display: block;
}
/* Modern form */
.sc_form_modern .sc_form_info {
margin-bottom: 2.2em;
}
.sc_form_modern .sc_form_info_item {
text-align:center;
}
.sc_form_modern .sc_form_info_icon {
color: #c7c7c7;
display:block;
}
.sc_form_modern .sc_form_info_icon:before {
font-family: $trx_addons_icons;
@include font(4.8em, 1.5em);
}
.sc_form_modern .sc_form_info_item_address .sc_form_info_icon:before { content: '\e88a'; }
.sc_form_modern .sc_form_info_item_email .sc_form_info_icon:before { content: '\e86d'; }
.sc_form_modern .sc_form_info_item_phone .sc_form_info_icon:before { content: '\e893'; }
.sc_form_modern .sc_form_field {
margin-bottom: 2.2em;
}
.sc_form_modern textarea {
min-height:10.75em;
}
.sc_form_modern .sc_form_field_button {
text-align:center;
}
.sc_form_modern button {
margin-top:0;
}
/* Forms in the Google map */
.sc_googlemap_content .sc_form_default .sc_form_details {
width:100%;
float:none;
}
.sc_googlemap_content .sc_form_default .sc_form_details > div {
width: 100%;
padding-right:0;
}
.sc_googlemap_content .sc_form_default .sc_form_field_message {
width: 100%;
float:none;
padding-left: 0;
}
.sc_googlemap_content .sc_form .sc_form_field input[type="text"],
.sc_googlemap_content .sc_form .sc_form_field textarea {
padding:0.5em 1em;
}
.sc_googlemap_content .sc_form .sc_form_field textarea {
min-height:3em;
}
/* Input hovers
----------------------------------------------------- */
/* Common rules */
[class*="sc_input_hover_"] .sc_form_field_wrap,
[class*="sc_input_hover_"] .comments_field_wrap {
position:relative;
z-index:1;
display:block;
}
[class*="sc_input_hover_"] input[type="text"],
[class*="sc_input_hover_"] input[type="number"],
[class*="sc_input_hover_"] input[type="email"],
[class*="sc_input_hover_"] input[type="password"],
[class*="sc_input_hover_"] input[type="search"],
[class*="sc_input_hover_"] select,
[class*="sc_input_hover_"] textarea {
@include font(1em !important, 1.25em, 400, normal);
letter-spacing: 1px;
text-align:left !important;
padding:1.4em !important;
width:100%;
}
[class*="sc_input_hover_"] input:focus,
[class*="sc_input_hover_"] select:focus,
[class*="sc_input_hover_"] textarea:focus {
outline: none;
}
[class*="sc_input_hover_"] .sc_form_field_hover {
@include abs-lt;
width: 100%;
font-size:1em;
text-align: left !important;
overflow: visible;
padding: 0;
pointer-events: none;
white-space: nowrap;
@include border-box;
@include user-select(none);
-webkit-font-smoothing: antialiased;
-webkit-touch-callout: none;
}
[class*="sc_input_hover_"] .sc_form_field_content {
position: relative;
display: block;
width: 100%;
@include font(1em, 1.2em);
@include border-box;
}
[class*="sc_input_hover_"] label.required .sc_form_field_content:after {
content: '*';
vertical-align:top;
margin-left:0.3em;
font-size:110%;
color:#da6f5b;
}
[class*="sc_input_hover_"] label.required:after {
display: none;
}
/* Accent */
.sc_input_hover_accent input[type="text"],
.sc_input_hover_accent input[type="number"],
.sc_input_hover_accent input[type="email"],
.sc_input_hover_accent input[type="password"],
.sc_input_hover_accent input[type="search"],
.sc_input_hover_accent select,
.sc_input_hover_accent .select2-container .select2-selection,
.sc_input_hover_accent textarea {
@include box-shadow(0px 0px 0px 2px transparent);
@include transition-property(box-shadow);
-webkit-appearance: none; /* for box shadows to show on iOS */
}
.sc_input_hover_accent textarea {
min-height:11.5em;
}
.sc_input_hover_accent .sc_form_field_hover {
position:static;
}
.sc_input_hover_accent .sc_form_field_content {
padding: 0.3em 0 0;
}
.sc_input_hover_accent .sc_form_field_hover:before {
content: ' ';
display:block !important;
@include abs-lt(0, 0, -1);
@include box(100%, 3em);
@include box-shadow(0px 0px 0px 0px);
color: rgba(239,167,88,0.6);
}
.sc_input_hover_accent textarea + .sc_form_field_hover:before {
height: 9em;
}
.sc_input_hover_accent input:focus + .sc_form_field_hover,
.sc_input_hover_accent select:focus + .sc_form_field_hover,
.sc_input_hover_accent .select2-container--focus + .sc_form_field_hover,
.sc_input_hover_accent .select2-container--open + .sc_form_field_hover,
.sc_input_hover_accent textarea:focus + .sc_form_field_hover {
pointer-events: none;
}
.sc_input_hover_accent input:focus + .sc_form_field_hover:before,
.sc_input_hover_accent select:focus + .sc_form_field_hover:before,
.sc_input_hover_accent .select2-container--focus + .sc_form_field_hover:before,
.sc_input_hover_accent .select2-container--open + .sc_form_field_hover:before,
.sc_input_hover_accent textarea:focus + .sc_form_field_hover:before {
@include animation(anim-accent 0.3s forwards);
}
.sc_input_hover_accent input[type="text"]:focus,
.sc_input_hover_accent input[type="number"]:focus,
.sc_input_hover_accent input[type="email"]:focus,
.sc_input_hover_accent input[type="password"]:focus,
.sc_input_hover_accent input[type="search"]:focus,
.sc_input_hover_accent select:focus,
.sc_input_hover_accent .select2-container--focus .select2-selection,
.sc_input_hover_accent .select2-container--open .select2-selection,
.sc_input_hover_accent textarea:focus {
border-color: #efa758 !important;
}
@-webkit-keyframes anim-accent {
to {
@include box-shadow(0px 0px 100px 50px);
opacity: 0;
}
}
@keyframes anim-accent {
to {
@include box-shadow(0px 0px 100px 50px);
opacity: 0;
}
}
/* Path */
.sc_input_hover_path .sc_form_field_wrap {
margin-bottom: 3em;
}
.sc_input_hover_path input[type="text"],
.sc_input_hover_path input[type="number"],
.sc_input_hover_path input[type="email"],
.sc_input_hover_path input[type="password"],
.sc_input_hover_path input[type="search"],
.sc_input_hover_path textarea {
border:none !important;
background: transparent !important;
}
.sc_input_hover_path textarea {
height:4.1em;
overflow:hidden;
min-height: 0 !important;
}
.sc_input_hover_path textarea.filled,
.sc_input_hover_path textarea:focus {
height: auto;
min-height:10.5em !important;
}
.sc_input_hover_path .sc_form_field_hover {
height: 100%;
cursor: text;
display:block;
}
.sc_input_hover_path .sc_form_field_content {
padding: 2em 1.5em 1.5em;
@include transform-origin(0% 50%);
@include transition-property(transform);
}
.sc_input_hover_path textarea + .sc_form_field_hover > .sc_form_field_content {
padding-top:2em;
}
.sc_input_hover_path .sc_form_field_graphic {
fill: none;
@include abs-lt;
@include scale3d(1, -1, 1);
@include transition-property(stroke-dashoffset, 0.5s);
pointer-events: none;
stroke: #333;
stroke-width: 2px;
stroke-dasharray: 1190;
stroke-dashoffset: 670;
}
.sc_input_hover_path textarea + .sc_form_field_hover > .sc_form_field_graphic {
stroke-dasharray: 1420;
stroke-dashoffset: 900;
}
.sc_input_hover_path input:focus + .sc_form_field_hover,
.sc_input_hover_path textarea:focus + .sc_form_field_hover,
.sc_input_hover_path input.filled + .sc_form_field_hover,
.sc_input_hover_path textarea.filled + .sc_form_field_hover {
cursor: default;
pointer-events: none;
}
.sc_input_hover_path input:focus + .sc_form_field_hover > .sc_form_field_graphic,
.sc_input_hover_path textarea:focus + .sc_form_field_hover > .sc_form_field_graphic,
.sc_input_hover_path input.filled + .sc_form_field_hover > .sc_form_field_graphic,
.sc_input_hover_path textarea.filled + .sc_form_field_hover > .sc_form_field_graphic {
stroke-dashoffset: 0;
}
.sc_input_hover_path input:focus + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_path textarea:focus + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_path input.filled + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_path textarea.filled + .sc_form_field_hover > .sc_form_field_content {
@include transform(scale3d(0.875, 0.875, 1) translate3d(0, 2.8em, 0));
}
.sc_input_hover_path textarea:focus + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_path textarea.filled + .sc_form_field_hover > .sc_form_field_content {
@include transform(scale3d(0.875, 0.875, 1) translate3d(0, 10em, 0));
}
/* Jump */
.sc_input_hover_jump .sc_form_field_wrap {
padding-top: 2em;
overflow: hidden;
}
.sc_input_hover_jump input[type="text"],
.sc_input_hover_jump input[type="number"],
.sc_input_hover_jump input[type="email"],
.sc_input_hover_jump input[type="password"],
.sc_input_hover_jump input[type="search"],
.sc_input_hover_jump textarea {
border: 2px solid #ddd;
}
.sc_input_hover_jump textarea {
min-height:11.9em !important;
}
.sc_input_hover_jump .sc_form_field_hover {
overflow:hidden;
@include translate3d(0, 2em, 0);
}
.sc_input_hover_jump .sc_form_field_content {
padding: 1.5em;
}
.sc_input_hover_jump .sc_form_field_content:before {
content: attr(data-content);
@include abs-lt(0, -190%, '');
font-weight: bold;
margin:0;
color: #efa758;
}
.sc_input_hover_jump input:focus + .sc_form_field_hover,
.sc_input_hover_jump textarea:focus + .sc_form_field_hover,
.sc_input_hover_jump input.filled + .sc_form_field_hover,
.sc_input_hover_jump textarea.filled + .sc_form_field_hover {
@include animation(anim-jump-1 0.25s forwards);
}
.sc_input_hover_jump input:focus + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_jump textarea:focus + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_jump input[type="text"].filled + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_jump textarea.filled + .sc_form_field_hover > .sc_form_field_content {
@include animation(anim-jump-2 0.25s forwards ease-in);
}
.sc_input_hover_path input:focus,
.sc_input_hover_path textarea:focus,
.sc_input_hover_path input.filled,
.sc_input_hover_path textarea.filled {
border-color: #efa758;
}
@-webkit-keyframes anim-jump-1 {
0%, 70% { @include translate3d(0, 3em, 0); }
71%, 100% { @include translate3d(0, 0, 0); }
}
@keyframes anim-jump-1 {
0%, 70% { @include translate3d(0, 3em, 0); }
71%, 100% { @include translate3d(0, 0, 0); }
}
@-webkit-keyframes anim-jump-2 {
0% { @include translate3d(0, 0, 0); }
70%, 71% { @include translate3d(0, 125%, 0); @include animation-timing(ease-out); }
100% { @include translate3d(0, 200%, 0); }
}
@keyframes anim-jump-2 {
0% { @include translate3d(0, 0, 0); }
70%, 71% { @include translate3d(0, 125%, 0); @include animation-timing(ease-out); }
100% { @include translate3d(0, 200%, 0); }
}
/* Underline */
.sc_input_hover_underline .sc_form_field {
margin-bottom: 2em;
}
.sc_input_hover_underline .sc_form_field_button {
margin-bottom: 0;
margin-top: 3em;
}
.sc_input_hover_underline .sc_form_field_wrap {
margin-bottom: 0;
}
[class*="sc_input_hover_"].sc_input_hover_underline input[type="text"],
[class*="sc_input_hover_"].sc_input_hover_underline input[type="number"],
[class*="sc_input_hover_"].sc_input_hover_underline input[type="email"],
[class*="sc_input_hover_"].sc_input_hover_underline input[type="password"],
[class*="sc_input_hover_"].sc_input_hover_underline input[type="search"],
[class*="sc_input_hover_"].sc_input_hover_underline textarea {
border:none !important;
background-color: transparent !important;
padding: 0.5em 0 !important;
}
.sc_input_hover_underline textarea {
height:2.5em;
overflow:hidden;
min-height: 0 !important;
}
.sc_input_hover_underline textarea.filled,
.sc_input_hover_underline textarea:focus {
height: auto;
min-height:6em !important;
}
.sc_input_hover_underline textarea + .sc_form_field_hover > .sc_form_field_content {
display: block;
/*height: 1.5em;*/
}
.sc_input_hover_underline textarea.filled + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_underline textarea:focus + .sc_form_field_hover > .sc_form_field_content {
height: 6.3em;
}
.sc_input_hover_underline .sc_form_field_hover {
padding: 0.5em 0;
overflow:visible;
}
.sc_input_hover_underline .sc_form_field_hover:before {
content: ' ';
display:block !important;
@include abs-pos(auto, auto, 0, 0, '');
@include box(100%, 2px);
@include transform-origin(50% 100%);
@include transition(transform 0.3s, background-color 0.3s);
background-color:#ddd;
}
.sc_input_hover_underline .sc_form_field_content {
padding: 0;
@include transform-origin(0% 0%);
@include transition(transform 0.3s, color 0.3s);
}
.sc_input_hover_underline input:focus + .sc_form_field_hover:before,
.sc_input_hover_underline textarea:focus + .sc_form_field_hover:before,
.sc_input_hover_underline input.filled + .sc_form_field_hover:before,
.sc_input_hover_underline textarea.filled + .sc_form_field_hover:before {
background-color:#333;
@include scale3d(1, 1, 1);
}
.sc_input_hover_underline input:focus + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_underline input.filled + .sc_form_field_hover > .sc_form_field_content {
color:#333;
@include transform(translate3d(0, 2.2em, 0) scale3d(0.875, 0.875, 1));
}
.sc_input_hover_underline textarea:focus + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_underline textarea.filled + .sc_form_field_hover > .sc_form_field_content {
color:#333;
height: 5.3em;
@include transform(translate3d(0, 6.2em, 0) scale3d(0.875, 0.875, 1));
}
/* Iconed */
[class*="sc_input_hover_"].sc_input_hover_iconed input[type="text"],
[class*="sc_input_hover_"].sc_input_hover_iconed input[type="number"],
[class*="sc_input_hover_"].sc_input_hover_iconed input[type="email"],
[class*="sc_input_hover_"].sc_input_hover_iconed input[type="password"],
[class*="sc_input_hover_"].sc_input_hover_iconed input[type="search"],
[class*="sc_input_hover_"].sc_input_hover_iconed textarea {
padding-left: 3em !important;
}
.sc_input_hover_iconed textarea {
min-height:8.4em;
}
.sc_input_hover_iconed .sc_form_field_hover {
overflow:hidden;
padding:1.2em !important;
margin: 0;
}
.sc_input_hover_iconed .sc_form_field_content {
display: inline-block !important;
width: auto;
@include translate3d(-1.4em, 0, 0);
@include transition(transform 0.3s, opacity 0.3s);
}
.sc_input_hover_iconed .sc_form_field_icon {
display: inline-block;
font-size: 1.1111em;
text-align:center !important;
position:relative;
@include box(1.5em, 1.6em, 1.6em);
@include translate3d(-3em, 0, 0);
@include transition-property(transform);
}
.sc_input_hover_iconed .sc_form_field_icon:before {
position:static !important;
left: auto;
top: auto;
@include box(auto, auto);
margin:0 !important;
padding:0 !important;
font-style:normal !important;
line-height:inherit;
vertical-align:middle;
}
.sc_input_hover_iconed input:focus + .sc_form_field_hover,
.sc_input_hover_iconed textarea:focus + .sc_form_field_hover,
.sc_input_hover_iconed input.filled + .sc_form_field_hover,
.sc_input_hover_iconed textarea.filled + .sc_form_field_hover {
color: #333;
}
.sc_input_hover_iconed input:focus + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_iconed textarea:focus + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_iconed input.filled + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_iconed textarea.filled + .sc_form_field_hover > .sc_form_field_content {
opacity: 0;
@include translate3d(100px, 0, 0);
}
.sc_input_hover_iconed .sc_form_field_content,
.sc_input_hover_iconed .sc_form_field_icon,
.sc_input_hover_iconed input:focus + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_iconed textarea:focus + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_iconed input.filled + .sc_form_field_hover > .sc_form_field_content,
.sc_input_hover_iconed textarea.filled + .sc_form_field_hover > .sc_form_field_content {
@include transition-timing(0.7, 0, 0.3, 1);
}
.sc_input_hover_iconed input:focus + .sc_form_field_hover > .sc_form_field_icon,
.sc_input_hover_iconed textarea:focus + .sc_form_field_hover > .sc_form_field_icon,
.sc_input_hover_iconed input.filled + .sc_form_field_hover > .sc_form_field_icon,
.sc_input_hover_iconed textarea.filled + .sc_form_field_hover > .sc_form_field_icon {
@include translate3d(0, 0, 0);
}