/* SPARKY DYNAMICALLY GENERATED CSS - DO NOT EDIT THIS FILE!
YOUR CHANGES WILL BE OVERWRITTEN AFTER NEXT SAVE OF TEMPLATE PARAMETERS!
You can add your custom CSS code in template options, under Custom tab or
you can edit file custom.css to add your CSS code. */

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/pxiEyp8kv8JHgFVrFJDUc1NECPY.ttf);
}
    
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/pxiByp8kv8JHgFVrLEj6V1tvFP-KUEg.ttf);
}
    
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/pxiByp8kv8JHgFVrLCz7V1tvFP-KUEg.ttf);
}
    
* {
    box-sizing: border-box;
}

body {
    color:#666666;
    font-size:16px;
    line-height:1.6;
    font-family:'Poppins', sans-serif;
    
    font-weight:400;
    font-style:normal;
}

input, textarea, button, select {
    font-family:'Poppins', sans-serif;
}

.content_sparky li, dl, dd, dt {
    line-height:1.6;
}

.sparky_container::after {
    content:'';
    display:table;
    clear:both;
}

.clr {
    clear:both;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    border:none;
}

.sparky_container {
    margin:0 auto;
    padding:0;
}

.sparky_container > .sparky_cell {
    float:left;
}


/* GRID SYSTEM */

.sparkle1 {
    width: 8.3333333333333%;
}

.sparkle2 {
    width: 16.666666666667%;
}

.sparkle3 {
    width: 25%;
}

.sparkle4 {
    width: 33.333333333333%;
}

.sparkle5 {
    width: 41.666666666667%;
}

.sparkle6 {
    width: 50%;
}

.sparkle7 {
    width: 58.333333333333%;
}

.sparkle8 {
    width: 66.666666666667%;
}

.sparkle9 {
    width: 75%;
}

.sparkle10 {
    width: 83.333333333333%;
}

.sparkle11 {
    width: 91.666666666667%;
}

.sparkle12 {
    width: 100%;
}

.full .sparky_container {
    width:100%;
}

/* ROW SETTINGS */


/* SCREEN < 768px AND < TEMPLATE WIDTH */

@media (max-width: 767px) {
    .sparky_container {
        width: 100%;
    }

    .sparky_container > [class*='sparkle'] {
        width: 100% !important;
    }

    .two [class*='sparkle'] {
        width: 50% !important;
    }

    .full .sparky_container {
        width:100%;
    }

    .full .sparky_container > .sparky_cell {
        margin: 0;
        padding: 0;
    }
}

/* SCREEN >= 768px AND < TEMPLATE WIDTH */

@media (min-width: 768px) {
    .sparky_container {
        width: 750px;
    }
}

/* SCREEN >= 992px AND < TEMPLATE WIDTH */

@media (min-width: 992px) {
    .sparky_container {
        width: 970px;
    }
}

/* SCREEN >= TEMPLATE WIDTH */

@media (min-width:1200px) {
    .sparky_container {
        width:1170px;
    }

    [class*='sparkle'] {
        margin-left: 0;
    }
}
.one .sparkle1 {
    width: 8.3333333333333% !important;
}
.one .sparkle2 {
    width: 16.666666666667% !important;
}
.one .sparkle3 {
    width: 25% !important;
}
.one .sparkle4 {
    width: 33.333333333333% !important;
}
.one .sparkle5 {
    width: 41.666666666667% !important;
}
.one .sparkle6 {
    width: 50% !important;
}
.one .sparkle7 {
    width: 58.333333333333% !important;
}
.one .sparkle8 {
    width: 66.666666666667% !important;
}
.one .sparkle9 {
    width: 75% !important;
}
.one .sparkle10 {
    width: 83.333333333333% !important;
}
.one .sparkle11 {
    width: 91.666666666667% !important;
}
.one .sparkle12 {
    width: 100% !important;
}
.fluid .sparky_container {
    width: 100%;
}
.sparky_container > .sparky_cell {
    padding:30px 15px;
}

/* FONTS AND TYPOGRAPHY */

h1, h1 a {
    padding:30px 0;
    margin:0;
    line-height:1.1;
    color:var(--sparkycolor1);
    font-size:56px;
    font-family:'Poppins', sans-serif;
    
    font-weight:600;
    font-style:normal;
}

h2, h2 a {
    padding:15px 0;
    margin:0;
    line-height:1.2;
    color:var(--sparkycolor1);
    font-size:40px;
    font-family:'Poppins', sans-serif;
    
    font-weight:600;
    font-style:normal;
}

h2.row_heading {
    padding-left:15px;
    padding-right:15px;
}

h3 {
    padding:15px 0;
    margin:0;
    color:#333333;
    font-size:28px;
    line-height:1.4;
    font-family:'Poppins', sans-serif;
    
    font-weight:600;
    font-style:normal;
}

h3.row_subheading {
    padding-left:15px;
    padding-right:15px;
}

h4 {
    padding:15px 0;
    margin:0;
    color:#333333;
    font-size:20px;
    line-height:1.4;
    font-family:'Poppins', sans-serif;
    
    font-weight:600;
    font-style:normal;
}

a {
    color:var(--sparkycolor1);
    font-weight:bold;
    font-style:normal;
    text-decoration:none;
}

a:hover, a:active, a:focus {
    color:#000000;
    text-decoration:none;
}

p {
    margin: 0 0 15px;
}

button,
button.btn,
a.btn,
button.btn-primary,
p.readmore a,
a.readmore {
    display: inline-block;
    padding: 4px 12px;
    color: #333333;
    text-align: center;
    vertical-align: middle;
    background-color: #f5f5f5;
    background-image:none;
    border: 1px solid #cccccc;
    font-size:inherit;
    line-height:inherit;
    text-shadow:none;
    border-radius:0;
    box-shadow:none;
}

