@import url(../js/fancybox/jquery.fancybox.css);
@import url(http://fonts.googleapis.com/css?family=Dosis:400,500,300,700&subset=latin,latin-ext);
@import url(http://fonts.googleapis.com/css?family=Bree+Serif&subset=latin,latin-ext);
/*
Author: ondrejmuzik.cz
Project: psychoterapie-hlousek.cz
Created: 2013-10-24
*/
/*
  Document   : reset
  Created on : 17.6.2013, 14:46:13
  Author     : ondrejmuzik.cz
  License    : none (public domain)
  Based on http://meyerweb.com/eric/tools/css/reset/ (v2.0 | 20110126) and combination of others
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section {
  display: block; }

/* Typography */
body {
  font: 87.5%/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif; }

h1, h2, h3, h4, h5, h6 {
  font-weight: normal; }

h1 {
  font-size: 2.714em;
  line-height: 1;
  margin: 0.8em 0; }

h2 {
  font-size: 2em;
  margin-bottom: 0.25em; }

h3 {
  font-size: 1.5em;
  line-height: 1;
  margin: 0.666em 0; }

h4 {
  font-size: 1.2em;
  line-height: 1.25;
  margin: 0.8333em 0; }

h5 {
  font-size: 1em;
  font-weight: bold; }

h6 {
  font-size: 1em;
  font-style: italic; }

p {
  margin: 0 0 1em; }

a {
  color: #06c;
  text-decoration: none; }

a:focus {
  outline: thin dotted; }

a:hover {
  text-decoration: underline; }

strong {
  font-weight: bold; }

em {
  font-style: italic; }

small {
  font-size: 75%; }

big {
  font-size: 125%; }

sup, sub {
  line-height: 0;
  font-size: 75%; }

sub {
  vertical-align: sub; }

sup {
  vertical-align: super; }

abbr, acronym {
  border-bottom: 1px dotted #666; }

address {
  margin: 0 0 1em;
  font-style: normal; }

li ul, li ol {
  margin: 0; }

ul, ol {
  margin: 0 1.5em 1em 0;
  padding-left: 1.5em; }

ul {
  list-style-type: disc; }

li ul {
  list-style-type: circle; }

ol {
  list-style-type: decimal; }

li ol {
  list-style-type: lower-alpha; }

dl {
  margin: 0 0 1em 0; }

dl dt {
  font-weight: bold; }

dd {
  margin-left: 1.5em; }

/* Tables */
table {
  margin-bottom: 1em;
  /*width: 100%;*/
  max-width: 100%;
  border-collapse: collapse;
  border-spacing: 0; }

th {
  font-weight: bold; }

th, td, caption {
  padding: 4px 10px 4px 5px; }

table tr:nth-child(even) td,
table tr.row-even td {
  background: #e5ecf9; }

/********** Common ************************************************************/
a {
  text-decoration: none; }
  a:hover {
    text-decoration: underline; }

a:focus {
  outline: 0; }

/********** Layout ************************************************************/
body {
  font-family: "Dosis", sans-serif;
  font-size: 0.9375em;
  color: gray;
  background: white url("../img/background.png") no-repeat center top;
  -webkit-font-smoothing: antialiased; }

.page {
  position: relative;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  background: no-repeat center top; }

#header {
  *zoom: 1;
  margin-bottom: 30px; }
  #header:before, #header:after {
    content: " ";
    display: table; }
  #header:after {
    clear: both; }

#logo {
  float: left;
  margin: 0 0 0 -75px;
  font-size: 1.066666666666667em; }
  #logo a {
    display: block;
    width: 271px;
    height: 136px;
    padding: 35px 0 0 132px;
    color: white;
    background-repeat: no-repeat; }
    #logo a:hover {
      text-decoration: none; }
  #logo .name {
    font-family: "Bree Serif", serif;
    font-size: 1.9375em; }
  #logo .divider {
    display: none; }
  #logo .title {
    display: block;
    width: 130px;
    margin-top: 7px;
    line-height: 1.2; }

