div.en-components-show-all{

    --red: #e31c3d;
    --black: #000000;
    --gray: #f0f0f0;
    --white: #ffffff;


    --color-1:var(--red);
    --color-2:var(--black);
    --color-3:var(--gray);
    --color-4:var(--white);
    --color-5:#fbb700;

    --background-color-1:var(--red);
    --background-color-2:var(--black);
    --background-color-3:var(--gray);
    --background-color-4:var(--white);
    --background-color-5:#fbb700;

    --hover-color-1:var(--red);
    --hover-color-2:var(--black);
    --hover-color-3:var(--gray);
    --hover-color-4:var(--white);
    --hover-color-5:#fbb700;



}


div.en-components-show-all {
    border: none;
    /*background: var(--en-website-color-4);*/
    width: min-content;
    white-space: nowrap;
    font-size: 14px;
    /*border: 1px solid var(--en-website-color-2) ;*/
    border-radius: 4px;
    padding: 6px;

}

div.en-components-show-all a:any-link {
    color: var(--color-1);
    font-size: 15px;
    border-radius: 0px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: normal;
    text-align: center;
    transition: all 0.5s ease-in-out 0s;
    z-index: 1;
    text-decoration: none;
    position: relative;
    float: left;
    padding-bottom: 10px;
}





/*div.en-components-show-all a:any-link:before {*/
/*    !*content: '\003E';*/
/*    top: 50%;*/
/*    transform: translateY(-50%);*!*/
/*    position: absolute;*/
/*    background: var(--red);*/
/*    width: 70px;*/
/*    height: 5px;*/
/*    bottom: -5px;*/
/*    !* left: -0.5px; *!*/
/*    z-index: -1;*/
/*    transition: .5s all ease-in-out;*/
/*    padding: 0 0 0 0.6px;*/
/*    content: "";*/
/*}*/

div.en-components-show-all a:any-link:hover {
    color: var(--hover-color-5);
}


