:root {
    --white: rgb(255,255,255);
    --black: rgb(0,0,0);
    --esmoBlue: rgb(0, 87, 184);
    --semiconBlue: rgb(65, 143, 222);
    --automationBlue: rgb(0, 147, 178);
    --grayMedium: rgb(175,175,175);
    --grayDark: rgb(59,60,57);
    --grayDarkTransparent: rgb(59,60,57, 0.4);
    --red: rgb(168,4,3);
    --swiper-theme-color: rgb(0, 147, 178);
    --swiper-pagination-bullet-inactive-color: #fff;
    --swiper-pagination-bullet-inactive-opacity: 1.0;
}


*{
    font-family: 'Outfit';
    font-size: 16px;
    font-weight: 300;
}

h1,
h1.cWhite{
    font-size: 2rem !important;
    line-height: 1.3;
    font-weight: 600;
    margin-bottom: 1.0rem;
}

h2,
ph2,
h2.cWhite{
    font-size: 1.75rem !important;
    line-height: 1.3;
    font-weight: 500;
    margin-bottom: 1.0rem;
}

h3,
h3.cWhite
pH3{
    font-size: 1.250rem !important;
    line-height: 1.3;
    font-weight: 500;
    margin-bottom: 1.000rem;
}

h4,
h4.cWhite
h5{
    font-size: 1.000rem !important;
    line-height: 1.3;
    font-weight: 500;
    margin-bottom: 0.875rem;
}

* span.fWeight100{
    font-weight: 100 !important;
    line-height: 1.5;
    font-size: 100%;
}

* span.fWeight200{
    font-weight: 200 !important;
    line-height: 1.5;
    font-size: 100%;
}
* span.fWeight300{
    font-weight: 300 !important;
    line-height: 1.5;
    font-size: 100%;
}
* span.fWeight500{
    font-weight: 500 !important;
    line-height: 1.5;
    font-size: 100%;
}
* span.fWeight600{
    font-weight: 600 !important;
    line-height: 1.5;
    font-size: 100%;
}


.divFullSizeBanner h2{
    
    color: var(--white);
    text-shadow: 0 2px 8px rgba(44,50,53,.85);
    
}


blockquote p,
sliderInner blockquote p{
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.250;
    
}

.sliderInner blockquote p,
.sliderInner p{
    color: white !important;
    text-shadow: 0 2px 8px rgba(44,50,53,.85);
    
}

p{
    font-size: 1.000rem;
    font-weight: 300;
    line-height: 1.5;
}

.table tbody tr td{
    font-size: 1.000rem;
    font-weight: 300;
    line-height: 1.5;
    margin-bottom: 0 !important;
}

.table tbody tr td strong{
    font-size: 1.000rem;
    font-weight: 300;
    line-height: 1.5;
    margin-bottom: 0 !important;
}

/************
*** Blockquote ***
************/

blockquote p{
    font-size: 1.125rem;
    font-weight: 300;
    line-height: 1.5;
    font-style: italic;
}

/************
*** List ***
************/

ol,
ul{
    margin:0 0 0 0;
    padding: 10px 0 0 20px;
}

ol li,
ul li{
    font-size: 1.000rem;
    font-weight: 300;
    line-height: 1.5;
    padding: 0 0 10px 10px;
    margin: 0;
}

ul.ulCheck li,
ul.ulPlus li,
ul.ulArrow li{
    font-size: 1.000rem;
    font-weight: 300;
    line-height: 1.5;
    padding: 0 0 10px 40px;
    margin: 0;
    position: relative;
}

ul.ulCircle li{
    font-size: 1.000rem;
    font-weight: 300;
    line-height: 1.5;
    padding: 0 0 10px 30px;
    margin: 0;
    position: relative;
}

ul.ulCheck,
ul.ulPlus,
ul.ulCircle,
ul.ulArrow{
    list-style: none;
    padding: 5px 0 15px 10px;
}



ul.ulCheck li::before {
    content: '' !important;
    background-image: url(../../../../../../fileadmin/user_upload/images/icons/iconCheck.svg);
    display: inline-block;
    height: 30px;
    width: 30px;
    background-repeat: no-repeat;
    background-size: 30px 30px;
    position: absolute;
    top: -2px;
    left: 0;
}

ul.ulPlus li::before {
    content: '' !important;
    background-image: url(../../../../../../fileadmin/user_upload/images/icons/iconPlus.svg);
    display: inline-block;
    height: 30px;
    width: 30px;
    background-repeat: no-repeat;
    background-size: 30px 30px;
    position: absolute;
    left: 0;
    top: 0;
    margin: 0;
}

ul.ulCircle li::before {
    content: '' !important;
    background-image: url(../../../../../../fileadmin/user_upload/images/icons/iconCircle.svg);
    margin: 0;
    display: inline-block;
    height: 24px;
    width: 26px;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    position: absolute;
    left: 0;
    top: 3px;
}

ul.ulArrow li::before {
    content: '' !important;
    background-image: url(../../../../../../fileadmin/user_upload/images/icons/iconArrow.svg);
    display: inline-block;
    height: 30px;
    width: 30px;
    background-repeat: no-repeat;
    background-size: 30px 30px;
    position: absolute;
    left: 0;
    top: -2px;
    margin: 0;
}


