/*
  Theme Name: Baeldung
  Theme URI: http://baeldung.com
  Description: Theme developed for Baeldung
  Version: 4.7.6
  Author: Baeldung
  Author URI: http://baeldung.com
  Tags:  two-columns, flexible-width, custom-menu, full-width-template
  Requires at least: 5.6
  Tested up to: 8.0
  Requires PHP: 8.0
  License: GNU General Public License v2.0 & Apache License 2.0
  License URI: http://www.gnu.org/licenses/gpl-2.0.html http://www.apache.org/licenses/LICENSE-2.0
*/


/*========================*/

/*--- Base ---*/

/*
 * WP Classes
 */

img.alignleft {
    margin-right: 10px;
    float: left;
}

img.alignright {
    margin-left: 10px;
    float: right;
}

img.aligncenter {
    display: block;
    margin: 0 auto;
}

/* UX-2157: Adds a property to the wp-caption class to allow resize.*/
.wp-caption {
    max-width: 100%;
}

/* UX-4275 Add subsite logos to the links in the full page menu. */
.nav_menu_subsite_link{
	margin-right: 0.5em;
    width: 25px;
}

/*
 * Content
 */

@media screen and (min-width: 1200px) {
    #wrap {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        height: 100%;
    }
}
    
#content {
background-color: #fff;
padding-top: 50px;
padding-bottom: 80px;
word-wrap: break-word;
width: 100%;
position: relative;
}

#content pre{
    white-space: pre-wrap;       /* Since CSS 2.1 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

@media screen and (min-width: 1200px) {
    #content {
        -webkit-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;

        -webkit-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;

        -webkit-flex-basis: auto;
        -ms-flex-basis: auto;
        flex-basis: auto;
    }

    #content > .container-inner {
        padding-right: 3vw;
    }

    #content > .container-inner > .flex-wrap {
        margin-right: -3vw;
    }
}

@media screen and (min-width: 1400px) {
    #content > .container-inner {
        padding-right: 50px;
    }
    #content > .container-inner > .flex-wrap {
        margin-right: -50px;
    }
}

#main {
    width: 100%;
}

@media screen and (min-width: 920px) {
    #main:not(:only-child) {
        max-width: 920px;
        margin-left: auto;
        margin-right: auto;
    }
}


@media screen and (min-width: 1200px) {
    #main:not(:only-child) {
        margin-left: 0;
        margin-right: 0;
    }

    #main {
        -webkit-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;

        -webkit-flex-basis: auto;
        -ms-flex-basis: auto;
        flex-basis: auto;
    }

    #main,
    #main:not(:only-child) {
        max-width: none;
    }

    #main:not(:only-child) {
        width: calc(100% - 300px - 3vw);
    }

    #footer {
        -webkit-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }
}

@media screen and (max-width: 767px) {
	#footer .container{
		display: flex;
		justify-content: center;
		text-align: center;
	}
}

.fs-sidewall-container {
	z-index: 99 !important;
}

@media screen and (min-width: 1400px) {
    #main:not(:only-child) {
        width: calc(100% - 300px - 50px);
    }
}

/* heading anchor pointers */
.bd-anchor{
    position:relative;
    top: -150px;
}
  

/* Fluid iframe videos */

.iframe-fluid {
    position: relative;
    display: block;
    height: 0;
    overflow: hidden;
}

.iframe-fluid iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

/* hero unit */

.hero-unit,
.hero-unit {
  padding: 1em;
}

.hero-unit h1 {
  font-size: 3em;
}

.site-members .page-header{
    display: none;
}



/*========================*/

/*--- Base/Element/Buttons ---*/

.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
  
.btn-default {
    color: white;
    background-color: #323232;
    border-color: #323232;
}
  
.btn-default:hover,
.btn-default:focus {
    background-color: #63B175;
    border-color: #63B175;
}
  
.btn-default:focus,
.btn-default:focus:active {
    background-color: #4E9359;
    border-color: #4E9359;
}

/* Prices with vat under checkout buttons */

.price-with-tax {
    font-size: inherit;
    color: inherit;
    font-weight: inherit;
    text-align: inherit;
}

/*--- https://team.baeldung.com/browse/UX-16653 -- */

.bael_modes:hover{
	text-decoration: none;
}
.bael_modes {
	display: inline-flex !important;
	margin-top: 5px;
}

.bael_dark_mode{
	right: 0;
	top: 0;
	position: absolute !important;
}

.bael-dark-mode-switcher img{
    width: 2.3em;
    background-color: #000;
    padding: 9px;
    border-radius: 50%;
    margin: 0px;
}
.site-library .bael-dark-mode-switcher img, .site-partners .bael-dark-mode-switcher img, .site-courses .bael-dark-mode-switcher img{
	width: 2.1em;
}

@media only screen and (min-width: 1400px){
	.bael_dark_mode{
		right: 2.8em;
	}
}

.bael_modes:hover{
	text-decoration: none !important;
	cursor: pointer;
}

.bael_dark_mode_elementor{
	position:fixed;
	top:0px;
	right: 15px;
	z-index: 999;
}

.bael_dark_mode_elementor .bael_modes span {
	top: 0.3em;
}
@media screen and (max-width: 767px) {
	.site-members .nav--logo img{
		position: relative;
        top: 0.28em;
        left: 0.56em;
	}
	.nav--logo img {
		width: 165px !important;
        height: auto !important;
	}
	.big-menu-active .big-nav-top-bar img{
		width: 165px !important;
        height: auto !important;
	}
	.site-kotlin .nav--logo img, 
	.site-linux .nav--logo img, 
	.site-cs .nav--logo img, 
	.site-scala .nav--logo img, 
	.site-ops .nav--logo img, 
	.site-sql .nav--logo img{
		width: 110px !important;
        height: auto !important;
	}
	.site-kotlin.big-menu-active .big-nav-top-bar img, 
	.site-linux.big-menu-active .big-nav-top-bar img, 
	.site-cs.big-menu-active .big-nav-top-bar img, 
	.site-scala.big-menu-active .big-nav-top-bar img,
	.site-ops.big-menu-active .big-nav-top-bar img,
	.site-sql.big-menu-active .big-nav-top-bar img {
		width: 110px !important;
        height: auto !important;
	}
	.site-kotlin .sublogo-container img,
	.site-linux .sublogo-container img,
	.site-cs .sublogo-container img,
	.site-scala .sublogo-container img,
	.site-ops .sublogo-container img,
	.site-sql .sublogo-container img {
		max-width: 50px !important;
        height: auto !important;
	}
	
	a.nav--menu_item_anchor{
		padding: 15px 10px !important;
	}
	.loginout {
		padding-right: 0px !important;
	}
	.sublogo-container{
		left: -12px !important;
	}
    .nav--logo .sublogo-container img {
        max-width: 50px !important;
        height: auto !important;
	}
	.bael_dark_mode{
		display: inline-block !important;
        position: relative !important;
        float: right !important;
        width: auto !important;
		max-height: 50px !important;
	}
	.bael-dark-mode-switcher img {
		margin-right: 2px;
		width: 2em !important;
		padding: 8px !important;
	}
	.site-library .bael-dark-mode-switcher img, .site-partners .bael-dark-mode-switcher img, .site-courses .bael-dark-mode-switcher img{
		width: 1.8em !important;
	}
	.site-members .bael-dark-mode-switcher img {
        width: 2.3em !important;
	}
	.nav--menu_item .loginout__avatar{
		width: 60% !important;
	}
	.nav--menu_item .loginout__info {
		gap: 5px;
	}
	.bael_modes {
		margin-top: 7px;
	}
}

@media only screen and (min-width: 768px) and (max-width: 1023px)  {
	.nav--logo img{
		width: 110px !important;
        height: auto !important;
	}
	.sublogo-container {
        left: -12px !important;
    }
	.nav--logo .sublogo-container img {
        max-width: 50px !important;
        height: auto !important;
    }
	.bael_dark_mode {
        display: inline-block !important;
        position: relative !important;
        float: right !important;
        width: auto !important;
    }
	.bael-dark-mode-switcher img {
		margin-right: 2px;
	}
	#mobile-nav-container .bael_dark_mode{
		display: none !important;
	}
}

@media only screen and (min-width: 1024px) and (max-width: 1280px)  {
	.nav--logo img{
		width: 110px !important;
        height: auto !important;
	}
	.sublogo-container{
		left: -12px !important;
	}
    .nav--logo .sublogo-container img {
        max-width: 50px !important;
        height: auto !important;
	}
	.bael_dark_mode{
		display: inline-block !important;
        position: relative !important;
        float: right !important;
        width: auto !important;
	}
	.bael-dark-mode-switcher img {
		margin-right: 2px;
	}
	#mobile-nav-container .bael_dark_mode{
		display: none !important;
	}
}



/*========================*/

/*--- Base/Element/Forms ---*/

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
  
.form-inline .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle;
}
  
.form-inline .input-group {
    display: inline-table;
    vertical-align: middle;
}
  
.form-inline .input-group .input-group-btn,
.form-inline .input-group .form-control {
    width: auto;
    display: table-cell;
    vertical-align: middle;
}
  
.form-inline .input-group > .form-control {
    width: 100%;
}
  
.form-inline .input-group-btn:last-child > .btn {
    z-index: 2;
    margin-left: -1px;
}
  
.form-inline .control-label {
    margin-bottom: 0;
    vertical-align: middle;
}
  
.form-inline .radio,
.form-inline .checkbox {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    vertical-align: middle;
}
  
.form-inline .radio label,
.form-inline .checkbox label {
    padding-left: 0;
}
  
.form-inline .radio input[type=radio],
.form-inline .checkbox input[type=checkbox] {
    position: relative;
    margin-left: 0;
}


/*========================*/

/*--- Base/Element/Tables ---*/

.table-styled {
	margin: 0 0 10px;
	padding: 8px;
	border: 1px solid #ddd;
	border-collapse: collapse;
	caption-side: bottom;
	font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
}

.table-styled th {
	padding: 12px;
	border: 1px solid #ddd;
	background-color: #999;
	color: white;
	text-align: center;
}

.table-styled tr:nth-child(odd) {
	background-color: #f2f2f2;
}

.table-styled td {
	padding: 5px;
	text-align: left;
}

.table-styled td:not(:last-child) {
	border-right: 1px solid #999;
}



/*========================*/

/*--- Base/Element/Widgets ---*/


/* Q2W3 Fixed Widget */

body .q2w3-fixed-widget-container .widget {
    width: 100%;
}

body .q2w3-fixed-widget-container .widget> div {
    width: 300px;
    margin: 0 auto;
}

/* BAEL-20536: Replace WWSGD (continuation) */

/* Sidebar/Before/After content widgets - display only first */

.before-post-widgets .before-post-content-widget, .after-post-widgets .after-post-content-widget{
    display: none;
}
.before-post-content-widget:first-child, .after-post-content-widget:first-child{
    display: block;
}
.sidebar .sticky-widgets > div {
    display: none; /* Hide all direct children initially */
}

.sidebar .sticky-widgets > div:first-child {
    display: block; /* Only display the first direct child */
}

.must-display{
	display: block !important;
}

