/**************************************/
/*   BOOTSTRAP CLASSES MODIFICATIONS  */
/**************************************/
[class^="col-"], [class*=" col-"], .container-fluid{
    padding-right: 0px;
    padding-left: 0px;
}

.row {
    margin-right: 0px;
    margin-left: 0px;
}

.mm-slideout { 
	z-index:auto;
}

.form-control {
	font-size: 12px;
}

.overflow-auto {
	overflow: auto !important;
}


/**************************************/
/*     HEADINGS SIZES & SCALING       */
/**************************************/

/*** default font properties ***/
h1, h2, h3, h4, h5, h6{
    color: #00b842;
}

h1, h2, h3, h4 {
    font-family: "Noto Sans Bold";
}

h5, h6 {
    font-family: "Noto Sans";
}

/*** extra small devices - 30% of original font-size ***/
h1{
    font-size: 1.36rem;
    margin-bottom: 0.6rem;
}
h2{
    font-size: 1.25rem;
    margin-bottom: 0.5rem;
}
h3{
    font-size: 1.18rem;
    margin-bottom: 0.4rem;
}
h4{
    font-size: 1.1rem;
    margin-bottom: 0.3rem;
}
h5{
    font-size: 1.03rem;
    margin-bottom: 0.3rem;
}
h6{
    font-size: 0.95rem;
    margin-bottom: 0.3rem;
}

/*** small devices - 50% of original font-size ***/
@media (min-width: 576px) {
    h1{
        font-size: 1.69rem;
    }
    h2{
        font-size: 1.5rem;
    }
    h3{
        font-size: 1.38rem;
    }
    h4{
        font-size: 1.25em;
    }
    h5{
        font-size: 1.13rem;
    }
    h6{
        font-size: 1rem;
    }
}

/*** medium devices - 80% of original font-size ***/
@media (min-width: 768px) {
    h1{
        font-size: 2.18rem;
    }
    h2{
        font-size: 1.88rem;
    }
    h3{
        font-size: 1.68rem;
    }
    h4{
        font-size: 1.48rem;
    }
    h5{
        font-size: 1.28rem;
    }
    h6{
        font-size: 1.08rem;
    }
}

/*** large and extra large devices - 100% font size ***/
@media (min-width: 992px) {
    h1{
        font-size: 2.5rem;
    }
    h2{
        font-size: 2.125rem;
    }
    h3{
        font-size: 1.875rem;
    }
    h4{
        font-size: 1.625rem;
    }
    h5{
        font-size: 1.375rem;
    }
    h6{
        font-size: 1.125rem;
    }
}

/**************************************/
/*              LINKS                 */
/**************************************/

a{
    color: #3e6ca8;
    text-decoration: none;
    font-family: inherit;
    font-weight: bold;
}
a:hover{
    color: #f00;
    text-decoration: underline;
}

/**************************************/
/*   PARAGRAPHS  & UNORDERED LISTS    */
/**************************************/

p, ul{
    margin-bottom: 0.5rem;
}

ul{
    padding-left: 30px;
}

/*** bullet lists ***/
ul.bullet-list, ul.bullet-list.green-bullets{
    list-style: none;
    padding-left: 10px;
}

ul.bullet-list li{
    font-family: "Noto Sans", Impact, Charcoal, sans-serif;
    font-size: 15px;
}

ul.bullet-list li::before, ul.bullet-list.green-bullets li::before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 6px;
    vertical-align: middle;
    background: url(/site/images/tabs.png) 0 -602px no-repeat;
}

ul.bullet-list.black-bullets li::before {
    background: url(/site/images/tabs.png) 0 -617px no-repeat;
}

ul.steps {
	padding-left: 0;
    width: 100%;
    display: flex;
    counter-reset: steps-counter;
}

ul.steps li {
    list-style: none;
    width: 25%;
    text-align: center;
    position: relative;
}

ul.steps li a::before {
    content: counter(steps-counter);
	counter-increment: steps-counter;
	background: #e5e5e5;
	border-radius: 20px;
	width: 40px;
	height: 40px;
	padding-top: 5px;
	margin: auto;
	position: relative;
	margin: 0;
	color: #fff;
	font-size: 20px;
	z-index: 1;
	display: block;
	margin: 0 auto 5px auto;
}

ul.steps li a {
    color: #000;
	text-decoration: none;
	display: block;
	cursor: pointer;
}

ul.steps li.disabled a {
	cursor: not-allowed;
}

ul.steps li.completed a::before, .steps li.active a::before {
    background: #4290e4;
}

ul.steps li:not(:last-child)::after {
    content: '';
    position: absolute;
    background: #e5e5e5;
    display: block;
    width: 100%;
    height: 8px;
    top: 16px;
    left: 50%;
}

ul.steps li.completed:not(:last-child)::after {
    background: #4290e4;
}

ul.validation-messages {
	padding: 0 35px;
}

/**************************************/
/*              BUTTONS               */
/**************************************/

/*** BUTTONS WITHOUT ICONS ***/
button, button.small{
    cursor: pointer;
    color: black;
    padding: 2.5px 10px;
    margin: 5px;
    border: 1px solid #00b842;
    background-color: #00b842;
    text-transform: uppercase;
    font-family: "Noto Sans";
    font-size: 14px;
}
button.button-black{
    color: white;
    border: 1px solid black;
    background-color: black;
}