button:hover,
button.btn:hover,
button.btn-primary:hover,
button:active,
button.btn:active,
button.btn-primary:active,
button:focus,
button.btn:focus,
button.btn-primary:focus,
p.readmore a:hover,
p.readmore a:focus,
a.readmore:hover,
a.readmore:focus {
    color: #333333;
    text-decoration: none;
    background-color: #eeeeee;
    background-image:none;
}

p.readmore a.btn span {
    display:none;
}

/* blog layout */

.blog-items {
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-start;
    clear:both;
}

.blog-items.columns-2 .blog-item {
    width:calc(50% - 15px);
    margin-inline-end: 15px;
    margin-bottom: 50px;
}

.blog-items.columns-3 .blog-item {
    width:calc(33.33% - 15px);
    margin-inline-end: 15px;
    margin-bottom: 50px;
}

.blog-items.columns-4 .blog-item {
    width:calc(25% - 15px);
    margin-inline-end: 15px;
    margin-bottom: 50px;
}

.blog-items.columns-5 .blog-item {
    width:calc(20% - 15px);
    margin-inline-end: 15px;
    margin-bottom: 50px;
}

.blog-items.columns-6 .blog-item {
    width:calc(16.66% - 15px);
    margin-inline-end: 15px;
    margin-bottom: 50px;
}

@media (max-width: 767px) {

    .blog-items.columns-2 .blog-item,
    .blog-items.columns-3 .blog-item,
    .blog-items.columns-4 .blog-item,
    .blog-items.columns-5 .blog-item,
    .blog-items.columns-6 .blog-item {
        width:100%;
        margin-inline-end: 0;
    }

}

.page-header {
    padding: 0;
    margin: 0;
    border: 0;
}

.pull-left.item-image, figure.left.item-image {
    margin-right:15px;
    float:left;
}

.pull-right.item-image, figure.right.item-image {
    margin-left:15px;
    float:right;
}

/* forms */

form {
    margin:0;
}

.form-inline {
    display:inline;
}

#login-form input {
    padding: 4px;
}

/* lists */

ul, ol {
    margin: 15px 45px;
    padding: 0;
}

div.item-page ol li, div.item-page ul li {
    margin: 0 0 10px 0;
    padding: 0;
}

div.icons ul.dropdown-menu li {
    margin: 0;
}


ul.arrow, ul.arrowleft, ul.calendar, ul.checklist, ul.clock, ul.delete, ul.email, ul.file, ul.folder, ul.heart, ul.information, ul.lock, ul.pencil, ul.play, ul.rss, ul.person, ul.shop, ul.song, ul.star, ul.star2, ul.trash, ul.tweak, ul.unlock, ul.warn {
    margin: 15px 45px;
    padding: 0;
}

ul.arrow li, ul.arrowleft li, ul.calendar li, ul.checklist li, ul.clock li, ul.delete li, ul.email li, ul.file li, ul.folder li, ul.heart li, ul.information li, ul.lock li, ul.pencil li, ul.play li, ul.rss li, ul.person li, ul.shop li, ul.song li, ul.star li, ul.star2 li, ul.trash li, ul.tweak li, ul.unlock li, ul.warn li {
    list-style: none;
    padding: 0 15px;
}

ul.arrow li:before, ul.arrowleft li:before, ul.calendar li:before, ul.checklist li:before, ul.clock li:before, ul.delete li:before, ul.email li:before, ul.file li:before, ul.folder li:before, ul.heart li:before, ul.information li:before, ul.lock li:before, ul.pencil li:before, ul.play li:before, ul.rss li:before, ul.person li:before, ul.shop li:before, ul.song li:before, ul.star li:before, ul.star2 li:before, ul.trash li:before, ul.tweak li:before, ul.unlock li:before, ul.warn li:before {
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    padding: 0;
    margin: 0 -30px;
    position: absolute;
}

ul.arrow li:before {
    content: '\f061';
}

ul.arrowleft li:before {
    content: '\f060';
} 

ul.calendar li:before {
    content: '\f073';
}

ul.checklist li:before {
    content: '\f00c';
}

ul.clock li:before {
    content: '\f017';
}

ul.delete li:before {
    content: '\f00d';
}

ul.email li:before {
    content: '\f0e0';
}

ul.file li:before {
    content: '\f15b';
}

ul.folder li:before {
    content: '\f07b';
}

ul.heart li:before {
    content: '\f004';
}

ul.information li:before {
    content: '\f05a';
}

ul.lock li:before {
    content: '\f023';
}

ul.pencil li:before {
    content: '\f303';
}

ul.person li:before {
    content: '\f007';
}

ul.play li:before {
    content: '\f04b';
}

ul.rss li:before {
    content: '\f09e';
}

ul.shop li:before {
    content: '\f07a';
}

ul.song li:before {
    content: '\f001';
}

ul.star li:before {
    content: '\f005';
}

ul.star2 li:before {
    content: '\f006';
}

ul.trash li:before {
    content: '\f2ed';
}

ul.tweak li:before {
    content: '\f0ad';
}

ul.unlock li:before {
    content: '\f09c';
}

ul.warn li:before {
    content: '\f071';
}

/* font awesome icon sizes */

.fa-1 {
    font-size: 1em;
}

.fa-2 {
    font-size: 2em;
}

.fa-3 {
    font-size: 4em;
}

.fa-4 {
    font-size: 7em;
}

.fa-5 {
    font-size: 12em;
}

.fa-6 {
    font-size: 16em;
}

.fontawesome-icon-list {
    font-size: 10px;
}

.fontawesome-icon-list i {
    font-size: 16px;
}

.warning, .info, .error {
    padding:15px 30px;
    min-height: 50px;
}

.warning {
    color:#000;
    border: 1px solid #ffcc00;
    background:#ffff66;
}