/* Add CSS globally for .short_box-announcement (UX-7024) */
.short_box.short_box-announcement {
	background-color: #f2f2f2;
	border: 2px dashed #000;
	padding-top: 40px;
	padding-bottom: 40px;
	position: relative;
}
.short_box-icon {
	width: 40px;
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	top: -20px;
}
.short_box.short_box-announcement p {
	font-size: 18px !important;
}
.short_box.short_box-announcement p a {
	font-size: 100%
}
.short_box.short_box-announcement a {
	font-size: 150%;
	color: #76af7a !important;
	font-weight: bold;
}



/*========================*/

/*--- Base/Layout ---*/

/*
 * Container
*/

.container {
    max-width: 1520px;
    margin-left: auto;
    margin-right: auto;
}
  
.container-inner {
    padding-left: 6vw;
    padding-right: 6vw;
}

@media screen and (min-width: 1400px) {
    .flex-col,
    .container-inner {
        padding-left: 100px;
        padding-right: 100px;
    }
  
    .container-inner > .flex-wrap,
    .container-inner > .row {
        margin-left: -100px;
        margin-right: -100px;
    }
}

@media screen and (min-width: 1200px) and (max-width: 1400px) {
	#main { padding-right: 30px; }	
}

/*
 * Responsive utilities
*/

.hidden-xs {
    display: none;
}
  
.visible-xs {
    display: block;
}
  
@media screen and (min-width: 768px) {
    .hidden-xs {
        display: block;
    }
    .visible-xs {
        display: none;
    }
}

/*
 * Flex Grid
*/

.flex-wrap {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
  
.flex-col {
    -webkit-flex-grow: 1;
    -ms-flex-grow: 1;
    flex-grow: 1;
    -webkit-flex-shrink: 0;
    -ms-flex-shrink: 0;
    flex-shrink: 0;
    -webkit-flex-basis: auto;
    -ms-flex-basis: auto;
    flex-basis: auto;
  
    width: auto;
    max-width: 100%;
}


/*========================*/

/*--- Components/Navigation ---*/

/*
 * Logo
 */

/* Hide desktop logo, show mobile logo */

.nav--logo {
    display: none;
}
  
.nav--logo_mobile {
    display: block;
    position: relative;
    -webkit-flex-grow: 0;
    -ms-flex-grow: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-shrink: 0;
    flex-shrink: 0;
    -webkit-flex-basis: auto;
    -ms-flex-basis: auto;
    flex-basis: auto;
  
    margin-right: auto;
}
  
@media only screen and (min-width: 944px) {
    /* Hide mobile logo, show desktop logo */
    /* TODO: Inline svg for awesome hover effects */
    .nav--logo_mobile {
        display: none;
    }
    .nav--logo {
        display: block;
        margin-right: auto;
    }
}
  
@media only screen and (min-width: 1200px) {
    .nav--logo {
        margin-right: calc(33% - 305px);
    }
}
  
/* UX-683: sublogo for sub-sites */
  
.sublogo-container {
    padding: 1px 3px 4px 3px;
    border-radius: 3px;
    position: relative;
    left: -22px;
}
  
/*
 * Navigation
 */
  
.header--menu {
    position: fixed;
    z-index: 9999;
    left: 0;
    right: 0;
    background: #63B175;
}
  
.header--menu .nav--menu {
    padding: 0;
    list-style: none;
    margin: 0 -6vw;
}
  
@media only screen and (min-width: 944px) {
    .header--menu .nav--menu {
        margin-right: 0;
        margin-left: 0;
    }
}

.header--menu > .container:not(.menu-container) > .container-inner {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

/* This class toggles the menu */

.header--menu .show-on-mobile {
    display: block;
}

/* Mobile: Veggie burger */

.menu-mobile {
    position: relative;
    -webkit-flex-grow: 0;
    -ms-flex-grow: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-shrink: 0;
    flex-shrink: 0;
    -webkit-flex-basis: auto;
    -ms-flex-basis: auto;
    flex-basis: auto;

    text-align: right;
    outline: none !important;
    background: #63B175;
    padding: 20px;
    margin-right: -20px;
}

@media only screen and (min-width: 944px) {
    .menu-mobile {
        /* The mobile menu is hidden */
        display: none;
    }
}

.menu-mobile #veggieBurger {
    width: 20px;
    height: 20px;
    margin: 0 auto;
}


/* Mobile: Menu: Parents */

.nav--menu {
    display: none;
}

.nav--menu_item {
    position: relative;
    display: block;
    float: none;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

@media only screen and (min-width: 944px) {
    .nav--menu {
        display: block;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }
    /* Menu item */
    .nav--menu_item {
        width: auto;
        position: static;
    }
    /*Menu item link — highlighted*/
    .nav--menu_item_highlighted {
        background: #6DC782;
    }
    /*Menu item link — darkened*/
    .nav--menu_item_darkened {
        background: #4E9359;
    }
}

a.nav--menu_item_anchor {
    position: relative;
    display: block;
    height: 50px;
    padding: 15px;
    text-decoration: none;
    outline: none;
    color: #ffffff;
    font-weight: 600;
    text-align: center;
    line-height: 1;
    white-space: nowrap;
}

a.nav--menu_item_anchor:active,
a.nav--menu_item_anchor_active {
    background: #535353;
}

.menu-pro a.nav--menu_item_anchor {
    padding: 10px 15px;
}


/* Down Arrow */

.nav--menu_item_anchor .menu--item_normal {
    font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif !important;
    font-size: 0.4em;
    vertical-align: 1px;
    /* Down arrow displays by default */
    display: inline;
    pointer-events: none;
}


/* Up Arrow */

.nav--menu_item_anchor .menu--item_active {
    font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif !important;
    font-size: 0.4em;
    vertical-align: 2px;
    /* Up arrow is hidden by default */
    display: none;
    pointer-events: none;
}


/* Arrow dropdown visibility is reversed for the active states of the links */

.nav--menu_item_anchor_active .menu--item_normal {
    display: none;
    pointer-events: none;
}

.nav--menu_item_anchor_active .menu--item_active {
    display: inline;
    pointer-events: none;
}


/* MOBILE: Menu: Children */

.nav--dropdown {
    display: none;
    margin: 0 auto;
    background: #535353;
}

.nav--dropdown_content {
    position: relative;
    display: block;
    margin: 0 auto;
    padding: 0 0 30px;
    max-width: 470px;
}

.nav--dropdown_item {
    position: relative;
    display: block;
    float: none;
    padding: 10px;
    margin: 0 20px auto;
    border-bottom: 2px solid #3C3C3C;
}

.nav--dropdown_item:last-of-type {
    border-bottom: none;
}

@media only screen and (min-width: 944px) {
    /* The children are hidden by default */
    .nav--dropdown {
        display: none;
    }
    /* This is the unordered list */
    /* We make the content full width */
    .nav--dropdown_content {
        margin: 0;
        padding: 0px 20px 0px 20px;
        background: #535353;
        position: absolute;
        width: 100%;
        max-width: none;
        left: 0;
        right: 0;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    /* make fake fullscreen background */
    .nav--dropdown_content:before,
    .nav--dropdown_content:after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        bottom: 0;
        background-color: #535353;
        width: 1000%;
    }
    .nav--dropdown_content:before {
        right: 100%;
    }
    .nav--dropdown_content:after {
        left: 100%;
    }
}

a.dropdown--item_anchor {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

a.dropdown--item_anchor:focus {
    outline: none;
}

a.dropdown--item_anchor:hover,
a.dropdown--item_anchor:focus,
a.dropdown--item_anchor:active {
    text-decoration: none;
}

a.dropdown--item_anchor:hover .dropdown--item_text,
a.dropdown--item_anchor:focus .dropdown--item_text,
a.dropdown--item_anchor:active .dropdown--item_text {
    color: #63B175;
}

.dropdown--item_icon {
    -webkit-flex-grow: 0;
    -ms-flex-grow: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-shrink: 0;
    flex-shrink: 0;
    -webkit-flex-basis: 130px;
    -ms-flex-basis: 130px;
    flex-basis: 130px;

    max-width: 130px;
}

.dropdown--item_icon img,
.dropdown--item_icon svg {
    width: 100px;
    height: 100px;
    max-width: 100%;
    pointer-events: none;
}

.dropdown--item_text {
    position: relative;
    display: block;
    margin: 0;
    color: #ffffff;
    font-size: .8em;
    line-height: 1.6;
    text-decoration: none;
    text-align: left;
    -webkit-flex-grow: 1;
    -ms-flex-grow: 1;
    flex-grow: 1;
    -webkit-flex-shrink: 1;
    -ms-flex-shrink: 1;
    flex-shrink: 1;
    -webkit-flex-basis: auto;
    -ms-flex-basis: auto;
    flex-basis: auto;
}

.dropdown--item_title {
    font-size: 20px;
    font-weight: 600;
}

@media only screen and (min-width: 944px) {
    /* This is a child */
    .nav--dropdown_item {
        margin: 0px;
        min-height: 160px;
        width: 25%;
        border-bottom: 0 none;
        -webkit-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
        -webkit-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
        -webkit-flex-basis: 100%;
        -ms-flex-basis: 100%;
        flex-basis: 100%;
    }
    .nav--menu_has_1_children .nav--dropdown_item,
    .nav--menu_has_2_children .nav--dropdown_item {
        max-width: 430px;
    }
    .nav--menu_has_1_children .dropdown--item_text,
    .nav--menu_has_2_children .dropdown--item_text,
    .nav--menu_has_3_children .dropdown--item_text {
        max-width: calc( 100% - 120px);
    }
    /* The children are hidden by default */
    .nav--dropdown {
        display: none;
        margin: 0 auto;
        background: #535353;
    }
    /* The child link */
    .dropdown--item_anchor {
        position: relative;
        width: unset;
        margin: 0;
        padding: 0;
        line-height: 0;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    /* Child link icon */
    .dropdown--item_icon {
        min-height: 126px;
        max-width: 100%;
        padding: 10px 5px;
        -webkit-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
        -webkit-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
        -webkit-flex-basis: auto;
        -ms-flex-basis: auto;
        flex-basis: auto;
    }
    /* Child link text */
    .dropdown--item_text {
        padding: 0 0 0 15px;
    }
}

@media only screen and (min-width: 1200px) {
    .header--menu > .menu-container {
        position: relative;
    }
    .nav--dropdown_item {
        max-width: 430px;
    }
    .dropdown--item_anchor {
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }
    .dropdown--item_text {
        -webkit-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
        -webkit-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
        -webkit-flex-basis: auto;
        -ms-flex-basis: auto;
        flex-basis: auto;
    }
}

@media only screen and (min-width: 1400px) {
    .nav--dropdown_content {
        -webkit-align-items: flex-start;
        -ms-flex-align: flex-start;
        align-items: flex-start;
    }
}

/* UX-70 and UX-548: additional styles for second level dropdowns in top menu */

.inner-dropdown .nav--dropdown ul.nav--dropdown_content {
	position: fixed;
}

li.nav--dropdown_item.inner-dropdown {
	margin-top: 0px;
	padding: 0px 0px 10px 0px;
}

.inner-dropdown .dropdown--item_icon, .inner-dropdown .dropdown--item_text {
	margin-top: 10px;
}

p.dropdown--item_excerpt {
	margin-right: 10px;
}

.dropdown--item_normal {
	display: inline;
}

.dropdown--item_active {
	display: none;
}

.nav--dropdown_item:hover {
	background-color: #454545;
}

#wrap li.inner-dropdown a.nav--dropdown_active { 
	background-color: #454545;
}

#wrap .nav--dropdown li.inner-dropdown .nav--dropdown, #wrap .nav--dropdown li.inner-dropdown .nav--dropdown ul {
	background-color: #454545;
}

.nav--dropdown_active .dropdown--item_active {
	display: inline;
}

.nav--dropdown_active .dropdown--item_normal {
	display: none;
}

/* Fix iframe height problem from Google Remarketing Iframe */

iframe[name='google_conversion_frame'] {
    height: 0 !important;
    width: 0 !important;
    line-height: 0 !important;
    font-size: 0 !important;
    margin-top: -13px;
    float: left;
}

.nav--menu> .nav--menu_item> .nav--menu_item_anchor svg {
    width: 20px;
    height: 20px;
    pointer-events: none;
}

.nav--menu> .nav--menu_item.menu-pro> .nav--menu_item_anchor svg {
    width: 30px;
    height: auto;
}

.nav--menu_item.menu-pro {
    margin-left: auto;
    transform: translateX(-3em);
  }
  
@media (max-width: 1200px) {
    .nav--menu_item.menu-pro {
        transform: translateX(1em);
    }
}
@media (max-width: 944px) {
    #big-nav .big-nav-content .menu-pro svg {
        width: 30px;
        height: auto;
    }
    
    .nav--menu_item.menu-pro {
        transform: translateX(0em);
    }
}

/* 
 these styles fix visible parent background issue for the third-level menu
 but they also shift second-level menu items to the left side on smaller screens, 
 so we are limiting this fix to wide screens only 
*/
@media screen and (min-width: 1540px) { 

	/* makes container for second-level items to be 100% of screen width, but still centered on wide screens  */
	li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { /* using ">" selector here to affect only the second-level items but not third-level */
		width: 100vW;
    padding-right: 20%;
	}
}

/* UX-670 */
@media screen and (min-width: 1540px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 4%; } }
@media screen and (min-width: 1650px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 13%; } }
@media screen and (min-width: 1750px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 16%; } }
@media screen and (min-width: 1850px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 25%; } }
@media screen and (min-width: 1900px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 29%; } }
@media screen and (min-width: 2000px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 36%; } }
@media screen and (min-width: 2100px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 44%; } }
@media screen and (min-width: 2200px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 45%; } }
@media screen and (min-width: 2300px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 56%; } }
@media screen and (min-width: 2400px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 62%; } }
@media screen and (min-width: 2500px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 74%; } }
@media screen and (min-width: 2600px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 81%; } }
@media screen and (min-width: 2700px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 87%; } }
@media screen and (min-width: 2800px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 92%; } }
@media screen and (min-width: 2900px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 98%; } }
@media screen and (min-width: 3000px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 105%; } }
@media screen and (min-width: 3100px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 110%; } }
@media screen and (min-width: 3200px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 130%; } }
@media screen and (min-width: 3400px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 140%; } }
@media screen and (min-width: 3600px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 151%; } }
@media screen and (min-width: 3800px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 158%; } }
@media screen and (min-width: 4000px) {  li.menu-courses > .nav--dropdown > ul.nav--dropdown_content { padding-right: 64vw; } }
/* end UX-670 */

