﻿@charset "utf-8";
/* CSS Document */

.fixed {
    width: 100% !important;
    float: left;
    background: #ffffff;
    border: none;
    /*box-shadow:0px 6px 12px -4px rgba(0,0,0,0.24);*/
    animation: slide-down 0.7s;
    margin: 0 0 0 !important;
    padding: 46px 0 46px;
    left: 0;
    right: 0;
    z-index: 999999;
}

.fixed .fa-gg {
    transform: rotate(360deg);
}

.float-panel {
    width: 100%;
    transition: all 0.7s;
}

.scroll {
    width: 100%;
    float: left;
    margin: 0 0 0;
}

.fixed .linker-col1 {
    width: 161px;
    animation: slide-down 0.7s;
}

.button_container .fixed {
    width: 87px !important;
    background: none;
    border-bottom: none;
    box-shadow: none;
    padding: 65px 0 65px;
    left: 7px;
    right: inherit;
    z-index: 9999999999;
}

.button_container .scroll {
    width: 89px;
    background: none;
}

.button_container.active .fixed .button_text {
    color: #151515;
}

.button_container.active .fixed .button_line .top {
    background: #3abed2;
}

.button_container.active .fixed .button_line .middle {
    background: #3abed2;
}

.button_container.active .fixed .button_line .bottom {
    background: #3abed2;
}

@keyframes slide-down {
    0% {
        transform: translateY(-100%);
    }

    100% {
        transform: translateY(0);
    }
}

/* ---------------- For Animation on Scroll ---------------- */
.slideanim {
    visibility: hidden;
}

.slideanim.slide {
    visibility: visible;
    animation: slide 1s;
}

.slideanim::after {
    /* useful when its child elements are float:left; */
    content: "";
    display: table;
    clear: both;
}

.linker-wrapp .scroll.float-panel.fixed .menu-header-zod {
    position: relative;
    bottom: inherit;
    padding: 36px 0 0;
}

@keyframes slide {
    0% {
        transform: translateY(50%);
    }

    100% {
        transform: translateY(0);
    }
}

/*Smartphone css*/
@media screen and (max-width: 480px) {
    .fixed {
        width: 100% !important;
        background: none;
        border-bottom: none;
        position: relative !important;
        box-shadow: none !important;
        animation: none !important;
        padding: 0 !important;
    }

    .float-panel {
        transform: none;
        transition: none;
    }

    .scroll {
        width: 100%;
    }

    .fixed .linker-col1 {
        width: 203px;
        animation: none;
    }

    .button_container .fixed {
        width: 78px !important;
        left: 0;
    }

    .button_container .scroll {
        width: 78px;
    }
}

@media screen and (min-width:481px) and (max-width:600px) {
    .fixed {
        width: 100% !important;
        background: none;
        border-bottom: none;
        position: relative !important;
        box-shadow: none !important;
        animation: none !important;
        padding: 0 !important;
    }

    .float-panel {
        transform: none;
        transition: none;
    }

    .scroll {
        width: 100%;
    }

    .fixed .linker-col1 {
        width: 203px;
        animation: none;
    }

    .button_container .fixed {
        width: 78px !important;
        left: 0;
    }

    .button_container .scroll {
        width: 78px;
    }
}

@media screen and (min-width:601px) and (max-width:767px) {
    .fixed {
        width: 100% !important;
        background: none;
        border-bottom: none;
        position: relative !important;
        box-shadow: none !important;
        animation: none !important;
        padding: 0 !important;
    }

    .float-panel {
        transform: none;
        transition: none;
    }

    .scroll {
        width: 100%;
    }

    .fixed .linker-col1 {
        width: 203px;
        animation: none;
    }

    .button_container .fixed {
        width: 80px !important;
        left: 0;
    }

    .button_container .scroll {
        width: 80px;
    }
}

@media screen and (min-width:768px) and (max-width:900px) {
    .fixed {
        padding: 36px 0 36px;
    }

    .fixed .linker-col1 {
        width: 135px;
    }

    .button_container .fixed {
        width: 17px !important;
        padding: 50px 0 55px;
        left: 2%;
    }

    .button_container .scroll {
        width: 17px;
    }
}

@media screen and (min-width:901px) and (max-width:1024px) {
    .fixed {
        padding: 41px 0 41px;
    }

    .fixed .linker-col1 {
        width: 148px;
    }

    .button_container .fixed {
        width: 17px !important;
        padding: 57px 0 60px;
        left: 2%;
    }

    .button_container .scroll {
        width: 17px;
    }
}

@media screen and (min-width:1025px) and (max-width:1240px) {

    /*.button_container .fixed { left:3%;}*/
    .button_container .fixed {
        /*width:17px !important;*/
        left: 1.25%;
    }

    .button_container .scroll {
        width: 65px;
    }

    .button_container .scroll {
        display: none !important;
    }
}

@media screen and (min-width:1241px) and (max-width:1340px) {

    /*.button_container .fixed { width:17px !important;}*/
    .button_container .scroll {
        width: 65px;
    }

    .button_container .scroll {
        display: none !important;
    }
}

@media screen and (min-width:1341px) and (max-width:1440px) {

    /*.button_container .fixed { width:17px !important;}*/
    .button_container .scroll {
        width: 91px;
    }

    .button_container .scroll {
        display: none !important;
    }
}

@media screen and (min-width: 1441px) {
    .button_container .scroll {
        display: none !important;
    }
}