/*!****************************!
div.module-config-1-2 .en-components-show-all {
    border: none;
    background: none;
    width: min-content;
    white-space: nowrap;
    font-size: 14px;
    border-radius: 4px;
    padding: 6px;
}

div.module-config-1-2 .en-components-show-all a:any-link {
    font-size: 18px;
    color: var(--color-1);
    font-weight: 500;
    line-height: 30px;
    text-decoration: none;
    transition: all .5s ease;
    position: relative;
    letter-spacing: 0;
    padding: 0 19px 0 0;
    background: url(/pics/news-event_arrow.png) no-repeat top 10px right 2.5px;
}

div.module-config-1-2 div.en-components-show-all a:any-link:hover,
div.module-config-1-2 div.en-components-show-all a:any-link:focus {
    text-decoration: underline;
}


!****************************!
div.module-config-1-3 .en-components-show-all {
    border: none;
    background: none;
    width: min-content;
    white-space: nowrap;
}

div.module-config-1-3 .en-components-show-all a:any-link {
    font-weight: 700;
    font-size: 18px;
    line-height: 22px;
    position: relative;
    text-decoration: none;
    padding: 0;
    transition: 0.5s all ease-in-out;
    color: var(--color-1);
    margin: 0;
    border: none;
    background: none;
    text-transform: lowercase;
}

div.module-config-1-3 div.en-components-show-all a:any-link:hover,
div.module-config-1-3 div.en-components-show-all a:any-link:focus {
    color: var(--hover-color-2);
    text-decoration: underline;
    letter-spacing: unset;
}

!****************************!


div.module-config-1-4 .en-components-show-all a:any-link {
    font-size: 18px;
    font-weight: 500;
    line-height: 36px;
    letter-spacing: normal;
    text-align: left;
    color: var(--color-2);
    margin: 0 0 0px 0px;
    text-decoration: none;
    !* text-transform: capitalize; *!
    padding: 0 0px 0 16px;
    position: relative;
    transition: all .5s ease-in-out;
    display: inline-block;
}

div.module-config-1-4 .en-components-show-all a:hover::before,
.div.module-config-1-4 .en-components-show-all a:focus::before {
    width: 100%;
    top: unset;
    left: 10px;
    bottom: 0px;
    height: 2px;
    letter-spacing: unset;
}

div.module-config-1-4 .en-components-show-all a::before {
    content: '';
    position: absolute;
    top: 15.5px;
    left: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--background-color-1);
    transition: all .5s ease-in-out;
}


div.module-config-1-4 .en-components-show-all a:any-link {
    border: none;
    background: none;
    width: min-content;
    white-space: nowrap;
}

!****************************!
div.module-config-1-5 .en-components-show-all a:any-link {
    font-size: 18px;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
    color: var(--color-1);
    align-items: center;
    display: flex;
    margin: 0 0 0 2px;
    border: 0;
    background: none;
    padding: 0;
    width: auto;
    min-height: auto;
    position: relative;
    z-index: 1;
    letter-spacing: 0.2px;
    transition: .7s all ease-in-out;
    padding-left: 20px;
}

div.module-config-1-5 .en-components-show-all a::before {
    position: absolute;
    transition: .7s all ease-in-out;
    content: "";
    opacity: 0;
    background: var(--background-color-2);
    width: 14px;
    height: 8px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    z-index: -1;
}

div.module-config-1-5 .en-components-show-all a:hover,
div.module-config-1-5 .en-components-show-all a:focus {
    color: #fff;
}


div.module-config-1-5 .en-components-show-all a:hover::before {
    width: 100%;
    height: 100%;
    left: 0;
    padding: 10px;
    opacity: 1;
}

!****************************!

div.module-config-1-6 .en-components-show-all a:any-link {
    font-weight: 500;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0.8px;
    position: relative;
    text-decoration: none;
    padding: 6.75px 21.12px 6.75px 24.12px;
    transition: 0.5s all ease-in-out;
    color: var(--color-1);
    margin: 0;
    border: none;
    background: none;
    text-transform: lowercase;
}

div.module-config-1-6 .en-components-show-all a::before {
    content: "";
    position: absolute;
    !*background-image: url(/pics/show_all_bg.jpg);*!
    width: 100%;
    left: 1px;
    height: 100%;
    right: 0;
    top: -1px;
    margin: 0 auto;
    z-index: -1;
    !* --bg-color: #fcfcfc;
     --fg-color: #e0e0e0;
     --dot-size: 2px;
     background-image: linear-gradient(180deg, transparent var(--dot-size), var(--bg-color) var(--dot-size)), linear-gradient(90deg, transparent var(--dot-size), var(--bg-color) var(--dot-size)), linear-gradient(0deg, var(--fg-color) 0%, var(--fg-color) 100%);
     background-position: 5px 5px;
     background-size: 7px 7px;
     background-repeat: repeat;*!
    --bg-color: #ffffff;
    --fg-color: #e8e8e8;
    --dot-size: 1px;
    background-image: linear-gradient(180deg, transparent var(--dot-size), var(--bg-color) var(--dot-size)), linear-gradient(0deg, var(--fg-color) 0%, var(--fg-color) 100%);
    background-size: 2px 2px;
    background-repeat: repeat;
}

div.module-config-1-6 .en-components-show-all a::after {
    content: "";
    position: absolute;
    background: none;
    border: 2px solid var(--hover-color-5);
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    right: 0;
    margin: 0 auto;
    box-sizing: border-box;
    transform-origin: left;
    transition: transform 0.5s;
    transform: scaleX(0);
}

div.module-config-1-6 .en-components-show-all a:hover,
div.module-config-1-6 .en-components-show-all a:focus {
    color: var(--color-2);
    box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 15%);
}

div.module-config-1-6 .en-components-show-all a:hover::before,
.div.module-config-1-6 .en-components-show-all a:focus::before {
    background-position: center right;
}

div.module-config-1-6 .en-components-show-all a:hover::after,
.div.module-config-1-6 .en-components-show-all a:focus::after {
    transform-origin: right;
    transform: scaleX(1);
}

!***************************!

div.module-config-1-7 .en-components-show-all a:any-link {
    float: left;
    font-size: 18px;
    line-height: 18px;
    font-weight: 400;
    color: var(--color-2);
    text-align: center;
    position: relative;
    margin: 0 0 0 0;
    display: inline-block;
    padding: 0 10px 3px;
    text-decoration: none;
    transition: 0.5s all ease-in-out;
    letter-spacing: 0.1px;
    z-index: 2;
    background-color: rgba(0, 0, 0, 0.01);
    padding-left: 20px;
    padding-top: 6px;
}

div.module-config-1-7 .en-components-show-all a::before {
    content: "";
    position: absolute;
    background: var(--background-color-1);
    width: 16.5px;
    height: 16.5px;
    left: -1px;
    z-index: -1;
    transform: rotate(45deg);
    transition: 0.5s all ease-in-out;
}

div.module-config-1-7 .en-components-show-all a::after {
    content: "";
    position: absolute;
    width: 0;
    height: 114%;
    top: 1px;
    right: -6px;
    border: 2px solid #fff;
    transition: 0.5s all ease-in-out;
    box-sizing: border-box;
    border-color: var(--color-5);
    opacity: 0;
    z-index: -1;
    box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 10%);
}

div.module-config-1-7 .en-components-show-all a:hover,
div.module-config-1-7 .en-components-show-all a:focus {
    color: var(--hover-color-4);
}

div.module-config-1-7 .en-components-show-all a:hover::before,
.div.module-config-1-7 .en-components-show-all a:focus::before {
    transform: rotate(0);
    width: 100%;
    left: 0;
    background: var(--background-color-1);
    top: 3px;
    height: 100%;
}

div.module-config-1-7 .en-components-show-all a:hover::after,
.div.module-config-1-7 .en-components-show-all a:focus::after {
    width: 100%;
    opacity: 1;
    left: 0;
}

!***************************!

div.module-config-1-8 .en-components-show-all a:any-link {
    float: left;
    font-size: 20px;
    line-height: 20px;
    font-weight: 400;
    color: var(--color-2);
    text-align: center;
    position: relative;
    margin: 0 0 0 0;
    display: inline-block;
    padding: 0 10px 3px;
    text-decoration: none;
    transition: 0.5s all ease-in-out;
    letter-spacing: 0.1px;
    z-index: 2;
    background-color: rgba(0, 0, 0, 0.01);
    padding-left: 20px;
}


div.module-config-1-8 .en-components-show-all a::after {
    content: "";
    position: absolute;
    width: 0;
    height: 114%;
    top: -2px;
    right: -6px;
    border: 2px solid #fff;
    transition: 0.5s all ease-in-out;
    box-sizing: border-box;
    border-color: var(--hover-color-1);
    opacity: 0;
    z-index: -1;
    box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 10%);
}

div.module-config-1-8 .en-components-show-all a:hover,
div.module-config-1-8 .en-components-show-all a:focus {
    color: var(--hover-color-5);
}

div.module-config-1-8 .en-components-show-all a:hover::before,
.div.module-config-1-8 .en-components-show-all a:focus::before {
    transform: rotate(0);
    width: 100%;
    left: 0;
    background: var(--hover-color-1);
    top: 0px;
    height: 100%;
}

div.module-config-1-8 .en-components-show-all a:hover::after,
.div.module-config-1-8 .en-components-show-all a:focus::after {
    width: 100%;
    opacity: 1;
    left: 0;
}*/