/* fix for mobile menus, to make third-level items stay inside container */
@media (max-width: 943px) { 

	.inner-dropdown .nav--dropdown ul.nav--dropdown_content {
		position: relative;
	}
	
}

@media (max-width: 1200px) { 

    .dropdown--item_icon {
			display: inline;
			padding:0px 0px 0px 5px;
			max-width: 70px;
    }
    
    .dropdown--item_text {
			display: inline;
			max-width:70%;
			margin-top:5px;
			padding-left: 10px;
    }
}

@media (max-width: 930px) { 
	.nav--dropdown_item {
		padding: 0px;
		margin: 0 5px auto;
	}

	.inner-dropdown .nav--dropdown_item {
			margin: 0px;

	}

	.nav--dropdown li.inner-dropdown .nav--dropdown_content li {
		padding-left:15px;
	}
}
/* end UX-70 and UX-548 */

/* nav color quickfix (to be moved) */
body.home #wrap nav a:link, body.home #wrap nav a:visited {
	color: #fff;
}

#big-nav.inactive{
  display: none;
}

#big-nav,
.header--menu li.big-nav-icon {
   /* display: none; */
}

@media only screen and (min-width: 944px) {
  #big-nav,
  .header--menu li.big-nav-icon {
   /* display: block; */
  }
}

.header--menu li.big-nav-icon,
.big-nav-top-bar a.close-big-nav {
  margin-left: 0;
  margin-right: 30px;
}
li.big-nav-icon{
	background-color: #4E9359;
}
li.big-nav-icon:hover{
	background-color: #525E74;
}
.big-nav-icon.active {
	background-color: #525E74;
}
.big-nav-top-bar a.close-big-nav{
	background-color: #525E74;	
}

#menu-main-menu.nav--menu {
	display: flex;
}
.header--menu #menu-main-menu.nav--menu {
  padding: 0;
  list-style: none;
  margin: 0;
}
.big-nav-icon .nav--menu_item_anchor {
	padding: 13px 10px !important;
	width: 50px;
	height: 50px;
}

svg#BigNavIcon {
	width: 100%;
	height: 100%;
}

#big-nav.menu-not-loaded{
	display: none;
}

@media (max-width:943px){
	.header--menu .container:first-child {
		display: none;
	}
	#menu-main-menu.nav--menu {
		display: block;
	}
	.header--menu .container-inner{
		/* display: none; */
	}
	li.big-nav-icon{
		/* display: none; */
	}
	#big-nav{
		/* display: none; */
	}
	#menu-main-menu .nav--menu_item:not(.nav--logo):not(.big-nav-icon):not(.menu-search){
		display: none;
	}
}

@media(max-width:995px){
	#big-nav > .container{
		padding-top: 50px !important;
	}
	.big-nav-icon, .nav--logo{
		display: inline-block !important;
		vertical-align: middle;
		width: auto !important;
	}
	.nav--menu_item.menu-rss{
		display: none;
	}
}

.nav--menu_item.menu-search {
	width: auto;
	display: inline-block;
	float: right;
}

@media (min-width: 1400px){
	.nav--menu_item.menu-search{
		padding-right: 100px !important;
	}
}
@media (min-width: 1200px){
	.nav--menu_item.menu-search{
		right: 0.56em; top: 0;
		position: absolute;
		padding-right: 6vw;
	}
}
@media (min-width: 944px){
	.nav--menu_item.menu-search{
        right: 0.56em; top: 0;
        position: absolute;
		display:block;
	}
}
@media (max-width: 576px){
	.header--menu li.big-nav-icon, .big-nav-top-bar a.close-big-nav {
		margin-left: 0;
		margin-right: 10px !important;
	}
	.header--menu #menu-main-menu.nav--menu {
		margin: 0;
	}
	.big-nav-top-bar > .container > .container-inner, .menu-container .container-inner{
		padding: 0;
	}
}
@media (max-width: 370px){
	.header--menu #menu-main-menu.nav--menu .nav--logo a img {
      width: 100px !important;
      height: auto !important;
  }
	.header--menu #menu-main-menu.nav--menu .nav--logo a .sublogo-container {
      margin-left: 4px;
  }
	.header--menu #menu-main-menu.nav--menu .nav--logo a .sublogo-container img {
      width: 50px !important;
  }
}

.basic_search{text-align: center;}
.basic_search .form-inline .input-group {
    display: flex;
    width: 50%;
    vertical-align: middle;
    margin-left: auto;
    margin-right: auto;
}

/** UX-20631 - pro logo visible on mobile screen */
@media (max-width: 576px){
    
    html body #wrap #menu-main-menu li.nav--menu_item.menu-pro {
        width: auto;
        display: block;
        position: absolute;
        right: 2.5em;
        top: 0;
    }

    html body #wrap #menu-main-menu li.nav--menu_item.menu-pro a {
        padding: 11px 12px !important;
    }

}


/*========================*/

/*--- Components ---*/




/*========================*/

/*--- Comments ---*/


/* Disable comments message */

p.alert.alert-info {
    display: none;
}


/*========================*/

/*--- Components/Content/Archive ---*/

.archive-description {
font-size: 18px;
margin-top: 15px;
}

.archive-header {
    margin-top: 50px;
    margin-top: calc(50px + 2vw);
    margin-bottom: 40px;
    margin-bottom: calc(40px + 1vw);
}

.archive-header .flex-wrapper {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;

    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.archive-header .page-title {
    margin-top: 10px;
    margin-bottom: 10px;
}

.archive-header .icon-wrapper {
    display: none;
    width: 70px;
    height: 104px;
    margin-right: 20px;
}

@media screen and (min-width: 480px) {
    .archive-header .icon-wrapper {
    display: block;
    }
}

.archive-header .category-icon {
    width: 100%;
    height: auto;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    transform: translateY(-50%);
}

.archive-header svg.category-icon {
    opacity: 0;
}

.archive-header svg.category-icon.ready {
    opacity: 1;
}


/* archive items */

.archive-columns {
    margin-bottom: 50px;
}

.archive-columns .hentry {
    max-width: 100%;
    margin-bottom: 30px;
}

.archive-columns .post-inner {
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);
    padding: 10px 20px;
    position: relative;
}

.archive-columns .post-title {
    margin-top: 20px;
    margin-bottom: 15px;
    font-weight: 500;
    font-size: 22px;
    color: #55a067;
}

.archive-columns .post-title a {
    color: #66b077;
    display: inline-block;
}

.archive-columns .post-content {
    font-size: 17px;
}

.archive-columns .post-content p {
    margin-bottom: 20px;
}

.archive-columns .more {
    white-space: nowrap;
}

.archive-columns.rounded-on .post-inner {
    border-radius: 8px;
}

.archive-columns.no-more .post-content .more {
    display: none;
}

.archive-columns.click-whole .post a:hover,
.archive-columns.click-whole .post a:focus,
.archive-columns.click-whole .post a:focus:active {
    text-decoration: none;
}

.archive-columns.click-whole .post-title a:before {
    content: "";
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.archive-columns.click-whole .post:hover .post-title a:before {
    display: block;
}

.archive-columns.click-whole .post-title .hover-wrapper {
    display: inline-block;
    position: relative;
}

.archive-columns.click-whole .post-title .hover-wrapper:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    margin-top: 5px;
    line-height: 0;
    opacity: 0;
    height: 2px;
    -webkit-transition: opacity .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out;

    background: #66b077;
}

.archive-columns.click-whole .post:hover .post-title .hover-wrapper:before {
    opacity: .8;
}
.archive-columns.click-whole .post:active .post-title .hover-wrapper:before {
    opacity: .3;
}

.archive-columns.layout-flex .post-inner {
    height: 100%;
}


@media screen and (min-width: 640px) {
    .archive-columns.layout-flex {
    -webkit-display: flex;
    -moz-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
    }

    .archive-columns.layout-flex .post {
    padding-left: 15px;
    padding-right: 15px;
    width: 50%;
    }

}

.bael_popular_tag{display: inline-flex;}
.bael_popular_span{margin-left: 0.5em;min-width: fit-content;}