#navigation {
  float: left;
  width: 50.83333333333333%;
  margin-top: 47px; }
  #navigation ul {
    list-style: none;
    margin: 0;
    padding: 0; }
  #navigation li {
    float: left;
    height: 20px;
    margin: 0 2.04918032786885% 0 3.68852459016393%;
    padding-bottom: 15px; }
  #navigation a {
    display: inline-block;
    font-weight: 500;
    color: #999999;
    text-transform: uppercase;
    line-height: 1.3; }
    #navigation a:hover, #navigation a.active {
      /*font-weight: bold;*/
      text-decoration: none;
      border-bottom: 1px solid gray; }
  #navigation .link-homepage a:hover, #navigation .link-homepage a.active {
    color: #95cec6;
    border-color: #95cec6; }
  #navigation .link-work a:hover, #navigation .link-work a.active {
    color: #f98958;
    border-color: #f98958; }
  #navigation .link-about a:hover, #navigation .link-about a.active {
    color: #6fb8c9;
    border-color: #6fb8c9; }
  #navigation .link-prices a:hover, #navigation .link-prices a.active {
    color: #736357;
    border-color: #736357; }
  #navigation .link-links a:hover, #navigation .link-links a.active {
    color: #f7ba59;
    border-color: #f7ba59; }
  #navigation .link-contact a:hover, #navigation .link-contact a.active {
    color: #c66363;
    border-color: #c66363; }

.flash {
  display: none;
  position: absolute;
  top: 101px;
  left: 346px;
  padding: 10px 50px;
  background-color: #f7ba59;
  font-size: 1.2em;
  color: #000;
  border-radius: 8px; }

#content {
  margin: 0 16.66666666666667% 0 17.1875%;
  padding-bottom: 50px; }
  #content h2 {
    display: none; }
  #content h3 {
    margin: 1.5em 0;
    font-size: 1.533333333333333em;
    font-weight: 500;
    line-height: 1.304347826086957; }
    #content h3.title {
      margin-top: 0.666em; }
  #content p {
    font-family: Arial, Helvetica, sans-serif;
    text-align: justify; }

/********** Sections **********************************************************/
/* Homepage */
.section-homepage {
  color: #999999; }
  .section-homepage .page {
    background: url("../img/homepage-bg.png") no-repeat center 107px;
    /*background-size: contain;*/ }
  .section-homepage #logo a {
    background-image: url("../img/homepage-logo.png"); }
  .section-homepage #content h2 {
    display: block;
    margin-top: 468px;
    font-size: 1.733333333333333em;
    text-transform: uppercase; }
  .section-homepage #content #image-cloud, .section-homepage #content #image-tree, .section-homepage #content #image-dog {
    position: absolute;
    display: block; }
  .section-homepage #content #image-cloud {
    top: 107px;
    left: 322px;
    width: 127px;
    height: 130px;
    background: url("../img/homepage-img-cloud.png") no-repeat -500px 0; }
    .section-homepage #content #image-cloud:hover {
      background-position: 0 0; }
  .section-homepage #content #image-tree {
    top: 193px;
    left: 32px;
    width: 202px;
    height: 265px;
    background: url("../img/homepage-img-tree.png") no-repeat -500px 0; }
    .section-homepage #content #image-tree:hover {
      background-position: 0 0; }
  .section-homepage #content #image-dog {
    top: 441px;
    left: 671px;
    width: 167px;
    height: 110px;
    background: url("../img/homepage-img-dog.png") no-repeat -500px 0; }
    .section-homepage #content #image-dog:hover {
      background-position: 0 0; }
  .section-homepage #content p {
    font-family: "Dosis", sans-serif;
    font-size: 1.4em;
    text-align: left;
    line-height: 1.2; }
    .section-homepage #content p span {
      white-space: nowrap; }

/* Work */
.section-work #logo a {
  background-image: url("../img/work-logo.png"); }
.section-work #content h3 {
  color: #f98958; }
  .section-work #content h3.title {
    width: 50%;
    margin-bottom: 100px; }
.section-work #content .image {
  float: right;
  display: block;
  width: 306px;
  height: 168px;
  margin-top: -15px;
  background: url("../img/work-img-book.png") no-repeat 0 0; }
  .section-work #content .image:hover {
    background-position: 0 bottom; }
.section-work #content p strong {
  font-style: italic; }
.section-work #content p a {
  color: #f98958; }

/* About */
.section-about #logo a {
  background-image: url("../img/about-logo.png"); }
.section-about #content h3 {
  color: #6fb8c9; }
  .section-about #content h3.title {
    width: 62.99212598425197%;
    margin-bottom: 70px; }