.info {
    color:#006699;
    border: 1px solid #006699;
    background:#bde1ff;
}

.error {
    color:#900;
    border: 1px solid #900;
    background:#f8b5b5;
}

.alert-heading .warning, .alert-heading .info, .alert-heading .error {
    border: 0;
    background: transparent;
    padding:15px 0;
}

.warning:before, .info:before, .error:before {
    font-family: 'Font Awesome 6 Free';
    font-size: 32px;
    font-weight: 900;
    line-height:1;
    margin: 0 30px 0 0;
    float: left;
}

.alert-heading .warning:before, .alert-heading .info:before, .alert-heading .error:before {
    float: none;
}

.warning:before {
    content: '\f071';
    color: #ffcc00;
}

.info:before {
    content: '\f05a';
    color:#006699;
}

.error:before {
    content: '\f057';
    color:#900;
}

.outline {
    background: transparent;
}

.warning.outline {
    color: #d5aa00;
}

.typewriter {
    background: url('../images/typewriter_bg.png');
    padding:20px 15px 20px 30px;
    color:#000;
    font-family:'Courier New', Courier, monospace;
    line-height:20px;
}

.quote {
    margin-left: auto;
    margin-right: auto;
    padding: 15px 15px 15px 15px;
    font-size: 24px;
    font-style: normal;
    line-height: 1.4;
    text-align: center;
    max-width: 600px;
}

.dropcap:first-letter {
    font-size: 300%;
    font-weight:bold;
    float:left;
    margin:0 10px 5px 0;
    line-height: 1;
}

.p_number:first-letter {
    display:block;
    float:left;
    font-family: monospace;
    font-size: 400%;
    line-height:1;
    font-weight:bold;
    text-align: center;
    margin:0 15px 15px 0;
    padding:5px 15px;
    position: relative;
    color: #fff;
    background: #ccc;
}

.inset_left {
    display:block;
    float:left;
    width: 150px;
    font-style: italic;
    margin: 15px 15px 15px 0;
}

.inset_right {
    display:block;
    float:right;
    width: 150px;
    font-style: italic;
    margin: 15px 0 15px 15px;
}

.inset_title {
    font-weight:bold;
    display:block;
}

img.img_left {
    float:left;
    margin:0 30px 30px 0;
}

img.img_right {
    float:right;
    margin:0 0 30px 30px;
}

blockquote {
    border-left: 3px solid #ccc;
    font-family: Georgia, serif;
    font-style: italic;
    margin: 15px;
    padding: 15px;
}

legend {
    display: block;
    padding: 15px;
    margin-bottom: 5px;
    background:#f5f5f5;
    border: 0;
    font-size:inherit;
    line-height:inherit;
}

code {
    display: block;
    padding: 1em;
    color:inherit;
    border:0;
}


.quote:before {
    display: block;
    text-align: center;
    font-family: 'Font Awesome 6 Free';
    content: '\f10d';
    font-size: 1.5em;
    font-style: normal;
    font-weight: 900;
    color: #ccc;
    float: none;
    margin-bottom: 15px;
}

.fontawesome-icon-list div {
    width: 25%;
    float: left;
    padding: 5px 0;
}

.fontawesome-icon-list i {
    width: 30px;
    color: #333;
}

@media(min-width:600px) {
    .two-cols {
        -moz-column-count:2;
        -webkit-column-count:2;
        column-count:2;
        -moz-column-gap:3em;
        -webkit-column-gap:3em;
        column-gap:3em;
    }

    .three-cols {
        -moz-column-count:3;
        -webkit-column-count:3;
        column-count:3;
        -moz-column-gap:3em;
        -webkit-column-gap:3em;
        column-gap:3em;
    }

    .four-cols {
        -moz-column-count:4;
        -webkit-column-count:4;
        column-count:4;
        -moz-column-gap:3em;
        -webkit-column-gap:3em;
        column-gap:3em;
    }

    .five-cols {
        -moz-column-count:5;
        -webkit-column-count:5;
        column-count:5;
        -moz-column-gap:2em;
        -webkit-column-gap:2em;
        column-gap:2em;
    }

    .six-cols {
        -moz-column-count:6;
        -webkit-column-count:6;
        column-count:6;
        -moz-column-gap:2em;
        -webkit-column-gap:2em;
        column-gap:2em;
    }
}

.abovecontent {
    padding: 0 0 30px 0;
}

.belowcontent {
    padding: 30px 0 0 0;
}


/* LOGO */

.sparky_logo {
    color:#333333;
    font-size:24px;
    font-family:'Poppins', sans-serif;
    font-weight:600;
    font-style:normal;
    
    text-decoration:none;
}
.sparky_slogan {
    color:#999999;
    font-size:12px;
    font-family:Arial, Helvetica, sans-serif;
    font-weight:normal;
    font-style:normal;
    
    text-decoration:none;
}

.sparky_logo_link {
    display:block;
}


/* DROP-DOWN MENU */

ul.mnu_mainmenu {
    display:block;
    margin:0;
    padding:0;
    list-style-type:none;
    list-style-position:outside;
    position:absolute;
    z-index:100;
    white-space:nowrap;
    text-align:center;
    position:relative;
    font-family:'Poppins', sans-serif;
}

.mnu_mainmenu ul {
    margin:0;
    list-style-type:none;
    list-style-position:outside;
    text-align:initial;
    position:absolute;
    z-index:100;
    background:var(--sparkycolor2);
    width:300px;
    border:0px solid #dddddd;
    padding:15px;
}

.mnu_mainmenu > li > a, .mnu_mainmenu > li > span {
    display:block;
    margin:0;
    text-decoration:none;
    color:#666666;
    font-size:16px;
    padding:0 25px;
    font-weight:400;
    font-style:normal;
    height:40px;
    line-height:40px;
    cursor:pointer;
}