/* minimal archive layout */

body.category .post-inner, body.tag .post-inner{
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 0 4px;
}

body.category .post-inner h3, body.tag .post-inner h3{
    margin: 0;
    font-size: 18px;
}

/* UX-5367 Tweak the size of the tags on meta pages*/

body.category article, body.tag article{
    margin-bottom: 0em !important;
}

.archive-columns .tags-display{
	display: flex;
    align-items: center;
    padding: 1em 0em 1em 0em !important;
}

.tags-display .post-tags{
	color: #fff;
    list-style: none;
	padding-left: 1em;
	margin: 0em;
}

.tags-display .post-tags li{
	display: inline-flex;
	padding-right: 0.5em;
}

.tags-display .post-tags li a {
    background-color: #333;
	color: #fff !important;
	font-size: 13px;
    border-radius: 4px;
	display: inline-flex;
    padding: 0.3em 0.5em;
	font-weight:600;
	line-height: 1.4;
}

.tags-display .post-tags li.pointed{padding:0;}
.tags-display .post-tags li.pointed span {
	background: #EBEBEB;
	color: black;
	border-right: none;
	margin-right: 10px;
	font-size: 16px;
    border-radius: 4px;
    border: none;
	padding: 3px 7px;
}

.tags-display .post-tags li.pointed a:after, .tags-display .post-tags li.pointed span:after {
    content: "";
    width: 1.2em;
    height: 1.28em;
    display: inline-block;
    position: absolute;
    right: 0px;
    background-color: #EBEBEB;
    transform: scaleX(0.6)rotate(45deg);
    border-top-right-radius: 5px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 0px;
    z-index: -1;
	border-top: 2px solid #EBEBEB;
    border-right: 2px solid #EBEBEB;
}



/*========================*/

/*--- Components/Content/Footer ---*/

.content-info,
.content-info .column-wrapper {
    background-color: #323232;
}

@media screen and (min-width: 1200px) {
    .content-info {
        background-color: #3C3C3C;
    }
}

.content-info .column-wrapper {
    padding: 30px 6vw;
}

@media screen and (min-width: 768px) {
    .content-info .column-wrapper {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
}

.content-info .column-wrapper {
    padding-bottom:140px;
}

@media screen and (min-width: 1400px) {
    .content-info .column-wrapper {
        padding-left: 100px;
        padding-right: 100px;
    }
}

@media screen and (min-width: 768px) {
    .content-info .widgets {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .content-info .stacked-rows {
        width: 100%;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        text-align: center;
    }

    .content-info .stacked-rows .widget {
        margin: 0 auto;
    }

    .content-info .stacked-rows .widget .menu {
        margin-bottom: 0;
    }

    .content-info .stacked-rows .widget .menu,
    .content-info .stacked-rows .widget .menu li {
        display: inline-block;
    }

    .content-info .stacked-rows .widget .menu li {
        margin-right: 5px;
    }

    .content-info .stacked-rows .widget .menu li:not(:first-child):before {
        content: "";
        display: inline-block;
        height: 8px;
        border-left: 1px solid rgba(255, 255, 255, .4);
        margin-right: 10px;
    }
}

.content-info .widget {
    padding: 15px 20px;
    margin-left: auto;
    margin-right: auto;
}

@media screen and (min-width: 768px) {
    .content-info .widget {
        -webkit-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }
}

.content-info .logo-mobile {
    margin-top: 40px;
    width: 50px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.content-info .logo-desktop {
    margin-top: 20px;
    margin-bottom: 20px;
    margin-right: 20px;
    display: none;
}

@media screen and (min-width: 768px) {
    .content-info .logo-mobile {
        display: none;
    }
    .content-info .logo-desktop {
        display: block;
    }
}

@media screen and (min-width: 1200px) {
    .content-info .logo-desktop {
        margin-right: 80px;
    }
}

.content-info .widgettitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin: 20px 0px;
    text-transform: uppercase;
}

.content-info a {
    color: rgba(255, 255, 255, 0.8);
}

.content-info a:hover {
color: rgba(255, 255, 255, 1);
    text-decoration: none;
}

@media screen and (min-width: 992px) {
    .content-info .widget_nav_menu {
        -webkit-flex-basis: auto;
        -ms-flex-basis: auto;
        flex-basis: auto;
        -webkit-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
        max-width: 100%;
    }
}

.content-info .widget_nav_menu ul {
    padding-left: 0;
}

.content-info .widget_nav_menu ul li {
    font-size: 12px;
    font-weight: 300;
    line-height: 23px;
    text-transform: uppercase;
    list-style-type: none;
    letter-spacing: 1px;
}

/* UX-17402 Custom icon for widget menu item */
.content-info .widget_nav_menu ul li .icon {
	width: 28px;
	height: 28px;
	margin-right: 5px;
}

/* UX-1469 Tap Targets on Mobile */
@media screen and (max-width: 767px) {
	footer .widget_nav_menu ul li a {
		font-size: 13.5px;
		padding: 5.5px 0;
		display: inline-block;
	}
}

/* UX-4389 Menu Scrollable vs Bottom Page Ad */
.big-menu-active #fs-sticky-footer {
	z-index: 10 !important;
}



/*========================*/

.whole-homepage {
	margin-top: 4em;
	margin-right: auto;
	margin-left: auto;
	padding: 5px;
	max-width: 1200px;
}

.homepage-row {
	display: flex;
	width: 100%;
}

.homepage-col-30 {
	display: flex;
	margin-top: 0.56em;
	padding: 1.1em;
	width: 30%;
}

.homepage-col-70 {
	display: block;
	padding: 2.2em 0em 3.3em 0em;
	width: 70%;
}

.homepage-col-50 {
	display: flex;
	margin: 0.56em;
	width: 50%;
}

.homepage-col-100 {
	margin: 0.56em;
	width: 100%;
}

.home-whole-banner {
	position: relative;
	width: 100%;
	background-color: #f5c248;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}

.homepage-banner {
	display: flex;
	width: 100%;
}

.homepage-link-image {
	position: absolute;
	right: 0;
	bottom: 0em;
}

.homepage-image img {
	display: inline-block;
	height: auto;
	max-width: 100%;
	border: none;
	border-radius: 0;
	box-shadow: none;
	vertical-align: middle;
}

.homepage-text-editor {
	min-height: 2.8em;
}

.homepage-text-editor a {
	color: #fff !important;
	text-decoration: none;
	font-weight: normal;
	font-size: 1.4em;
	font-family: 'Raleway', Sans-serif;
}

.homepage-text-editor a.home-content {
	font-size: 1em;
}

.homepage-link-image svg {
	display: block;
	width: 3.3em;
	height: 2.2em;
}

.homepage-link-image svg .cls-1,
.homepage-link-image svg .cls-2 {
  fill: inherit;
}

.homepage-link-image svg .cls-2 {
  stroke: #fff;
  stroke-width: 2px;
  fill-rule: evenodd;
}

.homepage-link-image:hover svg {
	filter: brightness(1.65);
}

.homepage-posts {
	display: inline-flex;
	flex-direction: row;
	justify-content: flex-start;
	flex-wrap: wrap;
	width: 100%;
}

.home-post-content {
	display: flex;
	padding: 0.8em;
	width: 33%;
}

.home-post-content.-type_fullwidth {
	width: 100%;
}

.content-post {
	width: 100%;
}

.hpost-heading-title {
	padding-bottom: 0.2em;
	color: #333;
	font-weight: bold;
	font-size: 1.3em;
	font-family: 'Raleway', Sans-serif;
}

.home-post-image img {
	width: 100%;
}

.homepage-posts .post-links {
	display: flex;
	justify-content: space-between;
	gap: 15px;
	width: 100%;
	border-bottom: 1px solid #dadada;
}

.post-links .bold-button-link {
	display: flex;
	align-items: center;
	margin: 0.56em 0em;
	width: 100%;
}

.post-links .post-button {
	display: block;
	flex-shrink: 0;
	margin: 0.56em 0em;
	width: 35%;
	text-align: right;
}

.bold-button-link a {
	text-decoration: none;
	font-weight: normal;
	font-size: 18px;
	font-family: 'Raleway', Sans-serif;
}

.post-button a {
	display: block;
	padding: .4em;
	border-radius: 2px 2px 2px 2px;
	box-shadow: 0 0 0 0 rgba(0,0,0,.5);
	color: #fff !important;
	text-align: center;
	text-decoration: none;
	font-weight: 500;
	font-size: 14px;
	font-family: 'Raleway', Sans-serif;
}

.post-button a:hover {
	text-decoration: none;
}

.button-branding a {}

.post-button.button-branding a:hover {
	filter: brightness(.9);
}

.button-custom a {}

.post-button.button-custom a:hover {
	filter: brightness(.9);
}

.button-default a {
	background-color: #3f3f3f;
}

.button-default a:hover {
	background-color: #1f1f1f;
}

@media screen and (max-width: 767px) {
	.whole-homepage {
		margin-top: 4em;
		padding: 0;
	}

	.homepage-row {
		display: block;
		text-align: center;
	}

	.homepage-col-50 {
		display: block;
		margin: 0;
		margin-bottom: 1.1em;
		width: 100%;
	}

	.homepage-col-30 {
		display: block;
		padding: 0.56em 0em 0.56em 0em;
		width: 100%;
	}

	.homepage-col-70 {
		padding: 0;
		width: 100%;
	}

	.homepage-col-100 {
		margin: 0 0 1.1em;
	}

	.homepage-link-image {
		top: auto;
		bottom: 0em;
	}

	.homepage-link-image svg {
		width: 2.2em;
		height: 2.2em;
	}

	.homepage-text-editor {
		padding: 0em 0.56em;
	}

	.homepage-banner {
		display: block;
		padding-bottom: 2.2em;
		text-align: center;
	}

	.homepage-image img {
		padding-top: 1em;
		width: 40%;
	}

	.home-post-content {
		display: block;
		margin: 2.2em 0;
		width: 100%;
	}

	.homepage-posts {
		display: block;
	}
}

@media only screen and (max-width: 1023px) and (min-width: 768px) {
	.homepage-col-30 {
		margin-top: 1.1em;
		padding: 0.56em;
	}

	.homepage-col-70 {
		padding: 1.68em 0em 0.56em 0em;
	}

	.homepage-text-editor a {
		font-size: 1.1em;
	}

	.homepage-text-editor {
		min-height: 1.6em;
	}

	.homepage-text-editor a.home-content {
		font-size: 0.6em;
	}

	.homepage-banner {
		padding-bottom: 1.1em;
	}

	.hpost-heading-title {
		font-size: 1.1em;
	}

	.post-links .post-button {
		width: 50%;
	}

	.post-links .bold-button-link {
		width: 50%;
	}

	.bold-button-link a {
		font-size: .8em;
	}

	.post-button a {
		font-size: 12px;
	}

	.homepage-image img {
		width: 4.4em;
	}

	.homepage-link-image svg {
		width: 2.2em;
		height: 1.6em;
	}

	.homepage-posts {
		display: inline-flex;
		flex-direction: row;
		justify-content: flex-start;
		flex-wrap: wrap;
	}

	.home-post-content {
		padding: 0.56em;
		margin:0;
    	width: 50%;
	}
	
}


/* Wide Banner */
.home-wide-banner {
	width: 100%;
}

.home-wide-banner__img {
	width: 100%;
}

.home-wide-banner__img.-type_desktop {

}

.home-wide-banner__img.-type_mobile {
	display: none;
}

@media only screen and (max-width: 768px) {
	.home-wide-banner {
		margin-right: -6vw;
		margin-left: -6vw;
		width: calc(100% + 12vw);
	}

	.home-wide-banner__img.-type_desktop {
		display: none;
	}

	.home-wide-banner__img.-type_mobile {
		display: block;
	}
}



/*========================*/

/*--- Components/Content/Page ---*/

.page-title {
    margin-top: 6vw;
    margin-bottom: 4vw;
    font-weight: 700;
    font-size: 52px;
    line-height: 1;
    position: relative;
}

.page-template-page-full-width h1::first-line {
    font-weight: 700;
}


/*========================*/

/*--- Components/Content/Post ---*/

article.post {
    margin-bottom: 30px;
}

article.post img {
    height: auto;
    max-width: 100%;
}

article.post footer {
    border-top: none;
    margin-top: 0;
    padding-top: 0;
    position: relative;
    min-height: 20px;
}

.single #wrap .post-tags a,
.archive #wrap .related-tags a{
    border-bottom:none;
}

.pointed{
    position:relative;
    z-index:0;
}

.single .categories li.pointed:not(:last-child),
.single .post-tags li.pointed:not(:last-child),
.archive .related-tags li.pointed:not(:last-child),
.archive .related-categories li.pointed:not(:last-child){
    margin-right:4px;
}

/*Changed made for UX-3946. Added selecter .single #wrap .post-tags .pointed span */
.single #wrap .post-tags .pointed a,
.single #wrap .post-tags .pointed span,
.archive #wrap .related-tags .pointed a{
    background:#EBEBEB;
    color:black;
    border: 1px solid darkgray;
    border-right: none;
    margin-right: 10px;
}

