/* Cascade Style Sheets - www.pbsolution.cz */

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

html {
  scroll-behavior: smooth;
}

@font-face {
  font-family: 'Toyota';
  src: url('../font/toyotadisplay_bd.ttf');
  src: url('../font/toyotadisplay_bd.woff') format("woff");
}

body { 
 font-family: 'Montserrat', sans-serif;
 font-size:16px;
 color:#3F3F3F; 
}

.container {
  width:1600px;
  max-width:100%;
}

.row.row-flex {
  display: flex;
  align-items: center;
  justify-content: center;
}

#header {
  background:url('../img/background.jpg') no-repeat center center;
  background-size:cover;
  padding:25px 0;
  color:#fff;
  margin-bottom:20px;
  position:relative;
}

#header:after {
  bottom: 0;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #ffffff;
	border-width: 30px;
	margin-left: -30px;  
}

#header ul {
  font-family:'Toyota';
  text-transform:uppercase;
}

#header ul li {
  list-style:none;
  display:inline-block;
  margin-left:20px;
}

#header ul li a {
  color:#fff;
}

img {
  max-width:100%;
}


.nopadding {
  padding:0 !important;
}

h1 {
  font-family:'Toyota';
  text-transform:uppercase;
  font-size:6vw;
  margin-top:0;
}

h1 span {
  margin-right:10px;  
}

h2 {
  font-family:'Toyota';  
  font-size:4vw;  
  color:#EB0A1E;
  margin:30px 0;
}

.red {
  color:#EB0A1E;
}

.top-image {
  margin-top:50px;
}


.owl-page span {
  width:30px !important;
  height:30px !important;
  opacity:1 !important;
  box-shadow:0 0 5px #ccc !important;
  border:1px solid #ddd;
}

.owl-page:first-child span {
  background:#EB0A1E !important;
}

.owl-page:nth-child(2) span {
  background:#000 !important;
}

.owl-page:nth-child(3) span {
  background:#f7f7f7 !important;
}

.owl-page.active span {
  box-shadow:0 0 10px #666 !important;
}

#parameters .ico {
  display:inline-block;
  border-radius:50%;
  background:#ddd;
  width:160px;
  height:160px;
  line-height:160px;
  margin-bottom:20px;  
}

#parameters .ico img {
  width:60%;
}

#parameters strong {
  font-size:30px;
}

#parameters .btn {
  margin:30px 0;
}

#video {
  width:2000px;
  margin:20px auto;
  max-width:100%;
  padding:40px;  
  background:#000;
}

#video .container {
  width:800px;
  max-width:100%;
}

#podvozek,
#motor,
#karoserie {
  margin:50px 0;
}

.text-box ul {
  margin-left:15px;
  padding-left:0;
}

.text-box {
  width:450px;
  max-width:100%;
}


#order {
  position:relative;
  color:#fff;
  padding:60px 0;    
}

#order:before {
  position:absolute;
  content:'';
  top:0;
  left:0;
  background:url('../img/background.jpg') no-repeat center center;
  background-size:cover;
  width:100%;
  height:100%;
  border:1px solid green;
  transform:rotate(180deg);
  z-index:-1;
}

#order h2 {
  color:#fff;  
}

.footer-headline {
  font-family:'Toyota';
  text-transform:uppercase;
  font-size:20px;
  line-height:1;
  color:#fff;    
}

p.slim {
  width:450px;
  max-width:100%;
  margin:0 auto;
}

#copyright {
  padding:25px;
}

#copyright img {
  width:80px;
}


.btn.btn-rounded {
  background:#EB0A1E;
  display:inline-block;
  padding:15px 30px;
  border-radius:30px;
  color:#fff;
  font-family:'Toyota';
  text-transform:uppercase;
  font-size:22px;
  line-height:1; 
   -webkit-transition: all 200ms ease-out;
  -moz-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}

.btn:hover {
   -webkit-transition: all 200ms ease-out;
  -moz-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
  background:#9B000C;
}

.btn.btn-text {
  margin-top:25px;
  font-size:16px;
}

.white-box {
  width: 100%;
  background:#fff;
  padding:40px 30px 30px 30px;    
  border-radius:2px;
  border:1px solid #fff;
  box-shadow:0 5px 10px rgba(0,0,0,.1);
  -webkit-transition: all 200ms ease-out;
  -moz-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}

.white-box:hover {
  border:1px solid #ddd;
   box-shadow:0 5px 10px rgba(0,0,0,.2);
  -webkit-transition: all 200ms ease-out;
  -moz-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}


