@charset "UTF-8";/*!* nmoban102 外贸牛 NO.102 模板* Copyright © 2022 waimaoniu* @link:https://www.waimaoniu.com/* @author:lzx* @version:1.0.2*/
@font-face {
    font-family: "Poppins-Light";
    src: url("../fonts/Poppins-Light.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/*!- w102-sidebar begin -*/
.w102-sidebar .w102-sidebar-wrap {
    position: fixed;
    top: 50%;
    right: 0;
    z-index: 998;
}

.w102-sidebar .w102-sidebar-item {
    position: relative;
    height: 48px;
}

.w102-sidebar .w102-sidebar-item .wrap {
    position: absolute;
    top: 0;
    left: 0;
    transition: all .3s;
    transform: translateX(-48px);
}

.w102-sidebar .w102-sidebar-item .trigger {
    display: flex;
    color: #fff;
}

.w102-sidebar .w102-sidebar-item .trigger .icon {
    display: block;
    flex: none;
    width: 48px;
    height: 48px;
    line-height: 48px;
    text-align: center;
}

.w102-sidebar .w102-sidebar-item .trigger .icon i {
    font-size: 24px;
}

.w102-sidebar .w102-sidebar-item .trigger .text {
    display: block;
    font-size: 16px;
    line-height: 48px;
    padding: 0 16px 0 8px;
    white-space: nowrap;
    word-break: keep-all;
}

.w102-sidebar .w102-sidebar-item .popover {
    display: none;
    position: absolute;
    top: 0;
    right: 100%;
    padding: 0 12px 0 0;
}

.w102-sidebar .w102-sidebar-item .popover .popover-wrap {
    position: relative;
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 6px 20px 2px rgba(0,0,0,0.18);
    padding: 2px 0;
}

.w102-sidebar .w102-sidebar-item .popover .popover-wrap:after {
    display: block;
    content: '';
    position: absolute;
    z-index: 1;
    top: 20px;
    right: -8px;
    border-style: solid;
    border-width: 8px 0 8px 8px;
    border-color: transparent transparent transparent #fff;
}

.w102-sidebar .w102-sidebar-item .popover img {
    display: block;
    max-width: 128px;
    height: auto;
}

.w102-sidebar .w102-sidebar-item .popover ul li a {
    display: block;
    font-size: 14px;
    line-height: 40px;
    padding: 0 16px;
    min-width: 120px;
    white-space: nowrap;
    word-break: keep-all;
    color: #333;
}

.w102-sidebar .w102-sidebar-item .popover ul li a i {
    font-size: 20px;
    vertical-align: -.1em;
}

.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-whatsapp'] {
    color: #25D366;
}

.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-skype'] {
    color: #00AEF3;
}

.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-facebook'] {
    color: #235B9E;
}

.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-twitter'] {
    color: #00ACED;
}

.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-messenger'] {
    color: #008AFF;
}

.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-youtube'] {
    color: #FF0000;
}

.w102-sidebar .w102-sidebar-item .popover ul li a:hover {
    background-color: #fffcf4;
    color: #FEBC2A;
}

.w102-sidebar .w102-sidebar-item.top {
    display: none;
}

.w102-sidebar .w102-sidebar-item:hover .wrap {
    transform: translateX(-100%);
}

.w102-sidebar .w102-sidebar-item:hover .popover {
    display: block;
}

.w102-sidebar.scrolled .w102-sidebar-item.top {
    display: block;
}

@media screen and (max-width: 1280px) {
    .w102-sidebar .w102-sidebar-wrap {
        top:auto;
        bottom: 10%;
    }
}