button.large{
    padding: 12px 15px;
    margin: 8px;
    font-family: "Noto Sans Bold";
}
button:hover{
    color: #00b842;
    background-color: black;
}
button.button-black:hover{
    color: #00b842;
}
button.margin-none{
    margin: 0px;
}

button *, button.small * {
	font-family: "Noto Sans";
}

button.large * {
	font-family: "Noto Sans Bold";
}

/*** BUTTONS WITH ICONS ***/
/* note. recommended use -> iconButton.tag */
div.icon-button{
    display: inline-block;
    border: 1px solid #292b2c;
    background-color: #00b842;
    cursor: pointer;
}

div.icon-button > i{
    background-color: #292b2c;
    color: #00b842;
    font-size: 18px;
    padding: 3px 5px;
}

div.icon-button > span{
    color: black;
    font-size: 14px;
    padding: 0px 8px 0px 6px;
    font-family: "Noto Sans";
}
div.icon-button:hover{
    background-color: #292b2c;
}

div.icon-button:hover > i{
    background-color: #00b842;
    color: black;
}

div.icon-button:hover > span{
    color: #00b842;
}

/**************************************/
/*             ROWS                   */
/**************************************/

div.row {
    padding: 20px;
}

div.row.padding-none {
    padding: 0px;
}

div.row.padding-small {
    padding: 5px;
}

div.row.padding-medium {
    padding: 10px;
}

div.row.padding-large {
    padding: 15px;
}

div.row.padding-extra-large {
    padding: 20px;
}

/**************************************/
/*              BLOCKS                */
/**************************************/
div.block-wrapper{
    padding: 5px;
}

div.block{
    background-color: #575757;
    padding: 15px;
    color: white;
    height: 100%;
}

div.block:hover{
    background-color: black;
}

div.block-button, a.block-button{
    border: 1px solid #00b842;
    background-color: #00b842;
    color: black;
    padding: 10px;
    height: 100%;
    font-family: "Noto Sans Bold";
    font-size: 16px;
    text-transform: uppercase;
    text-align: center;
}

h6 > a.block-button {
    font-size: 1.125rem;
    text-transform: none;
    color: #000;
}

.switchable-area h6 {
    color: #000;
}

div.block-button.border-none, a.block-button.border-none{
    border: none;
}

a.block-button{
    cursor: pointer;
    display: block;
}

a.block-button:hover{
    background-color: black;
    color: #00b842;
    text-decoration: none;
}

/**************************************/
/*              OTHERS                */
/**************************************/

.font-franklin-gothic-demi{
    font-family: "Noto Sans Bold";
}
.font-franklin-gothic-medium{
    font-family: "Noto Sans";
}
.font-franklin-gothic-book{
    font-family: "Noto Sans Bold";
}
.decoration-none, .hover-decoration-none:hover{
    text-decoration: none;
}
.decoration-underline, .hover-decoration-underline:hover{
    text-decoration: underline;
}
.weight-normal{
    font-weight: normal;
}
.weight-bold{
    font-weight: bold;
}
.style-normal{
    font-style: normal;
}
.style-italic{
    font-style: italic;
}
.heading-text *{
    font-size: 14px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    text-align: left;
}

/**************************************/
/*            COLOR BASE              */
/**************************************/

/*** Classes for text color ***/
html .white, html .hover-white:hover{
    color: #fff;
}
html .black, html .hover-black:hover{
    color: #000;
}
html .red, html .hover-red:hover{
    color: #f00;
}
html .blue, html .hover-blue:hover{
    color: #3e6ca8;
}
html .gray, html .hover-gray:hover{
    color: #575757;
}
html .dark-gray, html .hover-dark-gray:hover{
    color: #292b2c;
}
html .dark-blue, html .hover-dark-blue:hover{
    color: #235a92;
}
html .green, html .hover-green:hover{
    color: #00b842;
}
html .dark-green, html .hover-dark-green:hover{
    color: #28972e;
}

/*** Classes for background color ***/
html .bg-white{
    background-color: #fff;
}
html .bg-black{
    background-color: #000;
}
html .bg-red{
    background-color: #f00;
}
html .bg-blue{
    background-color: #3e6ca8;
}
html .bg-gray{
    background-color: #575757;
}
html .bg-dark-gray{
    background-color: #292b2c;
}
html .bg-dark-blue{
    background-color: #235a92;
}
html .bg-green{
    background-color: #00b842;
}
html .bg-dark-green{
    background-color: #28972e;
}

/**************************************/
/*              TABLES                */
/**************************************/

table.striped-table {
	width: 100%;
}

table.striped-table th, table.striped-table td {
	text-align: center;
	border: 1px solid #fff;
}

table.striped-table th {
	background-color: #00b842;
	color: #fff;
	font-weight: bold;
	padding: 5px;
}

table.striped-table td {
	color: #000;
	padding: 15px;
	background-color: #fff;
}

table.striped-table > tbody > tr:nth-of-type(even) td {
	background-color: #e5e5e5;
}