.mnu_mainmenu  > li.active > a, .mnu_mainmenu > li.active > span {
    color:var(--sparkycolor2);
    cursor:pointer;
}

.mnu_mainmenu > li > a:hover, .mnu_mainmenu > li:hover > a, .mnu_mainmenu > li > a:hover, .mnu_mainmenu > li:hover > span {
    color:var(--sparkycolor3);
}

.mnu_mainmenu > li {
    display:inline-block;
    position:relative;
    margin:0;
    padding:0;
    border-right:0px solid #cccccc;
    border-bottom:0px solid #cccccc;
    border-top:0px solid #cccccc;
}

.mnu_mainmenu > li.active {
}

.mnu_mainmenu > li:first-child {
    border-left:0px solid #cccccc;
}

.mnu_mainmenu li:hover {
    position:relative;
    background:var(--sparkycolor2);
}

.mnu_mainmenu li ul li:hover {
    background-color:var(--sparkycolor2);
}

.mnu_mainmenu li ul li {
    height:35px;
    border-bottom:0px solid #dddddd;
    padding:0 10px;
    margin: 0;
    
}

.mnu_mainmenu li ul a, .mnu_mainmenu li ul span {
    display: block;
    line-height:35px;
    font-size:14px;
    color:var(--sparkycolor3);
    font-weight:400;
    font-family:'Poppins', sans-serif;
    font-style:normal;
    padding-top:0;
    cursor:pointer;
}

.mnu_mainmenu li ul li:hover > a, .mnu_mainmenu li ul li:hover > span {
    color:var(--sparkycolor1);
}

.mnu_mainmenu li ul ul {
    left: calc(300px - 15px);
    margin-top:-15px;
}

.mnu_mainmenu ul ul {
    top:0px;
}

.mnu_mainmenu .sub {
    font-size:10px;
    line-height:normal;
    display:block;
}

.mnu_mainmenu > li > ul {
    display: none;
}


/* STANDARD MENU */
ul.mnu_bottommenu1 , ul.mnu_bottommenu3 , ul.mnu_bottommenu2  {
    display:block;
    margin:0;
    padding:0;
}
ul.mnu_bottommenu1 ul, ul.mnu_bottommenu3 ul, ul.mnu_bottommenu2 ul {
    margin:10px;
    padding:0;
}
.mnu_bottommenu1 li, .mnu_bottommenu3 li, .mnu_bottommenu2 li {
    display:block;
}
.mnu_bottommenu1 > li, .mnu_bottommenu3 > li, .mnu_bottommenu2 > li {
    margin-bottom:5px;
    padding:5px 0px;
    font-size:14px;
    font-weight:400;
    font-style:normal;
}
.mnu_bottommenu1 > li > a, .mnu_bottommenu3 > li > a, .mnu_bottommenu2 > li > a {
    color:var(--sparkycolor3);
    font-family:'Poppins', sans-serif;
    font-weight:400;
    font-style:normal;
}
.mnu_bottommenu1 > li > a:hover, .mnu_bottommenu3 > li > a:hover, .mnu_bottommenu2 > li > a:hover {
    color:var(--sparkycolor3);
}
.mnu_bottommenu1 > li li, .mnu_bottommenu3 > li li, .mnu_bottommenu2 > li li {
    margin:0;
    padding:0;
    font-size:11px;
    line-height:15px;
    font-weight:400;
    font-style:normal;
}
.mnu_bottommenu1 > li li a, .mnu_bottommenu3 > li li a, .mnu_bottommenu2 > li li a {
    color:var(--sparkycolor3);
    font-family:'Poppins', sans-serif;
    font-weight:400;
    font-style:normal;
}
.mnu_bottommenu1 > li li a:hover, .mnu_bottommenu3 > li li a:hover, .mnu_bottommenu2 > li li a:hover {
    color:var(--sparkycolor2);   
}

/* RESPONSIVE TOP MENU */

.js .nav-collapse {
    clip: rect(0 0 0 0);
    max-height: 0;
    position: absolute;
    display: block;
    zoom: 1;
}

.nav-collapse.opened {
    max-height: 9999px;
    position:absolute;
}

.nav-collapse.opened > ul {
    position: fixed;
    top: 0;
    left: 5%;
    width: 90%;
    height: auto;
    background:#444;
}

.nav-collapse.opened > ul ul {
    width: 100%;
    position: relative;
    left:0;
    padding:0;
    margin:0;
    background:#444;
    border:0;
}

.nav-collapse.opened > ul ul li {
    height:auto;
}

.nav-collapse.opened li {
    width: 100%;
    display: block;
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 0;
    text-align:initial;
}

.nav-collapse.opened li.active, .nav-collapse.opened li:hover {
    background-color:#333;
}

.nav-collapse.opened li.active a {
    color:#fff !important;
}

.nav-collapse.opened li a,
.nav-collapse.opened li span {
    padding:0 15px;
    margin:0;
    line-height:50px;
    height:50px;
    color:#fff !important;
}

.nav-collapse.opened li li a,
.nav-collapse.opened li li span {
    padding:0 30px;
    line-height:30px;
    height:30px;
}

.nav-toggle {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    background: url('../images/tinynav.png');
    background-size: 42px 84px;
    width: 42px;
    height: 42px;
    text-indent:-9999px;
    display:inline-block;
    float:right;
}

.nav-toggle.active {
    position: fixed;
    z-index: 999;
    right: 5%;
    top: 0;
    margin-top:5px;
    margin-right:15px;
    background-position: bottom;
}

#blocker {
    position:fixed;
    width:100%;
    height:100%;
    left:0;
    top:0;
    right:0;
    bottom:0;
    z-index:9999;
}

@media screen and (min-width: 992px) {

    .js .nav-collapse {
        position: relative;
    }

    .js .nav-collapse.closed {
        max-height: none;
    }

    .nav-toggle {
        display: none;
    }

}

