/*---------------------------------------------------------------

  Project Name: Branten - Personal Portfolio HTML Template
  File Name: style.css
  Author: Peng Lam
  Author URI: http://khaitawng.com
  Version: 1.0.0

------------------------------------------------------------------*/
/*----------------------------------------------------------------

// Table of contents //

        Body
    0.  Typography
    1.  Buttons
    2.  General
    3.  Preloader
    4.  Navigation section
    5.  Home section
    6.  About section
    7.  Service section
    8.  Divider section
    9.  Work section
    10. Contact section
    11. Footer section
    12. Social icon
    13. Mobile Responsive styles

------------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,700');
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700');

body {
    background: rgb(239, 239, 239);
    font-family: 'Source Sans Pro', sans-serif;
    font-style: normal;
    font-weight: 400;
    overflow-x: hidden;
}


/*---------------------------------------
    0 Typorgraphy              
-----------------------------------------*/

h1,h2,h3,h4,h5,h6 {
  font-family: 'Source Sans Pro', sans-serif;
  font-style: normal;
  font-weight: bold;
  letter-spacing: 0px;
}


h1,h2 {
  font-size: 42px;
  line-height: 52px;
  margin-top: 0px;
}

h3 {
  border-right: 4px solid #f0f0f0;
  border-left: 4px solid #f0f0f0;
  display: inline-block;
  font-size: 16px;
  font-weight: 400;
  line-height: 32px;
  letter-spacing: 6px;
  text-transform: uppercase;
  padding: 0px 22px 0px 32px;
}

h4 {
  font-size: 18px;
  font-weight: 300;
  line-height: 32px;
}

h5 {
  letter-spacing: 0.5px;
}

p {
    color: #777;
    font-size: 14px;
    font-weight: 300;
    line-height: 28px;
    letter-spacing: 0.2px;
}

.font-playfair {
  font-family: 'Playfair Display', sans-serif;
  font-weight: 300;
}

/* Zajištění tučného písma pro b a strong tagy */
h4 b, h4 strong, 
.font-playfair b, .font-playfair strong,
h4.font-playfair b, h4.font-playfair strong {
  font-weight: 700 !important;
}


/*---------------------------------------
    1 Buttons               
-----------------------------------------*/

.btn-success:focus {
  background-color: #000;
  border-color: transparent;
}

.section-btn {
  background-color: #000;
  border: 3px solid transparent;
  border-radius: 100px;
  color: #ffffff;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 1.6px;
  padding: 12px 36px;
  margin-top: 22px;
  -webkit-transition: all ease-in-out 0.4s;
  transition: all ease-in-out 0.4s;
  text-transform: uppercase;
}

.section-btn:focus,
.section-btn:hover {
  background: transparent;
  border-color: #000;
  color: #000;
}



/*---------------------------------------
    2 General               
-----------------------------------------*/

html{
  -webkit-font-smoothing: antialiased;
}

a {
  color: #4d638c;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  text-decoration: none !important;
}

a:hover, a:active, a:focus {
  color: #4d638c;
  outline: none;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

*:before,
*:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.parallax-section {
  background-attachment: fixed !important;
  background-size: cover !important;
}

.section-title {
  position: relative;
  padding-bottom: 20px;
}

#about,
#onas,
#plemeno,
#strava,
#stimulace,
#service,
#queen,
#divider,
#work,
#rezervace,
#vyber,
#contact {
  background: #ffffff;
  box-shadow:0 40px 100px rgba(0,0,0,.2);
  padding-top: 100px;
  padding-bottom: 100px;
  position: relative;
}

#service,
#contact,
#queen,
#work,
footer {
  text-align: center;
}


.center_dotaznik{
text-align: center;
}

/*---------------------------------------
    3 Preloader section              
-----------------------------------------*/

.preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99999;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  background: none repeat scroll 0 0 #ffffff;
}

.sk-spinner-wordpress.sk-spinner {
  background-color: #000000;
  width: 38px;
  height: 1px;
  position: relative;
  -webkit-animation: sk-innerCircle 1s linear infinite;
  animation: sk-innerCircle 1s linear infinite; 
}

.sk-spinner-wordpress .sk-inner-circle {
  display: block;
  background-color: #ffffff;
  width: 16px;
  height: 16px;
  position: absolute;
  border-radius: 8px;
  top: 5px;
  left: 5px; 
}

@keyframes sk-innerCircle {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0); }

  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }



/*---------------------------------------
    4 Navigation section              
-----------------------------------------*/

.custom-navbar {
    border: none;
    margin-bottom: 0;
    background-color: #ffffff !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.custom-navbar .navbar-brand {
    color: #000;
    font-weight: bold;
    font-size: 3rem;
    line-height: 35px;
}

.custom-navbar .nav-link {
    font-size: 18px;
    font-weight: bolder;
    color: #777;
    padding-right: 28px !important;
    padding-left: 28px !important;
    -webkit-transition: all ease-in-out 0.4s;
    transition: all ease-in-out 0.4s;
}

.custom-navbar .nav-link:hover {
    background: transparent;
    color: #000;
}

.custom-navbar .navbar-nav .nav-link:hover,
.custom-navbar .navbar-nav .nav-link:focus {
  background-color: transparent;
}

.custom-navbar .navbar-nav .nav-item.active .nav-link {
    background-color: transparent;
    color: #000;
}

.custom-navbar .navbar-toggler {
    border: none;
    padding-top: 10px;
}

.custom-navbar .navbar-toggler {
    background-color: transparent;
}

.custom-navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0, 0, 0, 0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