/*********Button2 Desing********************/

div.en-components-button2 {

    --color-button-text: #fff;
    --color-button-text_2: var(--red);
    --color-button-text_3: #000000;
    --color-button-hover-text: var(--red);
    --color2-button-hover-text: #000000;
    --background-color-button: #000000;
    --background-color-button_2: #FFF;
    --background-color-button_3: var(--red);


    --font-size-button-text: clamp(15px, 1.8181vw, 20px);
    --font-size-button-text-hover: clamp(15px, 1.8181vw, 20px);
    --font-family: inherit;


}

div.en-components-button2 {
    text-align: center;
}

div.en-components-button2 a {
    color: var(--color-button-text);
    background: var(--background-color-button);
    box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 15%);
    transition: 0.5s all;
    font-size: var(--font-size-button-text);
    line-height: 22px;
    display: inline-block;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    position: relative;
    padding: 10px 20px 10px;
    letter-spacing: 0.8px;
    z-index: 99;
}

div.en-components-button2 a:hover {
    color: var(--red);
}

div.en-components-button2 a::before {
    content: "";
    position: absolute;
    background: #fff;
    width: 0;
    height: 100%;
    left: 0;
    top: 0;
    z-index: -1;
    opacity: 0;
    transition: 0.7s all ease-in-out;
}

div.en-components-button2 a:hover::before,
div.en-components-button2 a:focus::before {
    width: 50%;
    opacity: 1;
}

div.en-components-button2 a::after {
    content: "";
    position: absolute;
    background: #fff;
    width: 0;
    height: 100%;
    right: 0;
    top: 0;
    z-index: -1;
    opacity: 0;
    transition: 0.7s all ease-in-out;
}

