/*ALIGN*/
.al_center{text-align: center !important;}
.al_left{text-align: left !important;}
.al_right{text-align: right !important;}
.al_justify{text-align: justify !important;}

/***********************************
######### CUSTOM BUTTONS ###########
***********************************/
.btn{display: inline-block; cursor: pointer; padding: 5px 10px; margin-top: 2px; background: #888; font-size: 0.9em; color: #fff; text-decoration: none; text-align: center; border: none; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -webkit-transition: all linear 0.5s; -moz-transition: all linear 0.5s; transition: all linear 0.5s;}
.btn:hover{background: #555; text-decoration: none; text-shadow: none;}
.btn_small{font-size: 1em; padding: 7px 12px;}
.btn_medium{font-size: 1.1em; padding: 10px 15px;}
.btn_large{font-size: 1.2em; padding: 15px 20px;}
.btn_blue{background-color: #0E96E5;}
.btn_blue:hover{background-color: #096397; text-shadow: none;}
.btn_green{background-color: #3CBA5B;}
.btn_green:hover{background-color: #37AB54; text-shadow: none;}
.btn_yellow{background-color: #FAAD50;}
.btn_yellow:hover{background-color: #CC8D41; text-shadow: none;}
.btn_red{background-color: #F45563;}
.btn_red:hover{background-color: #C54550 !important; text-shadow: none;}

.btn_cta_blue{padding: 15px 30px; font-size: 1.2em; font-weight: bold; text-transform: uppercase; background: #052893; border-bottom: 5px solid rgba(0,0,0,0.2);}
.btn_cta_blue:hover{background-color: #0984e3; border-color: rgba(0,0,0,0.3);}

.btn_cta_green{padding: 15px 30px; font-size: 1.2em; font-weight: bold; text-transform: uppercase; background: #3CBA5B; border-bottom: 5px solid rgba(0,0,0,0.2);}
.btn_cta_green:hover{background-color: #37AB54; border-color: rgba(0,0,0,0.3);}

.btn_cta_yellow{padding: 15px 30px; font-size: 1.2em; font-weight: bold; text-transform: uppercase; background: #FAAD50; border-bottom: 5px solid rgba(0,0,0,0.2);}
.btn_cta_yellow:hover{background-color: #CC8D41; border-color: rgba(0,0,0,0.3);}

.btn_cta_red{padding: 15px 30px; font-size: 1.2em; font-weight: bold; text-transform: uppercase; background: #F45563; border-bottom: 5px solid rgba(0,0,0,0.2);}
.btn_cta_red:hover{background-color: #C54550; border-color: rgba(0,0,0,0.3);}

.btn_cta_line_blue{padding: 15px 30px; font-size: 1.2em; font-weight: bold; text-transform: uppercase; color: #052893 !important; background: transparent !important; border: 2px solid #052893 !important;}
.btn_cta_line_blue:hover{color: #fff !important; background: #052893 !important;}
.btn_cta_line_green{padding: 15px 30px; font-size: 1.2em; font-weight: bold; text-transform: uppercase; color: #008068 !important; background: transparent !important; border: 2px solid #008068 !important;}
.btn_cta_line_green:hover{color: #fff !important; background: #008068 !important;}
.btn_cta_line_yellow{padding: 15px 30px; font-size: 1.2em; font-weight: bold; text-transform: uppercase; color: #CC8D41 !important; background: transparent !important; border: 2px solid #CC8D41 !important;}
.btn_cta_line_yellow:hover{color: #fff !important; background: #CC8D41 !important;}
.btn_cta_line_red{padding: 15px 30px; font-size: 1.2em; font-weight: bold; text-transform: uppercase; color: #C54550 !important; background: transparent !important; border: 2px solid #C54550 !important;}
.btn_cta_line_red:hover{color: #fff !important; background: #C54550 !important;}

.btn_blue_noaction:hover{background: #0E96E5 !important; cursor: default !important;}
.btn_green_noaction:hover{background: #3CBA5B !important; cursor: default !important;}
.btn_yellow_noaction:hover{background: #FAAD50 !important; cursor: default !important;}
.btn_red_noaction:hover{background: #F45563 !important; cursor: default !important;}

.popup{display: inline-block; cursor: default; width: 100%; padding: 5px 10px; margin-top: 2px; background: #888; font-size: 1.2em; color: #fff; text-decoration: none; text-align: center; border: none; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0;}
.popup_cta_blue{padding: 15px 30px; font-size: 1.4em; font-weight: bold; text-transform: uppercase; background: #096397;}
.popup_cta_green{padding: 15px 30px; font-size: 1.4em; font-weight: bold; text-transform: uppercase; background: #37AB54;}
.popup_cta_yellow{padding: 15px 30px; font-size: 1.4em; font-weight: bold; text-transform: uppercase; background: #CC8D41;}
.popup_cta_red{padding: 15px 30px; font-size: 1.4em; font-weight: bold; text-transform: uppercase; background: #C54550;}

/***********************************
########## TOOLTIP CUSTOM ##########
***********************************/
.tooltip_custom{z-index: 50; color: #666; position: relative; font-size: 1.3em;}
.tooltip_custom span:after {content: ''; position: absolute; top: 100%; left: 50%; width: 0; height: 0; margin-left: -8px; border-top: 8px solid #000000; border-right: 8px solid transparent; border-left: 8px solid transparent;}
.tooltip_custom span{position: absolute; bottom: 100%; margin-bottom: 12px; left: 50%; margin-left: -30px; padding: 10px 5px; z-index: 99; display: block; width: 60px; background: #000; text-align: center; display: none; font-size: 0.75rem; text-shadow: 1px 1px #000; font-weight: 500; border-radius: 4px; text-transform: capitalize; color: #FFF !important;}
.tooltip_custom:hover span{display: block;}
.tooltip_custom span:hover{display: none;}

/***********************************
######## BORDER RADIUS  ############
***********************************/
.radius3{border-radius: 3px !important;}
.radius5{border-radius: 5px !important;}
.radius10{border-radius: 10px !important;}
.radius50{border-radius: 50px !important;}

/***********************************
########## TOOLTIP CUSTOM ##########
***********************************/
.scrollTop {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    width: 40px;
    height: 40px;
    cursor: pointer;
    border-radius: 50%;
    background: var(--themeColorGreen);
    transition: background-color ease 0.5s;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
}

.scrollTop:hover {
    background: var(--themeColorBlueNavy);
    transition: background-color ease 0.5s;
}

.scrollTop span {
    font-size: 1.5em;
    color: #fff;
    margin-bottom: 4px !important
}

/***********************************
######## HTML CHARS CONFIG #########
***********************************/
.htmlchars{display: block; width: 100%; padding: 30px; font-size: 1.3em;}
.htmlchars h3{display: block; font-size: 2em; font-weight: 300; margin-bottom: 30px}
.htmlchars h4{display: block; font-size: 1.8em; font-weight: 300; margin-bottom: 30px}
.htmlchars h5{display: block; font-size: 1.6em; font-weight: 300; margin-bottom: 30px}
.htmlchars p{margin-bottom: 20px; font-size: 0.9em; font-weight: 400;}
.htmlchars p:last-of-type{margin: 0;}
.htmlchars iframe{width: 100%; border: none;}
.htmlchars ul{list-style: disc; margin: 20px 30px !important; padding: 0; text-indent: 0; font-size: 0.9em;}
.htmlchars ol{margin: 20px 30px !important; text-indent: 0; font-size: 0.9em;}
.htmlchars li{font-size: 0.9em; font-weight: 400;}
.htmlchars form{padding: 20px; background: #fbfbfb; margin: 20px 0; text-align: center; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;}
.htmlchars form label{display: block; margin-bottom: 15px; font-size: 0.9em; text-transform: uppercase;}
.htmlchars form input,
.htmlchars form textarea{border: 1px solid #ccc; display: block; margin-top: 15px; font-size: 1em; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;}
.htmlchars form button,
.htmlchars form input[type="submit"]{display: block; border: 0; color: #fff; text-shadow: 0 1px #000; cursor: pointer; padding: 15px 30px; font-size: 1.2em; font-weight: bold; text-transform: uppercase; background: #00B494; border-bottom: 5px solid #008068; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;}
.htmlchars form button:hover,
.htmlchars form input[type="submit"]:hover{background-color: #008068; border-color: #0B5747;}
.htmlchars a{color: #0E96E5; text-decoration: none;}
.htmlchars a:hover{text-decoration: underline;}
.htmlchars pre{margin-bottom: 30px; font-size: 0.8em;}
.htmlchars .btn{display: block; color: #fff;}
.htmlchars .btn:hover{text-decoration: none !important;}

/***********************************
######### TRIGGER CUSTOM ###########
***********************************/
.trigger{position: relative; width: 100%; padding: 15px !important; background: #333; font-size: 1em; font-weight: normal; color: #fff; text-align: left; margin: 15px 0; border-left: 7px solid rgba(0,0,0,0.2); outline: 10px solid rgba(255,255,255,0.3);}
.message{background: rgba(0,0,0,0.2); padding: 5px 10px; margin-right: 18px !important;}
.trigger_none{margin-bottom: 0;}
.trigger p{margin-top: 10px;}
.trigger_ajax{display: none; cursor: pointer;}
.trigger_success{background-color: #3FC35F;}
.trigger_info{background-color: #0E96E5;}
.trigger_alert{background-color: #FAAD50;}
.trigger_error{background-color: #F45563;}
.trigger_modal{position: fixed; right: 0; top: 0; width: 460px; max-width: 80%; padding: 20px 20px 0 0; cursor: pointer; z-index: 9999 !important;}
.trigger_modal .trigger{padding: 20px; margin: auto 30px auto auto;}

/* PAGINATOR */
.paginator{display: block; width: 100%; text-align: center; margin-top: 20px;}
.paginator li{display: inline-block; margin: 0 5px 0 0;}
.paginator li:last-of-type{display: inline-block; margin: 0;}
.paginator li span, .paginator li a{font-size: 1em; display: inline-block; padding: 10px 15px; background: rgba(0,0,0,0.2); border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; text-decoration: none; color: #333; font-weight: 600; text-shadow: none;}
.paginator li a:hover{background: #0E96E5;}
.paginator li span{background: #888; text-shadow: 1px 1px #333;}

/***********************************
############### BARS  ##############
***********************************/
.bar_blue{display: inline-block; vertical-align: middle; padding: 4px 10px 5px 10px; background: #45D4FF; font-size: 0.8em; color: #fff;}
.bar_green{display: inline-block; vertical-align: middle; padding: 4px 10px 5px 10px; background: #3CBA5B; font-size: 0.8em; color: #fff;}
.bar_yellow{display: inline-block; vertical-align: middle; padding: 4px 10px 5px 10px; background: #FAAD50; font-size: 0.8em; color: #fff;}
.bar_red{display: inline-block; vertical-align: middle; padding: 4px 10px 5px 10px; background: #F45563; font-size: 0.8em; color: #fff;}
.bar_icon:before{ display: inline-block; margin-right: 4px !important;}

/***********************************
########## FONT COLOR  #############
***********************************/
.font_black{color: black !important;}
.font_white{color: white !important;}
.font_blue{color: #45D4FF !important;}
.font_green{color: #3CBA5B !important;}
.font_yellow{color: #FAAD50 !important;}
.font_red{color: #F45563 !important;}
.font_purple{color: #B78FD3 !important;}
.font_vintage{color: #7EB1BC !important;}

/***********************************
########## BACK COLOR  #############
***********************************/
.bg_blue{background-color: #45D4FF !important;}
.bg_green{background-color: #3CBA5B !important;}
.bg_yellow{background-color: #FAAD50 !important;}
.bg_red{background-color: #F45563 !important;}
.bg_purple{background-color: #B78FD3 !important;}
.bg_vintage{background-color: #7EB1BC !important;}

/***********************************
########### COLUNA MODEL ###########
***********************************/
.table{display: inline-block; width: 100%; vertical-align: top;}
.table:before{clear: both;}
.col1{width: 100%; margin: 15px 0 15px 0;}
.col2{width: 48%; margin-right: 4%; float: left;}
.col2:nth-of-type(2n+0){margin-right: 0; float: right;}
.col3{width: 32%; margin-right: 2%;}
.col3:nth-of-type(3n+0){margin-right: 0;}
.col4{width: 23.5%; margin-right: 2%;}
.col4:nth-of-type(4n+0){margin-right: 0;}
.col5{width: 18.4%; margin-right: 2%;}
.col5:nth-of-type(5n+0){margin-right: 0;}

@media (max-width: 40em){.col2, .col3, .col4, .col5{width: 100%; margin: 15px 0 15px 0 !important; display: block;}}
@media (min-width: 40.0625em) and (max-width: 48em){.col2, .col3, .col4, .col5{width: 48%; margin-right: 4% !important; display: block;} .col2:nth-of-type(2n+0), .col3:nth-of-type(2n+0), .col4:nth-of-type(2n+0), .col5:nth-of-type(2n+0){margin-right: 0 !important;}}
@media (min-width: 48em) and (max-width: 64em){.col3, .col4, .col5{width: 32%; margin-right: 2% !important;} .col3:nth-of-type(3n+0), .col4:nth-of-type(3n+0), .col5:nth-of-type(3n+0){margin-right: 0 !important;}}
@media (min-width: 64em) and (max-width: 80em){.col4, .col5{width: 22.75%; margin-right: 2% !important;} .col4:nth-of-type(4n+0), .col5:nth-of-type(4n+0){margin-right: 0 !important;}}