@media(min-width:768px) {
    .custom-navbar {
        background: #ffffff !important;
    }
.custom-navbar.top-nav-collapse {
        background: #ffffff !important;
        box-shadow:0 40px 100px rgba(0,0,0,.2);
        padding: 0px 0;
    }

}



/*---------------------------------------
    5 Home section              
-----------------------------------------*/

#home {
    background: #ffffff;
    display: -webkit-box;
    display: -webkit-flex;
     display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
     align-items: center;
    height: 80vh;
    position: relative;
    text-align: center;
    padding-top:10vh;
}
@media (max-width: 768px) {
  #home {
  height: 100%;
  padding-top: 10vh;
  }
}
@media (max-width: 768px) {
  #cover {
  position: absolute;
  width: 100%;
  height: 90vh;
  left: 0;
  background-image: url("../images/profil.jpg"); 
  background-repeat:no-repeat;
  background-size:100%;
  background-position:center; 
    }
  }

@media (min-width: 768px) {
    #cover {
          position: absolute;
  width: 100%;
  height: 90vh;
  left: 0;
        background-image: url("../images/timeline.jpg"); 
        background-repeat:no-repeat;
        background-size:100%;
        background-position:center;  
    }
  }



/*---------------------------------------
    6 About section              
-----------------------------------------*/

#about .about-text {
  padding-top: 42px;
}

#about .about-text h4 {
  padding-top: 12px;
}

#about .about-text a {
  color: #000;
  font-weight: bold;
}

#about .about-image img {
  border-right: 6px solid #202020;
  border-radius: 5px;
  padding-right: 12px;
}



/*---------------------------------------
    7 Service section              
-----------------------------------------*/

#service p {
  font-size: 18px;
  line-height: 30px;
}

#service .service-thumb {
  padding: 42px 22px;
}

#service .service-thumb .fa {
  font-size: 82px;
  margin-bottom: 12px;
}

.onas_img{
margin-top: 65px;
}

/* Strava section styles */
#strava ul {
  padding-left: 20px;
}

#strava ul li {
  margin-bottom: 10px;
}

#strava .table {
  font-size: 16px;
}

#strava .table th {
  font-weight: bold;
  padding: 15px;
}

#strava .table td {
  padding: 12px 15px;
  vertical-align: middle;
}

#strava .table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(0,0,0,.02);
}

#strava .table-hover tbody tr:hover {
  background-color: rgba(77, 99, 140, 0.1);
}



/*---------------------------------------
    9 Work section              
-----------------------------------------*/

#work .work-thumb {
  border-radius: 5px;
  margin-bottom: 26px;
  padding: 0;
  overflow: hidden;
  position: relative;
  top: 0;
  -webkit-transition: all ease-in-out 0.4s;
  transition: all ease-in-out 0.4s;
}

#work .work-thumb:hover {
  background: #ffffff;
  box-shadow: 0px 16px 22px 0px rgba(90, 91, 95, 0.3);
  top: -5px;
}

#work .work-thumb img {
  border-radius: 5px;
}



/*---------------------------------------
    10 Contact section              
-----------------------------------------*/

#contact-form .text-success,
#contact-form .text-danger {
  display: none;
}

#contact .form-control {
  border: 2px solid #f0f0f0;
  border-radius: 5px;
  box-shadow: none;
  font-size: 18px;
  margin-top: 10px;
  margin-bottom: 10px;
  -webkit-transition: all ease-in-out 0.4s;
  transition: all ease-in-out 0.4s;
}

#contact .form-control:focus {
  border-color: #999;
}

#contact input {
  height: 55px;
}

#contact button#cf-submit {
  border: 3px solid #333;
  border-radius: 40px;
  color: #333;
  font-family: 'Playfair Display', sans-serif;
  height: 55px;
}

#contact button#cf-submit:hover {
  background: #333;
  color: #ffffff;
}


/*---------------------------------------
    11 Footer section              
-----------------------------------------*/

footer-bottom {
    background: #151515;
    color: #ffffff;
    padding-top: 140px;
    padding-bottom: 140px;
}

footer .footer-copyright p {
  font-size: 14px;
  letter-spacing: 0.5px;
}



/*---------------------------------------
    12 Social Icon             
-----------------------------------------*/

.social-icon {
    position: relative;
    padding: 0;
    margin: 0;
}

.social-icon li {
    display: inline-block;
    list-style: none;
}

.social-icon li a {
    color: #999;
    cursor: pointer;
    font-size: 16px;
    text-decoration: none;
    -webkit-transition: all ease-in-out 0.4s;
    transition: all ease-in-out 0.4s;
    text-align: center;
    vertical-align: middle;
    position: relative;
    margin: 22px 14px 22px 14px;
}

.social-icon li a:hover {
    color: #ffffff;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}



/*---------------------------------------
    13 Mobile Responsive styles              
-----------------------------------------*/

@media (max-width: 980px) {

 h1 {font-size: 92px;}

}



@media (max-width: 768px) {

  h1 {font-size: 78px;}

  .custom-navbar {background-color: #ffffff;box-shadow:0 40px 100px rgba(0,0,0,.2);}

  .custom-navbar .navbar-brand {line-height: 15px;}

  .custom-navbar .nav li a {line-height: 25px;}

}



@media (max-width: 767px) {

  #about .about-image {padding-top: 32px;}

}



@media (max-width: 650px) {

  h1 {font-size:42px}

  h2 {font-size: 32px;line-height: 42px;}

  h3 {font-size: 12px;letter-spacing: 8px;padding: 0px 10px 0px 18px;}

}