/*Changed made for UX-3946. Added selecter .single #wrap .post-tags .pointed span */
.single #wrap .post-tags .pointed span {
    margin-left: 4px;
    border: none;
}

.single #wrap .post-tags .pointed a:hover,
.archive #wrap .related-tags .pointed a:hover,
.archive #wrap .related-tags .pointed a.highlight{
    color:white;
}

/*Changed made for UX-3946. Added selecter .single #wrap .post-tags .pointed span */
.single #wrap .post-tags .pointed a:after,
.single #wrap .post-tags .pointed span:after{
    content: "";
    width: 1.2em;
    height: 1.28em;
    display: inline-block;
    position: absolute;
    right: 0px;
    background-color: #EBEBEB;
    transform: scaleX(0.6)rotate(45deg);
    border-top: 2px solid darkgray;
    border-right: 2px solid darkgray;
    border-top-right-radius: 5px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 0px;
    z-index: -1;
  }

/*Changed made for UX-3946. Added selecter .single #wrap .post-tags .pointed span */
.single #wrap .post-tags .pointed span:after{
    border-top: 2px solid #EBEBEB;
    border-right: 2px solid #EBEBEB;
}

.archive #wrap .related-tags .pointed a:after{
    content: "";
    width: 1.28em;
    height: 1.28em;
    display: inline-block;
    position: absolute;
    right: 0px;
    background-color: #EBEBEB;
    transform: scaleX(0.6)rotate(45deg);
    border-top: 2px solid darkgray;
    border-right: 2px solid darkgray;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
    z-index: -1;
}

/* CSS for code block(hightlightcopyjs). */

