﻿


/*  STYLE
    -----------------------------------------------------------------------------------------------
*/



.logo
{

    font-family: var(--x-title-font);
    font-size: 26px;
    font-weight: 600;

    color: var(--x-title-forecolor);

    letter-spacing: -1px;

    padding: 0 0 0 13px;

}



.footer_style
{

    font-family: var(--x-body-font)  !important;
    font-size: 15px  !important;
    font-weight: 400;

    color: var(--x-body-forecolor);

    letter-spacing: .5px;

}



.main_title
{

    font-family: var(--x-title-font);
    font-size: 32px;
    font-weight: 600;

    color: var(--x-title-forecolor);

    line-height: 39px;
    letter-spacing: 1.5px;

}



.sub_title
{

    font-family: var(--x-title-font) !important;
    font-size: 19px !important;
    font-weight: 400;

    color: var(--x-title-forecolor);

    line-height: 39px;
    letter-spacing: 1px;

}



/*  FORM / INPUT / INPUT STYLE
    -----------------------------------------------------------------------------------------------
*/



.input_style
{

    font-family: var(--x-input-text-font);
    font-size: 15px;

    color: var(--x-input-text-forecolor);
    background-color: transparent;

    outline: none;
    padding: 10px 10px 10px 10px;

    width: 100%;
    max-width: 100%;

    border: 0;

    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: var(--x-input-border-forecolor);

    -moz-appearance: textfield;

}



.input_style:focus
{

    border-bottom-color: var(--x-color-orange);

}



.input_style:hover
{

    border-bottom-color: var(--x-color-orange);

    transition: ease all 0.6s;

}



.input_style::-webkit-inner-spin-button,
.input_style::-webkit-outer-spin-button
{

    -webkit-appearance: none;
    margin:0;

}



/*  BUTTON STYLE
    -----------------------------------------------------------------------------------------------
*/



.button_style
{

    font-family: var(--x-input-text-font);
    font-size: 15px;

    color: var(--x-input-text-forecolor);
    background-color: transparent;

    text-align: center;

    outline: none;
    padding: 10px 0 10px 0;

    width: 70%;

    border-width: 1px;
    border-style: solid;
    border-color: var(--x-input-border-forecolor);

    border-radius: 10px;

    cursor: pointer;

}



.button_style:hover
{

    background-color: var(--x-color-orange);

    border-color: var(--x-color-orange);

    color: var(--x-color-white);

    transition: ease all 0.4s;

}



.button_style:focus
{

    background-color: var(--x-color-orange);

    border-color: var(--x-color-orange);

}



.button_style:disabled:hover
{

    color: var(--x-input-text-forecolor);

    border-color: var(--x-input-label-forecolor);

    cursor: not-allowed;

    background-color: transparent;

}



.cover_button_style
{

    font-family: var(--x-input-text-font);
    font-size: 17px;

    color: var(--x-color-white);
    background-color: var(--x-color-orange);

    text-align: center;

    outline: none;
    padding: 10px 40px 10px 40px;

    width: 360px;
    height: 45px;

    border-width: 1px;
    border-style: solid;
    border-color: var(--x-color-orange);

    border-radius: 2px;

    cursor: pointer;

}



.cover_button_style:hover
{

    background-color: var(--x-color-darkgray);

    border-color: var(--x-color-darkgray);

    color: var(--x-color-white);

    transition: ease all 0.4s;

}



.cover_button_style:focus
{

    background-color: var(--x-color-darkgray);

    border-color: var(--x-color-darkgray);

}



.cover_button_style:disabled:hover
{

    color: var(--x-input-text-forecolor);

    border-color: var(--x-input-label-forecolor);

    cursor: not-allowed;

    background-color: transparent;

}



/*  DROPDOWN STYLE
    -----------------------------------------------------------------------------------------------
*/



.dropdown_style
{

    font-family: var(--x-input-text-font);
    font-size: 15px;

    color: var(--x-input-text-forecolor);
    background-color: transparent;

    outline: none;
    padding: 10px 10px 10px 10px;

    width: 100%;
    max-width: 100%;

    border: 0;

    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: var(--x-input-border-forecolor);

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

}



.dropdown_style:focus
{

    background-color: transparent;

    border-bottom-color: var(--x-color-orange);

}



.dropdown_style:hover
{

    background-color: transparent;

    border-bottom-color: var(--x-color-orange);

}



/*  WARNING / ERROR / SUCCESS / NOTE / MODAL STYLE
    -----------------------------------------------------------------------------------------------
*/



.modal_style
{

    font-family: var(--x-input-text-font);
    font-size: 14px;

    color: var(--x-color-white);

}

