/*
Theme Name: tuankietcomvn
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}
#FOLLOW-ICON{max-width:60px;position:fixed;z-index:9;right:10px;bottom: 25px;}
#FOLLOW-ICON > li{width:100%;margin:30px 0;list-style-type: none;}
.an{display:none}
.anPC{display:none}
@media (max-width:480px){.anPC{display:block}.anMB{display:none}#FOLLOW-ICON{max-width:100%}#FOLLOW-ICON > li{width:fit-content;float:right;margin:0 3px}}
:root{--phone:rgb(210,19,14);--phoneopa:rgb(210,19,14,0.5);--facebook:rgb(59,89,152);--facebookopa:rgb(59,89,152,0.5);--mail:rgb(223,75,56);--mailopa:rgb(223,75,56,0.5);--zalo:rgb(2,143,227);--zaloopa:rgb(2,143,227,0.5);--messenger:rgb(2,143,227);--messengeropa:rgb(2,143,227,0.5)}
#phone a{background:var(--phone);border:2px #fff solid}
#phone svg path{fill:#fff}
#phone .alo-circle-fill{background-color:var(--phoneopa)}
#phone .alo-circle{border-color:var(--phone)}
#phone:hover a{background:rgb(255,87,34)}
#phone:hover svg path{fill:#fff}
#phone:hover .alo-circle-fill{background-color:rgb(255,87,34,0.5)}
#phone:hover .alo-circle{border-color:rgb(255,87,34)}
#facebook a{background:var(--facebook);border:2px #fff solid}
#facebook svg path{fill:rgb(255,255,255)}
#facebook .alo-circle-fill{background-color:var(--facebookopa)}
#facebook .alo-circle{border-color:var(--facebook)}
#facebook:hover a{background:rgb(255,87,34)}
#facebook:hover svg path{fill:#fff}
#facebook:hover .alo-circle-fill{background-color:rgb(255,87,34,0.5)}
#facebook:hover .alo-circle{border-color:rgb(255,87,34)}
#mail a{background:var(--mail);border:2px #fff solid}
#mail svg path{fill:rgb(255,255,255)}
#mail .alo-circle-fill{background-color:var(--mailopa)}
#mail .alo-circle{border-color:var(--mail)}
#mail:hover a{background:rgb(255,87,34)}
#mail:hover svg path{fill:#fff}
#mail:hover .alo-circle-fill{background-color:rgb(255,87,34,0.5)}
#mail:hover .alo-circle{border-color:rgb(255,87,34)}
#zalo svg{background:#fff;padding:1px}
#zalo svg path{fill:var(--zalo)}
#zalo .alo-circle-fill{background-color:var(--zaloopa)}
#zalo .alo-circle{border-color:var(--zalo)}
#zalo:hover svg{background:#fff}
#zalo:hover svg path{fill:rgb(255,87,34)}
#zalo:hover .alo-circle-fill{background-color:rgb(255,87,34,0.5)}
#zalo:hover .alo-circle{border-color:rgb(255,87,34)}
#messenger svg{background:#fff;padding:1px}
#messenger svg path:first-child{fill:var(--messenger)}
#messenger .alo-circle-fill{background-color:var(--messengeropa)}
#messenger .alo-circle{border-color:var(--messenger)}
#messenger:hover svg{background:#fff}
#messenger:hover svg path:first-child{fill:rgb(255,87,34)}
#messenger:hover .alo-circle-fill{background-color:rgb(255,87,34,0.5)}
#messenger:hover .alo-circle{border-color:rgb(255,87,34)}
.support-online.type-01 a{display:block}
.support-online.type-02 a{display:flex;border-radius:100%;align-items:center;justify-content:center}
.support-online.type-01 svg{width:40px;height:40px;border-radius:100%}
.support-online.type-02 svg{width:25px;height:25px}
.support-online{}
.support-online a{position:relative;text-align:left;margin:10px;width:40px;height:40px}
.support-online svg{text-align:center;line-height:1.9;position:relative;z-index:9;animation:1s ease-in-out 0s normal none infinite running Icon-running}
.alo-circle-fill{width:60px;height:60px;top:50%;left:50%;transform:translate(-50%,-50%);position:absolute;-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-ms-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out;-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;border:2px solid transparent;-webkit-transition:all .5s;-moz-transition:all .5s;-o-transition:all .5s;transition:all .5s;opacity:.75}
.alo-circle{width:50px;height:50px;top:50%;left:50%;transform:translate(-50%,-50%);position:absolute;background-color:transparent;-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;border:2px solid rgba(30,30,30,0.4);opacity:.5}
.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}
.pulse{-webkit-animation-name:pulse;animation-name:pulse}
.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}
@-moz-keyframes Grow{0%{transform:scale(.1);-ms-transform:scale(.1);-webkit-transform:scale(.1);opacity:0;filter:alpha(opacity=0)}50%{opacity:1;filter:alpha(opacity=100)}to{transform:scale(1.8);-ms-transform:scale(1.8);-webkit-transform:scale(1.8);opacity:0;filter:alpha(opacity=0)}}
@keyframes Grow{0%{transform:scale(.1);-ms-transform:scale(.1);-webkit-transform:scale(.1);opacity:0;filter:alpha(opacity=0)}50%{opacity:1;filter:alpha(opacity=100)}to{transform:scale(1.8);-ms-transform:scale(1.8);-webkit-transform:scale(1.8);opacity:0;filter:alpha(opacity=0)}}
@keyframes Icon-running{0%{transform:rotate(0deg) scale(1) skew(1deg)}10%{transform:rotate(-25deg) scale(1) skew(1deg)}20%{transform:rotate(25deg) scale(1) skew(1deg)}30%{transform:rotate(-25deg) scale(1) skew(1deg)}40%{transform:rotate(25deg) scale(1) skew(1deg)}50%{transform:rotate(0deg) scale(1) skew(1deg)}100%{transform:rotate(0deg) scale(1) skew(1deg)}}
@keyframes zoomIn{0%{opacity:0;-webkit-transform:translate(-50%,-50%) scale3d(.3,.3,.3);-ms-transform:translate(-50%,-50%) scale3d(.3,.3,.3);transform:translate(-50%,-50%) scale3d(.3,.3,.3)}50%{opacity:1}}
@keyframes pulse{0%,100%{-webkit-transform:scale(1);transform:translate(-50%,-50%) scale(1);opacity:1}50%{-webkit-transform:scale(.9);transform:translate(-50%,-50%) scale(.9);opacity:.7}}