div.en-components-button2 a:hover::after,
div.en-components-button2 a:focus::after {
    width: 50%;
    opacity: 1;
}


div.ensbutton1-1-2 div.en-components-button2 a {
    font-size: var(--font-size-button-text);
    color: var(--color-button-text);
    background: var(--background-color-button);
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    position: relative;
    border: 2px solid transparent;
    z-index: 1;
    transition: 0.3s all ease-in-out;
}

div.ensbutton1-1-2 div.en-components-button2 a:hover,
div.ensbutton1-1-2 div.en-components-button2 a:focus {
    box-shadow: 5px 5px 25px 0px rgba(0, 0, 0, 0.1),
    4px 4px 5px 0px rgba(0, 0, 0, 0.1);
    color: var(--color-button-hover-text) !important;
}

div.ensbutton1-1-2 div.en-components-button2 a:hover::before,
div.ensbutton1-1-2 div.en-components-button2 a:focus::before {
    transform-origin: left;
    transform: scaleX(1);
    transform: scale(1.01);
}

div.ensbutton1-1-2 div.en-components-button2 a::before {
    content: "";
    position: absolute;
    background: #fff;
    width: 100%;
    height: 100%;
    left: -2px;
    top: -2px;
    transform-origin: left;
    transition: transform 0.5s;
    transform: scaleX(0);
    z-index: -1;
    border: 2px solid;
    --start-border-color: #FF7133;
    border-image: linear-gradient(to right, var(--start-border-color), var(--color-button-hover-text)) 1;
    clip-path: polygon(0% 0, 99% 0, 90% 100%, 0% 100%);
}

div.ensbutton1-1-2 div.en-components-button2 a span {
    font-weight: 600;
}

div.ensbutton1-1-2 div.en-components-button2 a:hover span,
div.ensbutton1-1-2 div.en-components-button2 a:focus span {
    background-image: linear-gradient(
            -225deg,
            #fff 0%,
            var(--color-button-hover-text) 58%,
            var(--color-button-hover-text) 67%,
            #fff 100%
    );
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: hover_text 1s linear infinite;
}

div.ensbutton1-1-2 div.en-components-button2 a::after {
    background: unset;
}
div.ensbutton1-1-3 div.en-components-button2 a {
    font-weight: 600;
    color: var(--color-button-text_2);
    background: var(--background-color-button_2);
    text-decoration: none;
    text-transform: uppercase;
    position: relative;
    width: 100%;
    display: inline-block;
    transition: 0.5s all ease-in-out;
    text-align: center;
    border: 2px solid #e9eff5;
    box-sizing: border-box;

}

div.ensbutton1-1-3 div.en-components-button2 a:hover,
div.ensbutton1-1-3 div.en-components-button2 a:focus {
    background-color: var(--background-color-button_2);
    color: var(--color-button-text_3);
    --start-border-color: #FF7133;
    border-image: linear-gradient(to right, var(--start-border-color), var(--color-button-hover-text)) 1;
    box-shadow: 5px 5px 25px 0px rgb(0 0 0 / 10%), 4px 4px 5px 0px rgb(0 0 0 / 10%);
    text-decoration: underline;
}

div.ensbutton1-1-4 div.en-components-button2 a {
    font-weight: 600;
    color: var(--color2-button-hover-text);
    background: var(--background-color-button_3);
    text-decoration: none;
    text-transform: uppercase;
    position: relative;
    width: 100%;
    display: inline-block;
    transition: 0.5s all ease-in-out;
    text-align: center;
    border: 2px solid #e9eff5;
    box-sizing: border-box;

}

div.ensbutton1-1-4 div.en-components-button2 a:hover,
div.ensbutton1-1-4 div.en-components-button2 a:focus {
    background-color: var(--background-color-button_3);
    color: var(--color2-button-hover-text);
    --start-border-color: #FF7133;
    border-image: linear-gradient(to right, var(--start-border-color), var(--color-button-hover-text)) 1;
    box-shadow: 5px 5px 25px 0px rgb(0 0 0 / 10%), 4px 4px 5px 0px rgb(0 0 0 / 10%);
}



@keyframes hover_text {
    to {
        background-position: 200% center;
    }
}


@media only screen and (max-width: 390px) {
    div.en-components-button2 a {
        padding: 4px 24px 4px;
        font-size: clamp(14px, 4.1vw, 16px);
        letter-spacing: 2px;
    }
}










