/*
Theme Name:     moneclicks Child Theme
Template:       moneclicks
Version:        9.2.5
*/

/* Place all your CSS modifications below */
h1,h2,h3,h4,h5,h6{color: #0e80d4;}
p {color: #444;}
body {color: #4a5b8e;}


/* ------ header ------- */

.cp-202405_pc-add{ height: 75px; background-image: url(../image/ad-pc_bg-1.png);background-repeat: no-repeat;background-position: center top;background-size: 75%; background-color: #49c8f0; justify-content: flex-end; align-items: center; flex-direction: column;}


.g1-bin .snax-button-create {
margin-top: 0px;
margin-bottom: 0px;
}

.register {
background-color: #079e34!important;
}

.g1-link　{
color: #30b570!important;
}

.single-post .g1-hb-row-a .g1-row-background {
background-color: transparent!important;
}

.category-news .g1-hb-row-a .g1-row-background {
background-color: transparent!important;
}

.category-news .page-header {
display: none!important;
}

.page-header > .g1-row-background {
background-color: transparent;
}

.wpb_single_image .vc_box_border.vc_box_border_black, .wpb_single_image .vc_box_border_circle.vc_box_border_black {
background-color: #fff!important;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)!important;
}

.herobg {
background-image: url(../image/moneclicks-header-bkgd-new.png),
linear-gradient(to right, #0070ba, #1546a0);
background-repeat: repeat-x!important;
background-position: center 70%!important;
}

.dropmc{filter: drop-shadow(0px 0px 10px #1546a0);}

.g1-dropable .menu-item-g1-standard .sub-menu {
    border-radius: 10px;
}

/* ------ registration form ------- */
.reg_frm {
text-align: left;
font-size: 110%;
font-weight: bold;
background-color: #19bac8;
border-radius: 7px;
padding: 20px 16px 20px 16px;
}

.header__user {
/*padding: 0 20px 0 0 !important;*/
}
.header__user .header__id {
margin: 0 0 10px 0;
}

.header__pass {
margin: 0 0 15px 0;
}

.header__user input {
padding: 6px 10px !important;
outline: none !important;
border-radius: 2px !important;
font-family: Arial, Helvetica, sans-serif !important;
-webkit-font-smoothing: antialiased !important;
font-size: 15px !important;
margin: 0 0 5px 0 !important;
width: 100% !important;
max-width: 100% !important;
color: #999 !important;
line-height: 1.1 !important;
border: 1px solid #dddddd !important;
background: #ffffff !important;
-webkit-transition: all 0.2s !important;
-moz-transition: all 0.2s !important;
-ms-transition: all 0.2s !important;
-o-transition: all 0.2s !important;
transition: all 0.2s !important;
}

.fa-check-circle:before {
font-size: 24px;
color: #31ed46;
vertical-align: middle;
padding-right: 8px;
}

.points{
margin-bottom:8px;
font-weight:700;
color:#fff;
}

.vc_btn3-container.vc_btn3-center .vc_btn3-block.vc_btn3-icon-left:not(.vc_btn3-o-empty) .vc_btn3-icon {
margin-top: 3px !important;
}

.header__pass_ttl {
font-size: 11px;
margin: 0 3px 0 0;
}

.header__submit {
margin: 0 0 0 0;
}

.ccinput {
clear: both;
height: 0px;
}

.riyuu {
font-weight: bold;
}

.archive-title{margin-top:20px;}


/* ------ video ------- */
.videocontainer {
width: 800px;
max-width: 100%;
margin: 0 auto;
border: 5px solid #eee;
margin-bottom: 70px;
}

.videowrapper {
float: none;
clear: both;
width: 100%;
position: relative;
padding-bottom: 56.25%;
padding-top: 0px;
height: 0;
text-align: center;
}

.videowrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


/* ------ blog news FP  ------- */
.businessnews .vc_gitem_row .vc_gitem-col {
min-height: 230px;
background-color: #fff!important;
}

.vc_btn3-container.vc_btn3-left {
display: none!important;
}

.icn-new {
background-color: #ff0000;
padding: 0 2px 2px;
margin-right: 5px;
font-size: 11px;
font-weight: 600;
color: #fff;
}

.vc_gitem-zone-img {
height: 220px!important;
}

.vc_gitem-post-data {
margin-bottom: 15px;
margin-top: 15px;
}
/* ------ button ------- */


.vc_btn3.vc_btn3-size-lg {
    font-weight: 700;
}

/* ------ merchant flow chart ------- */

.tourokuttl {
width: 96%;
}

.se-content {
font-size: 25px;
position: relative;
display: inline-block;
padding: 8px 30px 9px 30px;
/* height: 40px; */
width: 73%;
text-align: center;
font-weight: bold;
color: #ffffff;
}

.se-content:after {
content: '';
width: 0;
height: 0;
border-top: 20px solid transparent;
border-bottom: 17px solid transparent;
border-left: 30px solid #FF6B39;
position: absolute;
right: 41px;
top: 8px;
}

.se-content:before {
content: '';
width: 0;
height: 0;
border-top: 20px solid transparent;
border-bottom: 17px solid transparent;
border-right: 30px solid #FF6B39;
position: absolute;
left: 0px;
top: 8px;
}

.tourokuttl2 {
width: 23%;
}

.step {
list-style-type: none;
display: table;
width: 96%;
padding: 0;
margin: 0 auto;
overflow: hidden;
}

.step li.is-current {
background: #FDF235;
font-weight: bold;
color: #4a4a4a;
}

.step li {
display: table-cell;
position: relative;
background: #00BFCA;
/* padding: 1em 0.5em 1em 2em; */
padding: 40px 0.5em 40px 2em;
color: #fff;
font-weight: bold;
width: 23%;
}


.step .stepp1 {
font-size: 27px;
}

.step .stepp2 {
text-align: left;
font-weight: normal;
width: 90%;
margin: 0 auto;
padding: 0 0 0 6%;
line-height: 135%;
}

.step li.is-current:after {
border-color: transparent transparent transparent #FDF235;
}
.step li:after {
top: -15px;
right: -1.7em;
border-style: solid;
border-color: transparent transparent transparent #00BFCA;
border-width: 140px 0 140px 2em;
z-index: 10;
}

.step li:before, .step li:after {
content: "";
position: absolute;
width: 0;
height: 0;
margin: auto;
}


.page-title {
display:none!important;
}


.se-content p {
background: #FF6B39;
width: 95%;
padding: 0;
}

@media screen and (max-width: 1900px) and (min-width: 768px)
merchants:816.step2 {
display: none;
}

/* ------testimonals -------*/
.testimonals-box{
border-radius: 2px;
background-color: rgb(255, 255, 255);
box-shadow: 0px 8px 40px 0px rgba(131, 133, 247, 0.2);
height: 400px;
margin: 40px 0px;
}

.testimonial-spacer{
color:#9be6c6;
}

.testimonial-img{
margin-top: -90px;
}


/* ------ waves ------- */

.diagonal-purple{
background-image: url(../image/background-angle-purple.png) !important;
background-position: 0px 20px !important;
background-repeat: no-repeat !important;
}

.svg_bg {
transform: rotate(180deg);
}
.elementor-shape-fill {
fill: #fff;}

.section_bg {
background-color: transparent;
background-image: linear-gradient(180deg,#fff 0%,#f4f8fd 100%);
padding-bottom: 0;
}

.section-grow {
background-size: contain;
background-repeat: no-repeat;
background-position: 0px 20px;
}

.merchant-flow{
background-size: contain;
background-repeat: no-repeat;
background-position: 0px 0px;
}

.section_bg2 svg {
transform: translateX(-50%) rotateY(180deg);
display: block;
width: calc(100% + 1.3px);
position: relative;
left: 50%;
background-color: transparent;
background-image: linear-gradient(180deg,#fff 0%,#f4f8fd 100%);
padding-bottom: 0;
}

.section_bg2-fill {
transform: rotateY(0deg);
transform-origin: center;
fill: #fff;
}

.purple-growth {
background: url(../image/moneclicks_background_wave.png) center top no-repeat !important;
background-size: cover!important;
}

/* ==========================================================================
  16.  CONTACTS
  =========================================================================== */
  
  
textarea:focus::-webkit-input-placeholder { color:transparent; }
textarea:focus:-moz-placeholder { color:transparent; } /* Firefox 18- */
textarea:focus::-moz-placeholder { color:transparent; } /* Firefox 19+ */
textarea:focus:-ms-input-placeholder { color:transparent; } /* oldIE ;) */

#contacts-1.bg-lightgrey {
  background-image: url(https://www.moneclicks.com/wp-content/themes/images/dotted-map.png);
}

#contacts-2 .section-title {
  margin-bottom: 35px;
}

#contacts-2 .form-holder {
  margin-right: 8%;
  margin-left: 8%;
}

.contacts-section .form-holder {
  position: relative;
}

#contacts-map {
  padding-top: 180px;
}

#contacts-map .section-title {
  margin-bottom: 80px;
}

/*------------------------------------------*/
/*    CONTACTS TYPOGRAPHY
/*------------------------------------------*/ 

#contacts-2 .quick-form p { 
  padding: 0 15%;
  margin-top: 20px;
  margin-bottom: 0;
}

#contacts-2 .quick-form p a { 
  font-weight: 600;
  text-decoration: underline;
}

#contacts-2 .quick-form p a:hover { 
  color: #000;
}

/*------------------------------------------*/
/*    Contact Box
/*------------------------------------------*/

#contacts-3 .contact-box {
  margin-bottom: 30px;
}

#contacts-3 .contact-box h5 {
  margin-top: 0;
  margin-bottom: 5px;
}

#contacts-3 .contact-box p {
  margin-bottom: 0;
}