.ce-headline-left,
.text-left{
    text-align: start;
}

.ce-headline-center,
.text-center{
    text-align: center;
}

.ce-headline-right,
.text-right{
    text-align: end;
}

.text-justify{
    text-align: justify;
}


footer p{
    font-size: 1rem;
    line-height: 1.250rem !important;
}

    
footer p a{
    font-size: 1rem;
    line-height: 1.250rem !important;
    text-decoration: none;
    color: var(--white);
}

p a,
a{
    font-size: 1.000rem;
    text-decoration: underline;
    font-weight: 300;
    display: inline-block;
    color: var(--black);
}

p strong{
    font-size: 100%;
    font-weight: 500;
    color: var(--black);
}
p a strong,
p a:hover strong{
    font-size: 100%;
    font-weight: 500;
    color: var(--black);
    text-decoration: underline;   
}

hr{
    margin: 20px 0 20px 0;
    padding: 0;
    border-top: 1px solid var(--grayDark);
}

/************
*** Color ***
************/

.cWhite{
    color: var(--white);
    font-size: 100%
}

.cGrayMedium{
    color: var(--grayMedium);
    font-size: 100%
}

.cGrayDark{
    color: var(--grayDark);
    font-size: 100%
}

.cBlack{
    color: var(--black);
    font-size: 100%
}

.cEsmoBlue{
    color: var();
}

.cSemiconBlue{
    color: var(--semiconBlue);
}

.cAutomationBlue{
    color: var(--automationBlue);
}

/************
*** BG Color ***
************/

.bgWhite{
    background-color: var(--white);
}

.bgBlack{
    background-color: var(--black);
}

.bgBlack *{
    color: var(--white);
}

.bgEsmoBlue{
    background-color: var();
}

.bgEsmoBlue *{
    color: var(--white);
}

.bgSemiconBlue{
    background-color: var(--semiconBlue);
}

.bgAutomationBlue{
    background-color: var(--automationBlue);
}

.bgGrayMedium{
    background-color: var(--grayMedium);
}

.bgGrayMedium *{
    color: var(--white);
}

.bgGrayDark{
    background-color: var(--grayDark);
}

.bgGrayDark *{
    color: var(--white);
}

.bgGrayDark *:hover{
    color: var(--white) !important;
}


/*
* Button
*/

.btnNews,
.btnNews:hover{
    padding: 10px 30px;
    width: 100%;
    margin-top: 0;
    margin-right: 10px;
    border-radius: 6px;
    font-size: 1.000rem !important;
    line-height: 1.25;
    font-weight: 300;
    text-decoration: none;
    text-align: center;
    display: inline-block;
}

.btnSmall,
.btnSmall:hover{
    padding: 10px 30px;
    margin-top: 0;
    margin-right: 10px;
    border-radius: 6px;
    font-size: 1.000rem !important;
    line-height: 1.25;
    font-weight: 300;
    text-decoration: none;
    text-align: center;
    display: inline-block;
}

.btnSmall .material-symbols-outlined,
.btnSmall:hover .material-symbols-outlined{
    font-size: 1.000rem;
    line-height: 1.000rem;
}

.btnRegular,
.btnRegular:hover{
    padding: 10px 30px;
    margin-top: 0;
    margin-right: 10px;
    border-radius: 6px;
    font-size: 1.000rem !important;
    line-height: 1.5;
    font-weight: 300 !important;
    text-decoration: none;
    text-align: center;
    display: inline-block;
    transition: 0.5s
}

.btnRegular .material-symbols-outlined,
.btnRegular:hover .material-symbols-outlined{
    font-size: 1.250rem;
    line-height: 1.250rem;
}

.btnLarg,
.btnLarg:hover{
    padding: 15px 40px;
    margin-top: 0;
    margin-right: 10px;
    border-radius: 5px;
    font-size: 1.500rem !important;
    line-height: 1.500rem !important;
    font-weight: 300 !important;
    text-decoration: none !important;
    text-align: center;
    display: inline-block;
}

.btnLarg .material-symbols-outlined,
.btnLarg:hover .material-symbols-outlined{
    font-size: 1.500rem;
    line-height: 1.500rem;
}

.btnBlue{
    background-color: var() !important;
    color: var(--white) !important;
}

.btnBlue:hover{
    background-color: var() !important;
    color: var(--white) !important;
}

.btnAutomation{
    background-color: var(--automationBlue) !important;
    color: var(--white) !important;
}

.btnAutomation:hover{
    background-color: var(--automationBlue) !important;
    color: var(--white) !important;
}

.btnGrayDark{
    background-color: var(--grayDark) !important;
    color: var(--white) !important;
}

.btnGrayDark:hover{
    background-color: var(--grayDark) !important;
    color: var(--white) !important;
}

.btnRed{
    background-color: var(--red) !important;
    color: var(--white) !important;
}

.btnRed:hover{
    background-color: var(--red) !important;
    color: var(--white) !important;
}