/* Extracted from the inline <style> block in pages/skulenie.php.
   Part of the Bootstrap migration: page-specific CSS that isn't reused
   anywhere else gets its own file instead of living inline. */

	.mobil-navi ul {
		margin-top: 0px!important;
	}

	/* .row-akcia and .akciova: both rules were missing entirely from this file, even
	   though the page's own markup uses `class="row-akcia"` and `class="btn akciova"` -
	   same missing-rule pattern found on css/sosovky-galaxy.css. Added from the standard
	   cross-page pattern (matches css/zlasik.css) so the promo bar/button don't render
	   unstyled if a pricing row with akcia+url content is ever configured for this page. */
	.row-akcia {
		background: url(/img/relex-smile/bg-akcia.png) repeat-x;
		color: var(--color-white);
		height: 90px;
		line-height: 90px;
	}
	.akciova, .akciova:hover {
		display: inline-block;
		text-align: left;
		height: 50px;
		line-height: 50px;
		padding: 0 20px;
		margin-top: 15px;
		font-family: var(--font-primary);
		font-weight: 700;
		text-transform: uppercase;
		color: var(--color-white)!important;
		background-image: url(../img/nbtn.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		cursor: pointer;
	}

	#pocket .row-trash {
		background-color: #f3f1f0;
		padding: 80px 0px;
	}

	#pocket .row-banner {
		background-position: center top;
		background-size: cover;
		padding: 50px 0;
		color: var(--color-white);
        position: relative;
		min-height: 600px;
	}
	#pocket .row-order {
		background-image: url(/img/magic-pocket/azure.jpg);
		background-position: center top;
		background-size: cover;
		padding: 80px 0;
		color: var(--color-white);
		height: 380px;
	}

	#pocket .row-banner h1 {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-white);
		margin-bottom: 10px;
		font-size: 45px;
	}
	#pocket .row-banner h2 {
		font-family: var(--font-primary);
		font-weight: 400;
		color: var(--color-white);
		font-size: 20px;
	}
	#pocket .row-banner p {
		font-family: var(--font-primary);
		font-weight: 300;
		color: var(--color-white);
		font-size: 18px;
		margin-top: 16px;
		margin-bottom: 10px;
	}
	#pocket .row-banner .headline {
		max-width: 555px;
        padding: 50px 35px 50px 30px;
		background-color: rgba(29,96,113, 0.8);
		margin-top: 30px;
	}

	#pocket .row-trash h2 {
		font-family: var(--font-primary);
		font-weight: 700;
		color: #29c3b1;
		font-size: 36px;

	}