/*!- w102-sidebar begin -*/.w102-sidebar .w102-sidebar-wrap {position:fixed;top:50%;right:0;z-index:998;}
.w102-sidebar .w102-sidebar-item {position:relative;height:48px;}
.w102-sidebar .w102-sidebar-item .wrap {position:absolute;top:0;left:0;transition:all .3s;transform:translateX(-48px);}
.w102-sidebar .w102-sidebar-item .trigger {display:flex;color: #fff !important;background-color: #055f57;}
.w102-sidebar .w102-sidebar-item .trigger .icon {display:block;flex:none;width:48px;height:48px;line-height:48px;text-align:center;/* background-color: #000000; */}
.w102-sidebar .w102-sidebar-item .trigger .icon i {font-size:24px;}
.w102-sidebar .w102-sidebar-item .trigger .text {display:block;font-size:16px;line-height:48px;padding:0 16px 0 8px;white-space:nowrap;word-break:keep-all;}
.w102-sidebar .w102-sidebar-item .popover {display:none;position:absolute;top:0;right:100%;padding:0 12px 0 0;}
.w102-sidebar .w102-sidebar-item .popover .popover-wrap {position:relative;background-color:#fff;border-radius:2px;box-shadow:0 6px 20px 2px rgba(0,0,0,0.18);padding:2px 0;}
.w102-sidebar .w102-sidebar-item .popover .popover-wrap:after {display:block;content:'';position:absolute;z-index:1;top:20px;right:-8px;border-style:solid;border-width:8px 0 8px 8px;border-color:transparent transparent transparent #fff;}
.w102-sidebar .w102-sidebar-item .popover img {display:block;max-width:128px;height:auto;}
.w102-sidebar .w102-sidebar-item .popover ul li a {display:block;font-size:14px;line-height:40px;padding:0 16px;min-width:120px;white-space:nowrap;word-break:keep-all;color:#333;}
.w102-sidebar .w102-sidebar-item .popover ul li a i {font-size:20px;vertical-align:-.1em;}
.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-whatsapp'] {color:#25D366;}
.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-skype'] {color:#00AEF3;}
.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-facebook'] {color:#235B9E;}
.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-twitter'] {color:#00ACED;}
.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-messenger'] {color:#008AFF;}
.w102-sidebar .w102-sidebar-item .popover ul li a i[class*='icon-youtube'] {color:#FF0000;}
.w102-sidebar .w102-sidebar-item .popover ul li a:hover {background-color:#fffcf4;color: #235b9e;}
.w102-sidebar .w102-sidebar-item.top {display:none;}
.w102-sidebar .w102-sidebar-item:hover .wrap {transform:translateX(-100%);}
.w102-sidebar .w102-sidebar-item:hover .popover {display:block;}
.w102-sidebar.scrolled .w102-sidebar-item.top {display:block;}
@media screen and (max-width:1280px) {.w102-sidebar .w102-sidebar-wrap {top:auto;bottom:10%;}
}
@media screen and (max-width:992px) {.w102-sidebar {height:48px;}
.w102-sidebar .w102-sidebar-wrap {top:auto;bottom:0;left:0;}
.w102-sidebar .w102-sidebar-list {display:flex;background-color: #fff !important;box-shadow:0 0 0 1px #d9d9d9;}
.w102-sidebar .w102-sidebar-item {flex:1;height:auto;}
.w102-sidebar .w102-sidebar-item .wrap {position:relative;transform:translateX(0);}
.w102-sidebar .w102-sidebar-item .trigger {justify-content:center;/* background-color:#fff; */color:#333;}
.w102-sidebar .w102-sidebar-item .trigger .icon {display:block;width:auto;height:48px;line-height:48px;text-align:center;}
.w102-sidebar .w102-sidebar-item .trigger .text {display:none;font-size:12px;padding-right:0;}
.w102-sidebar .w102-sidebar-item .popover {display:none;position:absolute;top:auto;left:50%;bottom:100%;right:auto;padding:0 0 12px;transform:translateX(-50%);}
.w102-sidebar .w102-sidebar-item .popover .popover-wrap {box-shadow:6px 0 20px 2px rgba(0,0,0,0.18);}
.w102-sidebar .w102-sidebar-item .popover .popover-wrap:after {top:auto;right:auto;left:50%;bottom:-8px;margin-left:-8px;border-width:8px 8px 0 8px;border-color:#fff transparent transparent transparent;}
.w102-sidebar .w102-sidebar-item.top {display:none;}
.w102-sidebar .w102-sidebar-item.primary {flex:2;order:2;}
.w102-sidebar .w102-sidebar-item.primary .trigger {background-color: #0f7068;color:#fff;}
.w102-sidebar .w102-sidebar-item.primary .trigger .text {display:block;}
.w102-sidebar .w102-sidebar-item:hover .wrap {transform:translateX(0);}
.w102-sidebar .w102-sidebar-item:hover .popover {display:block;}
.w102-sidebar.scrolled .w102-sidebar-item.top {display:none;}
}
/*!- w102-sidebar end -*/


.float {
    position: fixed;
    width: 50px;
    height: 50px;
    bottom: 57px;
    left: 40px;
    background-color: #25d366;
    color: #fff;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
    animation: pulse 1s infinite;
}

.my-float {
    margin-top: 16px;
}

@keyframes pulse {
    0% {
        transform: scale(1);
        box-shadow: 2px 2px 3px #999;
    }
    50% {
        transform: scale(1.1);
        box-shadow: 4px 4px 6px #999;
    }
    100% {
        transform: scale(1);
        box-shadow: 2px 2px 3px #999;
    }
}

/* Media query to hide the element on screens smaller than 768 pixels (adjust as needed) */
@media (max-width: 767px) {
    .float {
        display: none;
    }
}




/* floating box style */
.floating-form {
    max-width: 314px;
    padding: 30px 30px 10px 30px;
    font: 13px Arial, Helvetica, sans-serif;
    background: #F9F9F9;
    border: 1px solid #ddd;
    right: 10px;
    position: fixed;
    box-shadow: -2px -0px 8px rgba(43, 33, 33, 0.06);
    -moz-box-shadow: -2px -0px 8px rgba(43, 33, 33, 0.06);
    -webkit-box-shadow:  -2px -0px 8px rgba(43, 33, 33, 0.06);
    z-index: 9999999;
    }
.contact-opener {
    position: absolute;
    left: -127px;
    transform: rotate(-90deg);
    top: 161px;
    background-color: #216288;
    padding: 9px;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.43);
    cursor: pointer;
    border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    box-shadow: -2px -0px 8px rgba(43, 33, 33, 0.06);
    -moz-box-shadow: -2px -0px 8px rgba(43, 33, 33, 0.06);
    -webkit-box-shadow:  -2px -0px 8px rgba(43, 33, 33, 0.06);
}
.floating-form-heading{
    font-weight: bold;
    font-style: italic;
    border-bottom: 2px solid #ddd;
    margin-bottom: 10px;
    font-size: 15px;
    padding-bottom: 3px;
}
.floating-form label{
    display: block;
    margin: 0px 0px 15px 0px;
}
.floating-form label > span{
    width: 70px;
    font-weight: bold;
    float: left;
    padding-top: 8px;
    padding-right: 5px;
}
.floating-form span.required{
    color:red;
}
.floating-form .tel-number-field{
    width: 40px;
    text-align: center;
}
.floating-form  .long{
    width: 120px;
}
.floating-form input.input-field{
    width: 68%;
   
}

.floating-form input.input-field,
.floating-form .tel-number-field,
.floating-form .textarea-field,
 .floating-form .select-field{
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out; 
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    border: 1px solid #C2C2C2;
    box-shadow: 1px 1px 4px #EBEBEB;
    -moz-box-shadow: 1px 1px 4px #EBEBEB;
    -webkit-box-shadow: 1px 1px 4px #EBEBEB;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    padding: 7px;
    outline: none;
}
.floating-form .input-field:focus,
.floating-form .tel-number-field:focus,
.floating-form .textarea-field:focus,  
.floating-form .select-field:focus{
    border: 1px solid #0C0;
}
.floating-form .textarea-field{
    height:100px;
    width: 68%;
}
.floating-form input[type="button"],
.floating-form input[type="submit"], .contact-opener {
    -moz-box-shadow: inset 0px 1px 0px 0px #3985B1;
    -webkit-box-shadow: inset 0px 1px 0px 0px #3985B1;
    box-shadow: inset 0px 1px 0px 0px #055f57;
    background-color: #055f57;
    border: 1px solid #055f57;
    display: inline-block;
    cursor: pointer;
    color: #FFFFFF;
    padding: 14px 50px;
    text-decoration: none;
    font: 12px Arial, Helvetica, sans-serif;
}
.floating-form input[type="button"]:hover,
.floating-form input[type="submit"]:hover, .contact-opener {
    background: linear-gradient(to bottom, #055f57 5%, #055f57 100%);
    background-color: #055f57;
}
.floating-form .success{
    background: #D8FFC0;
    padding: 5px 10px 5px 10px;
    margin: 0px 0px 5px 0px;
    border: none;
    font-weight: bold;
    color: #2E6800;
    border-left: 3px solid #2E6800;
}
.floating-form .error {
    background: #FFE8E8;
    padding: 5px 10px 5px 10px;
    margin: 0px 0px 5px 0px;
    border: none;
    font-weight: bold;
    color: #FF0000;
    border-left: 3px solid #FF0000;
}