.section-about #content .image {
  float: right;
  display: block;
  width: 254px;
  height: 237px;
  margin-top: -64px;
  margin-right: -34px;
  background: url("../img/about-img-bike.png") no-repeat 0 0; }
  .section-about #content .image:hover {
    background-position: 0 bottom; }
.section-about #content p a {
  color: #6fb8c9; }
.section-about #content .photo {
  float: right;
  margin-left: 20px;
  width: 40%  }

/* Prices */
.section-prices #logo a {
  background-image: url("../img/prices-logo.png"); }
.section-prices #content h3 {
  color: #736357; }
  .section-prices #content h3.title {
    width: 70.86614173228346%;
    margin-bottom: 45px; }
.section-prices #content .image {
  float: right;
  display: block;
  width: 164px;
  height: 300px;
  margin-top: -35px;
  margin-right: -25px;
  background: url("../img/prices-img-clock.png") no-repeat 0 0; }
  .section-prices #content .image:hover {
    background-position: 0 bottom; }
.section-prices #content ul, .section-prices #content p {
  width: 70.86614173228346%; }
.section-prices #content ul {
  padding: 0;
  font-family: Arial, Helvetica, sans-serif;
  list-style: none; }
  .section-prices #content ul strong {
    font-weight: normal;
    text-transform: uppercase; }

/* Links */
.section-links #logo a {
  background-image: url("../img/links-logo.png"); }
.section-links #content h3 {
  color: #f7ba59; }
  .section-links #content h3:nth-of-type(2) {
    margin-top: 75px; }
.section-links #content .image {
  float: right;
  display: block;
  width: 128px;
  height: 158px;
  background: url("../img/links-img-face.png") no-repeat 0 0; }
  .section-links #content .image:hover {
    background-position: 0 bottom; }
.section-links #content p {
  /*font-size: 0.8666666666666667em;*/ }
  .section-links #content p strong {
    font-weight: normal; }
  .section-links #content p a {
    color: #f7ba59; }

/* Contact */
.section-contact #logo a {
  background-image: url("../img/contact-logo.png"); }
.section-contact #content h3 {
  margin: 60px 0 10px;
  font-size: 0.9333333333333333em; }
  .section-contact #content h3.title {
    margin-top: 0.666em;
    font-size: 1.533333333333333em;
    color: #c66363;
    text-transform: none; }
.section-contact #content .image {
  float: right;
  display: block;
  width: 300px;
  height: 242px;
  margin-top: -75px;
  background: url("../img/contact-img-phone.png") no-repeat 0 0; }
  .section-contact #content .image:hover {
    background-position: 0 bottom; }
.section-contact #content p {
  font-family: "Dosis", sans-serif;
  font-size: 1.133333333333333em;
  font-weight: light;
  color: #c66363;
  text-align: left; }
  .section-contact #content p strong {
    font-weight: normal; }
  .section-contact #content p a {
    color: #c66363; }
.section-contact #content .photos {
  *zoom: 1; }
  .section-contact #content .photos:before, .section-contact #content .photos:after {
    content: " ";
    display: table; }
  .section-contact #content .photos:after {
    clear: both; }
  .section-contact #content .photos a {
    float: left;
    display: block;
    width: 29.92125984251969%;
    margin: 0 5.03937007874016% 16px 0; }
    .section-contact #content .photos a:nth-child(3n) {
      margin-right: 0; }
    .section-contact #content .photos a img {
      display: block;
      width: 100%; }
.section-contact #content form {
  *zoom: 1; }
  .section-contact #content form:before, .section-contact #content form:after {
    content: " ";
    display: table; }
  .section-contact #content form:after {
    clear: both; }
  .section-contact #content form .personal {
    position: relative;
    float: left;
    width: 34.64566929133858%;
    margin-right: 2.83464566929134%; }
    .section-contact #content form .personal .required-info {
      position: absolute;
      bottom: -15px;
      font-size: 0.6666666666666667em;
      color: #ccc;
      line-height: 1; }
    .section-contact #content form .personal input {
      display: inline-block;
      width: 94.54545454545455%;
      margin-bottom: 8px;
      padding: 5px 2.72727272727273%; }
  .section-contact #content form .message {
    float: left;
    width: 45.66929133858268%;
    margin-right: 2.51968503937008%; }
    .section-contact #content form .message textarea {
      width: 95.17241379310345%;
      height: 110px;
      padding: 5px 2.41379310344828%; }
  .section-contact #content form .buttons {
    float: left;
    width: 14.17322834645669%; }
    .section-contact #content form .buttons .button {
      width: 100%;
      padding: 4px 0;
      color: white;
      background-color: #c66363;
      cursor: pointer; }
      .section-contact #content form .buttons .button:active {
        position: relative;
        top: 2px; }
  .section-contact #content form label {
    display: none; }
  .section-contact #content form input, .section-contact #content form textarea {
    border: none;
    border-radius: 3px;
    background-color: #f7f7f7;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.8em;
    color: #c66363;
    outline: 0; }