/*------------------------------------------*/
/*    Contact Form Input
/*------------------------------------------*/

.contact-form .form-control,
#contacts-2 .quick-form .form-control {
  height: 52px;
  box-shadow: 0;
  color: #444;
  font-size: 1rem;
  font-weight: 300;
  padding: 0 20px;
  margin-bottom: 25px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.contact-form .form-control {
  background-color: #f9f9f9;
  border: 1px solid #eee;
 width: 100%;
}

#contacts-2 .quick-form .form-control {
  height: 52px;
  background-color: #fff;
  border: 1px solid #ddd;
  margin-bottom: 15px;
}

.contact-form .custom-select {
  display: inline-block;
  background-color: #f9f9f9;
  border: 1px solid #eee;
  width: 100%;
  height: 56px;
  line-height: 1;
  color: #444;
  font-size: 1rem;
  font-weight: 300;
  padding: 0 15px;
  margin-bottom: 25px;
  box-shadow: 0;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.bg-lightgrey .contact-form .form-control,
.bg-lightgrey .contact-form .custom-select {
  background-color: #fff;
  border: 1px solid #ccc;
}

/*------------------------------------------*/
/*    Contact Form Textarea
/*------------------------------------------*/

.contact-form textarea { min-height: 220px; }
.contact-form textarea.form-control { 
  padding: 20px;
}

/*------------------------------------------*/
/*    Contact Form Placeholder
/*------------------------------------------*/

.contact-form .form-control::-moz-placeholder { color: #555; } 
.contact-form .form-control:-ms-input-placeholder { color: #555; }
.contact-form .form-control::-webkit-input-placeholder { color: #555; }

/*------------------------------------------*/
/*    Contact Form Input Focus
/*------------------------------------------*/

#contacts-2 .quick-form .form-control:focus,
.contact-form .form-control:focus,
.contact-form .custom-select:focus {
  outline: 0px none;
  box-shadow: none;
  border-color: #389bf2;
  background-color: #fff;
}

/*------------------------------------------*/
/*    Register Form Button
/*------------------------------------------*/

#contacts-2 .quick-form .btn {
  width: 100%;
  height: 54px;
  font-weight: 600;
}


/*------------------------------------------*/
/*  Contact Form Input
/*------------------------------------------*/

.contact-form .form-control,
.register-form .form-control {
  height: 54px;
  background-color: #fff;
  border: 1px solid #ddd;
  box-shadow: 0 0 0 0;
  color: #444;
  font-size: 1rem;
  font-weight: 300;
  padding: 0 15px;
  margin-bottom: 22px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-transition: all 450ms ease-in-out;
  -moz-transition: all 450ms ease-in-out;
  -o-transition: all 450ms ease-in-out;
  -ms-transition: all 450ms ease-in-out;
  transition: all 450ms ease-in-out;
}

.register-form .form-control {
  height: 58px;
  border: 1px solid #ddd;
  margin-bottom: 15px;
}

.contact-form .custom-select {
  display: inline-block;
  width: 100%;
  height: 54px;
  line-height: 1;
  color: #444;
  border: 1px solid #ddd;
  font-size: 1rem;
  font-weight: 300;
  padding: 0 15px;
  margin-bottom: 22px;
  box-shadow: 0;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-transition: all 450ms ease-in-out;
  -moz-transition: all 450ms ease-in-out;
  -o-transition: all 450ms ease-in-out;
  -ms-transition: all 450ms ease-in-out;
  transition: all 450ms ease-in-out;
}

.bg-wave .contact-form .form-control,
.bg-lightgrey .contact-form .form-control,
.bg-lightgrey .register-form .form-control,
.bg-wave .contact-form .custom-select,
.bg-lightgrey .contact-form .custom-select {
  border: 1px solid #f5f5f5;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

/*------------------------------------------*/
/*  Contact Form Textarea
/*------------------------------------------*/

.contact-form textarea { min-height: 220px; }
.contact-form textarea.form-control { 
  padding: 20px 15px;
}

/*------------------------------------------*/
/*  Contact Form Placeholder
/*------------------------------------------*/

.contact-form .form-control::-moz-placeholder { color: #555; } 
.contact-form .form-control:-ms-input-placeholder { color: #555; }
.contact-form .form-control::-webkit-input-placeholder { color: #555; }

/*------------------------------------------*/
/*  Contact Form Input Focus
/*------------------------------------------*/

.contact-form .form-control:focus,
.contact-form .custom-select:focus {
  outline: 0px none;
  box-shadow: none;
  border-color: #ccc;
}

/*------------------------------------------*/
/*    Register Form Button
/*------------------------------------------*/
.register-form .btn {
  width: 100%;
  height: 58px;
  font-weight: 600;
}

/*------------------------------------------*/
/*  Contact Form Message
/*------------------------------------------*/

.contacts-section label.error {
  color: #e74c3c;
  font-size: 14px;
  font-weight: 300;
  margin-bottom: 20px;
}

.contact-form-msg {
  width: 100%!important;
  display: block;
  text-align: center;
}

.contacts-section .sending-msg {
  margin-top: 18px;
}

.bg-blue .sending-msg .loading,
.bg-darkblue .sending-msg .loading,
.bg-green .sending-msg .loading,
.bg-purple .sending-msg .loading {
  color:  #ffc30d;
}



/*------------------------------------------*/
/*    Contact Form Message
/*------------------------------------------*/

#contacts-2 .quick-form label.error,
.contact-form label.error {
  color: #f6412d;
  font-size: 1rem;
  line-height: 1;
  margin-bottom: 20px;
  margin-left: 35px;
}

#contacts-2 .quick-form-msg,
.contact-form-msg {
  position: absolute;
  bottom: 10px;
  left: 10px;
}

#contacts-2 .quick-form-msg .error,
.contact-form-msg .error,
.register-form-msg .loading,
.contact-form-msg .loading {
  color: #45afff;
  font-size: 1rem;
  line-height: 1;
  font-weight: 600;
}

#contacts-2 .quick-form-msg .error,
.contact-form-msg .error {
  color: #f6412d;
}

/*------------------------------------------*/
/*  HERO FORM 
/*------------------------------------------*/

.hero-form { 
  background-color: #ffa200;
  padding: 45px 30px 40px;
  margin: 0 50px 0 20px;
  border: 1px solid #ffa200;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-box-shadow: 0 0 10px rgba(100, 100, 100, .15);
  -moz-box-shadow: 0 0 10px rgba(100, 100, 100, .15);
  box-shadow: 0 0 10px rgba(100, 100, 100, .15);
}

.hero-form .col-md-12 { 
  padding: 0; 
}

/*------------------------------------------*/
/*  Hero Form Text
/*------------------------------------------*/

.hero-form h4 { 
  line-height: 1;
  letter-spacing: -0.5px;
  margin-bottom: 30px;
}

/*------------------------------------------*/
/*  Hero Form Input
/*------------------------------------------*/

.hero-form .form-control {
  background-color: #fff;
  color: #333;
  height: 48px;
  font-size: 1rem;
  line-height: 1;
  font-weight: 300;
  padding: 4px 15px;
  margin-bottom: 15px;
  border: 1px solid #ddd;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px; 
  box-shadow: none; 
  -webkit-transition: all 400ms ease-in-out;
  -moz-transition: all 400ms ease-in-out;
  -o-transition: all 400ms ease-in-out;
  -ms-transition: all 400ms ease-in-out;
  transition: all 400ms ease-in-out;
}

/*------------------------------------------*/
/*  Hero Form Input Focus
/*------------------------------------------*/

.hero-form .form-control:focus {
  background-color: #f0f0f0;
  border-color: #ccc;
  outline: 0px none;
  box-shadow: none;
}

/*------------------------------------------*/
/*  Hero Form Button
/*------------------------------------------*/

.hero-form .btn.submit {
  display: block;
  width: 100%;
  height: 50px;
  margin-top: 10px;
}

/*------------------------------------------*/
/*  Hero Form Message
/*------------------------------------------*/

.hero-section label.error {
  color: #e74c3c;
  font-size: 14px;
  font-weight: 300;
  margin-bottom: 20px;
}

.sending-msg, 
.hero-form-msg {
  width: 100%!important;
  display: block;
  text-align: center;
}

.sending-msg {
  margin-top: 12px;
}

.sending-msg .loading {
  color: #16a2e0;
  font-size: 15px;
  font-family: 'Noto Sans TC', sans-serif;
  font-weight: 700;
}

.sending-msg .error {
  color: #e74c3c;
  font-size: 14px;
  font-weight: 300;
  margin-bottom: 20px;
}

/*------------------------------------------*/
/*    HERO NEWSLETTER FORM
/*------------------------------------------*/

#hero-2 .hero-newsletter-form {
  margin: 25px 10% 0;
}

#hero-4 .hero-newsletter-form {
  margin-top: 35px;
  margin-right: 10px;
}

#hero-9 .hero-newsletter-form {
  margin-top: 35px;
  margin-right: 10px;
}

#hero-10 .hero-newsletter-form {
  margin: 35px 10% 0;
}

/*------------------------------------------*/
/*  Hero Newsletter Form Input
/*------------------------------------------*/

.hero-newsletter-form .form-control {
  height: 50px;
  background-color: #fff;
  border: 1px solid #ccc;
  color: #666;
  font-size: 1.05rem;
  font-weight: 300;
  padding: 0 15px;
  box-shadow: none;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -o-border-radius: 6px;
  border-radius: 6px; 
  -webkit-transition: all 400ms ease-in-out;
  -moz-transition: all 400ms ease-in-out;
  -o-transition: all 400ms ease-in-out;
  -ms-transition: all 400ms ease-in-out;
  transition: all 400ms ease-in-out;  
}

.hero-newsletter-form .input-group > .form-control:not(:last-child) {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

/*------------------------------------------*/
/*  Hero Newsletter Form Placeholder
/*------------------------------------------*/

.hero-newsletter-form .form-control::-moz-placeholder { color: #999; } 
.hero-newsletter-form .form-control:-ms-input-placeholder { color: #999; }
.hero-newsletter-form .form-control::-webkit-input-placeholder { color: #999; }

/*------------------------------------------*/
/*   Hero Newsletter Form Focus
/*------------------------------------------*/

.hero-newsletter-form .form-control:focus {
  background-color: #f0f0f0;
  border-color: #ccc;
  outline: 0;
  box-shadow: none;
}

#hero-2 .hero-newsletter-form .form-control:focus {
  background-color: #fafafa;
  border-color: #bbb;
}

/*------------------------------------------*/
/*  Hero Newsletter Form Button
/*------------------------------------------*/

.hero-newsletter-form .btn {
  width: 100%; 
  height: 50px;
  margin-left: 5px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -o-border-radius: 6px;
  border-radius: 6px;
}


/* ------ footer ------- */
.g1-prefooter .widget {
margin-bottom: 10px!important;
}

.g1-footer-social{
float:right!important;}

ul#g1-social-icons-3{
margin-bottom:10px!important;}

.g1-footer-text {
margin-top: 6px!important;
}

h2.g1-delta.g1-delta-2nd.widgettitle span{
color: #a5cedf;
font-size: 14px;
font-weight: 700;}

.g1-prefooter a{
color: #72adc5;
font-size: 14px;}

.g1-prefooter a:hover{
color: #a5cedf;
}

.g1-prefooter > .g1-row-background, .g1-prefooter .g1-current-background {
    background-image: linear-gradient(0deg,#0070ba,#254ea6)!important;
}

.g1-prefooter{
padding-bottom: 1rem;
padding-top: 0rem!important;}

.support_footer{
border-top: 1px solid #1672a6;
margin-top: 6px;
margin-right: 60px;
padding-top: 16px;
font-size: 12px;}


.mt-separator {
border-top-style: solid;
border-top-width: 1px;
border-top-color: #133547;
width: 100%;
padding-bottom: 20px;
}

.footermascot{
 display: block;
    margin-left: auto;
    margin-right: auto;
    width: 1230px;
}

.tophero{
 display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

/* #footerwave svg{
display: block;
width: calc(100% + 1.3px);
position: relative;
transform: rotate(180deg);
height:300px;
width:100%;
}

 #footerwave{
background-image: url(https://www.moneclicks.com/wp-content/uploads/2022/06/starsmt.png);
background-position: center center;

} 

.fw-shape-fill {
    fill: #e1f6fd;
}*/

#overlay {
  position: relative; /* Sit on top of the page content */
  width: 100%; /* Full width (cover the whole page) */
  line-height:0px!important;
  bottom: -1px;
}

#topoverlay {
  position: relative; /* Sit on top of the page content */
  width: 100%; /* Full width (cover the whole page) */
}