:root {
  --tm: #ef7f1a;
  --sv: #ffe6aa;
}

body { font-family: 'Nunito Sans', sans-serif; font-weight: 300 }

a, a:hover { color: inherit; text-decoration: none }
a img { border: none; outline: none }
img { max-width: 100% }

.hidden { display: none }

.subpages-wrap { padding: 0 15px }
.subpages { list-style: none; margin: 0 -10px; padding: 0; display: flex; flex-wrap: wrap; place-content: center }

.subpages li, .subpage { flex-shrink: 0; margin: 10px; text-align: center }
.subpages li, .subpage { flex-basis: 130px }


strong,
.strong {
  font-weight: 700; }

.gr {
  background: #f7f9fa; }

.mid {
  padding: 20px 0; 
  display: flex;
  align-items: center; }

.brand {
  margin-right: auto; }
.brand img {
  /*height: 70px;*/ }

.mainnav,
.subnav {
  list-style: none;
  margin: 0;
  padding: 0; }

.top-navbar {
  display: flex;
  justify-content: space-between;
  align-items: center; }

.sticky .top-navbar {
  display: none; }

.top-links {
  font-size: .85rem;
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0; }
.top-links > li:not(:last-child)::after {
  content: '';
  margin-right: 10px; }
.top-links a {
  position: relative; display: inline-block; line-height: 43px }
.top-links a:hover::after, .top-links a.active::after {
  content: '';
  position: absolute;
  left: -3px;
  right: -3px;
  background: #000;
  bottom: 0;
  height: 1.6px; }

.top-info {
  display: none; }

@media only screen and (max-width: 1199.98px)  {
.mainnav {
  overflow: hidden;
  color: #fff;
  z-index: 10;
  border-radius: 22.5px 0 0 22.5px;
  background: #a75f4a;
  transition: width .35s ease-out;
  position: absolute;
  padding: 20px 0;
  top: 100%;
  max-height: 80vh;
  right: 0;
  width: 0px;
  display: block; }

.mainnav li {
  margin: 5px 25px; }
.mainnav li a {
  white-space: nowrap; }
.mainnav li a:hover {
  text-decoration: underline; }

.mainnav li .fa {
  margin-left: 5px; }

.mainnav.active {
  width: 280px; }

.subnav {
  overflow: hidden;
  transition: all .35s ease-out;
  max-height: 0; }


.subnav.active {
  max-height: 50vh; }

} /*END*/

.mobile-icon {
  margin-left: 5px; }
.phone-icon {
  display: none;
  margin-left: 5px; }
.basket-icon {
  /*display: none;*/
  position: relative;
  margin-left: 5px; }
.basket-icon .badge {
  display: none;
  font-size: 10px;
  position: absolute;
  right: 3px;
  top: 3px;
  color: #fff; }
.basket-price {
  display: none;
  margin-left: 10px; }

.modal-body form { margin: 0; padding: 0 }
.modal-body .close { float: none; position: absolute; right: 1rem; top: 1rem }

.btn { border-radius: 30px }

h2, .h2 { color: var(--dark); text-align: center; font-weight: 600; position: relative; margin-bottom: 35px }
h2:after, .h2:after { display: block; position: absolute; content: ''; left: 50%; margin-left: -55px; margin-top: 10px; width: 110px; height: 4px; background-color: var(--tm) }

h3, .h3 { color: var(--tm) }

small, .small { font-size: 80% }

.h-mid { display: flex; align-items: center; height: 90px }
@media (min-width: 992px) {
  .h-mid { height: 110px } 
}

.h-need-help { display: none; font-size: 90% }
.h-need-help a { font-weight: 600 }
@media (min-width: 550px) {
  .h-need-help { display: block; line-height: 50px; text-align: right }
}
@media (min-width: 992px) {
  .h-need-help { display: none }
}

.toggle-menu { display: block; margin: 0 0 0 auto; cursor: hand }
@media (min-width: 992px) {
  .toggle-menu { display: none }
}

.h-menu { display: block; z-index: 99; padding-left: 15px; height: 70px; position: relative; overflow-x: clip; margin-top: 80px; background: #fff }
.h-menu img { max-width: none; max-height: none }
@media (min-width: 550px) {
  .h-menu { margin-top: 0 }
}
@media (min-width: 992px) {
  .h-menu { padding-left: 25px }

  .sticky a[name]:before { display: block; visibility: hidden; margin-top: -75px; height: 75px; content: '' }
  
  .sticky .h-menu { position: fixed; left: 0; top: 0; right: 0 }
}



.global-logo { padding: 8px 0; position: absolute; left: 0; right: 0; top: -75px; text-align: center; display: inline-block }
@media (min-width: 550px) {
  .global-logo { position: static }
}
@media (min-width: 992px) {
/*
  .global-logo:hover ~ .mm-wrap { transform: translatex(134px) }
  .global-logo:hover ~ .mm-wrap > * { opacity: .3 }
*/
}


.brand { padding: 0 15px }


.mm-wrap { background-color: var(--tm); position: absolute; right: 0; top: 0; left: 0; border-top-left-radius: 35px; border-bottom-left-radius: 35px; display: flex; align-items: center; height: 70px; flex-grow: 1; transition: all .5s }
.mm-wrap > * { transition: opacity .2s }
@media (min-width: 550px) {
  .mm-wrap { left: 223px }
}
@media (min-width: 992px) {
  /*.mm-wrap { left: 89px }*/
}

.mm { display: block; z-index: 99; list-style: none; margin: 0; padding: 0; position: absolute; right: -75vw; top: 71px; border-radius: 35px 0 0 35px; background-color: var(--sv); padding: 25px 15px 25px 35px; width: 75vw; transition: all 0.5s }
.mmi { }
.mmi--link { display: inline-block; font-size: 18px; padding: 8px 0; font-weight: 600; color: #000 }
.mmi--link:hover { color: #000 }

@media (min-width: 550px) {
  .mm { right: -55vw; width: 55vw }
}
@media (min-width: 750px) {
  .mm { right: -35vw; width: 35vw }
}


#toggle-menu:checked ~ .mm { right: 0 }

@media (min-width: 992px) {
  .mm { margin: 0 auto; padding: 0; display: flex; align-items: center; position: static; border-radius: 0; width: auto; background-color: var(--tm) }
  .mmi { margin-right: 25px; backgrond-color: none; border-bottom: none; color: #fff }

  .mmi--link { display: inline; width: auto; padding: 0; font-size: 20px; position: relative; color: #fff; cursor: hand }
  .mmi--link:hover { color: #fff }
  .mmi--link:after { display: block; position: absolute; left: 50%; width: 0; opacity: 0; height: 2px; background-color: var(--sv); content: ""; transition: all 0.2s; cursor: pointer }
  .mmi--link:hover:after { left: 0; width: 100%; opacity: 1 }
}

.submm { list-style: none; margin: 0; padding: 0 }
.submmi--link { font-size: 16px; font-weight: 400; color: #000; padding: 5px 0 }
@media (min-width: 992px) {
  .submm { display: none }
}



.inline-basket { margin-left: 5px; position: relative; margin-right: 15px }
.inline-basket:after { content: ''; position: absolute; border-radius: 50%; background-color: var(--sv); width: 10px; height: 10px; right: 0; top: 0 }
.inline-basket-total { display: none }
@media (min-width: 768px) {
  .inline-basket { margin-right: 0 }
  .inline-basket-total { display: inline-block; margin-left: 5px; color: #fff; font-size: 16px; font-weight: 600; margin-right: 15px }
}
@media (min-width: 992px) {
    .inline-basket-total { margin-right: 25px }
}

.zlute-pole {
    padding: 25px 0;
    background: url('/files/podtisk.png') center bottom no-repeat rgb(255, 235, 174);
}
.obory { list-style: none }
.obory li { text-transform: uppercase; display: inline-block; white-space:nowrap; line-height: 2 } 
.obory li:after { content: " / "; color:  var(--tm); margin: 0 10px; }
.obory li:last-child:after { display: none }
.obory .promo { font-weight: 600; color: var(--tm) }




.header { margin-bottom: 20px }
header {
  background: #fff;  
  position: relative; }

.loga-vlevo a, .loga-vpravo a { margin: 0 10px }
.loga-vlevo, .loga-vpravo { color: rgb(178, 179, 179) }


.hr { height: 2px; background: url(//suvenyr.com/files/strip-3.svg) center center no-repeat; }
.hr--5 { height: 5px }

.hr--15 { height: 15px }

.links-top-wrap { display: none; #fff }
@media (min-width: 992px) {
  .links-top-wrap { display: block }
}
.links-top { list-style: none; height: 60px; display: flex; margin: 0; padding: 0; align-items: center; place-content: center; }
.links-top li { display: inline-block; font-size: .85rem }

@media (min-width: 1200px) {
  .links-top li { font-size: 1rem }
}
.links-top li:after { content: '/'; padding: 0 10px }
.links-top li:last-child:after { display: none }

.links-top a { position: relative; color: #000 }
.links-top a:after { display: block; position: absolute; left: 50%; width: 0; opacity: 0; height: 2px; background-color: var(--tm); content: ""; transition: all 0.2s; cursor: pointer }
.links-top li.active a { font-weight: 600; color: var(--tm) }
.links-top li:not(.active) a:hover:after, .links-top li.active a:after { width: 100%; left: 0; opacity: 1 }


.links { margin: 0 !important }
.link { padding: 10px 0}

.links-link { position: relative }
.links-link:after { display: block; position: absolute; left: 50%; width: 0; opacity: 0; height: 2px; background-color: #EF7F1A; content: ""; transition: all 0.2s; cursor: pointer }
.links-link:hover:after { width: 100%; left: 0; opacity: 1 }

.links-item { display: inline-block; font-size: .9rem }
.links-item.active a { font-weight: 600; color: #EF7F1A }
.links-item:after { content: '/'; padding: 0 10px }
.links-item.o { font-size: 1.25rem; font-weight: 600 }
.links-item.o a { margin-left: 1.5rem }
.links-item.o:after { content: ''; padding: 0 }
.links-item:last-child:after { display: none }

.information { background-color: #EF7F1A; color: #fff; padding: 10px 0 }
.information p { margin: 0 }
.information .fa-inverse { color: #EF7F1A }

.tlacitko {
    display: inline-block;
    vertical-align: middle;
    background: #fff;    
    padding: 8px 16px;
    font-size: 1.2rem;

    border-radius: 30px;
}
.tlacitko:hover {
    text-decoration: none;
}
.tlacitko small { white-space: nowrap}
.tlacitko--1 {
  background: var(--tm);
  color: #fff; font-weight: 600
}
.tlacitko--1:hover {
  color: #fff
}
.tlacitko--2 {
    border: 5px solid var(--tm);
    color: var(--tm) !important;
}



.pad-top { padding-top: 1rem }
.pad-btm { padding-bottom: 1rem }
.pad-lft { padding-left: 1rem }
.pad-rgt { padding-right: 1rem }

.text-right { text-align: right }
.text-left { text-align: left }
.text-center { text-align: center }

.img-rounded { border-radius: 50%; transition: all 0.2s }
a:hover .img-rounded { transform: scale(1.05) }




/* /var/www/originalnipf.cz/www/mojefotokniha/css/footer.css 1918 */
.footer {
    background: #7cd7ea;
    position: relative;
    padding-top: 60px;
}
.footer:before {
    background: url(//suvenyr.com/files/strip-3.svg) center center no-repeat;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 60px;
    content: "";
}

.footer-in p {
    margin-bottom: 12px;
}

@media screen and (max-width: 575px) {
    .footer-in {
        margin-left: auto;
        margin-right: auto;
        
        max-width: 300px;
    }
}
.footer__title {
    font-size: 1.125rem;
    color: #fff;
    font-weight: 600;
    padding-top: 21px;
    margin-bottom: 15px;
}
.footer__nav {
    list-style: none;
    margin: 0;
    padding: 0;
}
.footer__nav a {
    color: #000;
}
.footer__nav li {
    line-height: 1.875rem;
}

.footer__informace {
    padding: 30px 0 60px;
}
.copy {
    background: url(//suvenyr.com/files/vlna-4.svg) center top repeat-x;
    padding: 65px 0 25px;
}
.copy a {
    color: #000;
    text-decoration: none;    
}
.copy a:hover {
    text-decoration: underline;
}
.copy__design {
    text-align: center;
    font-size: .85rem;
}
.copy__gopay {
    text-align: center;
    margin-bottom: 15px;
}
.copy__gopay img {
    max-width: 75%;
}
.copy__tiskarna {
    
}
.copy__morcinko  {
    background: #ffd460;
    text-align: center;
    padding: 15px 0 50px;
}

.copy__morcinko .logo { max-width: 100px }

.panel__address {
    border: 1px solid #fff;
    padding: 15px;
    line-height: 1.875rem;
}
@media screen and (max-width: 991px) {
    .panel__address {
        margin-top: 25px;
    }
}
.panel__address p {
    margin: 0;
    padding: 0;
}

.panel__title {
    font-size: 1.125rem;
    color: #fff;
    font-weight: 600;
    padding-top: 0;
    margin-bottom: 15px;
}

.social {
    font-size: .85rem;
    text-align: center;
    padding: 20px 0;
}
.social__link {
    margin: 0 12px; color: #000;
}
.social__link:hover { color: #000; text-decoration: none }
.social__title {
    color: #000;
}
.social__link .fa {
    margin-right: 5px;
}
.social__promo {
    text-align: center;
}

#back-top{ bottom: 15vh; position:fixed; right:5vw; z-index:99; display: none; color: var(--tm); font-size: 36px }
#back-top a { text-decoration:none }

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

.mobile-icon {
  display: none; }

.mainnav {
  background: none;
  position: static;
  display: flex;
  /*margin-left: 15px;*/ }
.mainnav>li {
  position: relative; }
.mainnav>li:hover {}
.mainnav>li>a {
  display: inline-flex;
  align-items: center;
  height: 45px;
  border-radius: 22.5px; 
  padding: 0 25px;
  background: #fff; }
.mainnav>li:hover>a {
  color: #fff;
  background: #ef7f1a; }

.mainnav>li>a>.fa {
  margin-left: 5px; }

.mainnav li:hover>.subnav {
  max-height: 100vh; }

.subnav {
  top: 100%;
  right: 0;
  max-height: 0;
  overflow: hidden;
  transition-delay: .5s;
  transition: max-height .35s ease-out;
  width: 250px;
  background: #ef7f1a;
  color: #fff;
  border-radius: 22.5px; 
  margin-top: 5px;  
  position: absolute;  
  z-index: 10; }
.subnav li {
  margin: 10px 25px; }
.subnav li a:hover {
  text-decoration: underline; }

}

.reklama { width: 77px; height: 300px; position: absolute; top: 25px; right: 0; overflow: hidden; transition: width .75s ease .5s }
.reklama img { max-width: none !important; }
.reklama:hover {
  width: 313px;
}

@media screen and (max-width: 1024px) {
  .reklama { display: none }
}