@charset "UTF-8";



/* Roboto font family import from Google*/

@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab:100,300,400,700');




/*Globel Link Clear*/

a,
a:link,
a:visited,
a:hover,
a:active {
    color: #000;
    text-decoration: none;
}

body {
    font-family: 'Roboto', 'Roboto Slab', sans-serif, serif;
    font-feature-settings: "liga", "kern";
    font-synthesis: none;
    text-rendering: optimizelegibility;
}

@media only screen and (max-width: 768px) {
    * {
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    }
    a:link {
        -webkit-tap-highlight-color: rgba(255, 255, 255, 0.05);
    }
    .home_padding {
        padding-top: 3%;
        /* padding-left: 1%;
        padding-right: 1%;*/
    }
    .logo_img {
        width: 65px;
    }
    .logo_text {
        font-size: 16px;
    }
    .flx {
        flex-flow: column nowrap;
    }
    .flx_c {
        font-size: calc(2vw + 1.5vh + 6vmin);
        line-height: calc(1vw + 2.5vh + 4vmin);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    .flx_c a:link,
    .flx_c a:visited {
        color: rgba(255, 255, 255, 0.8);
    }
    .flx_c a:hover,
    .flx_c a:active,
    .flx_c a:focus {
        color: rgba(255, 255, 255, 1);
    }
    .json_error_msg {
        left: calc(100% - (95% - 5%));
        position: absolute;
        text-align: center;
        width: calc(80%);
    }
    #loading .button {
        position: absolute;
        text-transform: uppercase;
        top: calc(100% - 65%) !important;
        left: calc(100% - (50% + 84px)) !important;
        -webkit-appearance: none;
    }
    #imgbox:hover~#slide_dot {
        display: block;
    }
    #slide_dot {
        display: none;
        padding: 5px;
    }
    .dash li {
        /*margin: 0;*/
        margin: calc(0.4vw + 0.4vh + 0.4vmin);
        padding: 0;
    }
    .dash li button {
        padding: 0;
        width: 20px;
        border: 0 none;
    }
    .dash li button:before {
        /*font-size: 10px;*/
        font-size: calc(0.8vw + 0.5vh + 0.8vmin);
    }
    .smap {
        letter-spacing: 3px;
        font-size: 18px;
        font-weight: 500;
        padding: 0;
    }
    .copyright_main p {
        font-size: 15px;
        font-weight: 500;
        text-align: center;
        margin-bottom: 10px;
    }
    /* .header {
     background: rgba(0, 0, 0, 0.12) none repeat scroll 0 0;
     font-family: 'Roboto', sans-serif;
     margin: 0;
     padding: 0;
     text-transform: uppercase;
     height: 45px;
     }
     */
    .lock {
        position: inherit;
        overflow: hidden !important;
    }
    .wt_color {
        color: rgba(255, 255, 255, 1) !important;
    }
    .wt_bg {
        background: rgba(255, 255, 255, 0.95) none repeat scroll 0 0 !important;
    }
    .header {
        backface-visibility: hidden;
        background: rgba(255, 255, 255, 0.95) none repeat scroll 0 0;
        /*border-bottom: 1px solid rgba(0, 0, 0, 0.05);*/
        /*box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);*/
        font-family: "Roboto", sans-serif;
        height: 45px;
        margin: 0;
        padding: 0;
        position: fixed;
        text-transform: uppercase;
        top: 0;
        transform: translate3d(0px, 0px, 0px);
        width: 100%;
        z-index: 100;
        /*On Scroll animation*/
        -webkit-transition: -webkit-transform 300ms ease-in 50ms, height 350ms cubic-bezier(0.61, 0.19, 0.37, 0.81) 30ms, background 350ms ease 250ms;
        -moz-transition: -moz-transform 300ms ease-in 50ms, height 350ms cubic-bezier(0.61, 0.19, 0.37, 0.81) 30ms, background 350ms ease 250ms;
        -ms-transition: -ms-transform 300ms ease-in 50ms, height 350ms cubic-bezier(0.61, 0.19, 0.37, 0.81) 30ms, background 350ms ease 250ms;
        transition: transform 300ms ease-in 50ms, height 350ms cubic-bezier(0.61, 0.19, 0.37, 0.81) 30ms, background 350ms ease 250ms;
        /*webkit*/
        -webkit-backface-visibility: hidden;
        -webkit-transform: translate3d(0px, 0px, 0px);
    }
    .header>h1 {
        font-size: 20px;
        font-weight: 400;
        letter-spacing: 2px;
        margin-top: 12px;
        padding: 0;
        position: absolute;
        text-align: center;
        transition: font-weight 0.2s ease 0s;
        width: 100%;
    }
    .header_hide {
        background: rgba(0, 0, 0, 0.92) none repeat scroll 0 0;
        height: 100%;
        /*overflow: hidden;*/
        transform: translate(0px, 0px) !important;
        transition: height 400ms cubic-bezier(0.61, 0.19, 0.37, 0.81) 50ms;
    }
    .hide-nav-bar {
        backface-visibility: hidden;
        -webkit-transition: -webkit-transform 500ms ease-out 50ms;
        -moz-transition: -moz-transform 500ms ease-out 50ms;
        -ms-transition: -ms-transform 500ms ease-out 50ms;
        transition: transform 500ms ease-out 50ms;
        -webkit-transform: translate(0px, -100%);
        -moz-transform: translate(0px, -100%);
        -ms-transform: translate(0px, -100%);
        transform: translate(0px, -100%);
        -webkit-backface-visibility: hidden;
    }
    .nav {
        /*display: none;*/
        /*background: rgba(255, 255, 255, 0.95);*/
        left: 0;
        position: absolute;
        top: 0;
        height: 0;
        width: 100%;
        margin-top: 45px;
        /*transition: background 0.35s linear 0s, height 0.35s ease-in 50ms;*/
        overflow: hidden;
        /*z-index: 100;*/
        opacity: 0;
    }
    .nav ul {
        display: inline-flex;
        list-style: none;
        margin: 10px;
        flex-flow: column;
    }
    .nav>ul>li {
        padding: 25px;
    }
    main {
        margin-top: 45px;
        padding: 1%;
    }
    .m_title {
        padding: 0 15px;
    }
    .m_title h1 {
        font-size: calc(2vw + 4vh + 3.5vmin);
        padding: 5px;
        text-align: center;
    }
    article {
        margin-top: 10px;
        padding: 8px;
    }
    article>h1 {
        font-size: 26px;
        padding: 5px;
    }
    article h2 {
        font-size: 24px;
        padding: 5px;
    }
    article h3 {
        font-size: 22px;
        padding: 5px 12px;
    }
    article h5 {
        font-size: 18px;
        padding: 20px 12px 5px;
    }
    article p {
        font-size: 18px;
        line-height: 28px;
        padding: 5px 12px;
        text-align: initial;
    }
    footer {
        padding: 1%;
    }
    footer>section {
        padding: 10px;
        text-align: center;
    }
    .link {
        border-top: 1px solid rgba(0, 0, 0, 0.1);
        font-size: 20px;
        letter-spacing: 1px;
        padding-top: 12px;
    }
    .sub_link {
        letter-spacing: 1px;
        font-size: 14px;
    }
    .copyright {
        margin-top: 15px;
        padding: 5px;
        text-align: center;
        /* temp Change */
        font-size: 13px;
        font-weight: 500;
        margin-bottom: 10px;
    }
    .main li {
        font-size: 18px;
    }
    .ctitle {
        font-size: 20px;
    }
    .ctext {
        font-size: 18px;
        line-height: 25px;
        padding: 5px;
    }
    .cart p {
        font-size: 18px;
        line-height: 25px;
    }
    .grid {
        display: inline;
        font-family: roboto, sans-serif;
        margin-top: 10px;
        padding: 10px;
    }
    .cell:nth-child(2) {
        font-size: 22px;
        flex: 2;
        padding: 10px;
    }
    .cell img {
        margin: auto 0;
        max-height: 100%;
        max-width: 100%;
        width: calc(5vw + 5vh + 20vmax);
    }
    .cell p {
        font-size: 18px;
        line-height: 25px;
        padding: 5px;
    }
    .pbody {
        display: table;
    }
    .pbody section {
        box-sizing: border-box;
        margin: 0;
        padding: 5px 12px;
        width: 100%;
    }
    .pbody section h3 {
        display: table-cell;
        font-size: 21px;
        height: 75px;
        padding: 2px;
        vertical-align: middle;
    }
    .pbody section>h3>small {
        font-size: 15px;
    }
    .pbody section p {
        display: none;
        font-size: 20px;
        line-height: 32px;
        padding: 5px;
    }
    .plink {
        display: none;
    }
    .icon::before {
        background-size: 80px 80px;
        background-repeat: no-repeat;
        height: 80px;
        padding-left: 5px;
        width: 25%;
    }
    .icon::after {
        background-size: 80px 80px;
        height: 80px;
        width: 80px;
    }
    .pro_title {
        padding: 5px 12px;
        margin: 5px 0 0 5px;
    }
    /* new values for h1 title for mobile fix Change : 02/06/22*/
        .pro_title h1 {
         font-family: 'Roboto Slab', serif;
         font-size: calc(2vw + 3vh + 1vmin);
         text-transform: uppercase;
    }
    .pro_body {
        margin: 0px;
        padding: 5px 12px;
    }
    .pro_body h2 {
        border-bottom: 1px solid #d6d6d6;
        font-size: 22px;
        font-weight: 400;
        line-height: 10px;
        margin-bottom: 8px;
        padding: 15px 5px;
    }
    .pro_body h3 {
        font-size: 22px;
        font-weight: 400;
        line-height: 28px;
        margin-bottom: 5px;
        padding: 10px 5px;
    }
    .pro_body p {
        font-size: 18px;
        font-weight: 300;
        line-height: 28px;
        padding: 2px 5px;
    }
    .pro_cnt {
        align-content: center;
        align-items: flex-start;
        display: flex;
        justify-content: space-around;
        margin: 0px;
        padding: 5px 12px;
        flex-flow: column nowrap;
    }
    .pro_cnt img {
        /*width: 30%;*/
        width: calc(1vw + 1vh + 50vmin);
    }
    .pro_cnt figure {
        align-items: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin: 10px auto;
        width: 90%;
    }
    .pro_cnt p {
        align-content: center;
        background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0;
        box-sizing: border-box;
        font-size: 16px;
        font-weight: 500;
        line-height: 0;
        margin-top: 20px;
        padding: 20px;
        text-align: center;
        text-transform: uppercase;
        width: 100%;
        height: 20px;
    }
    .pro_image {
        height: calc(4vw + 4vh + 80vmin);
        position: relative;
        width: calc(4vw + 4vh + 80vmin);
    }
    .pro_image>img {
        width: calc(4vw + 4vh + 80vmin);
    }
    .pro_thumbnail {
        display: flex !important;
        justify-content: space-around;
        padding: 5px;
        position: relative;
    }
    .pro_thumbnail>img {
        border-bottom: 4px solid #fff;
        box-sizing: content-box;
        cursor: pointer;
        display: inline-block;
        height: calc(1vw + 1vh + 12vmin);
        margin: 10px 8px 5px;
        opacity: 1;
        padding-bottom: 10px;
        transition: border 0.2s ease 0s;
        width: calc(1vw + 1vh + 12vmin);
    }
    .pro_thumbnail img:hover {
        border-bottom: 4px solid rgba(0, 0, 0, 0.35);
    }
    .pro_back {
        align-items: center;
        display: flex;
        justify-content: space-around;
        padding: 10px 0 5px;
    }

    #recaptcha_data>div {
        background: #fff none repeat scroll 0 0;
        border: 1px solid rgba(0, 0, 0, 0.3);
        box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.3);
        border-radius: 4px;
        box-sizing: border-box;
        margin: 0 6px 15px;
        padding: 0px;
        width: calc(2vw + 4vh + 70vmin);
        /*transition: all 0.3s ease 0s;*/
    }

    #recaptcha_data>div:hover {
        -webkit-transition: border-color 0.3s ease-in-out;
        -moz-transition: border-color 0.3s ease-in-out;
        transition: border-color 0.3s ease-in-out;
        outline: 0;
        border: 1px solid rgba(0, 0, 0, 0.5);
        box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.5);
    }

    #contact h4 {
        margin: 0;
        padding: 5px 12px 12px;
    }
    #contact input[type="text"],
    #contact input[type="email"],
    #contact input[type="tel"],
    #contact input[type="url"],
    #contact textarea {
        background: #fff none repeat scroll 0 0;
        border: 2px solid rgba(0, 0, 0, 0.3);
        border-radius: 5px;
        box-sizing: border-box;
        margin: 0 5px 15px;
        padding: 10px;
        width: calc(2vw + 4vh + 79vmin);
    }
    #contact button[type="submit"] {
        padding: 10px 50px;
        position: relative;
        text-transform: uppercase;
        margin-left: 5px;
    }

    .hrs_base {
        padding: 5px !important;
        padding-left: 10px !important;
    }

    .hrs_base li {
        font-size: 17px;
    }

    .gmap {
        padding: 5px;
        width: calc(2vw + 2vh + 85vmin);
    }


    .site_map {
        align-items: center;
        display: block;
    }
    #nav_mobile {
        display: block !important;
        width: 25px;
        height: 45px;
        position: relative;
        margin: 0 20px;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
        cursor: pointer;
    }
    #nav_mobile span {
        display: block;
        position: absolute;
        height: 2px;
        width: 100%;
        background: rgba(0, 0, 0, 0.8);
        border-radius: 0;
        opacity: 1;
        left: 0;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }
    #nav_mobile span:nth-child(1) {
        top: 14px;
    }
    #nav_mobile span:nth-child(2) {
        top: 22px;
    }
    #nav_mobile span:nth-child(3) {
        top: 30px;
    }
    #nav_mobile.open span:nth-child(1) {
        top: 22px;
        -webkit-transform: rotate(135deg);
        -moz-transform: rotate(135deg);
        -o-transform: rotate(135deg);
        transform: rotate(135deg);
    }
    #nav_mobile.open span:nth-child(2) {
        opacity: 0;
        left: -60px;
    }
    #nav_mobile.open span:nth-child(3) {
        top: 22px;
        -webkit-transform: rotate(-135deg);
        -moz-transform: rotate(-135deg);
        -o-transform: rotate(-135deg);
        transform: rotate(-135deg);
    }
    .info_slider {
        margin: 0 auto;
        width: 80%;
    }
    .menu_toggle {
        height: 100%;
        opacity: 1;
    }
    .nav a {
        font-size: 38px;
        padding: 0 5px;
        font-weight: 400;
    }
    .nav a span::before {
        width: 200px;
    }
    .no_scroll {
        overflow: hidden;
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
    }
    /*404 Error*/
    .sub_head {
        font-size: 24px;
        margin-top: 15px;
        padding: 10px;
        text-align: center;
        text-transform: none;
    }
    /*Experement*/
    .contain h2 {
        display: none;
    }
    .contain h3 {
        /*display: inline;*/
        font-size: calc(1.5vw + 1.5vh + 2.2vmin);
        font-weight: 300;
        line-height: calc(2vw + 2vh + 2.5vmin);
        padding: 0;
    }
    .contain p {
        font-size: calc(1.5vw + 1.5vh + 1.5vmin);
        /*line-height: calc(2vw + 2vh + 2vmin);*/
        font-weight: 300;
        padding: 0;
    }
    .contain small {
        font-size: calc(0.9vw + 0.9vh + 0.8vmin);
        font-weight: 400;
    }
    .Honeycomb,
    .Product,
    .AboutUs,
    .Contact {
        opacity: 0;
        position: absolute;
        transition: opacity 300ms ease 30ms;
        padding: 5px;
    }
    .AboutUs h3 {
        font-size: calc(1.5vw + 1.5vh + 1.2vmin);
    }

    #copyright_text {
        display: none;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1280px) {
    /* .home_padding {
        padding-top: 3%;
         padding-left: 1%;
        padding-right: 1%;
    }*/
    .pbody {
        padding-top: 25px;
    }
    .pbody section {
        width: auto;
    }
    .pbody section p {
        line-height: 28px;
    }
    .pbody section h3 {
        padding: 15px 5px 5px;
    }
}

#nav_mobile {
    display: none;
}