.notify-wrapper {
position: fixed;
opacity: 0;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 9999;
background-color: rgba(0, 0, 0, .5);
-webkit-transition: .3s;
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
.notify-wrapper * {
box-sizing: border-box;
}
.notify-wrapper .notify-window {
-webkit-transform: translate3d(0, 50px, 0);
-webkit-transition: .3s cubic-bezier(0, 0, 0, 1);
width: 300px;
border-radius: .25em;
overflow: hidden;
font-size: .9em;
user-select: none;
box-shadow: 0 0.25em 1em 0 rgba(0, 0, 0, .3);
}
.notify-wrapper .notify-window h3 {
margin: 0;
padding: 1em 1em;
font-size: 1em;
font-weight: normal;
line-height: 1.5em;
}
.notify-wrapper .notify-window h3 i {
font-size: 1.5em;
position: relative;
top: .08em;
margin-right: .25em;
}
.notify-wrapper .notify-window p {
padding: 1em 1em 2em;
margin: 0;
background-color: #ffffff;
color: #000000;
}
.notify-wrapper .notify-window .buttons {
padding: .75em 1em;
background-color: #f3f3f3;
text-align: center;
}
.notify-wrapper .notify-window .buttons button {
margin: 0 .5em;
padding: .5em 2em;
border-radius: .25em;
font-size: 1em;
border-width: 1px;
outline: 0;
}
.notify-wrapper .notify-window .buttons .ok {
background-image: linear-gradient(180deg, #ffffff, #e6e3e6 90%);
}
.notify-wrapper .notify-window .buttons .cancel {
color: #888888;
}
.notify-wrapper .notify h3 {
background-color: rgba(0, 0, 0, .5);
color: #ffffff;
text-align: center;
}
.notify-wrapper .alert h3 {
background-color: #cc6666;
color: #ffffff;
}
.notify-wrapper .confirm h3 {
background-color: #3366cc;
color: #ffffff;
}
.notify-wrapper .success h3 {
background-color: #1b926c;
color: #ffffff;
}
.notify-wrapper.show {
opacity: 1;
}
.notify-wrapper.show .notify-window {
-webkit-transform: translate3d(0, 0, 0);
}
.smallLoader {
display: none;
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 9999; background:#f9f9f9 url(//mentoren-verlag.de/wp-content/plugins/saferpay_woocommerce_gateway/assets/images/AjaxLoader.gif) center no-repeat;
}
.smallLoader {
display: none;
position: fixed;
background-color: #f9f9f9;
left: 0px;
top: 0px;
right: 0;
z-index: 9999;
width: 100%;
height: 100%;
opacity: 0.5;
}
.smallLoader:after { color: #6d6d6d; width: 30px;
height: 30px;
border-radius: 50%;
position: fixed;
left: 0;
right: 0;
top: 45%;
bottom: 0;
margin: 60px auto;
z-index: 99999; -webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0); animation: fa-spin .75s linear infinite;
font-size: 30px;
font-family: "Font Awesome 5 Free";
line-height: 30px;
}
@-webkit-keyframes load4 {
0%,
100% {
box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
}
12.5% {
box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
}
25% {
box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
}
37.5% {
box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
}
50% {
box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
}
62.5% {
box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
}
75% {
box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
}
87.5% {
box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
}
}
@keyframes load4 {
0%,
100% {
box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
}
12.5% {
box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
}
25% {
box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
}
37.5% {
box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
}
50% {
box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
}
62.5% {
box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
}
75% {
box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
}
87.5% {
box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
}
}
.sfwp-iframe {
width: 100% !important;
border: 0 !important;
}
iframe {
overflow: hidden;
} .ajax-loading {
display: none;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
z-index: 999;
}
.ajax-loading>i {
animation: ajax-loading 1s ease-in-out infinite;
background-color: #4e4e4e;
border-radius: 4px;
display: inline-block;
height: 18px;
margin-right: 2px;
width: 4px
}
.ajax-loading>i:nth-child(1) {
animation-delay: 0
}
.ajax-loading>i:nth-child(2) {
animation-delay: 90ms
}
.ajax-loading>i:nth-child(3) {
animation-delay: .18s
}
.ajax-loading>i:nth-child(4) {
animation-delay: .27s
}
@keyframes ajax-loading {
0% {
transform: scale(1)
}
20% {
transform: scale(1, 2.2)
}
40% {
transform: scale(1)
}
}
.alert-danger {
color: #721c24;
background-color: #f8d7da;
border-color: #f5c6cb;
position: relative;
padding: .75rem 1.25rem;
margin-bottom: 1rem;
border: 1px solid transparent;
border-radius: .25rem;
}
#iframe-wrap .alert-danger {
padding: 10px;
display: flex;
text-align: left;
}
#iframe-wrap .alert-danger svg.alert-triangle {
margin-right: 10px;
width: 25px;
height: 25px;
}
#iframe-wrap .alert-danger p{
font-size: 14px;
}
.alert-danger p {
padding: 0;
margin: 0;
display: inline-block;
}
.alert-danger svg.alert-triangle {
display: inline-block;
vertical-align: text-bottom;
margin-right: 5px;
width: 20px;
height: 20px;
}   .auForm select {
margin: 0 10px 25px 0;
min-width: 120px;
height: 30px;
border-radius: 5px;
}
.auWrap {
display: none;
}
.auWrap p {
font-weight: 600;
}
.text-center {
text-align: center;
}
.addCard {
margin-top: 30px;
}
@media (min-width: 1200px) {
.woocommerce-MyAccount-content table td {
min-width: 140px;
}
}
@media (max-width: 768px) {
#saferpay-div {
padding: 15px 0px !important;
}
.sample-two .form-group label {
padding: 8px 6px 0;
line-height: 20px;
}
.sample-one .row:last-child iframe {
width: 50% !important;
}
#payment .payment_methods li .payment_box,
#payment .payment_methods>li .payment_box,
#payment .place-order {
padding: 0 !important;
}
.sample-four-input-wrap {
flex-wrap: wrap;
}
.sample-four-input-wrap .form-group:nth-child(1) {
width: 100%;
}
.sample-four-input-wrap .form-group:nth-child(2),
.sample-four-input-wrap .form-group:nth-child(3) {
width: 48%;
}
.sample-three #wrapper {
display: block !important;
height: auto !important;
}
#saferpay-div.sample-one .row:last-child iframe {
width: 40% !important;
}
#saferpay-div.sample-two .form-group label {
width: 25%;
padding: 7px 5px 0;
word-break: break-word;
}
#saferpay-div.sample-two .form-group .col-sm-8 {
width: 75%;
}
} @media only screen and (min-width: 769px) {
.wc_payment_method.payment_method_spgw_credit_card .payment_method_spgw_credit_card #wrapper .col-7 {
width: 58%;
}
.wc_payment_method.payment_method_spgw_credit_card .payment_method_spgw_credit_card #wrapper .col-3 {
width: 25%;
}
.wc_payment_method.payment_method_spgw_credit_card .payment_method_spgw_credit_card #wrapper .col-2 {
width: 16%;
}
}
@media(min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
#saferpay-div.sample-three #wrapper iframe#fields-card-number {
width: 670px !important;
}
.wc_payment_method.payment_method_spgw_credit_card .payment_method_spgw_credit_card #wrapper .col-2 {
width: 20%;
}
#saferpay-div.sample-two {
padding: 36px 10px;
}
}
.input-group .logo {
right: 2em;
}
.sample-three #wrapper {
position: relative;
margin-bottom: 40px;
}
.sample-three #card-number-help{
position: absolute;
bottom: auto;
top: 40px;
font-size: 14px;
}
.sample-three #expiration-help {
position: absolute;
bottom: auto;
top: 40px;
font-size: 14px;
}
.sample-three #cvc-help {
position: absolute;
bottom: auto;
top: 40px;
font-size: 14px;
}
#expiration-help,
#cvc-help,
#card-number-help,
#holder-name-help{
font-size: 14px;
line-height: 16px;
color: #e2401c;
}
.sample-one #expiration-help{
position: absolute;
bottom: 0;
font-size: 14px;
left: 22px;
}
.payment_box.payment_method_spgw_credit_card input#fields-card-number {
padding-left: .75rem;
}
#saferpay-div.sample-two input{
width: 100%;
border: solid 1px #CFCFCF;
border-radius: 8px;
padding-right: calc(1.5em + .75rem);
padding: .375rem .75rem;
max-width: 100%;
box-shadow: none;
max-width: 100%;
height: 100%;
}
#saferpay-div.sample-three input{
color: #fff;
padding-right: calc(1.5em + .75rem);
padding: .375rem .75rem;
font-size: 1rem;
letter-spacing: normal;
word-spacing: normal;
text-transform: none;
background: transparent;
box-shadow: none;
max-width: 100%;
height: 100%;
}
#saferpay-div.sample-three input::-webkit-input-placeholder { color: #fff;
font-size: 19px;
opacity: 0.5;
}
#saferpay-div.sample-three input:-ms-input-placeholder { color: #fff;
font-size: 19px;
opacity: 0.5;
}
#saferpay-div.sample-three input::placeholder {
color: #fff;
font-size: 19px;
opacity: 0.5;
}
#saferpay-div.sample-four input{
display: block;
width: 100%;
height: 100%!important;
padding: .375rem .75rem;
font-size: 1rem;
color: #495057;
background-clip: padding-box;
border: 1px solid #ced4da;
border-radius: .25rem;
background-color: #fff;
padding-left: .75rem;
}
#saferpay-div.sample-one input{
display: block;
width: 100%;
height: 100%!important;
padding: .375rem .75rem;
font-size: 1rem;
color: #495057;
background-clip: padding-box;
border-bottom: 1px solid #ced4da;
border-radius: 0;
background-color: #fff;
padding-left: .75rem;
}
#saferpay-div.sample-four input::-webkit-input-placeholder,
#saferpay-div.sample-one input::-webkit-input-placeholder,
#saferpay-div.sample-two input::-webkit-input-placeholder { color: #6d6d6d;
font-size: 18px;
}
#saferpay-div.sample-four input::-ms-input-placeholder,
#saferpay-div.sample-one input::-ms-input-placeholder,
#saferpay-div.sample-two input::-ms-input-placeholder { color: #6d6d6d;
font-size: 18px;
}
#saferpay-div.sample-four input::placeholder,
#saferpay-div.sample-one input::placeholder,
#saferpay-div.sample-two input::placeholder {
color: #6d6d6d;
font-size: 18px;
}
.sample-three #wrapper .col-3{
position: relative;
}
.woocommerce-MyAccount-content .sample-one .row:last-child {
position: relative;
}
.woocommerce-MyAccount-content .sample-one #expiration-help {
position: absolute;
bottom: -16px;
font-size: 14px;
left: 0;
}   .sfwp-popup .ui-widget-content {
background: #fff !important;
color: #333333;
border: none !important;
border-radius: 0 !important; 
}
.sfwp-popup .ui-widget-header {
border: none !important;
background: none !important;
font-weight: normal;
color: inherit !important;
border-radius: 0 !important;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
border: none !important;
background: #fff !important;
font-weight: normal;
color: inherit !important;
border-radius: 0 !important;
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
border: none !important;
font-weight: bold;
color: inherit !important;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
float: none !important;
}
@media only screen and (max-width: 812px) and (min-width: 768px) and (orientation: landscape) {
.sample-three #card-number-help {
bottom: auto;
top: 40px;
}
.sample-three #expiration-help {
bottom: auto;
top: 40px;
}
.sample-three #wrapper{
margin-bottom: 35px;
}
}
@media only screen and (max-width: 768px) {
.sample-three #wrapper .col-7.px-0,
.sample-three #wrapper .col-3.px-0,
.sample-three #wrapper .col-2.px-0{
position: relative;
margin-bottom: 15px;
}
.sample-three #card-number-help,
.sample-three #expiration-help,
.sample-three #cvc-help{
position: absolute;
bottom: -15px;
font-size: 14px;
line-height: 16px;
left: 12px;
top: auto;
}
.sample-three #wrapper {
padding: 10px 0;
}
.sample-one #expiration-help {
position: absolute;
bottom: -8px;
font-size: 14px;
left: 0;
}
.sample-one #expiration-help {
bottom: 1px;
}
section.woocommerce-order-details{
overflow-x: auto;
}
table.order_details{
overflow-x: scroll;
}
}
.addCard {
margin-bottom: 30px;
}
.woocommerce-MyAccount-content{
overflow-x: auto;
}
@media (min-width: 1200px){
.woocommerce-MyAccount-content table td {
min-width: 0px;
}
}
#saferpay-div {
padding: 20px 0px !important;
}
.woocommerce-MyAccount-content #sfwp-cardtype{
border: 1px solid #cdcdcd;
background-color: #fff;
width: 15.5em;
max-width: 100%;
display: block;
text-decoration: none;
padding: 7px 7px 5px;
line-height: 1;
cursor: pointer;
padding-right: calc(10px + .7em + .7em);
font-size: 14px;
}
select:focus-visible{
outline-color: #96588a;
}