pre code.hljs {
    padding-right: 1.4em;
}
.hljs-copy-wrapper {
    position: relative;
    overflow: hidden;
}
.hljs-copy-button {
    position: absolute;
    font-size:12px;
    top: 1em;
    right: 1em;
    width: 2.2em;
    height: 2.2em;
    text-indent: -9999px;
    color: white;
    border-radius: 0.14em;
    border: 1px solid #63B175;
    background-image: url('data:image/svg+xml;utf-8,<svg width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 5C5.73478 5 5.48043 5.10536 5.29289 5.29289C5.10536 5.48043 5 5.73478 5 6V20C5 20.2652 5.10536 20.5196 5.29289 20.7071C5.48043 20.8946 5.73478 21 6 21H18C18.2652 21 18.5196 20.8946 18.7071 20.7071C18.8946 20.5196 19 20.2652 19 20V6C19 5.73478 18.8946 5.48043 18.7071 5.29289C18.5196 5.10536 18.2652 5 18 5H16C15.4477 5 15 4.55228 15 4C15 3.44772 15.4477 3 16 3H18C18.7956 3 19.5587 3.31607 20.1213 3.87868C20.6839 4.44129 21 5.20435 21 6V20C21 20.7957 20.6839 21.5587 20.1213 22.1213C19.5587 22.6839 18.7957 23 18 23H6C5.20435 23 4.44129 22.6839 3.87868 22.1213C3.31607 21.5587 3 20.7957 3 20V6C3 5.20435 3.31607 4.44129 3.87868 3.87868C4.44129 3.31607 5.20435 3 6 3H8C8.55228 3 9 3.44772 9 4C9 4.55228 8.55228 5 8 5H6Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M7 3C7 1.89543 7.89543 1 9 1H15C16.1046 1 17 1.89543 17 3V5C17 6.10457 16.1046 7 15 7H9C7.89543 7 7 6.10457 7 5V3ZM15 3H9V5H15V3Z" fill="white"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
}
.hljs-copy-button:hover {
    cursor: pointer;
}
.hljs-copy-button:active {
    border-color: #ffffff66;
}
.hljs-copy-button[data-copied="true"] {
    text-indent: 0;
    width: auto;
    background-image: none;
}
@media (prefers-reduced-motion) {
    .hljs-copy-button {
      transition: none;
    }
}
.hljs-copy-alert {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}
.language-bael + .hljs-copy-button{display:none;}
.katex {font-size: 18px !important;}
@media screen and (max-width: 768px) {
	.katex-display{ overflow-x: scroll; overflow-y: hidden;}
}
.download-icon {
    width: 40px;
    height: 40px;
    background-color: #F3B21A;
    display: flex;
    border: 2px solid black;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    padding: 8px;
    margin-bottom: 8px;
}


/*========================*/

/*--- Components/Content/Single ---*/

.page-header .single-title {
    color: #333;
    font-weight: 300;
    letter-spacing: -1.5px;
    margin-top: 60px;
    font-size: 47px;
    line-height: 1;
}

@media only screen and (min-width: 768px) {
    .page-header .single-title {
        font-size: 64px;
    }
}

.page-header .single-title::first-line {
    font-weight: 700;
}

/* elements */

@media(max-width:767px){
	.single .post-content table {
		display: block !important;
		overflow-x: auto !important;
		max-width: 100% !important;
	}
}

.single .post-content p {
    color: #000;
    line-height: 1.334;
}

.single .post-content h2,
.single .post-content h3 {
    margin-top: 2.1em;
    margin-bottom: 1.3em;
    font-weight: 700;
}

.single .post-content h2 {
    font-size: 29px;
}

.single .post-content ul {
    list-style-type: disc;
}
.single-sfwd-lessons.single .post-content ul li{
    list-style: disc!important;
}

.single .post-content ul li a {
    font-weight: bold;
}

.single .post-content blockquote p {
    font-weight: 100;
    word-wrap: break-word;
    font-size: 18px;
    line-height: 26px;
}

/* Adds 1em of margin for images inside a post */

.single .post-content img:not(.tve_image) {
    margin: 1em 0;
}

/* UX-10740 fix issue of image not centering and add 1em around centered image in a single post */
.single .post-content img.aligncenter {
    margin: 1em auto;
}

/* Post categories/tags mixed */

.single .categories,
.single .post-tags,
.archive .related-tags,
.archive .related-categories {
    color: #fff;
    list-style: none;
    padding-left: 0;
}

.single .categories .btn-share,
.single .categories .btn-share span,
.single .categories li,
.single .post-tags li,
.archive .related-tags li,
.archive .related-categories li {
    display: inline-block;
}

/*Changed made for UX-3946. Added selecter .single .post-tags span */
.single .categories .btn-share,
.single .categories a,
.single .post-tags a,
.single .post-tags span,
.archive .related-tags a,
.archive .related-categories a,
.archive a.archive-parent-cat {
    font-size: 18px;
    font-weight: 700;
}

/*Changed made for UX-3946. Added selecter .single .post-tags span */
.single .categories a,
.single .post-tags a,
.single .post-tags span,
.archive .related-tags a,
.archive .related-categories a,
.archive a.archive-parent-cat {
    color: #fff;
    background-color: #63B175;
    display: inline-block;
    padding: 3px 7px;
}

.single .categories a:not(:last-child),
.single .post-tags a:not(:last-child),
.archive .related-tags a:not(:last-child),
.archive .related-categories a:not(:last-child) {
    margin-right: 0;
}

.single .categories li:not(:last-child),
.single .post-tags li:not(:last-child),
.archive .related-tags li:not(:last-child),
.archive .related-categories li:not(:last-child) {
    margin-right: 4px;
	margin-bottom: 0.56em;
}

.single .categories a:hover,
.single .categories a:focus,
.single .post-tags a:hover,
.single .post-tags a:focus,
.archive .related-tags a:hover,
.archive .related-tags a:focus,
.archive .related-categories a:hover,
.archive .related-categories a:focus,
.archive a.archive-parent-cat:hover,
.archive a.archive-parent-cat:focus {
    background-color: #4e9359;
    text-decoration: none;
}

.archive .related-tags,
.archive .related-categories{
    margin-top: 50px;
}
.archive .related-tags a,
.archive .related-categories a{
    margin-top: 4px;
}
.archive .related-tags .highlight{
    background-color: #4e9359 !important;
}

.archive .related-tags .highlight span {
    color: #ffffff;
    /* line-height: 1px; */
    font-weight: bold;
    padding: 0 7px 0 4px;
    display: inline-block;
    height: 15px;
    vertical-align: middle;
    line-height: 11px;
}

.archive a.archive-parent-cat{
    margin-bottom: 20px;
    margin-right: 5px;
}

.archive a.archive-parent-cat img{
    width: 26px;
    margin-top: -6px;
    margin-right: 5px;
}

.archive .tag-filter-title {
    font-size: 50%;
}

/* UX-3368: Adds margin to category tags on mobile */
.single .categories {
    margin-bottom: 0px;
}

.single .categories > li {
    margin-bottom: 10px;
}

@media only screen and (min-width: 768px) {
    .single .categories,
    .single .post-tags {
        float: right;
    }
}


/* Post categories */

.single .categories .btn-share {
    background-color: #323232;
}

.single .categories .btn-share span {
    padding: 3px 5px;
    transform: rotate(0deg);
    transition: transform .2s ease-in-out;
}

.single .categories .btn-share span:hover {
    transform: rotate(180deg) scale(1.5);
}

/* Post tags */
/*Changed made for UX-3946. Added selecter .single .post-tags span */
.single .post-tags a,
.single .post-tags span,
.archive .related-tags a {
    background-color: #333;
    font-size: 16px;
    border-radius: 4px;
    border-bottom: 4px solid #63B175;
}

@media only screen and (min-width: 768px) {
    .single .post-tags {
        clear: right;
    }
}

.single p.post-modified {
    color: #333;
    font-size: smaller;
    margin-top: 3em;
    font-weight: 300;
}

/* author UX-4460 */
.author {
	margin-top: 1em;
    margin-bottom: 1em;
    padding-left: 1em;
    border-left: 1px solid #63B175;
	max-height: 2.52em;
}

.author-by {
    font-weight: 500;
}

.author-name {
    font-weight: 500;
}

.author-by,
.author-name {
    font-size: 18px;
    color: #333;
    padding: 0em;
    margin: 0em;
    line-height: 1em;
}

/* reviewer UX-4460 */
.reviewer {
	margin-top: 1em;
    margin-bottom: 1em;
    padding-left: 1em;
    border-left: 1px solid #63B175;
	max-height: 2.52em;
}
.reviewer-by {
    font-weight: 500;
}
.reviewer-name {
    font-weight: 500;
}
.reviewer-name a{
    text-decoration: none;
}
.reviewer-by,
.reviewer-name {
    font-size: 18px;
    color: #333;
    padding: 0em;
    margin: 0em;
    line-height: 1em;
}

@media only screen and (min-width: 767px) {
    .single .meta-row:after {
        content: "";
        display: table;
        clear: both;
    }
	.single .author_reviewer {
		margin-bottom: 2em;
		display: inline-flex;
		flex-basis: fit-content;
		justify-content: center;
		align-items: center;
    }
	.bael_page_inner_head{display: flex; justify-content: space-between;}
	.bael_category_tags{flex: auto;}
	.author {flex:1;}
	.reviewer {flex:1;}
	.author_reviewer .user_avatar_photo{
		width: 2.8em;
		height: 2.8em;
		object-fit: cover;
		position: relative;
		z-index: 2;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		border-radius: 100%;
		margin-right: 1em;
	}
	.author-by, .author-name{float:left;width:100%;line-height: 1.25em;}
	.reviewer-by, .reviewer-name{float:left;width:100%;line-height: 1.25em;}
	.single .categories,
    .single .post-tags {
        float: right;
		text-align: right;
    }
	.single .categories li,
    .single .post-tags li {
		margin-bottom: 0.56em;
	}
}
@media only screen and (max-width: 767px) {
    .single .author_reviewer {
        margin-bottom: 2em;
    }
	.single .categories {
        display: table-cell;
        padding-right: 1em;
    }
	.author {margin-top: 0.2em;display: flex;height: 2.2em; flex-direction: column;position: relative;top: 0.28em;margin-bottom: 2em;}
	.reviewer {margin-top: 0.2em;display: flex;height: 2.2em; flex-direction: column;position: relative;top: 0.28em;margin-bottom: 1em;}
	.author-by, .author-name {line-height: 1.2em;}
	.reviewer-by, .reviewer-name{line-height: 1.2em;}
	.author_reviewer .user_avatar_photo{
		width: 2.8em;
		height: 2.8em;
		object-fit: cover;
		position: relative;
		z-index: 2;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		border-radius: 100%;
		margin-right: 1em;
		float: left;
	}
	.single .categories li,
    .single .post-tags li {
		margin-bottom: 0.56em;
	}
}

/* anchor links */
h2, h3{
    position: relative;
}
h2:hover .anchor-link svg,
h3:hover .anchor-link svg,
.anchor-link:hover svg{
    opacity:1;
}
.anchor-link svg {
    transition: 0.2s;
    opacity: 0;
    width: 40px;
    height: 18px;
    position: relative;
}
h3 .anchor-link svg{
    top: 5px;
}
@media only screen and (max-width: 768px) {
	.topAdContainer{
		width: 362px;
		margin:0px !important;
		padding:0px !important;
		max-height: 200px;
		display: block !important;
		position: relative;
		right: 10px;
	}
}


/* Cross links */
.cross-links {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 12px;
	margin-bottom: 2em;
}

.cross-links__title {
	white-space: nowrap;
	font-size: 24px;
}

.cross-links__list {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cross-links__item {

}

.cross-links__link {
	display: block;
	padding: 1px 25px;
	border: 1px solid #000;
	color: #000;
}

.cross-links__link:hover,
.cross-links__link:focus {
	text-decoration: none;
	opacity: .8;
}

@media only screen and (max-width: 768px) {
	.cross-links {
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 20px;
		margin-bottom: 1.4em;
	}

	.cross-links__title {
		font-size: 20px;
	}

	.cross-links__list {
		flex-wrap: wrap;
	}

	.cross-links__link {
		padding: 1px 20px;
	}
}



/*========================*/

/***************** Almost done ************/
.almost_head{background-color: #535353;min-height: 18em;}
.almost-head-logo{display: flex;align-items: center;justify-content: center;}
.almost-head-logo img {margin-top: 6em;}
.almost_head p{color:#fff;text-align: center;margin: 1.68em 0em;}
.almost-done-p{font-size: 46px;color: #535353;text-align: center;font-weight: bold;}
.almost-done-p span{color: #4ea362;}
.almost-done-steps{display: flex;align-items: center;justify-content: center;}
.almost-step1 p, .almost-step2 p, .almost-step3 p{color:#fff;font-size: 16px;margin: 0px;}
p.bold{font-size: 22px;font-weight: bold;margin: 0 0 10px;}
p.font{font-size: 22px;}
.almost-step1, .almost-step2, .almost-step3{position: relative;padding: 2em 1em;height: 11em;}
.almost-step1{background:#63B175;width: 25%;}
.almost-step2{background:#535353;width: 35%;}
.almost-step3{background:#63B175;width: 40%;}
.triangle-green-right {width: 2.7em;background: #535353;border-left: 2.7em solid #63B175;border-top: 5.5em solid transparent;border-bottom: 5.5em solid transparent;}
.triangle-brown-right{width: 2.7em;background: #63B175;border-left: 2.7em solid #535353;border-top: 5.5em solid transparent;border-bottom: 5.5em solid transparent;}
.triangle-green-left{width: 2.7em;border-left: 2.7em solid #63B175;border-top: 5.5em solid transparent;border-bottom: 5.5em solid transparent;}

@media screen and (min-width: 769px) and (max-width: 1024px) {
	.almost-step1, .almost-step2, .almost-step3{position: relative;padding: 0.56em 0.56em;height: 11em;}
	p.font{font-size: 16px;font-weight: 600;margin: 0 0 5px;}
}
@media screen and (max-width: 768px) {
	.almost-done-steps{display: block;}
	.almost-step1, .almost-step2, .almost-step3{width:100%;padding: 1em 1em;margin-bottom: 1em;height: auto;}
	.border-arrow {display: none;}
	.almost-step1 p, .almost-step2 p, .almost-step3 p{margin: 0 0 10px;}
	.almost-done-p{font-size: 34px;margin: 20px 0px;}
}

/***************** About us ***************/
.about-us-template{padding: 1.12em;}
.about-us-template a img{margin-right: 5px;}
.about-baeldung{margin-top: 2.8em;}
.about-baeldung p, .about-publish p{margin-bottom: 1.12em;}
p.no_margin{margin-bottom: 0px;}
.about-us-template h1{font-size: 40px;font-weight: bold;line-height: 1;margin-bottom: 0.9em;}
.about-us-template h3{font-size: 26px;margin-bottom: 0.9em;}
.about-ceo{width: 100%;display: flex;}
.about-ceo-img{width: 33%;padding: 2em;}
.about-ceo-img p{font-size: 24px;}
.about-ceo-content{width:67%;padding: 1.12em;}
@media screen and (max-width: 768px) {
	.about-us-template{padding: 0.56em;}
	.about-us-template p{font-size: 20px;}
	.about-ceo{width: 100%;display: block;}
	.about-ceo-img{width: 100%;padding: 0px;}
	.about-ceo-img p{margin-bottom: 2.8em;}
	.about-ceo-content{width:100%;padding: 0px;}
	.about-us-template h3{font-size: 22px;}
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
	.about-ceo-img{width: 40%;padding: 1em;}
	.about-ceo-content{width:60%;padding: 0.56em;}
	.about-ceo-img p{font-size: 20px;}
	.about-us-template h3{font-size: 22px;}
}

/********** Start here template *****************/
.start-here-wrap {margin-top: 2em;}
.start-here-course { background-color: #F5F5F5;padding: 1em;display: flex;}
.start-item1{width: 25%;display: flex;align-items: center;justify-content: center;}
.start-item2{width: 40%;display: flex;justify-content: center;flex-direction: column;padding: 0px 10px;}
.start-item3{width: 35%;display: flex;align-items: center;justify-content: center;flex-direction: column;}
.start-item1 img{border-radius: 5px;}
.start-item2 p{font-size: 19px;color:#7A7A7A;}
.start-item2 p span{color: #63b175;}
.button-start-content{
	display: block;
    padding: 0.84em;
    min-width: 380px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1.12em;
	font-size: 19px;
    text-align: center;
    border-radius: 2px;
    color: white !important;
    font-weight: 600;
	border-radius: 3px;
}
@media screen and (max-width: 768px) {
	.start-here-course{display: block;}
	.start-item1, .start-item2, .start-item3{width: 100%;}
	.start-item2 p{margin: 0.9em 1em;}
}
@media screen and (max-width: 1024px) {
	.button-start-content{ min-width: 100%; }
}



/*========================*/

/* UX-11537: Login and Register buttons to Menu */

.loginout {
	position: relative;
	display: block !important;
	float: right;
	margin-left: auto;
	padding-right: 10px;
	width: auto;
}

.loginout__info {
	display: flex;
	align-items: center;
	gap: 10px;
	height: 50px;
	cursor: pointer;
}

.loginout__info::after {
	width: 0;
	height: 0;
	border-top: 8px solid #fff;
	border-right: 5px solid transparent;
	border-left: 5px solid transparent;
	content: '';
}

.loginout__avatar {
	border: 2px solid #4e9359;
	border-radius: 50%;
}

.loginout__name {
	color: #fff;
	font-weight: 600;
	font-size: 14px;
}

.loginout__menu {
	position: absolute;
	top: 100%;
	right: 0;
	display: none;
	overflow: hidden;
	margin: 0;
	padding: 0;
	width: 180px;
	border-radius: 0 0 5px 5px;
	list-style: none;
}

.loginout:hover .loginout__menu {
	display: block;
}

.loginout__item {
	border-top: 1px solid rgba(255, 255, 255, .5);
	text-align: center;
	font-weight: 600;
	font-size: 16px;
}

.loginout__item:first-child {
	border-top: none;
}

.loginout__link {
	display: block;
	padding: 5px;
}

@media (min-width: 1400px) {
	.loginout {
		margin-right: 100px;
	}
}

@media (min-width: 1200px) {
	.loginout {
		margin-right: 65px;
	}
}

@media (max-width: 1200px) {
	.loginout__name {
		display: none;
	}
}



/*========================*/

/* UX-40: Table of post contents in the left sidebar */ 

/* Default tocBot styles */ 

.toc {
    overflow-y: auto
}

.toc>.toc-list {
    overflow: hidden;
    position: relative
}

.toc>.toc-list li {
    list-style: none
}

.toc-list {
    margin: 0;
    padding-left: 10px
}

a.toc-link {
    height: 100%
}

.is-collapsible {
    max-height: 1000px;
    overflow: hidden;
    transition: all 300ms ease-in-out
}

.is-collapsed {
    max-height: 0
}

.is-position-fixed {
    position: fixed !important;
    top: 0
}

.is-active-link {
    font-weight: 700
}

.toc-list {
    border-left: 2px solid #eee;
}

/* Our customized tocBot styles */

ol> li.toc-list-item:before {
	content: "";
}

#toc-contents {
	display:none;
	max-width: 13%;
	overflow: hidden;
}

@media screen and (min-width: 1900px) {
	#toc-contents {
		position: fixed;
		left: 30px;
		top: 120px;
		display: block;
	}
}

@media screen and (min-width: 2000px) {
	#toc-contents {
		max-width: 16%;
	}
}



/*========================*/

/*--- Components/Pagination ---*/

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}

.pagination > li {
    display: inline;
}

.pagination > li > a,
.pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    line-height: 1.42857143;
    text-decoration: none;
    color: #63B175;
    background-color: #fff;
    border: 1px solid #ddd;
    margin-left: -1px;
}

.pagination > li:first-child > a,
.pagination > li:first-child > span {
    margin-left: 0;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
}

.pagination > li:last-child > a,
.pagination > li:last-child > span {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    z-index: 2;
    color: #23527c;
    background-color: #eee;
    border-color: #ddd;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    z-index: 3;
    color: #fff;
    background-color: #63B175;
    border-color: #337ab7;
    cursor: default;
}

.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
    color: #777;
    background-color: #fff;
    border-color: #ddd;
    cursor: not-allowed;
}


/*========================*/

/*--- Components/Sidebar ---*/

.sidebar {
    -webkit-flex-basis: 300px;
    -ms-flex-basis: 300px;
    flex-basis: 300px;

    -webkit-flex-grow: 0;
    -ms-flex-grow: 0;
    flex-grow: 0;

    width: 300px;
    padding-left: 0;
    padding-right: 0;
    position: relative;
    display: none;
}

.sidebar .widget {
    margin-bottom: 20px;
    margin-top: 20px;
    width: 300px;
}


/* Hide sidebar on small screens */

@media only screen and (min-width: 1200px) {
    .sidebar {
        display: block;
    }
}


/*========================*/

/*--- Customizations ---*/




/*========================*/

/*--- Customizations/AdsInserter ---*/

/* Hiding the Buy Sell Ads link */

.bsa_it_p {
    display: none;
}


/*========================*/

/*--- Customizations/Contact Form 7 ---*/

.wpcf7 .wpcf7-form-control-wrap,
.wpcf7 label,
.wpcf7 .wpcf7-form-control{
  width:100%;
  display: block;
}

.wpcf7 .wpcf7-form-control{
  padding:15px;
  margin-top:10px;
  margin-bottom: 30px;
}

.smaller-form-fields .wpcf7 .wpcf7-form-control{
  padding: 10px;
  margin-top: 7px;
  margin-bottom: 25px;
}


.wpcf7 .wpcf7-submit{
  background-color: #63B175;
  color: #fff;
  cursor: pointer;
  border: 0;
}
.wpcf7 .wpcf7-submit:hover{
  background-color: #4e9359;
}


/* UX-6690 */
.wpcf7-form[action^="/linux-author-contact"] .wpcf7-select[name="areas-focus"] option[value="Linux"],
.wpcf7-form[action^="/cs-author-contact"] .wpcf7-select[name="areas-focus"] option[value="Computer Science"],
.wpcf7-form[action^="/kotlin-author-contact"] .wpcf7-select[name="areas-focus"] option[value="Kotlin"],
.wpcf7-form[action^="/scala-author-contact"] .wpcf7-select[name="areas-focus"] option[value="Scala"] {
  display: none;
}



/*========================*/

/*--- Customizations/Cookie Notice ---*/

/* make the cookie notice appear above the ads */
#cookie-notice {
	z-index: 9999999 !important;
}


/*========================*/

/*--- Customizations/Elementor ---*/

/* Fix missing spaces around italics words on series page (UX-6988) */
.elementor-widget .elementor-icon-list-item a {
  display: inline !important;
}



/*========================*/

/*--- Customizations/Further Reading Box ---*/

section.further-reading-posts {
    border: 1px dotted #798baa;
    padding: 12px 35px;
    margin-bottom: 20px;
    margin-top: 20px;
}

section.further-reading-posts .fr-header h2 {
    font-weight: 900;
    font-size: 27px;
    color: #5dae70;
    margin-top: 20px;
    margin-bottom: 10px;
}

@media only screen and (min-width: 768px) {
    section.further-reading-posts .fr-wrap {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
}

section.further-reading-posts .fr-item {
    min-width: 33%;
    color: #7386a6;
}

@media only screen and (min-width: 768px) {
    section.further-reading-posts .fr-item:not(:first-child) {
        padding-left: 3%;
    }
}

section.further-reading-posts .fr-item h2 {
    margin-top: 20px;
    margin-bottom: 20px;
}

section.further-reading-posts .fr-item h2 a {
    font-weight: 900;
    font-size: 22px;
    overflow-wrap: break-word;
}

section.further-reading-posts .fr-item .ex,
section.further-reading-posts .fr-item a {
    color: #7386a6;
    font-size: 16px;
    line-height: 1.334;
    margin-bottom: 14px;
}

section.further-reading-posts .fr-item a {
    font-weight: 700;
}


/*========================*/

/*--- Customizations/Highlight.js ---*/


/* Baeldung Highlight.js default theme, partly overidable with branding settings */

.hljs {
    font-size: 14px !important;
    line-height: 1.43 !important;
    font-weight: 400 !important;
    font-family: 'Source Code Pro', "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;
    border-left: 3px solid #267438;
    padding-left: 14px;
    background-color: #f8f8f8;
}


/* Base color:  */

.hljs,
.hljs-subst {
  color: #444 !important;
}

.hljs-comment {
  color: #888888 !important;
}

.hljs-keyword,
.hljs-attribute,
.hljs-selector-tag,
.hljs-meta-keyword,
.hljs-doctag,
.hljs-name {
  font-weight: 600;
}

.hljs-keyword,
.hljs-attribute,
.hljs-selector-tag,
.hljs-meta-keyword,
.hljs-doctag,
.hljs-name {
  color: #63b175 !important;
}


/* User color:  */

.hljs-type,
.hljs-string,
.hljs-number,
.hljs-selector-id,
.hljs-selector-class,
.hljs-quote,
.hljs-template-tag,
.hljs-deletion {
  color: #4E9359 !important;
}

.hljs-title,
.hljs-section {
  color: #267438 !important;
  font-weight: bold;
}

.hljs-regexp,
.hljs-symbol,
.hljs-variable,
.hljs-template-variable,
.hljs-link,
.hljs-selector-attr,
.hljs-selector-pseudo {
  color: #BC6060 !important;
}


/* Language color: */

.hljs-literal {
  color: #78A960 !important;
}

.hljs-built_in,
.hljs-bullet,
.hljs-code,
.hljs-addition {
  color: #397300 !important;
}


/* Meta color: */

.hljs-meta {
  color: #1f7199 !important;
}

.hljs-meta-string {
  color: #4d99bf !important;
}


/* Misc effects */

.hljs-emphasis {
  font-style: italic;
}

.hljs-strong {
  font-weight: bold;
}

/* Fix grammarly infinite vertically expanding issue with code blocks */

.code grammarly-ghost {
  display: none;
}

/* UX-1339 */
pre code {
  font-size: 14px!important;
  line-height: 1.43!important;
  padding: 0.5em;
  display: block;
}

/* UX-2657 */
#content pre.add-horizontal-scrollbar {
  white-space: pre;

	/* UX-7719 */
	overflow-x: auto;
}



/*========================*/

/*--- Customizations/InjectedSVG ---*/

/* Injected SVG height fix */

.injected-svg {
    height: auto;
}
  


/*========================*/

/*--- Customizations/VAT calculation ---*/

/* PPP Message BAEL-12093 */

.ppp-message {
	border: 3px dashed rgb(245, 194, 72);
}
.ppp-message p {
	color: #fff !important;
	padding: 10px;
	font-size: 15px;
	line-height: 1.55em;
	text-align: center;
	margin: 0;
}
.ppp-message.dark-text p{
	color: rgb(51, 51, 51) !important;
}
.ppp-message-container.dark-text .ppp-message p{
	color: rgb(51, 51, 51) !important;
}


/*========================*/

/*--- Customizations/Syntax Highlighter ---*/

/* setup the offset */
body .syntaxhighlighter {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
}
  
/* setup the font */
body .syntaxhighlighter,
body .syntaxhighlighter a,
body .syntaxhighlighter div,
body .syntaxhighlighter code,
body .syntaxhighlighter table,
body .syntaxhighlighter table td,
body .syntaxhighlighter table tr,
body .syntaxhighlighter table tbody,
body .syntaxhighlighter table thead,
body .syntaxhighlighter table caption,
body .syntaxhighlighter textarea {
    font-size: 14px !important;
    line-height: 1.43 !important;
    font-weight: 300 !important;
    font-family: 'Source Code Pro', "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;
}

/* setup the keyword/string style */
body .syntaxhighlighter .keyword,
body .syntaxhighlighter .string,
body .syntaxhighlighter .string a {
    color: #63B175 !important;
    font-weight: 600 !important;
}

/* override the vertical gutter color */
body .syntaxhighlighter .gutter .line {
    border-right: 3px solid #63B175 !important;
}

/* hide about the syntaxhighlighter plugin link */
body .syntaxhighlighter .toolbar {
    display: none !important;
}


/*========================*/

/*--- Customizations/WP discuz ---*/

/* wc-load-more-submit */

#wpcomm .wc-load-more-submit:hover,
#wpcomm .wc-load-more-submit:focus {
  background-color: #63B175;
  color: white;
  border: 0 none;
}


/*========================*/

/*--- Generic ---*/


/*========================*/

/*--- Generic/Animations ---*/

.fade {
    opacity: 0;
    -webkit-transition: opacity .15s linear;
    -o-transition: opacity .15s linear;
    transition: opacity .15s linear
}
  
.fade.in {
    opacity: 1
}
  
.collapse {
    display: none
}
  
.collapse.in {
    display: block
}
  
tr.collapse.in {
    display: table-row
}
  
tbody.collapse.in {
    display: table-row-group
}
  
.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition-property: height, visibility;
    transition-property: height, visibility;
    -webkit-transition-duration: .35s;
    transition-duration: .35s;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease
}


/*========================*/

/*--- Generic/Clearfix ---*/

.clearfix:before,
.clearfix:after {
 content: " ";
 display: table;
}

.clearfix:after {
 clear: both;
}


/*========================*/

/*--- Generic/IE 10 ---*/

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.home-banner-button{
		bottom: 40px !important;
	}
	
	.rws-home-top-link .tcb-flex-row :nth-of-type(1).tcb-flex-col,
	.ls-home-top-link .tcb-flex-row :nth-of-type(1).tcb-flex-col{
		width: 30%;
	}

	.rws-home-top-link .tve_image_frame{
		margin-top: 20px;
	}
	.ls-home-top-link .tve_image_frame{
		margin-top: 30px;
	}
}


/*========================*/

/*--- Generic/Normalize ---*/

/*
 * normalize.css v8.0.0
 * MIT License:
 * github.com/necolas/normalize.css
 */

 html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
  }
  
  body {
    margin: 0;
    font-weight: 400;
  }
  
  h1 {
    font-size: 2em;
    margin: .67em 0
  }
  
  hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
  }
  
  pre {
    font-family: monospace, monospace;
    font-size: 1em
  }
  
  a {
    background-color: transparent
  }
  
  abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted
  }
  
  b,
  strong {
    font-weight: bold
  }
  
  code,
  kbd,
  samp {
    font-family: monospace, monospace;
    font-size: 1em
  }
  
  small {
    font-size: 80%
  }
  
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
  }
  
  sub {
    bottom: -.25em
  }
  
  sup {
    top: -.5em
  }
  
  img {
    border-style: none
  }
  
  button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
  }
  
  button,
  input {
    overflow: visible
  }
  
  button,
  select {
    text-transform: none
  }
  
  button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
    -webkit-appearance: button
  }
  
  button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0
  }
  
  button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText
  }
  
  fieldset {
    padding: .35em .75em .625em
  }
  
  legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
  }
  
  progress {
    vertical-align: baseline
  }
  
  textarea {
    overflow: auto
  }
  
  [type="checkbox"],
  [type="radio"] {
    box-sizing: border-box;
    padding: 0
  }
  
  [type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
    height: auto
  }
  
  [type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px
  }
  
  [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
  }
  
  ::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
  }
  
  details {
    display: block
  }
  
  summary {
    display: list-item
  }
  
  template {
    display: none
  }
  
  [hidden] {
    display: none
  }