@media screen and (max-width: 991px) {

    .nav-collapse.closed {
        overflow:hidden;
    }

    .firstClick + ul {
        display: none !important;
    }

}
    
/* IMAGE ANIMATION */

.img-with-animation {
    opacity: 0;
    position: relative;
}

.img-with-animation[data-animation='grow-in'] {
    opacity: 0;
    transform: scale(0.4);
    transition: opacity 0.6s cubic-bezier(0.15, 0.84, 0.35, 1.25);}

.img-with-animation[data-animation='fade-in-from-left'] {
    left: -40px;
}

.img-with-animation[data-animation='fade-in-from-right'] {
    right: -40px;
}

.img-with-animation[data-animation='fade-in-from-bottom'] {
    bottom: -100px;
}

.element-invisible {
    display:none !important;
}

/* forms */

.input-group {
    margin-bottom:15px;
}

.has-danger input {
    border-color:red;
}

.form-control-feedback {
    color:red;
    padding: 0 15px;
}

.control-group {
    margin-bottom:15px;
}

.input-prepend .add-on,
.input-prepend .btn,
a.jmodedit {
    box-sizing: content-box;
}

.nav-tabs.nav-stacked {
    margin:0;
}

a.modal.btn, a.btn.hasTooltip, a.btn.modal-button {
    font-size:13px;
}

.input-password-toggle .icon-eye::before {
    content: '\f06e';
}

.input-password-toggle .icon-eye-slash::before {
    content: '\f070';
}

.btn .icon-edit::before {
    content: '\f044';
}

/* front-end edit */

a.jmodedit.btn {
    position: relative;
    z-index: 9999;
    padding: 15px;
    margin: 0;
    line-height: 1;
    color: #fff;
    background: #333;
    border: 1px solid #ccc;
    border-radius: 3px;
    text-decoration: none;
}

a.jmodedit.btn > span.icon-edit {
    color: #fff
}

a.jmodedit.btn:hover {
    padding: 15px;
    margin: 0;
    line-height: 1;
    color: #fff;
    background: #000;
    border: 1px solid #ccc;
    border-radius: 3px;
    text-decoration: none;
}

.moduletable [role='tooltip'] {
    color: #333;
    background: #fff;
    font-weight: 400;
    line-height: 1.5;
}

form#modules-form {
    background: #fff;
    color: #333;
    padding: 15px;
}

form#modules-form legend {
    color: #fff;
    background: #333;
    border: 0;
    padding: 15px;
    margin-bottom: 15px;
    font-size: 18px;
}

[aria-describedby^='editarticle'] {
    padding: 15px;
    margin: 0;
    line-height: 1;
    color: #fff;
    background: #333;
    border: 1px solid #ccc;
    border-radius: 3px;
    text-decoration: none;
    position: absolute;
    z-index: 9999;
    left: 15px;
}

[aria-describedby^='editarticle']:hover {
    color: #fff;
    background: #333;
}

[aria-describedby^='editarticle'] [role='tooltip'] {
    color: #333;
    background: #fff;
    font-weight: 400;
    line-height: 1.5;
    margin-top: 15px;
    margin-left: -15px;
}

.edit.item-page button span {
    margin:0 5px;
}

#jform_publish_up_img, #jform_publish_down_img {
    padding:7px 12px 6px;
}

#jformposition_chzn ul.chzn-results li:nth-child(1),
#jformposition_chzn ul.chzn-results li:nth-child(2),
#jformposition_chzn ul.chzn-results li:nth-child(3) {
    display:none;
} 

/* article info */

dl.article-info {
    display:inline-block;
    width:auto;
    margin:0 0 10px;
    padding:4px 3px 3px;
    font-size:13px;
}

dl.article-info dt.article-info-term {
    display:none;
}

dl.article-info dd {
    display:inline-block;
    padding:0 5px;
    margin:0;
    border-right:1px solid #ccc;
}

dl.article-info dd:first-of-type {
    padding:0 5px 0 0;
}

dl.article-info dd:last-child {
    border:0;
}

/* print/email drop-down */

.items-leading .icons,
.items-row .icons {
    float:right;
    width:15%;
}

.dropdown-menu li a span {
    padding:0 10px;
    background-image:none !important;
}

.dropdown-menu li a span:before {
    margin-left:-10px;
}

/* pagination */

.icon-angle-left:before {
    content: '\f104';
}

.icon-angle-double-left:before {
    content: '\f100';
}

.icon-angle-right:before {
    content: '\f105';
}

.icon-angle-double-right:before {
    content: '\f101';
}

/* pager */

.pager li > a, .pager li > span {
    background: transparent;
    border: 1px solid #121212;
    border-radius: 0;
    color: #121212;
    font-size: 14px;
    font-weight: 700;
    padding: 12px 25px;
    text-transform: uppercase;
}

/* tags */

ul.tags.list-inline, .mod-tagspopular ul {
    margin:0;
    padding:15px 0;
    list-style:none;
}

ul.tags.list-inline li, .mod-tagspopular ul li {
    display:inline-block;
    border:1px solid #ccc;
    padding:0;
    border-radius:4px;
    line-height:13px;
}

ul.tags.list-inline li:hover, .mod-tagspopular ul li:hover {
    background:#f5f5f5;
}

ul.tags.list-inline li a.btn, .mod-tagspopular ul li a {
    display:inline-block;
    background:none;
    border:none;
    text-shadow:none;
    color:#999;
    padding:5px;
    margin:0;
    font-size:13px;
    line-height:13px;
}

ul.tags.list-inline li a.btn:hover, .mod-tagspopular ul li a:hover {
    color:#666 !important;
}

/* rating */

.content_rating {
    display: inline-block;
    margin-inline-end: 15px;
}

.content_vote {
    display: inline-block;
    margin-bottom: 15px;
}

