/* Moderní dopravce */
a { cursor: pointer;}
.btn--whiteLigBlue { background-color: #fff; border-color: #00a0dc; color: #00a0dc}
.btn--whiteLigBlue:hover { border-color: #002766; color: #002766}

.p-1 { padding: 1em;}
.p-15 { padding: 1.5em;}
.p-2 { padding: 2em;}
.p-3 { padding: 3em;}

.pt-1 { padding-top: 1em;}
.pt-15 { padding-top: 1.5em;}
.pt-2 { padding-top: 2em;}
.pt-3 { padding-top: 3em;}

.pb-1 { padding-bottom: 1em;}
.pb-15 { padding-bottom: 1.5em;}
.pb-2 { padding-bottom: 2em;}
.pb-3 { padding-bottom: 3em;}

.px-05 { padding-left: 0.5em; padding-right: 0.5em;}
.px-1 { padding-left: 1em; padding-right: 1em;}
.px-2 { padding-left: 2em; padding-right: 2em;}
.px-3 { padding-left: 3em; padding-right: 3em;}

.py-05 { padding-top: 0.5em; padding-bottom: 0.5em;}
.py-1 { padding-top: 1em; padding-bottom: 1em;}
.py-2 { padding-top: 2em; padding-bottom: 2em;}
.py-3 { padding-top: 3em; padding-bottom: 3em;}

.m-0 { margin: 0;}
.m-1 { margin: 1em;}
.mt-05 { margin-top: 0.5em;}
.mt-1 { margin-top: 1em;}

.mb-05 { margin-bottom: 0.5em;}
.mb-1 { margin-bottom: 1em;}

p.margin0 { margin: 0;}

.flex.justifyC_spaceB {justify-content: space-between;}
.flex.justifyC_spaceA {justify-content: space-around;}
.flex.alignIt_base { align-items: baseline;}
.flex.alignIt_center { align-items: center;}


.text-white { color: #fff !important;}
.text-blue { color: #082862 !important;}
.text-blueL { color: #00a0dc !important;}
.text-green { coler: #84bf00 !important;}

.bgColor-white { background-color: #fff;}
.bgColor-blue { background-color: #082862;}
.bgColor-blueL { background-color: #00a0dc;}
.bgColor-green { background-color: #84bf00;}

.font-size05 { font-size: 0.5em;}
.font-size075 { font-size: 0.75em;}
.font-size1 { font-size: 1em;}
.font-size15 { font-size: 1.5em;}
.font-size175 { font-size: 1.75em;}
.font-size2 { font-size: 2em;}
.font-size25 { font-size: 2.5em;}

.moderniDopravce.bannerH { background-image: url(/images/rrcd/modDopBann1.jpg); min-height: 400px; position: relative; background-position: right; background-repeat: no-repeat;}
.moderniDopravce.bannerH div { position: absolute; left: 2em;bottom: 7em; max-width: 500px;}

.sluzby { gap: 1px; flex-wrap: wrap; margin-bottom: 1px; justify-content: center;}
.sluzby div { background-color: #e5f2fc; padding: 2em 1em 3em; width: 24.9%; min-width: 150px;}
.sluzby img { width: 112px; height: 110px;}

.moderniDopravce.bannerS { background-image: url(/images/rrcd/modDopBann2.jpg); min-height: 400px; position: relative; background-position: right; background-repeat: no-repeat; background-size: cover;}
.moderniDopravce.bannerS div { position: absolute; left: 2em; top: 8em; color: #fff; width: 200px; height: 150px; background-color: rgba(230,0,126,0.8); text-align: center; display: flex; flex-direction: column;}
.moderniDopravce.bannerS div p:first-child { background-color: #fff; color: rgba(230,0,126,0.8); margin-top: -16px; width: 60px; padding: 5px; align-self: center;}
.moderniDopravce.bannerS div p:nth-child(2) {margin: 0 auto;}


.spoje {  gap: 15px 1px; flex-wrap: wrap; margin-bottom: 1px; justify-content: center;}
.spoje .btn--green { white-space: unset;}
.spoje .box { width: 24.9%; min-width: 150px; background-color: #f1f3f5;}
.spoje .box div:nth-child(1) { border-bottom: 2px dotted #fff;}
.spoje .box div:nth-child(2) { ;}
.spoje .box div:nth-child(3) { background: url(/images/rrcd/bg-divider-lightblue3.svg) left top repeat-x;height: 8px;}

.vlak { min-height: 400px;}
.vlak { background-image: url(/images/rrcd/moderniDopVlak.jpg); position: relative; background-repeat: no-repeat; background-size: cover;}
.vlak .info { position: absolute; left: 1.5em; top: 1.5em; width: 320px;}

.vlakBox { position: relative; height: 400px; background-color: #e4f1fa;}
.vlakBox div { position: absolute; left: 1.5em; top: 1.5em; z-index: 1; max-width: 320px; margin-right: 1.5em;}
.vlakBox img { position: absolute; bottom: 2em; left: 2em;} 

.lineH-0 { line-height: 0;}
.block { display: block;}

.vlakVylet { justify-content: space-between; padding-bottom: 0; position: relative;}
.vlakVylet .phone { flex-shrink: 0;}
.vlakVylet .phone img { margin-top: -5em;}
.apps { ;}


@media only screen and (max-width: 992px) {
        .apps { flex-wrap: wrap;}
}

@media only screen and (max-width: 850px) {
        .apps,.vlakVylet { flex-wrap: wrap;}
        .vlakVylet .phone { flex-shrink: unset;}
        .vlakVylet .phone img { margin-top: 0; padding-top: 2em;}
}

@media only screen and (max-width: 768px) {
	.sluzby div { width: 49.9%;}
	.moderniDopravce.bannerS { margin-bottom: 7em;}
	.moderniDopravce.bannerS div { left: unset; top: unset; width: 100%; bottom: -150px;}
	.spoje .box { width: 32.9%;}
        .vlakBox { height: 470px;}
}

@media only screen and (max-width: 600px) {
	.sluzby div { width: 48.9%;}
	.spoje .box { width: 48.9%;}
        .vlakBox img { position: absolute; left: 1em;}
        .moderniDopravce.bannerH {
        background-image: url(/images/rrcd/modDopBann11m.jpg);
        min-height: 600px;
        max-width: 100%;
        position: relative;
        background-position: center;
        background-size: cover;
        }
	.moderniDopravce.bannerH div {
        position: absolute;
	text-align: center;	
       top: 2em;
       }
	h1 { font-size: 2em!important;}
       .moderniDopravce.bannerS { background-image: url(/images/rrcd/modDopBann2m.jpg);}
}

@media only screen and (max-width: 391px) {
	 .sluzby div { width: 100%;}
         .spoje .box { width: 100%;}
         .vlakBox img { position: absolute; left: 1em;}
}