/*========================*/

/*--- Generic/Print---*/

@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }
    a,
    a:visited {
        text-decoration: underline;
    }
    a[href]:after {
        content: " (" attr(href) ")";
    }
    abbr[title]:after {
        content: " (" attr(title) ")";
    }
    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }
    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }
    thead {
        display: table-header-group;
    }
    tr,
    img {
        page-break-inside: avoid;
    }
    img {
        max-width: 100% !important;
    }
    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }
    h2,
    h3 {
        page-break-after: avoid;
    }
}


/*========================*/

/*--- Generic/Scaffolding ---*/

/* Reset the box-sizing */

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  *:before,
  *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  
  /* Body reset */
  
  html, body {
    height: 100%;
  }
  
  html {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
  }
  
.iKSPLL *, .iKSPLL ::before, .iKSPLL ::after {
	font-size: 14px !important;
	line-height: 1.5 !important;
}

.iKSPLL .eltawh {
	color: rgb(41, 98, 255) !important;
	box-shadow: currentcolor 0px 0px 0px 1px inset !important;
	background: transparent !important;
}

.iKSPLL .qLrrc {
	box-shadow: none !important;
}

.iKSPLL .dXsjDQ button {
	box-shadow: none !important;
}

.iKSPLL .cwlUDU button{
	color: rgb(41, 98, 255) !important;
}

  body {
    color: #000;
    background-color: #fff;
    font-family: 'Raleway', sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.42857143;
	font-display: swap;
  }
  
  /* Reset fonts for relevant elements */
  
  input,
  button,
  select,
  textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
  }
  
  
  /* Links */
  
  a {
    color: #63b175;
    text-decoration: none;
  }
  
  
  a:hover,
  a:focus {
    text-decoration: underline;
  }
  
  a:link,
  a:visited {
    color: #63B175;
  }
  
  
  /* Figures */
  
  figure {
    margin: 0;
  }
  
  
  /* Images */
  
  img {
    vertical-align: middle;
    height: auto;
    max-width: 100%;
  }
  
  /* Horizontal rule */
  
  hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee;
  }
  
  h1, h2, h3, h4, h5, h6,
  .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
  }
  
  h2, .h2,
  h3, .h3 {
    font-weight: 700;
  }
  
  h1, .h1,
  h2, .h2,
  h3, .h3 {
    margin-top: 20px;
    margin-bottom: 10px;
  }
  h4, .h4,
  h5, .h5,
  h6, .h6 {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  
  h1, .h1 { font-size: 36px }
  
  h2, .h2 { font-size: 30px }
  
  h3, .h3 { font-size: 24px }
  
  h4, .h4 { font-size: 18px; margin-top:12px; }
  
  h5, .h5 { font-size: 14px }
  
  h6, .h6 { font-size: 12px }
  
  p {
    margin: 0 0 10px;
  }
  
  small {
    font-size: 85%;
  }
  
  mark {
    background-color: #fcf8e3;
    padding: .2em;
  }
  
  /* lists */
  
  ul,
  ol {
      margin-top: 0;
      margin-bottom: 10px
  }
  
  ul ul,
  ol ul,
  ul ol,
  ol ol {
      margin-bottom: 0
  }
  
  /* reset counters */
  ol {
    list-style: none;
    counter-reset: item;
  }
  
  ol> li:before {
    content: counters(item, ".") ". ";
    counter-increment: item;
  }
  
  ol ol> li:before,
  ul ol> li:before {
    content: counters(item, ".") " ";
  }
  
  dl {
    margin-top: 0;
    margin-bottom: 20px;
  }
  dt,
  dd {
    line-height: 1.42857143;
  }
  dt {
    font-weight: bold;
  }
  dd {
    margin-left: 0;
  }
  
  abbr[title] {
    cursor: help;
    border-bottom: 1px dotted #777;
  }
  
  
  /* blockquote */
  
  blockquote {
    padding: 10px 30px;
    margin: 40px 10px;
    font-size: 18px;
    line-height: 26px;
    border-left: 3px solid #447A50;
  }
  
  blockquote p:last-child,
  blockquote ul:last-child,
  blockquote ol:last-child {
    margin-bottom: 0
  }
  
  blockquote footer:before,
  blockquote small:before,
  blockquote .small:before {
    content: '\2014 \00A0'
  }
  
  address {
    margin-bottom: 20px;
    font-style: normal;
    line-height: 1.42857143;
  }
  
  /* Forms */
  
  fieldset {
    padding: 0;
    margin: 0;
    border: 0;
    min-width: 0
  }
  
  legend {
    display: block;
    width: 100%;
    padding: 0;
    margin-bottom: 20px;
    font-size: 21px;
    line-height: inherit;
    color: #333;
    border: 0;
    border-bottom: 1px solid #e5e5e5
  }
  
  label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 700
  }
  
  input[type=search] {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
  }
  
  input[type=radio],
  input[type=checkbox] {
    margin: 4px 0 0;
    margin-top: 1px \9;
    line-height: normal
  }
  
  input[type=file] {
    display: block
  }
  
  input[type=range] {
    display: block;
    width: 100%
  }
  
  select[multiple],select[size] {
    height: auto
  }
  
  input[type=file]:focus,
  input[type=radio]:focus,
  input[type=checkbox]:focus {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px
  }
  
  input[type=search] {
    -webkit-appearance: none
  }

  @media screen and (max-width: 767px) {
	.page-header .single-title::first-line{
		font-weight: 600;
	}
    .page-header .single-title {
		font-display: swap;
		font-family:'Garamond', sans-serif !important;
		line-height: 1.25;
		font-weight: 600;
		font-size: 1.624em;
		margin-top:20px;
		contain-intrinsic-width: 20.72em;
        contain-intrinsic-height: 16em;
    }
  } 

  /* Style for the team package dropdown */
  .membership_pro_baeldung .members-bulk {
  padding: 10px; 
  margin-top: 20px;
  font-size: 16px; 
  font-family: Arial, sans-serif; 
  background-color: #f9f9f9; 
  border: 1px solid #ccc;
  border-radius: 5px; 
  color: #333; 
}

