/*
 * Theme Name: N.U DESIGN
 * Description: Template for Wordpress - Developed by NR Global
 * Theme URI: https://nrglobal.vn
 * Version: 1.0
 * Theme Author: info.nrglobal@gmail.com
 * Author: Gấu Mập Dev
 * Author URI:  https://nrglobal.vn
 * Textdomain: nudesign
 */

.social-share
{
    top        : -10px;
    right      : 0px;
    float      : right;
    z-index    : 99999999;
    text-align : center;
    width      : 50px;
    height     : 50px;
    margin-top : -18px;
}

.social-share input[type="checkbox"]
{
    display : none;
}

.social-share .checkbox:checked ~ .social
{
    opacity            : 1;
    -webkit-transform  : scale(1) translateY(-67px);
    -moz-transform     : scale(1) translateY(-67px);
    -o-transform       : scale(1) translateY(-65px);
    transform          : scale(1) translateY(-67px);
    -webkit-transition : .5s;
    -moz-transition    : .5s;
    -o-transition      : .5s;
    transition         : .5s;
}

.social-share .label
{
    background-color : #000000;
    border-radius    : 50%;
    color            : #ffffff;
    font-size        : 17px;
    cursor           : pointer;
    margin           : 0;
    width            : 33px;
    height           : 33px;
    line-height      : 28px;
}

.social-share .checkbox:checked + .label
{
    background-color : #ebebeb;
    color            : #ffffff;
}

.social-share .social
{
    transform-origin  : 50% 0%;
    -webkit-transform : scale(0) translateY(-167px);
    -moz-transform    : scale(0) translateY(-167px);
    -o-transform      : scale(0) translateY(-167px);
    transform         : scale(0) translateY(-167px);
    opacity           : 0;
}

.social-share ul
{
    color      : #ffffff;
    width      : 90px;
    height     : 30px;
    margin     : auto;
    padding    : 0;
    list-style : none;
    position   : relative;
    left       : -27px;
    right      : 0;
}

.social-share ul li
{
    display     : block;
    font-size   : 15px;
    cursor      : pointer;
    width       : 30px;
    line-height : 30px;
    margin      : 0;
    padding     : 0;
    text-align  : center;
    float       : left;
}

.social-share ul li:hover
{
    color : rgba(0, 0, 0, .5);
}

.social-share ul:after
{
    content      : '';
    border-left  : 6px solid transparent;
    border-right : 6px solid transparent;
    border-top   : 6px solid #33bce9;
    display      : block;
    position     : absolute;
    top          : 100%;
    left         : 1px;
    right        : 0;
    height       : 0;
    width        : 0;
}

.social-share li[class*="facebook"]
{
    background-color : #37528d;
}

.social-share li[class*="twitter"]
{
    background-color : #33bce9;
}

.social-share li[class*="google-plus"]
{
    background-color : #dc2310;
}

.label:empty
{
    display : block !important;
}

.social-like
{
    margin      : 20px 0 0;
    position    : relative;
    z-index     : 1;
    line-height : 20px !important;
}

.social-like .item-social
{
    float    : left;
    margin   : 0 10px 0 0;
    position : relative;
}

.jssort07
{
    position : absolute; /* size of thumbnail navigator container */
    width    : 800px;
    height   : 100px;
}

.jssort07 .p
{
    position : absolute;
    top      : 0;
    left     : 0;
    width    : 99px;
    height   : 66px;
}

.jssort07 .i
{
    position : absolute;
    top      : 0px;
    left     : 0px;
    width    : 99px;
    height   : 66px;
    filter   : alpha(opacity=80);
    opacity  : .8;
}

.jssort07 .p:hover .i,
.jssort07 .pav .i
{
    filter  : alpha(opacity=100);
    opacity : 1;
}

.jssort07 .o
{
    position           : absolute;
    top                : 0px;
    left               : 0px;
    width              : 97px;
    height             : 64px;
    border             : 1px solid #000000;
    box-sizing         : content-box;
    transition         : border-color .6s;
    -moz-transition    : border-color .6s;
    -webkit-transition : border-color .6s;
    -o-transition      : border-color .6s;
}

.jssort07 .pav .o
{
    border-color : #0099ff;
}