.content_rating ul {
    margin: 0 0 15px;
}

.content_vote select {
    display: inline-block;
    height: 30px;
}

.content_vote input.btn {
    height: 30px;
    line-height: 30px;
    padding-top: 0;
    padding-bottom: 0;
}

/* blog */

.items-more ol.nav {
    margin:0;
}

.items-more ol.nav li a {
    border:0;
    padding:5px 0;
}

.items-more ol.nav li a:hover,
.items-more ol.nav li a:focus {
    background:none;
}

/* category */

ul.category {
    margin:0;
    padding:0;
    list-style:none;
}

ul.category li {
    padding:10px 0;
}

ul.category li .list-title {
    font-size:18px;
}

/* contact form */


/* search form */

ol.com-finder__results-list,
ol.com-finder__results-list ul.result__taxonomy {
    margin: 0;
}

.com-finder__explained {
    padding-bottom: 30px;
}

/* user */

.registration legend,
.profile-edit legend {
    border:0;
    font-size:18px;
}

ul.mod-login__options {
    margin-left:0;
    margin-right:0;
}

/* breadcrumbs */

ol.mod-breadcrumbs {
    margin: 0;
}

/* faq */

.accordion-header {
    padding: 0;
}


/* Custom user code */

/* TEST nieuw ontwerp 4eurohosting (05-11-2026), alleen in templatestijl 18. Live stijl 17 is ongewijzigd. */
:root{--dnt-grad:linear-gradient(135deg,#4392f9 0%,#22c3b6 100%);--dnt-navy:#0b193c;--dnt-licht:#f4f7fb}

/* Zwevende menubalk */
.logorow{background:transparent!important;box-shadow:none!important;position:sticky;top:0;z-index:999;padding:14px 16px 0}
.logorow > .sparky_container{max-width:1240px;margin:0 auto;background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:18px;box-shadow:0 10px 30px rgba(11,25,60,.12);padding-left:18px;padding-right:18px}
.fix_menu{box-shadow:none!important}
.fix_menu .sparky_container > .sparky_cell{padding-top:8px;padding-bottom:8px}
.mnu_mainmenu > li > a{border-radius:999px;padding:8px 16px!important;line-height:24px!important;height:auto!important;transition:background .2s,color .2s}
.mnu_mainmenu > li.active > a{background:var(--dnt-grad);color:#fff!important}
.mnu_mainmenu > li:not(.active) > a:hover{background:var(--dnt-licht)}

/* Knoppen met kleurverloop */
a.sparky_button,button.btn,.btn-primary{background:var(--dnt-grad)!important;border:0!important;border-radius:12px!important;padding:10px 24px!important;font-weight:600!important;box-shadow:0 8px 20px rgba(67,146,249,.30);transition:transform .15s,box-shadow .15s}
a.sparky_button:hover,a.sparky_button:focus{transform:translateY(-1px);box-shadow:0 12px 26px rgba(67,146,249,.38)}
.logorow .sparky_button{background:var(--dnt-navy)!important;box-shadow:none}

/* Hero: donkere laag over de video, grote strakke kop */
#row_24486100{position:relative}
#row_24486100::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,25,60,.82) 0%,rgba(11,25,60,.45) 100%);pointer-events:none;z-index:1}
.videotext{z-index:2!important}
.videotext h1{font-size:clamp(40px,5.6vw,76px)!important;line-height:1.05;letter-spacing:-.03em;font-weight:700}
.videotext h1 span{background:var(--dnt-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.videotext p{font-size:20px;opacity:.9}

/* Koppen en ritme */
h1,h2{letter-spacing:-.02em;font-weight:700}
h2{line-height:1.15}
.subheading{color:#4392f9;letter-spacing:.14em;font-weight:600;font-size:14px}

/* Kaarten en beelden met ronde hoeken */
.sparky_page_row figure img{border-radius:18px}
.servicesrow > .sparky_page_container > .sparky_cell{background:#fff;border:1px solid #e8edf4;border-radius:18px!important;box-shadow:0 10px 30px rgba(11,25,60,.07)}
.otherservicesrow figure,.servicesrow figure{box-shadow:0 8px 18px rgba(11,25,60,.15)}
.countersrow > .sparky_page_container > .sparky_cell{border-radius:18px}

/* Lichte band achter de pakketten */
#pakketten{background:var(--dnt-licht)}

/* Paginakop (donkere band onder het menu) */
.intro_row{background:radial-gradient(900px 380px at 15% 0%,rgba(67,146,249,.35),transparent 65%),radial-gradient(700px 300px at 90% 100%,rgba(34,195,182,.25),transparent 60%),#0b193c!important;border-radius:0 0 28px 28px}

/* Prijskaarten in plaats van de lijntjes */
.pricingrow hr.top_separator,.pricingrow hr.bottom_separator,.pricingrow hr.top_separator_dark,.pricingrow hr.bottom_separator_dark{display:none}
.pricingrow > .sparky_page_container > .sparky_cell{background:#fff;border:1px solid #e8edf4;border-radius:22px;box-shadow:0 14px 40px rgba(11,25,60,.08);padding:32px 24px!important;transition:box-shadow .2s}
.pricingrow > .sparky_page_container > .sparky_cell:hover{box-shadow:0 20px 50px rgba(11,25,60,.14)}
@media (min-width:768px){.pricingrow > .sparky_page_container > .sparky_cell{flex:1 1 0;width:auto!important;max-width:none!important;margin:0 10px}}
@media (max-width:767px){.pricingrow > .sparky_page_container > .sparky_cell{margin:0 0 20px}}

/* Lees meer en andere knoppen */
a.btn,p.readmore a.btn{background:var(--dnt-grad)!important;border:0!important;border-radius:12px!important;font-weight:600;color:#fff!important}

/* Blogberichten als kaarten */
.blog-items .blog-item{background:#fff;border:1px solid #e8edf4;border-radius:20px;box-shadow:0 10px 30px rgba(11,25,60,.06);padding:28px 32px}
@media (max-width:767px){.blog-items .blog-item{padding:20px 18px}}

/* Footer met een dun kleurverloop erboven */
.bottom_row{border-top:4px solid transparent;border-image:var(--dnt-grad) 1}

/* Hero in twee kolommen met de kaart van de Websitecontrole */
html body .videotext .sparky_cell:has(.dnt-hk){display:block!important}
@media (min-width:992px){
.videotext > .sparky_page_container{flex-wrap:nowrap!important;gap:48px;max-width:1240px;margin:0 auto;align-items:center}
.videotext > .sparky_page_container > .sparky_cell.sparky_col0{max-width:none!important;flex:1 1 58%}
.videotext > .sparky_page_container > .sparky_cell.sparky_col0 h1{text-align:left}
.videotext > .sparky_page_container > .sparky_cell.sparky_col0 .sparky_button{margin-left:0}
.videotext > .sparky_page_container > .sparky_cell:has(.dnt-hk){flex:0 0 420px;max-width:420px!important;width:auto!important}
}
.dnt-hk{background:rgba(255,255,255,.12);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.25);border-radius:22px;padding:26px 26px 20px;color:#fff;text-align:left;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.dnt-hk-label{display:inline-block;margin:0 0 10px;padding:4px 12px;border-radius:999px;background:rgba(255,255,255,.16);font-size:13px;font-weight:600;letter-spacing:.04em;color:#fff}
.dnt-hk-titel{color:#fff!important;font-size:26px!important;line-height:1.2;margin:0 0 10px;padding:0}
.dnt-hk-tekst{color:rgba(255,255,255,.88)!important;font-size:15px!important;line-height:1.55;margin:0 0 16px}
.dnt-hk-form label{display:block;font-size:13px;font-weight:600;color:#fff;margin-bottom:6px}
.dnt-hk-form input{width:100%;margin:0 0 12px;padding:12px 14px;border:0;border-radius:12px;background:#fff;color:#0b193c;font-size:16px}
.dnt-hk-form button.sparky_button{width:100%;margin:0;cursor:pointer;font-size:16px}
.dnt-hk-klein{margin:10px 0 0;font-size:12.5px;color:rgba(255,255,255,.75)!important}
@media (max-width:991px){.videotext .sparky_cell:has(.dnt-hk){margin-top:24px}.dnt-hk{background:#0b193c;color:#fff}}

/* Hero: ruimte onder het zwevende menu, kaart past in de hoogte */
@media (min-width:992px){
.videotext,.videotext > .sparky_page_container{height:auto!important;min-height:calc(100vw * 0.3645)}
.videotext > .sparky_page_container{padding-top:110px;padding-bottom:40px}
}
.dnt-hk-form button.sparky_button{display:block;background:var(--dnt-grad)!important;color:#fff!important;border:0!important;padding:12px!important;border-radius:12px!important;font-weight:600}
.dnt-hk p.dnt-hk-label{font-size:13px!important;line-height:1.4}
.dnt-hk p.dnt-hk-klein{font-size:12.5px!important;line-height:1.45}

/* Over ons: echte foto van André in plaats van de illustratie */
html body .dnt-oud-beeld{display:none!important}
html body .dnt-nieuw-beeld{display:block!important;margin:0}
.dnt-nieuw-beeld img{width:100%;height:auto;border-radius:22px;box-shadow:0 20px 50px rgba(11,25,60,.18)}

/* Nieuwe secties homepage: SEO/GEO met scorekaart, diensten 3x2 (oude dienstenrij verborgen) */
html body .dnt-nieuw-sectie{display:block!important}
html body .otherservicesrow{display:none!important}
.dnt-seo-sectie{padding:70px 0}
.dnt-seo-sectie > .sparky_page_container{max-width:1200px;margin:0 auto;align-items:center;gap:40px}
@media (min-width:992px){.dnt-seo-sectie > .sparky_page_container{flex-wrap:nowrap!important}.dnt-seo-sectie .sparky_col0{flex:1 1 58%;max-width:none!important}.dnt-seo-sectie .sparky_col1{flex:0 0 400px;max-width:400px!important}}
.dnt-seo-sectie h2{font-size:clamp(30px,3.4vw,46px);margin-top:6px}
.dnt-scorekaart{background:#fff;border:1px solid #e8edf4;border-radius:22px;box-shadow:0 20px 50px rgba(11,25,60,.10);padding:28px}
.dnt-sk-label{margin:0;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#4392f9}
.dnt-sk-cijfer{margin:6px 0 4px;font-size:48px;font-weight:700;line-height:1;color:#0b193c}
.dnt-sk-cijfer span{display:inline-block;width:58px;height:58px;line-height:58px;text-align:center;border-radius:14px;background:var(--dnt-grad);color:#fff;font-size:34px;margin-right:10px;vertical-align:middle}
.dnt-sk-cijfer small{font-size:20px;color:#6b7684;font-weight:600}
.dnt-sk-van{font-size:13.5px;color:#6b7684;margin:8px 0 16px}
.dnt-sk-balken{list-style:none;margin:0;padding:0}
.dnt-sk-balken li{display:grid;grid-template-columns:120px 1fr 36px;align-items:center;gap:10px;margin:0 0 10px;font-size:14px}
.dnt-sk-balk{height:8px;border-radius:999px;background:#eef2f7;overflow:hidden}
.dnt-sk-balk i{display:block;height:100%;border-radius:999px;background:var(--dnt-grad)}
.dnt-sk-balken b{text-align:right;color:#0b193c}
.dnt-diensten-sectie{background:var(--dnt-licht);padding:70px 0}
.dnt-diensten-sectie > .sparky_page_container{max-width:1200px;margin:0 auto}
.dnt-diensten-sectie h2{font-size:clamp(30px,3.4vw,46px);margin:6px 0 30px}
.dnt-diensten{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media (max-width:991px){.dnt-diensten{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.dnt-diensten{grid-template-columns:1fr}}
.dnt-dienst{background:#fff;border:1px solid #e8edf4;border-radius:20px;padding:26px;box-shadow:0 10px 30px rgba(11,25,60,.06);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.dnt-dienst:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(11,25,60,.12)}
.dnt-dienst figure{display:flex;width:50px;height:50px;align-items:center;justify-content:center;border-radius:14px;background:var(--dnt-navy);margin:0 0 16px}
.dnt-dienst figure img{width:25px;height:25px;margin:0}
.dnt-dienst h3{font-size:20px;margin:0 0 8px}
.dnt-dienst p{margin:0 0 16px;color:#556070;flex:1}
.dnt-dienst-link{font-weight:600;color:#2b7de9;text-decoration:none}
.dnt-dienst-link:hover{text-decoration:underline}
.dnt-diensten-onder{margin:30px 0 0;text-align:center}
.dnt-diensten-onder .sparky_button{display:inline-flex!important;float:none!important;margin:0 auto!important}
.dnt-diensten-sectie{border-radius:28px}
/* Hero: kop niet afbreken, tekstkolom krijgt de ruimte */
.videotext h1{hyphens:manual!important;-webkit-hyphens:manual!important;overflow-wrap:normal!important;word-break:normal!important}
@media (min-width:992px){.videotext > .sparky_page_container > .sparky_cell.sparky_col0{flex:1 1 auto!important;width:auto!important;min-width:0}}

/* Menu: uitklapmenu als witte kaart, leesbare tekst bij hover */
.mnu_mainmenu > li > a,.mnu_mainmenu > li:hover > a{color:#0b193c}
.mnu_mainmenu > li.active > a,.mnu_mainmenu > li.active:hover > a{color:#fff!important}
.mnu_mainmenu > li:not(.active):hover > a{background:var(--dnt-licht)!important}
.mnu_mainmenu ul.mod-menu__sub{background:#fff!important;border:1px solid #e8edf4;border-radius:14px;box-shadow:0 16px 40px rgba(11,25,60,.16);padding:8px!important;margin-top:10px;min-width:220px}
.mnu_mainmenu ul.mod-menu__sub li{background:none!important}
.mnu_mainmenu ul.mod-menu__sub a{display:block;color:#0b193c!important;background:none!important;border-radius:10px;padding:10px 14px!important;font-size:15px;line-height:1.3}
.mnu_mainmenu ul.mod-menu__sub a:hover,.mnu_mainmenu ul.mod-menu__sub li.active > a{background:var(--dnt-licht)!important;color:#0b193c!important}
.dnt-hk h2,.dnt-seo-sectie h2,.dnt-diensten-sectie h2{hyphens:manual!important;-webkit-hyphens:manual!important;overflow-wrap:normal!important}
.mnu_mainmenu > li,.mnu_mainmenu > li:hover,.mnu_mainmenu > li.parent:hover{background:none!important}
/* Menukopje zonder link (Joomla/Virtuemart): zelfde opmaak als de links, ook na klikken */
.mnu_mainmenu > li > span.mod-menu__separator,.mnu_mainmenu > li > span.mod-menu__separator.firstClick,.mnu_mainmenu > li:hover > span.mod-menu__separator{display:inline-block;color:#0b193c!important;border-radius:999px;padding:8px 16px!important;line-height:24px!important;height:auto!important;cursor:pointer;background:none!important}
.mnu_mainmenu > li:hover > span.mod-menu__separator,.mnu_mainmenu > li > span.mod-menu__separator.firstClick{background:var(--dnt-licht)!important}
.mnu_mainmenu > li.active > span.mod-menu__separator{background:var(--dnt-grad)!important;color:#fff!important}
.dnt-seo-quote{margin:4px 0 18px;padding:6px 0 6px 18px;border-left:4px solid #4392f9;border-image:var(--dnt-grad) 1;font-size:20px;line-height:1.5;color:#0b193c}
.dnt-seo-quote strong{color:#2b7de9}
/* Menu compacter (6 items) */
.mnu_mainmenu > li > a,.mnu_mainmenu > li > span.mod-menu__separator,.mnu_mainmenu > li > span.mod-menu__separator.firstClick,.mnu_mainmenu > li:hover > span.mod-menu__separator{padding:8px 12px!important;font-size:15px}
@media (max-width:1399px){.mnu_mainmenu > li > a,.mnu_mainmenu > li > span.mod-menu__separator{padding:8px 9px!important;font-size:14px}}
@media (min-width:992px){
.logorow > .sparky_container{flex-wrap:nowrap!important;align-items:center}
.logorow .mp_logo{flex:0 0 170px!important;width:170px!important}
.logorow .mp_top1{flex:1 1 auto!important;width:auto!important;min-width:0;display:flex;justify-content:center}
.logorow .mp_top2{flex:0 0 auto!important;width:auto!important}
}
/* Menubalk: logo en knop passend op elke breedte vanaf 992px */
@media (min-width:992px){
html body .logorow > .sparky_container{flex-wrap:nowrap!important}
html body .logorow .sparky_logo_image img{width:150px!important;max-width:150px!important;margin-top:0}
}
@media (min-width:992px) and (max-width:1199px){
html body .logorow .mp_logo{flex:0 0 130px!important;width:130px!important}
html body .logorow .sparky_logo_image img{width:120px!important}
html body .logorow .sparky_button{font-size:14px!important;padding:6px 12px!important}
.mnu_mainmenu > li > a,.mnu_mainmenu > li > span.mod-menu__separator{padding:8px 7px!important;font-size:13.5px}
}