#pocket .row-trash p {
    color: var(--color-text);
}

	#pocket .row-trash h3 {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-text);
		text-transform: uppercase;
		font-size: 20px;
		margin-top: 30px;
        margin-bottom: 20px;
	}

	#pocket .row-trash ul {
		margin-top: 10px;
	}

	#pocket .row-trash li {
		font-family: var(--font-primary);
		font-weight: 400;
		color: var(--color-text);
		font-size: 16px;
		margin-top: 5px;
	}

	#pocket .row-order .first-cena {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-text);
		text-transform: uppercase;
		font-size: 20px;
		margin-top: 10px;
	}

	#pocket .row-order .second-cena {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-teal);
		text-transform: uppercase;
		font-size: 56px;
	}

	#pocket .row-order .second-cena .sup{
		color: var(--color-teal);
		text-transform: initial;
		font-size: 28px;
		position: relative;
		top: -17px;
	}

	#pocket .row-order .third-cena {
		font-family: var(--font-primary);
		font-weight: 400;
		color: var(--color-text);
		text-transform: uppercase;
		font-size: 18px;
	}

	#pocket .row-order .text-right img {
		margin-right: 10px;
		margin-top: 8px;
	}

	#pocket .row-order .posun {
		margin-top: 20px;
	}

	#pocket .row-order .btn-order {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-white);
		text-transform: uppercase;
		font-size: 20px;
		background-color: var(--color-teal);
		padding: 15px 20px;
		display: -webkit-inline-box;
		cursor: pointer;
	}

	#pocket .row-order .btn-order i {
		margin-left: 20px;
	}

	#pocket .row-order .under-button {
		font-family: var(--font-primary);
		font-weight: 400;
		color: var(--color-text);
		font-size: 16px;
		width: 60%;
		margin-top: 5px;
		text-align: center;
		display: -webkit-inline-box;
	}

	/* newly added */
    .mb_20{
        margin-bottom: 20px !important;
    }
	.row-banner {
		background-image: url(/userfiles/operation/liecba-skulenia-bg.jpg);
		background-position: center top;
		background-size: cover;
		padding: 50px 0;
		color: var(--color-white);
		/* height: 600px; */
	}
	.pb-60px{
		padding-bottom: 60px !important;
	}

	.toric-title{
    	font-size: 36px;
		margin-bottom: 20px;
		color: #29c3b1 !important;
	}
	.toric-content {
		padding: 15px 0px;
		width: 90%;
	}
	.toric-content .row {
		margin-bottom: 20px;
	}
	.toric-content h4 {
		padding: 15px 0px;
		color: var(--color-text);
		font-size: 22px;
		font-weight: 600;
	}
	.toric-content p {
		line-height: 27px;
	}
	.icon_files{
    	width: 70%;
	}
	.line-height-25{
		line-height: 25px;
	}
	.clientCarousel {
		margin-top: 50px;
		background: #f3f1f0;
	}
	.slick-slider{
		margin-bottom: 0;
	}
	#referencie .sub_page{
		padding: 50px 0px;
	}
	#referencie .sub_page h2{
		font-size: 36px;
		color: var(--color-text);
	}

	.ndz-holder{
		display: flex;
	}

	/* newly added */

    .row-trash .cattegory {
        display: flex;
        border: 2px solid #c1c3c2;
        padding: 12px;
        margin-bottom: 40px
    }

    .row-trash .cattegory a {
        padding: 0 15px;
        border-right: 1px solid #eee;
        line-height: 20px;
        font-family: var(--font-primary);
        text-transform: uppercase;
        color: var(--color-text);
        font-size: 14px;
        font-weight: 700;
        text-align: center;
        display: inline-table;
    }
    .row-trash .cattegory a span{
    height: 60px;
    vertical-align: middle;
    display: table-cell;
    }

    .row-trash .cattegory a:last-child {
        border-right: none;
    }

    .row-trash .cattegory a.active {
        color: var(--color-teal);
        font-weight: 700
    }

    .row-trash .cattegory a:hover {
        color: var(--color-teal)
    }

    .row-trash .select {
        height: 103px;
        padding: 0 18px;
        border: 2px solid #c1c3c2;
        background: var(--color-white);
        width: 100%;
        font-family: var(--font-primary);
        font-size: 20px;
        color: var(--color-text);
        background-image: url(../img/relex-smile/select2.png) !important;
        background-position: right !important;
        background-repeat: no-repeat !important;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        padding-right: 45px;
        padding-left: 20px;
    }
    .mobil-navi {
        margin-bottom: 30px;
        display: none;
    }

    .mobil-navi ul {
        border-left: 2px solid #c1c3c2;
        border-right: 2px solid #c1c3c2;
        border-bottom: 2px solid #c1c3c2;
        margin-top: 0px;
        position: absolute;
        top: 103px;
        width: calc(100% - 1px);
        background: var(--color-white);
        z-index: 100;
        display: none;
    }
    .mobil-navi ul li {
        padding: 10px 10px;
        margin: 0px;
    }

    .mobil-navi ul li:hover {
        background-color: #c1c3c2;
    }
    .bok {
        border-right: 2px solid var(--color-teal);
    }
    @media (max-width: 1024px){
	.row-trash .mobil-navi { display: block; }
	.row-trash .cattegory { display: none; }
	.bok { border: none; }
}
    #pocket .sub_menu_div ul li, #pocket .row-section-2 ul li, #pocket .row-section-3 ul li {
        background-image: url(../img/textLi.jpg);
        background-repeat: no-repeat;
        background-position: left 50%;
        padding-left: 21px;
        margin-bottom: 10px;
        line-height: 25px;
    }

    #pocket .row-trash-0 .cattegory{
        margin-bottom:0px !important;
    }

    .sub_menu_div{
        background-color: var(--color-white) !important;
    }
    .menu-top .cattegory a {
        padding: 0 15px;
        border-right: 2px solid #eee;
        line-height: 20px;
        font-family: var(--font-primary);
        text-transform: uppercase;
        color: var(--color-text);
        font-size: 14px;
        font-weight: 700;
        display: inline-table;
        text-align: center;
        width: 19%;
        box-sizing: border-box;
    }
    .sub_menu_content{
        margin-top: 35px;
        margin-bottom: 25px;
        line-height: 25px;
    }
    #pocket .sub_menu_div h2 {
        font-family: var(--font-primary);
        font-weight: 700;
        color: #29c3b1;
        font-size: 36px;
    }
    .row-section-2 h2{
        padding-bottom: 20px;
    }
    .row-section-2 p{
        padding-bottom: 5px;
    }
    .row-section-2 ul{
        margin-top: 0px !important;
    }
    .row-section-2{
        background-color: var(--color-white) !important;
    }
    .row-section-3{
        background-color: #f3f1f0 !important;
    }

    .row-section-3 h2{
        margin-bottom: 15px;
    }
    .row-section-3 p{
        line-height: 25px;
        margin-bottom: 20px;
    }

	@media (max-width: 768px){
	.row-banner { height: 360px; padding: 20px 0 !important; }
	#referencie .sub_page h1 { display: none; }
	.ndz-holder { display: block; }
	.slider_title { display: none; }
}

	@media (max-width: 1024px){
	#pocket .row-banner { min-height: 300px; }
	#pocket .row-banner .headline { max-width: 730px; padding: 70px 35px 70px 30px; background-color: rgba(29,96,113, 0.8); margin-top: -18px; margin-left: 12%; }
	#pocket .row-order .symbol-euro { display: none; }
	#pocket .row-order .ceny { text-align: center; }
	#pocket .row-order { height: auto; }
	#pocket .row-order .under-button { width: auto; margin-top: 15px; text-align: center; display: block; }
	#pocket .row-order .col-md-6 { width: 100%; }
	#pocket .row-order .ceny { width: 50%; float: right; text-align: left; }
	#pocket .row-order .symbol-euro { width: 50%; float: left; display: inherit; }
	#pocket .row-trash { padding: 40px 0px; }
}

	@media (max-width: 960px){
	#pocket .row-banner .headline { max-width: 585px; padding: 70px 35px 70px 30px; background-color: rgba(29,96,113, 0.8); margin-top: 30px; }
	#pocket .row-order .under-button { width: auto; margin-top: 15px; text-align: center; }
	#pocket .row-banner { background-position: 60% top; }
	#pocket .row-banner .headline { max-width: 750px; margin-top: -20px; margin-left: 0; }
}

	@media (max-width: 800px){
	#pocket .row-banner .headline { max-width: 475px; padding: 70px 35px 70px 30px; background-color: rgba(29,96,113, 0.8); margin-top: 10px; }
}

	@media (max-width: 736px){
	#pocket .row-banner .headline { padding: 70px 30px 70px 30px; }
	#pocket .row-order .under-button { width: 80%; margin-top: 15px; }
}

	@media (max-width: 667px){
	#pocket .row-banner h1 { font-size: 36px; }
}

	@media (max-width: 568px){
}
	@media (max-width: 430px){
	.icon_files { width: 160%; }
	.row-banner { height: 330px; padding: 5px 0 !important; }
}

	@media (max-width: 420px){
	.row-banner { padding: 5px 0 !important; }
	#pocket .row-order .under-button { width: 100%; margin-top: 15px; }
	#pocket .row-order .ceny { width: inherit; float: inherit; text-align: center; }
	#pocket .row-order .symbol-euro { width: inherit; float: inherit; display: none; }
}

	@media (max-width: 390px){
	#pocket .row-banner { padding: 40px 0; }
	#pocket .row-banner .headline { padding: 40px 30px 40px 30px; }
	.row-banner { height: 300px; }
}

	@media (max-width: 380px){
	#pocket .row-banner .headline { padding: 20px 30px 20px 20px; margin-top: 10px; }
	#pocket .row-banner { min-height: 250px; }
	.row-banner { height: 250px; }
	#pocket .row-banner { padding: 20px 0; }
	#pocket .row-order .btn-order { font-size: 14px; }
}

	@media (max-width: 320px){
	#pocket .row-banner .headline { padding: 20px 30px 20px 20px; margin-top: 0px; }
}
	.check-icon {
		padding-left: 40px;
		background: url('../img/magic-pocket/check-icon.svg') no-repeat;
		background-size: 40px 40px;
		min-height: 40px;
	}

	/* Converted from inline style="" attributes in pages/skulenie.php
	   (Bootstrap migration: inline CSS -> classes, no exceptions). */
	.sub-menu-padding {
		padding: 40px 0px !important;
	}
	.section-3-title {
		color: var(--color-text);
	}
	.cta-fallback-title {
		color: #29c3b1;
		font-size: 25px;
		margin-bottom: 15px;
	}
	.cta-fallback-text {
		font-size: 20px;
		color: var(--color-text);
		margin-bottom: 20px;
	}
	.cta-fallback-text--top {
		margin-top: 20px;
	}
