/* ************************* header ************************* */

#header {position: sticky; top: 0; background-color: #fff!important; z-index: 999; padding: 30px 0 10px 0;} 
#header #header-inner #logo {height: 50px!important;}

#header #header-inner #header-search {width: 100%; min-width: 100%;}

/* header menu-login flag */
#menu-flag .flag {display: block; width: 45px; height: 30px; background-repeat: no-repeat; background-size: contain;}
#menu-flag .flag.czech {background-image: url('images/flag-cz.gif');}
#menu-flag .flag.slovakia {background-image: url('images/flag-sk.gif');}

@media screen and (max-width: 749px) {
  #header #header-inner #header-search-left {float: left; width: calc(100% - 56px)!important;}
  #header #header-inner #menu-flag {float: right; width: 46px;}  
  #header #header-inner #header-search #menu-header-search {clear: both;}
}

@media screen and (min-width: 750px) {
  #header {padding-top: 60px;}
  #header #header-inner #header-search {display: flex; flex-direction: row; align-items: center; flex-wrap: wrap;}
  #header #header-inner #header-search #header-search-left {order: 1;}
  
  #header #header-inner #header-search #menu-header-search {margin: auto; order: 2;}
  #header #header-inner #header-search #menu-header-search ul.underline li {margin: 0;}

  #header #header-inner #menu-flag {margin-left: auto; order: 3;}
}



/* main */
#main {overflow: hidden; margin: 0; padding: 2em 0 0 0;} 
#main strong a {color: #001ba0;}


/* block */
.block-portaly-info {margin-bottom: 50px;}
.block-portaly-info h2.title {font-size: 160%; margin: 0 0 1em 0; padding: 0 0 0.5em 0; border-bottom: 1px solid #ccc;}

.text-center {text-align: center;}


/* ************************* PIN ************************* */

#pin .pin-wrapper {text-align: center; margin-bottom: 40px;}
#pin .pin-wrapper .text-center {font-size: 90%; margin-top: 0.5em;}
#pin .pin-wrapper .text-center a {color: #000!important;}

#pin .pin-wrapper form label {display: block; margin-bottom: 0.5em;}

#pin .pin-wrapper form .input-button-wrapper {display: flex; justify-content: center; align-items: center; flex-wrap: nowrap; margin-bottom: 0.5em}
#pin .pin-wrapper form .input-button-wrapper input.pin {width: 138px; text-align: left; height: 38px; line-height: 38px; font-size: 14px; margin: 0!important; padding: 0 8px; border-width: 1px 0 1px 1px; border-style: solid; border-color: #999; background: #fafafa; box-sizing: border-box; box-shadow: none; border-radius: 4px 0 0 4px!important;}
#pin .pin-wrapper form .input-button-wrapper .button {width: 110px; min-width: 110px; height: 38px; border-radius: 0 4px 4px 0!important; margin: 0!important;}

#pin .pin-wrapper form label strong.title {font-size: 180%;}


@media screen and (min-width: 750px) {
  #pin .pin-wrapper form {display: flex; flex-direction: row; align-items: center; justify-content: center; flex-wrap: wrap; padding-bottom: 1em;}

  #pin .pin-wrapper form label {margin-bottom: 0; margin-right: 0.5em;}
  #pin .pin-wrapper form input.pin {max-width: 10em; flex-grow: 1; margin-right: 0.5em; margin-bottom: 0;}
  
  #pin .pin-wrapper .text-center {margin-top: 0;} 
}




/* column */
@media screen and (min-width: 480px) {
  /* column flex */
  .column .colu {padding-right: 2em!important;}
}

@media screen and (max-width: 479px) {
  #sluzby .profile-block.sluzby {margin: 0!important; padding: 0!important;}	
  #sluzby .column .colu {margin: 0 0 60px 0!important; padding: 0!important;}
}





/* ************************* reference ************************* */

#reference .no-margin {margin-bottom: 0!important;}

#portfolio-carousel {padding: 0; margin: 0; overflow: hidden;}

@media screen and (max-width: 979px) {
  #portfolio-carousel {margin-top: 20px;}	
}

#portfolio-carousel .portfolio {display: block; text-align: center; width: 100%; overflow: hidden;}
#portfolio-carousel .portfolio p {font-style: normal;}
#portfolio-carousel .portfolio h3 {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}


/* novinky owl-carousel */
#portfolio-carousel .owl-carousel {position: relative; padding-top: 2.5em!important;}
#portfolio-carousel .owl-carousel .owl-nav {position: absolute; top: 0; right: 0;}


@media screen and (min-width: 750px) {
  #portfolio-carousel .portfolio {padding-right: 1em;}
}

#portfolio-carousel blockquote {position: relative; text-align: left; font-size: 90%; font-style: italic; margin: 0.25em 0; padding: 0.25em 20px 0.25em 40px; line-height: 1.45;}
#portfolio-carousel blockquote::before {display: block; position: absolute; left: 0; top: -20px; content: "\201d"; color: #0076e4; font-size: 80px; font-family: Georgia, "Times New Roman", Times, serif;}


#weby .underline {text-decoration: underline;}




/* ************************* kontakt ************************* */

.contact-info-text .gallery {display: flex; justify-content: center; align-items: center;; margin: 0 0 0 2em}

@media screen and (min-width: 750px) {
  .contact-info-text {display: flex; align-items: center;}
  .contact-info-text .text {flex-grow: 1;}
  .contact-info-text .gallery {margin: 0 0 0 2em}
}