/* Sitemap */
.section-sitemap #logo a {
  background-image: url("../img/homepage-logo.png"); }
.section-sitemap #content h2 {
  display: block; }
.section-sitemap #content .home {
  color: #95cec6; }
.section-sitemap #content .work {
  color: #f98958; }
.section-sitemap #content .about {
  color: #6fb8c9; }
.section-sitemap #content .prices {
  color: #736357; }
.section-sitemap #content .links {
  color: #f7ba59; }
.section-sitemap #content .contact {
  color: #c66363; }

@media screen and (max-width: 960px) {
  #navigation li {
    margin: 0 1.5%; }

  .section-homepage #content #image-cloud, .section-homepage #content #image-tree, .section-homepage #content #image-dog {
    display: none; } }
@media screen and (max-width: 700px) {
  #header {
    max-width: 100%;
    overflow: hidden; }

  #logo {
    float: none;
    margin: 0 auto;
    width: 271px;
    max-width: 100%; }
    #logo a {
      margin-left: -27.67527675276753%; }

  #navigation {
    float: none;
    margin: 20px auto 0;
    width: 90%; }
    #navigation ul {
      text-align: center; }
    #navigation li {
      float: none;
      display: inline-block;
      margin: 0 5%;
      font-size: 1.2em; }

  #content {
    width: 90%;
    margin: 0 auto; }

  /* Homepage */
  .section-homepage .page {
    background-position: center 290px;
    background-size: auto 250px; }
  .section-homepage #content h2 {
    margin-top: 370px; }
  .section-homepage #content #image-cloud, .section-homepage #content #image-tree, .section-homepage #content #image-dog {
    display: none; }
  .section-homepage #content p span {
    display: block;
    white-space: normal; }

  /* Work, About, Prices, Links */
  .section-work #content .image, .section-about #content .image, .section-prices #content .image, .section-links #content .image {
    /*        float: none;
            margin: 0 auto;
            background-size: 100% auto;
            max-width: 100%;*/
    display: none; }
  .section-work #content h3.title, .section-about #content h3.title, .section-prices #content h3.title, .section-links #content h3.title {
    float: none;
    width: auto;
    margin-top: 25px;
    margin-bottom: 15px; }
  .section-work #content p, .section-about #content p, .section-prices #content p, .section-links #content p {
    text-align: left; }
  .section-work #content ul, .section-about #content ul, .section-prices #content ul, .section-links #content ul {
    width: auto;
    margin: 0; }

  .section-contact #content .image {
    margin-top: -35px; }
  .section-contact #content iframe {
    width: 100%; } }
@media screen and (max-width: 700px) and (max-width: 600px) {
  .section-contact #content .image {
    display: none; }
  .section-contact #content form .personal, .section-contact #content form .message, .section-contact #content form .buttons {
    float: none;
    width: auto;
    margin-right: 0; }
  .section-contact #content form .personal .required-info {
    position: relative;
    bottom: auto;
    display: block;
    padding: 0 0 5px 1.5%; }
  .section-contact #content form .personal input {
    display: block;
    padding-top: 8px;
    padding-bottom: 8px; }
  .section-contact #content form .message textarea {
    display: block; }
  .section-contact #content form .buttons {
    padding-top: 5px;
    text-align: right; }
    .section-contact #content form .buttons .button {
      display: block;
      width: 100%;
      padding: 10px 0; } }
@media screen and (max-width: 700px) and (max-width: 300px) {
  .section-contact #content .photos a {
    width: auto; } }

@media screen and (max-width: 300px) {
  #logo a {
    width: auto;
    padding-top: 8px;
    padding-bottom: 27px; }

  .section-about #content .photo {
    float: none;
    margin-left: 0; } }
a[href^="error:"] {
  background: red;
  color: white; }

form .error {
  color: #D00;
  font-weight: bold; }
