Your IP : 216.73.216.196
button,
input,
select,
optgroup,
textarea {
color: $text-color;
font-weight: $font-weight-base;
line-height: $line-height-base;
text-rendering: optimizeLegibility;
}
.button,button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
cursor: pointer;
background: $theme-color;
border: 1px solid $theme-color;
color: $link-color;
font-size: 14px;
outline: none;
padding: 8px 34px;
text-transform: uppercase;
text-decoration: none;
font-family: $headings-font-family;
font-weight: $headings-font-weight;
@include transition($linear);
@include box-sizing(border-box);
@include border-radius(0);
@include inline-block();
@include hover-focus-active() {
background: transparent;
color: $theme-color;
border-color: $theme-color;
}
&:visited {
text-decoration: none;
}
&:focus {
outline: none;
}
}
input[type=submit][disabled=disabled], button[disabled=disabled],
input[type=submit]:disabled, button:disabled {
pointer-events: none;
}
label{
font-weight: 600;
color: lighten($gray-base, 40%);
cursor: pointer;
}
// btn
.btn{
outline:none !important;
&.btn-donate{
font-size: 14px;
color: $headings-color;
line-height: 1;
padding: 14px 30px;
font-weight: 700;
text-transform: uppercase;
border: 1px solid $theme-color;
font-family: $headings-font-family;
background-color: $theme-color;
@include inline-block();
@include transition($linear);
@include hover-focus-active() {
color: $theme-color;
background-color: transparent;
}
}
}
.btn-outline-light{
@include button-variant-outline( #FFFFFF, transparent, #FFFFFF, $brand-primary, #FFFFFF, $brand-primary);
}
.btn-shop{
padding:0 0 3px;
font-size:14px;
font-weight: $font-weight-medium;
text-transform:uppercase;
border-bottom:2px solid #f43434;
}
.btn-outline{
@include button-outline(default, #fff, $theme-color );
@include button-outline(primary, $brand-primary, #fff );
@include button-outline(success, $brand-success, #FFFFFF );
@include button-outline(info, $brand-info, #FFFFFF );
@include button-outline(danger, $brand-danger, #FFFFFF );
@include button-outline(warning, $brand-warning, #FFFFFF );
}
.btn-inverse{
@include button-inverse(primary, $brand-primary, #FFFFFF );
@include button-inverse(success, $brand-success, #FFFFFF );
@include button-inverse(info, $brand-info, #FFFFFF );
@include button-inverse(danger, $brand-danger, #FFFFFF );
@include button-inverse(warning, $brand-warning, #FFFFFF );
@include button-inverse(theme, $theme-color, #FFFFFF );
}
.btn-compare.btn-outline{
color:#4c4c4c;
background:$white;
border:1px solid #e9e9e9;
height:$input-height-base;
&:hover,&:active{
color: $white;
background:#4c4c4c;
border-color:#4c4c4c;
}
}
.reamore{
font-size:14px;
font-weight: $font-weight-medium;
color:$theme-color !important;
text-transform:uppercase;
padding:0 0 4px;
border-bottom:2px solid $theme-color;
i{
@include rtl-margin-left(8px);
}
}
.apus-loadmore-btn{
display:inline-block;
font-size:14px;
font-weight: $font-weight-medium;
background:$theme-color;
color:$white;
text-transform:uppercase;
@include transition(all 0.2s ease-in-out 0s);
padding:12px 30px;
@include transition(all 0.2s ease-in-out 0s);
&:hover,&:active{
color:$white;
background:$brand-primary;
}
}
.viewmore-products-btn{
position:relative;
@extend .btn;
@extend .btn-theme;
&:before{
content: '';
position: absolute;
top: -2px;
left: -2px;
z-index:2;
@include size(calc(100% + 4px),calc(100% + 4px));
@include opacity(0);
background:rgba(255,255,255,0.9) url(#{$image-theme-path}loading-quick.gif) no-repeat scroll center center / 20px auto;
}
&.loading{
&:before{
@include opacity(1);
}
}
}
button,.btn{
@include hover-focus() {
outline:none !important;
@include box-shadow(none !important);
}
}
.btn-link{
font-weight: $headings-font-weight;
}
.radius-0{
@include border-radius(0 !important);
}
.radius-circle{
@include border-radius(100px !important);
}
.btn-3d{
@include box-shadow(0 0 10px 0 rgba($theme-color,0.8));
}
.read-more{
font-size:12px;
font-weight: $font-weight-medium;
text-transform:uppercase;
color:$theme-color;
}
.btn-white{
background: $white;
color: $theme-color;
border-color:$white;
&:active,
&:hover{
color: $theme-color;
background:darken(#fff, 5%);
border-color:darken(#fff, 5%);
}
}
.btn-white.btn-br-white{
background: $white;
color: $link-color;
border-color:$white;
&:active,
&:hover{
color: $link-color;
background:darken(#fff,15%);
border-color:darken(#fff,15%);
}
}
.btn-gradient{
border:none !important;
overflow:hidden;
@include gradient-horizontal($theme-color-second,$theme-color);
position:relative;
@include transition(all 0.3s ease-in-out 0s);
padding: ($padding-base-vertical + 2) $padding-base-horizontal;
&:before{
content: '';
@include size(100%,100%);
position: absolute;
top:0;
left: 0;
z-index: 1;
@include opacity(0);
@include gradient-horizontal(darken($theme-color-second,10%),darken($theme-color,10%));
@include transition(opacity 0.5s ease-out);
}
> *{
position:relative;
z-index: 2;
}
&:hover,&:active{
@include gradient-horizontal($theme-color-second,$theme-color);
&:before{
@include opacity(1);
}
}
&.btn-white{
color: $link-color;
&:before{
content: '';
top:2px;
right:2px;
left:2px;
bottom:2px;
background: $white;
@include border-radius($border-radius-base);
@include size(auto,auto);
@include opacity(1);
}
&:hover,&:active{
color:#fff !important;
&:before{
@include opacity(0);
}
}
}
}
.btn-readmore{
color: $link-color;
font-size: 14px;
font-weight: $headings-font-weight;
text-transform: none;
position:relative;
padding: 5px 15px;
text-transform: uppercase;
border: 1px solid transparent;
font-family: $headings-font-family;
background-color: $theme-color;
@include inline-block();
@include transition($linear);
@include hover-focus-active() {
color: $theme-color;
background: $white;
border-color: $theme-color;
}
@include media(tablet) {
padding: 9px 30px;
}
}
.btn-lighten{
border-color:$white;
color:$white;
background: transparent;
&:hover{
color: $white;
background: transparent;
border-color:$white;
}
}
.btn-outline.btn-white{
background: transparent;
color: $link-color;
border-color: $theme-color;
&:active,
&:hover{
color: $white;
background: $theme-color;;
border-color: $theme-color;;
}
}
.btn-pink{
@include button-variant(#fff, #e3a3a2, #e3a3a2);
}
.btn-primary.btn-inverse{
&:active,
&:hover{
background:#fff !important;
color: $brand-primary !important;
border-color:$brand-primary !important;
}
}
.btn-theme {
@include button-variant($headings-color, $theme-color, $theme-color);
@include hover-focus-active() {
background-color: $theme-color;
border-color: $theme-color;
}
}
.btn-dark {
@include button-variant(#252525,#cccccc, #cccccc);
&:active,
&:hover{
color: #181818 !important;
}
}
.btn-theme-second {
@include button-variant(#fff, $theme-color-second, $theme-color-second);
&:active,
&:hover{
color: $white;
}
}
.btn-theme.btn-outline{
color: $theme-color;
border-color: $theme-color;
background: transparent;
&:hover,&:active{
color: $white;
background: $theme-color;
border-color: $theme-color;
}
}
.more-link{
color: $theme-color;
display: inline-block;
font-weight: normal;
margin: 10px 0;
text-transform: capitalize;
&:hover{
text-decoration: none;
}
}
.btn-shaded-sm{
position: relative;
&:before{
content: '';
position: absolute;
top:0px;
left: 0px;
border-width:20px 10px;
border-style: solid;
border-color: transparent transparent transparent rgba(255,255,255,0.4);
}
}
/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
@include animation(autofill 0s forwards);
}
/* Search
------------------------------------------------*/
.search-popup{
.dropdown-menu{
padding: 10px;
}
}
.btn-action{
@include border-radius(4px);
cursor: pointer;
display: inline-block;
font-size: 11px;
font-weight: 900;
line-height: 30px;
margin-bottom: 0;
padding: 0px 10px;
text-align: center;
text-transform: uppercase;
@include transition(all 0.4s ease 0s);
vertical-align: middle;
white-space: nowrap;
}
.searchform{
.input-search{
padding:15px;
@include rtl-border-right(0);
line-height: 1.5;
}
.btn-search{
vertical-align: top;
color: #adafac;
padding:12px $padding-xs-horizontal;
}
.input-group-btn{
line-height: 100%;
}
}
// Search categories
.search-category{
.btn{
@include rtl-margin-left(10px !important);
@include border-radius($border-radius-small !important );
}
.wpo-search-inner{
label.form-control{
border:none;
border-bottom-right-radius: $border-radius-small;
border-top-right-radius: $border-radius-small;
}
}
select {
border:none;
text-transform: capitalize;
font-weight: $font-weight-medium;
}
}
/* comment form
------------------------------------------------*/
.chosen-container{
width: 100% !important;
}
.input-group-form{
@include border-radius(3px);
background: $input-group-form-bg;
margin: $input-group-form-margin;
.form-control-reversed{
border: 0px;
background: $input-form-bg;
color: darken($white, 20%);
@include font-size(font-size,14px);
height: 34px;
&:hover,
&:focus{
@include box-shadow(none);
}
}
.input-group-addon{
border: 0;
background: $input-form-bg;
@include border-left-radius(4px);
}
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
-webkit-appearance: none;
-webkit-backface-visibility: hidden;
cursor: pointer;
color: lighten($black, 60%);
background: $input-bg;
border: solid 1px $input-bg;
box-sizing: border-box;
outline: none;
height: auto;
padding: 13px 23px;
filter: none;
@include transition($linear);
@include appearance(none);
@include border-radius(0);
&:-moz-autofill,
&:-moz-autofill-preview {
filter: grayscale(21%) brightness(88%) contrast(161%) invert(10%) sepia(40%) saturate(206%);
}
@include hover-focus-active() {
border-color: $theme-color;
background-color: $white;
}
&:required,
&:optional,
&:invalid{
@include box-shadow(none);
}
}
input[type="search"] {
&::-webkit-search-decoration {
display: none;
}
}
// remove dotted outline/border in Firefox
button:focus,
a:focus, a:active,
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
select::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
outline: none !important;
}
select {
color: lighten($black, 60%);
cursor: pointer;
outline: none;
border: solid 1px $input-bg;
padding: 12px 15px;
background: url("data:image/svg+xml;utf8,<svg viewBox='0 0 140 140' width='24' height='24' xmlns='http://www.w3.org/2000/svg'><g><path d='m121.3,34.6c-1.6-1.6-4.2-1.6-5.8,0l-51,51.1-51.1-51.1c-1.6-1.6-4.2-1.6-5.8,0-1.6,1.6-1.6,4.2 0,5.8l53.9,53.9c0.8,0.8 1.8,1.2 2.9,1.2 1,0 2.1-0.4 2.9-1.2l53.9-53.9c1.7-1.6 1.7-4.2 0.1-5.8z' fill='gray'/></g></svg>") no-repeat;
background-size: 14px;
background-position: calc(100% - 20px) center;
background-repeat: no-repeat;
background-color: $input-bg;
@include border-radius(0);
@include transition-all();
@include appearance(none);
@include hover-focus-active() {
outline: none;
border-color: $theme-color;
background-color: $white;
}
option{
color: inherit;
font-size: $font-size-base;
}
&:-moz-focusring {
color: transparent;
@include text-shadow(0 0 0 lighten($black, 60%));
}
}
textarea,
textarea.form-control {
box-sizing: border-box;
display: block;
width: 100%;
max-width: 100%;
resize: vertical;
line-height: 1.5 !important;
min-height: 120px;
padding-left: 23px;
padding-right: 23px;
border-color: $input-bg;
@include hover-focus-active() {
border-color: $theme-color;
}
}
form {
p {
margin: 30px 0;
&:first-child{
margin-top: 0px;
}
&:last-child{
margin-bottom: 0px;
}
}
}
.elementor-element{
&.elementor-widget-button{
&.icon-color{
i{
color: $theme-color;
font-size: 12px;
}
}
}
}
.min-contact-form{
padding: 30px 20px 10px;
background-color: #464545;
@include box-shadow(0px 0px 30px 0px rgba($gray-base, 0.35));
@include media(tablet) {
padding: 38px;
}
ul{
margin-bottom: 0px;
li{
font-size: 18px;
font-weight: $font-weight-medium;
color: $white;
margin-bottom: 24px;
position: relative;
@include rtl-padding-left(80px);
@include media(desktop) {
margin-bottom: 54px;
}
&:before{
position: absolute;
top: 0px;
content: "";
background-color: transparent;
background-position: 0 0;
background-repeat: no-repeat;
@include background-size(cover);
@include rtl-left(0);
}
&:last-child{
margin-bottom: 30px;
@include media(desktop) {
margin-bottom: 48px;
}
}
a{
color: #949494;
@include hover-focus-active() {
color: $theme-color;
}
}
&.mail-icon{
> *{
display: block;
}
&:before{
background-image: url("../images/icon-mail.png");
@include size(50px,45px);
}
}
&.tel-icon{
font-size: 18px;
padding-top: 6px;
font-family: $headings-font-family;
@include media(tablet) {
padding-top: 0
}
@include media(tablet) {
font-size: 22px;
padding-bottom: 0px;
}
&:before{
background-image: url("../images/icon-tel.png");
@include size(61px,46px);
}
a{
color: $white;
@include hover-focus-active() {
color: $theme-color;
}
}
}
}
}
.title{
margin: 0px;
font-size: 20px;
font-weight: $font-weight-medium;
color: $white;
position: relative;
padding-bottom: 18px;
margin-bottom: 30px;
@include rtl-text-align-left();
@include media(tablet) {
margin-bottom: 50px;
}
@include media(desktop) {
text-align: center;
}
&:after{
content: "";
bottom: 0;
left: 0px;
right: 0px;
margin: 0;
position: absolute;
background-color: $theme-color;
@include size(49px,1px);
@include media(desktop) {
margin: 0 auto;
}
}
}
}
.apus_login_register_form{
background-color: $white;
max-width: 550px;
margin: 0 auto;
position: relative;
@include border-radius(10px);
.title-account{
text-align: center;
margin: 0px;
font-size: 24px;
letter-spacing: 0;
}
.bottom-login{
padding: 0px 20px 20px 20px;
}
.form-acount,
.form-register{
outline: none;
padding: 25px 15px 15px;
@include media(tablet) {
padding: 40px 40px 20px 40px;
}
@include hover-focus-active() {
outline: none;
}
.form-control{
height: 55px;
}
.btn{
padding: 19px 34px;
font-size: 16px;
line-height: 1;
letter-spacing: 0;
text-transform: uppercase;
font-family: $headings-font-family;
font-weight: $headings-font-weight;
@include transition($linear);
@include hover-focus-active() {
color: $headings-color;
border-color: $theme-color;
background-color: $theme-color;
}
}
}
.action-login{
padding-bottom: 15px;
.form-group{
margin: 0px;
label{
display: block;
position: relative;
cursor: pointer;
margin-bottom: 0px;
@include rtl-padding-left(25px);
@include user-select(none);
input{
position: absolute;
cursor: pointer;
@include opacity(0);
@include square(0);
&:checked ~ span {
&:after {
display: block;
}
&:before{
border-color: $theme-color;
}
}
}
span{
position: relative;
&:before{
content: "";
top: 2px;
position: absolute;
border: 1px solid $border-color;
background-color: transparent;
@include rtl-left(-25px);
@include square(16px);
@include transition($linear);
}
&:after {
content: "";
top: 4px;
display: none;
position: absolute;
border: solid $text-color;
border-width: 0 2px 2px 0;
@include rotate(45deg);
@include rtl-left(-19px);
@include size(5px,10px);
}
}
}
}
}
.ali-right{
@include rtl-text-align-right();
p{
margin: 0px;
}
}
.clear-submit{
margin-bottom: 0;
}
.nav{
border-bottom: 0px;
margin-bottom: 40px;
@include clearfix();
li{
@include rtl-float-left();
text-align: center;
width: 50%;
margin: 0px;
padding: 0px;
border: none;
@include opacity(1);
a{
margin: 0px;
border: none;
outline: none;
padding: 12px;
background-color: lighten($gray-base, 88%);
color: $headings-color;
font-weight: $font-weight-medium;
font-size: 18px;
@include border-radius(0);
@include transition($linear);
@include hover-focus-active() {
border: none;
background-color: transparent;
}
}
&.active{
a{
pointer-events: none;
@include opacity(1);
background-color: transparent;
}
}
&:first-child{
a{
@include border-radius-separate(10px,0, 0, 0);
}
}
&:last-child{
a{
@include border-radius-separate(0, 10px, 0, 0);
}
}
}
}
.mfp-close{
top: -25px;
text-indent: -99999px;
background-color: $theme-color;
display: block;
position: absolute;
overflow: hidden;
@include opacity(1);
@include rtl-right(-25px);
@include background-size(cover);
@include square(50px);
@include border-radius(100%);
&:before{
content: '';
background: url('data:image/svg+xml;utf8,<svg height="329pt" viewBox="0 0 329.26933 329" width="329pt" xmlns="http://www.w3.org/2000/svg"><path style="fill: white" d="m194.800781 164.769531 128.210938-128.214843c8.34375-8.339844 8.34375-21.824219 0-30.164063-8.339844-8.339844-21.824219-8.339844-30.164063 0l-128.214844 128.214844-128.210937-128.214844c-8.34375-8.339844-21.824219-8.339844-30.164063 0-8.34375 8.339844-8.34375 21.824219 0 30.164063l128.210938 128.214843-128.210938 128.214844c-8.34375 8.339844-8.34375 21.824219 0 30.164063 4.15625 4.160156 9.621094 6.25 15.082032 6.25 5.460937 0 10.921875-2.089844 15.082031-6.25l128.210937-128.214844 128.214844 128.214844c4.160156 4.160156 9.621094 6.25 15.082032 6.25 5.460937 0 10.921874-2.089844 15.082031-6.25 8.34375-8.339844 8.34375-21.824219 0-30.164063zm0 0"/></svg>');
background-repeat: no-repeat;
background-position: center center;
@include background-size(cover);
@include square(16px);
@include center-box(absolute);
}
}
}
div.wpcf7-response-output{
padding: 10px 30px;
border-color: $brand-danger;
background-color: $brand-danger;
color: darken($brand-danger, 30%);
margin: 10px 0 0 0;
}
.btn-width-icon{
.elementor-button-link{
.elementor-button-icon{
color: $theme-color;
font-size: 12px;
}
}
}
.page-form-contact{
> div{
margin-bottom: 30px;
&:last-child{
margin-bottom: 0;
margin-top: 20px;
}
}
.button, button,
input[type="button"],
input[type="reset"],
input[type="submit"]{
padding: 9px 30px;
font-size: 14px;
@include media(desktop) {
font-size: 16px;
padding: 9px 40px;
}
}
textarea{
max-height: 295px;
}
}