.jssort07 .p:hover .o
{
    border-color       : #ffffff;
    transition         : none;
    -moz-transition    : none;
    -webkit-transition : none;
    -o-transition      : none;
}

.jssort07 .p.pdn .o
{
    border-color : #0099ff;
}

.jssora051
{
    display  : block;
    position : absolute;
    cursor   : pointer;
}

.jssora051 .a
{
    fill              : none;
    stroke            : #ffffff;
    stroke-width      : 360;
    stroke-miterlimit : 10;
}

.jssora051:hover
{
    opacity : .8;
}

.jssora051.jssora051dn
{
    opacity : .5;
}

.jssora051.jssora051ds
{
    opacity        : .3;
    pointer-events : none;
}

#slider1_container
{
    width : 100% !important
}

#slider1_container img
{
    width  : 100% !important;
    height : auto !important;
}
.bao-gia-title h4 {
    font-size: 25px;
    text-align: center;
    margin-top: 30px;
    border: 1px;
    padding: 15px;
    background-color: #81807F;
    color: white;
    text-transform: uppercase;
}
.box-chi-tiet {
    margin-top: 30px;
    border: 1px solid #81807F;
    padding: 15px;
    border-radius: 5px;
}
.box-chi-tiet .box-chi-tiet-right {
    margin-top: 30px;
    border: 1px solid #81807F;
    padding: 10px;
    border-radius: 5px;
}
hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 2px solid #81807F;
}
.text-right .btn-show-detail-price {
    width: 30px;
    margin-bottom: 10px;
}
.box-chi-tiet .row .active {
    background-color: #81807F;
    border: 1px solid #81807F;
    color: white;
}
.box-chi-tiet h4 {
    font-weight: bold;
}
#tongCong, #giaPhanNoiThat{
    font-size: 13px
}