/* Hover effect for the dropdown */
.membership_pro_baeldung .members-bulk:hover {
  background-color: #e9e9e9; 
  border-color: #bbb; 
}

/* Focus style for better accessibility */
.membership_pro_baeldung .members-bulk:focus {
  outline: none; 
  border-color: #63b175; 
  box-shadow: 0 0 5px rgba(99, 177, 117, 0.5); 
}

[data-darkreader-scheme="dark"] .sublogo-container.light {
  display: none; /* Hide Light sublogo in Dark mode */
}

[data-darkreader-scheme="dark"] .sublogo-container.dark {
  display: inline-block; /* Show Dark sublogo in Dark mode */
}

.sublogo-container.light {
  display: inline-block; /* Default: Show Light sublogo */
}

.sublogo-container.dark {
  display: none; /* Default: Hide Dark sublogo */
}

.site-courses section.ppp-dark-message-anchor ~ .ppp-message-container, 
.site-courses section.ppp-message-anchor ~ .ppp-message-container {
  padding: 0em 2em 0em 2em;
  background: #f4f4f4;
}

.ppp-message-container .ppp-message{
	width:100%;
	text-align:center;
	border: 2px dashed #f8d480;
	margin:0 auto;
	padding:10px;
	font-family: "Raleway", Sans-serif;
	font-weight: 400;
	line-height: 28px;
	}

  .ppp-message p {
    color: #fff !important;
    padding: 10px;
    font-size: 15px;
    line-height: 1.55em;
    text-align: center;
    margin: 0;
  }
  
  body .ld-course-list-items .ld_course_grid .thumbnail.course .ribbon {
    font-size: 28px;
  }

  body .ld-course-list-items .bottom-meta {
    margin-top: 1.5em;
  }



/*========================*/

/*--- Shortcodes ---*/


/*========================*/

/*--- Shortcodes/Content control ---*/

.content-control {
	margin: 20px auto;
	padding: 15px;
	width: 100%;
	border: 1px dashed #666;
	border-radius: 8px;
	background-color: #f9f9f9;
	font-family: 'Raleway', sans-serif;
	line-height: 1.6;
}

.content-control a {
	color: #63b175;
}



/*========================*/

/*--- Shortcodes/Price-Switch ---*/

.price-switch {
	display: flex;
	overflow: hidden;
	margin: 0 auto;
	padding: 0;
	width: 180px;
	height: 46px;
	border-radius: 23px;
}

.price-switch__item {
	display: flex;
	align-items: center;
	flex-grow: 1;
	justify-content: center;
	background: #efefef;
	color: #a9a9a9;
	font-weight: 600;
	cursor: pointer;
}

.price-switch__item.-state_active {
	background: #63b175;
	color: #fff !important;
}



/*========================*/

/*--- Shortcodes/Shortbox ---*/

.short_box {
    border-top: 1px solid #EFEFEF;
    border-bottom: 1px solid #EFEFEF;
    margin-bottom: 20px;
    padding: 25px;
}

.short_box h3 {
    margin-top: 2.1em !important;
    margin-bottom: 1.3em !important;
}

.short_box h3 b {
    font-weight: 300!important;
    font-size: 25px!important;
    line-height: 29px;
    letter-spacing: -1.23px;
    margin-bottom: 15px !important;
}

.short_box p {
    font-weight: 400!important;
    font-size: 18px!important;
    letter-spacing: -0.75px;
}

.short_end {
    margin-top: 40px!important;
    border: 4px solid #63B175!important;
    padding: 5px 35px 10px 35px!important;
}

.short_end h3 b {
    font-weight: 700!important;
    font-size: 25px!important;
    line-height: 29px;
    letter-spacing: -1.23px;
    margin-bottom: 15px !important;
}