.cognito form {
  background:transparent !important;
}

.cognit .c-button-section {
  text-align:center !important;
}

.cognito .c-action {    
  width:calc(50% + 80px);      
}

.cognito button#c-submit-button {  
  border-radius:30px;
}

.cognito .c-editor.c-columns-0 span {
  color:#fff !important;
}

@media (max-width:1100px) {
  #parameters strong {
    font-size:20px;
  }
  
  #parameters .ico {
    width:110px;
    height:110px;
    line-height:110px;
  }
}


@media (max-width:991px) {  
  .row.row-flex {
    flex:none;
    display:block;
  }
}

@media (max-width:768px) {  
  body {
    text-align:center;
  }
  
  #header h1 {
    font-size:15vw;
  }
  
  #header p {
    font-size:12px;
  }
  
  #header .logo {
    height:40px;
  }
  
  h2 {
    font-size:10vw;
  }
  
  .text-box {
    margin:20px auto;
  }
  
  #header h1 {
    margin-top:20px;
  }
  
  #parameters .col-md-2 {
    border-right:1px solid #ddd;
    border-bottom:1px solid #ddd;
    padding-bottom:15px;    
  }
  
  #parameters .col-md-2:nth-child(even) {
    border-right:0;
  }
  
  #parameters .col-md-2:nth-child(n+5) {
    border-bottom:0;
  }
  
  #parameters .ico {
    width:80px;
    height:80px;
    line-height:80px;
    margin-top:15px;
  }
  
  #parameters strong {
    font-size:24px;
  }
  
  #video {
    padding:20px 0;
  }
  
   .navbar-header {
        float: none;
    }
  
  .navbar-toggle {
      display: block;
  }
  
  .navbar-collapse.collapse {
      display: none!important;
  }
  
  .navbar-collapse.collapse.in { 
        display:block !important; 
  }
 
  nav.navbar {
        position:initial;
        border:0;
        box-shadow:none;
        margin:0;
        padding-top:5px;
        display:inline-block;        
        background:transparent;
    }
    
    nav.navbar > div > button {    
        margin:0;        
        z-index:9999; 
        background:transparent !important;
        border:0 !important;           
    }
    
    nav.navbar > div > button > span {
      background:#fff !important;
      color:#fff !important;
    }
    
    button.navbar-toggle.active  {
      position:fixed;
      right:15px;
      top:10px;
      background:transparent !important;
    }       
    
    button.navbar-toggle.active > span  {
      color:#fff !important;
      background:#fff !important;
    }
    
    
    .navbar-toggle .icon-bar:nth-of-type(2) {
    	  top: 1px;
    }
    
    .navbar-toggle .icon-bar:nth-of-type(3) {
      	top: 2px;
    }
    
    .navbar-toggle .icon-bar {
    	  position: relative;
    	  transition: all 500ms ease-in-out;
    }
    
    .navbar-toggle.active .icon-bar:nth-of-type(1) {
    	  top: 6px;
    	  transform: rotate(45deg);
    }
    
    .navbar-toggle.active .icon-bar:nth-of-type(2) {
    	  background-color: transparent !important;
    }
    
    .navbar-toggle.active .icon-bar:nth-of-type(3) {
    	  top: -6px;
    	  transform: rotate(-45deg);
    }        
    
    
    
    #mobile-menu {
        position:fixed;
        left:0;
        top:0px;
        z-index:8888;
        background:#73C158;
        width:100%;        
        text-align:left;
        padding:50px 20px;        
    }
    
    #mobile-menu ul {
        margin:0;
        padding:0;
    }
    
    #mobile-menu > ul > li {
        list-style:none;
        display:block;   
        padding:0;  
        margin:0;       
    }
    
    #mobile-menu > ul > li > a {
        white-space:nowrap;
        margin-left:0;
        display:block;
        font-size:110%;        
        font-weight:bold;
        border:0;
        padding:5px;
    }
    
    #mobile-menu > ul > li a {
      color:#fff;
    }
    
    #mobile-menu > ul > li > ul {
       padding-left:4px;
    }
    
    #mobile-menu > ul > li > ul > li {            
      font-size:100%;  
      list-style:none;            
    }
    
    #mobile-menu > ul > li > ul > li > a {
      border:0;      
      display:inline-block;
      padding:0 5px;
      font-weight:300 !important;
      border-left:1px solid #F3F5F9;
    }
  
  
}