.fix_tel { position:fixed; bottom:15px; left: 0; z-index:9999;}
    .fix_tel a {text-decoration: none;}
    .tel { background: #eee;width:205px; height:40px; position:relative; overflow:hidden;background-size:40px;border-radius:20px;border:solid 1px #ccc;position: absolute; top: 25%; left: 25%; padding-right: 10px;}
    a:hover > .tel { background: #542a76;}
    .bor-left, .bor-top, .bor-right, .bor-bottom{position:absolute;background-color:#EDCB67;
        -webkit-transition: all 5s ease-in-out;transition: all 5s ease-in-out;}
    .bor-left{height:50%;width:3px;left:0;bottom:-100%;-webkit-animation:transtop 5s ease-in-out infinite;animation:transtop 5s ease-in-out infinite;
    }
    .bor-right{height:50%;right:0;top:-100%;width:3px;-webkit-animation:transbot 5s ease-in-outinfinite;animation:transbot 5s ease-in-outinfinite;}
    .bor-top{width:50%;left:-100%;top:0;height: 3px;-webkit-animation: transleft 5s ease-in-out infinite;animation: transleft 5s ease-in-out infinite;}
    .bor-bottom{width: 50%;height: 3px;right: -100%;bottom: 0;-webkit-animation: transright 5s ease-in-out infinite;animation: transright 5s ease-in-out infinite;}
    .fone {font-size: 20px;color: #f00;line-height: 38px;font-weight: bold;padding-left:45px;}
    a:hover > .tel > .fone { color: white; }
    .ring-alo-phone {background-color:transparent;cursor: pointer;height: 80px;position:relative;-webkit-transition:visibility 0.5s ease 0s;transition:visibility 0.5s ease 0s;visibility: hidden;width: 80px;z-index: 200000 !important;}
    .ring-alo-phone.ring-alo-show {visibility: visible;}
    .ring-alo-phone.ring-alo-hover, .ring-alo-phone:hover {opacity: 1;}
    .ring-alo-ph-circle {-webkit-animation: 1.2s ease-in-out 0s normal none infinite running ring-alo-circle-anim;animation: 1.2s ease-in-out 0s normal none infinite running ring-alo-circle-anim;background-color: transparent;border: 2px solid rgba(30, 30, 30, 0.4);border-radius: 100%;height: 100%;left: 0;opacity: 0.1;position: absolute;top: 0;-webkit-transform-origin: 50% 50% 0;transform-origin: 50% 50% 0;-webkit-transition: all 0.5s ease 0s;transition: all 0.5s ease 0s;width: 100%;}
    .ring-alo-phone.ring-alo-active .ring-alo-ph-circle {-webkit-animation: 1.1s ease-in-out 0s normal none infinite running ring-alo-circle-anim !important;animation: 1.1s ease-in-out 0s normal none infinite running ring-alo-circle-anim !important;}
    .ring-alo-phone.ring-alo-static .ring-alo-ph-circle {-webkit-animation: 2.2s ease-in-out 0s normal none infinite running ring-alo-circle-anim !important;animation: 2.2s ease-in-out 0s normal none infinite running ring-alo-circle-anim !important;}
    .ring-alo-phone.ring-alo-hover .ring-alo-ph-circle, .ring-alo-phone:hover .ring-alo-ph-circle {border-color: #f00;opacity: 0.5;}
    .ring-alo-phone.ring-alo-green.ring-alo-hover .ring-alo-ph-circle, .ring-alo-phone.ring-alo-green:hover .ring-alo-ph-circle {border-color: #542a76;opacity: 0.5;}
    .ring-alo-phone.ring-alo-green .ring-alo-ph-circle {border-color: #f00;opacity: 0.5;}
    .ring-alo-ph-circle-fill {-webkit-animation: 2.3s ease-in-out 0s normal none infinite running ring-alo-circle-fill-anim;animation: 2.3s ease-in-out 0s normal none infinite running ring-alo-circle-fill-anim;background-color: #000;border: 2px solid transparent;border-radius: 100%;height: 100%;left: 0;opacity: 0.1;position: absolute;top: 0;-webkit-transform-origin: 50% 50% 0;transform-origin: 50% 50% 0;-webkit-transition: all 0.5s ease 0s;transition: all 0.5s ease 0s;width: 100%;}
    .ring-alo-phone.ring-alo-hover .ring-alo-ph-circle-fill, .ring-alo-phone:hover .ring-alo-ph-circle-fill {background-color: rgba(0, 175, 242, 0.5);opacity: 0.75 !important;}
    .ring-alo-phone.ring-alo-green.ring-alo-hover .ring-alo-ph-circle-fill, .ring-alo-phone.ring-alo-green:hover .ring-alo-ph-circle-fill {background-color: #542a76;opacity: 0.75 !important;}
    .ring-alo-phone.ring-alo-green .ring-alo-ph-circle-fill {background-color: rgba(0, 175, 242, 0.5);opacity: 0.75 !important;}
    .ring-alo-ph-img-circle {-webkit-animation: 1s ease-in-out 0s normal none infinite running ring-alo-circle-img-anim;animation: 1s ease-in-out 0s normal none infinite running ring-alo-circle-img-anim;border: 2px solid transparent;border-radius: 100%;height: 50%;left: 25%;opacity: 1;position: absolute;top: 25%;-webkit-transform-origin: 50% 50% 0;transform-origin: 50% 50% 0;width: 50%; display: flex; justify-content: center; -webkit-justify-content: center; align-items: center;}
    .ring-alo-phone.ring-alo-hover .ring-alo-ph-img-circle, .ring-alo-phone:hover .ring-alo-ph-img-circle {background-color: #f00;}
    .ring-alo-phone.ring-alo-green.ring-alo-hover .ring-alo-ph-img-circle, .ring-alo-phone.ring-alo-green:hover .ring-alo-ph-img-circle {background-color: #542a76;}
    .ring-alo-phone.ring-alo-green .ring-alo-ph-img-circle {background-color: #f00;}
    @-webkit-keyframes ring-alo-circle-anim {
        0% {opacity: 0.1;-webkit-transform: rotate(0deg) scale(0.5) skew(1deg);transform: rotate(0deg) scale(0.5) skew(1deg);}
        30% {opacity: 0.5;-webkit-transform: rotate(0deg) scale(0.7) skew(1deg);transform: rotate(0deg) scale(0.7) skew(1deg);}
        100% {opacity: 0.6;-webkit-transform: rotate(0deg) scale(1) skew(1deg);transform: rotate(0deg) scale(1) skew(1deg);}
    }
    @keyframes ring-alo-circle-anim {
        0% {opacity: 0.1;-webkit-transform: rotate(0deg) scale(0.5) skew(1deg);transform: rotate(0deg) scale(0.5) skew(1deg);}
        30% {opacity: 0.5;-webkit-transform: rotate(0deg) scale(0.7) skew(1deg);transform: rotate(0deg) scale(0.7) skew(1deg);}
        100% {opacity: 0.6;-webkit-transform: rotate(0deg) scale(1) skew(1deg);transform: rotate(0deg) scale(1) skew(1deg);}
    }
    @-webkit-keyframes ring-alo-circle-img-anim {
        0% {-webkit-transform: rotate(0deg) scale(1) skew(1deg);transform: rotate(0deg) scale(1) skew(1deg);}
        10% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);transform: rotate(-25deg) scale(1) skew(1deg);}
        20% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);transform: rotate(25deg) scale(1) skew(1deg);}
        30% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);transform: rotate(-25deg) scale(1) skew(1deg);}
        40% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);transform: rotate(25deg) scale(1) skew(1deg);}
        50% {-webkit-transform: rotate(0deg) scale(1) skew(1deg);transform: rotate(0deg) scale(1) skew(1deg);}
        100% {-webkit-transform: rotate(0deg) scale(1) skew(1deg);transform: rotate(0deg) scale(1) skew(1deg);}
    }
    @keyframes ring-alo-circle-img-anim {
        0% {-webkit-transform: rotate(0deg) scale(1) skew(1deg);transform: rotate(0deg) scale(1) skew(1deg);}
        10% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);transform: rotate(-25deg) scale(1) skew(1deg);}
        20% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);transform: rotate(25deg) scale(1) skew(1deg);}
        30% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);transform: rotate(-25deg) scale(1) skew(1deg);}
        40% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);transform: rotate(25deg) scale(1) skew(1deg);}
        50% {-webkit-transform: rotate(0deg) scale(1) skew(1deg);transform: rotate(0deg) scale(1) skew(1deg);}
        100% {-webkit-transform: rotate(0deg) scale(1) skew(1deg);transform: rotate(0deg) scale(1) skew(1deg);}
    }
    @-webkit-keyframes ring-alo-circle-fill-anim {
        0% {opacity: 0.2;-webkit-transform: rotate(0deg) scale(0.7) skew(1deg);transform: rotate(0deg) scale(0.7) skew(1deg);}
        50% {opacity: 0.2;-webkit-transform: rotate(0deg) scale(1) skew(1deg);transform: rotate(0deg) scale(1) skew(1deg);}
        100% {opacity: 0.2;-webkit-transform: rotate(0deg) scale(0.7) skew(1deg);transform: rotate(0deg) scale(0.7) skew(1deg);}
    }
    @keyframes ring-alo-circle-fill-anim {
        0% {opacity: 0.2;-webkit-transform: rotate(0deg) scale(0.7) skew(1deg);transform: rotate(0deg) scale(0.7) skew(1deg);}
        50% {opacity: 0.2;-webkit-transform: rotate(0deg) scale(1) skew(1deg);transform: rotate(0deg) scale(1) skew(1deg);}
        100% {opacity: 0.2;-webkit-transform: rotate(0deg) scale(0.7) skew(1deg);transform: rotate(0deg) scale(0.7) skew(1deg);}
    }
    /*Icon Call End*/
    @media screen and (max-width: 767px) {
        .ring-alo-phone { height: 60px; width: 60px; }
        .tel { height: 30px; }
        .fone { font-size: 18px; line-height: 28px; }
    }

.content-ruller {
    overflow: hidden;
}
#wrapperloban {
    position: absolute;
    z-index: 1;
    top: 20px;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 425px;
    overflow: auto;
}
#scroller {
    width: 10100px;
    height: 100%;
    float: left;
    padding: 0;
}
#pullRight, #pullLeft {
    display: block;
    width: 50px;
    float: left;
    height: 100%;
}
#thelist {
    margin: 0;
    padding: 0;
}
#scroller li {
    display: block;
    float: left;
    width: 10000px;
    height: 100%;
}
#scroller li img {
    margin-top: 35px;
}
table tr td{
	padding: 10px;
}
.clear{
	clear: both;
}
.frm-pt .form-group {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}