@font-face {
  font-family: Myriad;
  src:url(../font/myriad_pro/MyriadPro-Regular.otf);
}
html,body{
	background:#f1f1f1;
	overflow-x:hidden;
	font-family: Myriad;
}
.rectangle,.polygon-f2,.polygon-f1,
#bus-advice,#sertificates-bg,
#form-bg,#two-form-bg,.contant{
	max-width: 100%;
	height:auto;
	-webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	background-attachment: relative;
	background-position: center center;	
	padding-bottom:2%;
}
#main{
	background-image:url('../images/tires.png');
	background-position: center;
	background-size: cover;
	max-width: 100%;
	height: 1490px;
}
img#otstup{
	padding-top:5px;
	margin-left: 5%;
}
@media all and (max-width:1740px),
all and (max-device-width:1740px){
	#main{height:1150px;}
}
@media all and (max-width:1366px),
all and (max-device-width:1366px){
	#main{height:1050px;}
}
@media all and (max-width:1270px),
all and (max-device-width:1270px){
	#main{height:950px;}
	.parallelogram-main{
		margin-left:10%;
	}
}
@media all and (max-width:870px),
all and (max-device-width : 870px){
	#main{height:700px;}
}
@media all and (max-width:820px),
all and (max-device-width : 820px){
	#main{height:600px;}
}
@media all and (max-width:740px),
all and (max-device-width : 740px){
	#main{height:550px;}
}
@media all and (max-width:660px),
all and (max-device-width : 660px){
	#main{height:450px;}
}
@media all and (max-width:550px),
all and (max-device-width : 550px){
	#main{height:400px;}
}
@media all and (max-width:547px),
all and (max-device-width : 547px){
	#main{height:400px;}
	img#otstup{
		margin-top:-46%;
	}
	div.parallelogram-main{
		margin-top: 28%;
	}
	.width-p{
		margin-top:-20%;
		font-weight:bold;
	}
}
@media all and (max-width:470px),
all and (max-device-width : 470px){
	#main{height:350px;}
}
@media all and (max-width:430px),
all and (max-device-width : 430px){
	#main{height:350px;}
	img#otstup{
		margin-top:-4%;
	}
	div.parallelogram-main{
		margin-top: 0%;
	}
	.width-p{
		margin-top:4%;
		font-weight:bold;
	}
}
@media all and (max-width:400px),
all and (max-device-width : 400px){
	#main{
		height: 1000px;
    	width: 1127px;
	}
	#trigger,#technology,.no-padding,#range,
	#form-bg,#form-bg,.grey,#two-form-bg,
	#two-form-bg,#two-form-bg {
    	width: 1170px;
	}
}
#trigger{
	padding-bottom:5%;
}
.top-posit{
	margin-top:3%;
}
.f-r{
	position:absolute;
	top:0%;
	right:0px;
}
.width-p{
	width: 195px;
    font-size: 9px;
	color:#000;
	margin-left:15%;
}
.color-white{
	color:#fff;
}
.posit-left{
	float:left;
}
.posit-right{
	float:right;
}
@media all and (max-width:767px),
all and (max-device-width : 767px){
	.polygon-f2{
		margin-top:25%;
	}
}
@media all and (max-width:506px),
all and (max-device-width : 506px){
	.polygon-f2{
		margin-top:35%;
	}
}
@media all and (max-width:370px),
all and (max-device-width : 370px){
	.polygon-f2{
		margin-top:45%;
	}
}
a.call-back{
	display: inline-block;
	font-size:13px;
	background:#0e7cb2;
	color:#ffffff;
	border:2px solid #ffffff;
	padding:18px 38px 18px 38px;	
}
@media all and (max-width:1199px),
all and (max-device-width : 1199px){
	a.call-back{
		font-size:10px;
		padding:18px;
	}
}
@media all and (max-width:830px),
all and (max-device-width : 830px){
	.parallelogram-main-2{
		max-width: 450px;
		height: 100px;
	}
	p.parallelogram-txt-main-2 {
		font-size: 15px;
	}
	img#otstup {
		margin-left: 0%;
	}
}
@media all and (max-width:547px),
all and (max-device-width : 547px){
	.posit-top{
		margin-top: 40%;		
	}
	.parallelogram-main{
		margin-top: 15%;
		max-width: 280px;
		height: 50px;
	}
	p.parallelogram-txt-main{
		font-size: 10px;
		color:#fff;
	}
	.parallelogram-main-2{
		max-width: 250px;
		height: 100px;
	}
	p.parallelogram-txt-main-2 {
		font-size: 10px;
	}
	img#otstup {
		margin-left: -40%;
	}
}

@media all and (max-width:545px),
all and (max-device-width : 545px){
	.parallelogram-logo{
		display:none;
	}
}
.sendsubmit {
	width:  500px;  
	height: 50px; 
	margin: 0;
	padding:0;
	border: 0;
	background: transparent url("../images/btn-img.png") no-repeat center top;
	text-indent: -1000em;
	cursor: pointer; 
	cursor: hand; 
}
.contant{
	background-image: url('../images/form-tire.png');
}
p.logo{
	font-size:9px;
}
#two-form-bg{
	padding-top:2%;
	background-image: url('../images/two-form-bg.png');
	color:#fff;
}
#form-bg{
	background-image: url('../images/forma-bg.png');
	color:#fff;
}
#bus-advice{
	background-image: url('../images/bus-advice.png');
	color:#fff;
}
#technology{
	padding-top: 3%;
	padding-bottom:3%;
}
p.under-logo{
	margin-top:10px;
	color:#fff;
}
.parallelogram-technology,.parallelogram-bus-advice,
.parallelogram-footer,.parallelogram-form-bg,.parallelogram-range,
.parallelogram-order,.parallelogram-main,.parallelogram-main-2,
.parallelogram-logo,.parallelogram-main-3{
	height: 50px;
	-webkit-transform: skew(20deg);
	   -moz-transform: skew(20deg);
	     -o-transform: skew(20deg);
}
.parallelogram-logo{
	height: 40px;
	width:300px;
	background: #fff;
}
.parallelogram-main-3{
	margin-top:2%;
	margin-left:20%;
	width:450px;
	height:50px;
	background: #0e7cb2;
	border:1px solid #0e7cb2;
}
.parallelogram-main-2{
	margin-top:2%;
	margin-left:10%;
	width:650px;
	height:50px;
	background: #0e7cb2;
	border:1px solid #0e7cb2;
}
.parallelogram-main{
	margin-top:10%;
	margin-left:3%;
	width:500px;
	height:50px;
	background: #0e7cb2;
	border:1px solid #0e7cb2;	
}
.parallelogram-order{
	width:300px;
	background: #0e7cb2;
	border:1px solid #0e7cb2;
}
.parallelogram-form-bg{
	max-width: 245px;
	background: #d8d8d8;
}
.parallelogram-technology {
	max-width: 400px;
	background: #0e7cb2;
}
.parallelogram-bus-advice{
	max-width: 285px;
	background: #d8d8d8;
}
.parallelogram-range{
	max-width: 480px;
	border:2px solid #257cb2;
	background: white;
}
.parallelogram-footer{
	max-width: 295px;
	background: #0e7cb2;
}
.parallelogram-txt,.parallelogram-txt-bus-advice,
.parallelogram-txt-footer,.parallelogram-txt-form-bg,
.parallelogram-txt-range,.parallelogram-txt-order,
.parallelogram-txt-main,.parallelogram-txt-main-2,
.parallelogram-logo-txt,.parallelogram-txt-otstup,
.parallelogram-txt-main-3{
	-webkit-transform: skew(-20deg);
	   -moz-transform: skew(-20deg);
	     -o-transform: skew(-20deg);
}
.parallelogram-txt-form-bg{
	padding-top:8px;
	color:#0e7cb2;
	background:#d8d8d8;
	border:1px solid #d8d8d8;
	font-size:24px;
	text-shadow: 3px 3px 3px #fff,3px 3px 3px #fff;
}
.parallelogram-txt-range{
	margin-top:12px;
	color:#000;
}
.parallelogram-txt-main-2,.parallelogram-txt-main-3{
	margin-top:10px;
	color: #fff;
}
.parallelogram-txt-main{
	margin-top:7px;
	font-size:23px;
	color: #fff;
}
.top-position{
	margin-top:30%;
}
.parallelogram-txt-main-2,.parallelogram-txt-main-3{
	color:#fff;
	font-size: 23px;
}
@media all and (max-width:597px),
all and (max-device-width : 597px){
	.parallelogram-txt-main-3 {
		width: 200px;
		background: #0e7cb2;
		font-size: 10px;
	}
	.parallelogram-main-3{
		width:200px;
	}
}
.parallelogram-txt{
	margin-top:12px;
	color:#fff;
}
.parallelogram-txt-bus-advice{
	padding-top:8px;
	color:#0e7cb2;
	text-shadow: 3px 3px 3px #fff;
}
.parallelogram-txt-footer{
	margin-top:15px;
	color:#fff;
}
.parallelogram-txt-order{
	margin-top:6px;
	color:#fff;
	font-size:25px;
	background:#0e7cb2;
	border:#0e7cb2;
}
@media all and (max-width:523px),
all and (max-device-width : 523px){
	.parallelogram-range{
		width: 260px;
	}
	.parallelogram-txt-range{
		margin-top:5px;
		font-size:18px;
	}
	.sendsubmit {
		max-width:  100%;  
		height: 50px; 
		margin: 0;
		padding:0;
		border: 0;
		background: transparent url("../images/btn-img.png") no-repeat center top;
		text-indent: -1000em;
		cursor: pointer; 
		cursor: hand; 
	}
}
@media all and (max-width:447px),
all and (max-device-width : 447px){
	.parallelogram-technology {
		width: 200px;
		background: #0e7cb2;
	}
	.parallelogram-txt{
		margin-top:12px;
		color:#fff;
		font-size:16px;
	}
	.parallelogram-txt-bus-advice{
		font-size:16px;
	}
}
#sertificates-bg{
	padding-top:2%;
	background-image: url('../images/sertificates-bg.png');
	color:#fff;
}
.polygon-f2{
	background-image: url('../images/polygon-f2.png');
	color:#fff;
}
.polygon-f1{
	background-image: url('../images/polygon-f1.png');
	padding-top:6%;
	padding-bottom:10%;
	color:#fff;
}
.img-posit-left{
	margin-left:-20px;
}
.img-posit-right{
	margin-right: -20px;
}

.btn-order-form,.btn-order-form2{
	display:inline-block;
	font-weight:bold;
	border:2px solid #bfbfbf;
	text-decoration:none;
	background:#f1f1f1;
}
.btn-order-form{
	padding:10px;
	margin-left:20px;
	font-size:20px;	
}
.btn-order-form2{
	padding:10px 50px 10px 50px;
	margin-right:20px;
	font-size:20px;	
}
@media all and (max-width:1272px),
all and (max-device-width : 1272px){
	.img-posit-left{
		margin-left:0px;
	}
	.img-posit-right{
		margin-right: 0px;
	}
}
@media all and (max-width: 991px),
all and (max-device-width: 991px){
	.width-img-smart{
		max-width:100%;
	}
}
.rectangle{
	background-image: url('../images/rectangle.png');
	color:#fff;
	margin-top:3%;
	padding-top: 3%;
    padding-bottom: 3%;
	margin-left:-3%;
}
@media all and (max-width:1199px),
all and (max-device-width : 1199px){
	.rectangle{
		margin-left:0%;
	}
}
.img-width{
	max-width:100%;
	height:auto;
}
hr{
	 border: none; /* Убираем границу для браузера Firefox */
     color: #257cb2; /* Цвет линии для браузера Internet Explorer */
     background-color: #257cb2; /* Цвет линии для браузера Firefox и Opera */
     height: 2px; /* Толщина линии */
}
a:hover{
	text-decoration:none;
}
a.read_more,a.order,a.download{
	border: 2px solid #c2c2c2;
	padding:12px 35px 12px 35px;
}
a.order{
	border: 1px solid #c2c2c2;
}
a.read_more{
	color:#4b9bc3;
	background:#f1f1f1;
}
a.order,a.download{
	color:#fff;
	background:#257cb2;
}
a.download{
	padding:12px 45px 12px 45px;
}
p.font-form{
	font-size:18px;
}
@media all and (max-width:768px),
all and (max-device-width : 768px){
	.buttons{
		margin-top:10px;
	}
}
@media all and (max-width:360px),
all and (max-device-width : 360px){
	a.download{
		font-size:13px;
	}
}

#range{
	padding-bottom:20px;
}
.color-blue{
	color:#257cb2;
}
.image-responsive{
   display: inline-block;
   height: auto;
   max-width: 100%;
}
.img-width-polygon{
	max-width:50%;
	height:auto;
}
ul.triangle{
	padding-left:40px;
	font-size:18px;
    list-style-image: url(../images/triangle.png);
}
#map {
    height: 496px;
}
.footer-color{
	color:#0e7cb2;
}
.grey{
	background:#f1f1f1;
}
.underline{
	text-decoration:underline;
}
.image {
	position	: relative;
	width		: 100%; /* for IE 6 */
}
.txt-for-smart{
	position	: absolute;
	top		: 70%;
	left		: 0;
	width		: 100%;
	color			: white;
	padding			: 10px;
}
#color-smart-img1{
	color:#21746a;
}
#color-smart-img2,#color-smart-img3{
	color:#656565;
}
span.footer-polygon,
span.polygon-bus-advice,
span.polygon-form{
	position: absolute;
	top		: 5px;
	left	: 0;
	width	: 100%;
	padding	: 10px;
}
span.polygon-form{
	color:#0e7cb2;
	text-shadow: 3px 3px 3px #fff;
}
span.polygon-form{
	top		: 30%;
}
@media all and (max-width:992px),
all and (max-device-width : 992px){
	span.polygon-form{
		top		: 25%;
	}
	span.polygon-bus-advice{
		font-size:14px;
	}
	.img-poligon{
		min-width:100%;
	}
}
@media all and (max-width:430px),
all and (max-device-width : 430px){
	.parallelogram-main {
		position: relative;
		top: 115px;
		padding-top: 12px;
		margin-left: 3%;
		width: 500px;
		height: 50px;
		background: #0e7cb2;
		border: 1px solid #0e7cb2;
	}
	.parallelogram-main-2 {
		margin-top: 29%;
		margin-left: 10%;
		width: 650px;
		height: 50px;
		background: #0e7cb2;
		border: 1px solid #0e7cb2;
	}
	/*.parallelogram-txt-main{
		margin-top:7px;
		font-size:23px;
		color: #fff;
	}*/
	.parallelogram-txt-main-2 {
		margin-top: 19px;
		color: #fff;
	}
}
@media all and (max-width:414px),
all and (max-device-width : 414px){
	.parallelogram-main-2 {
		margin-top: 31%;
	}
}
@media all and (max-width:391px),
all and (max-device-width : 391px){
	.parallelogram-main-2 {
		margin-top: 35%;
	}
}
@media all and (max-width:350px),
all and (max-device-width : 350px){
	.parallelogram-main-2 {
		margin-top: 40%;
	}
}
.txt-shadow{
	text-shadow: 3px 3px 3px #000;
}
span.footer-polygon{
	color: white;
}
.txt-grey{
	color:#e5e5e5;
}
#feedback-form{
	background:#f1f1f1;
	margin-left:10%;
}
#feedback-form .input-bloc{
	margin-bottom: 7px;
}
.error-box{ 
	font-size: 16px;
	margin-top: 5px;
}
.h2-modal{
	padding-top:40px;
	padding-bottom:15px;
	color:#0e7cb2;
	font-weight:bold;
}
.overlay {
    background-color: rgba(0, 0, 0, 0.6);
    bottom: 0;
    cursor: default;
    left: 0;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    visibility: hidden;
    z-index: 1;

    -webkit-transition: opacity .5s;
    -moz-transition: opacity .5s;
    -ms-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
}
.overlay:target {
    visibility: visible;
    opacity: 1;
}
.popup {
	height:582px;
	width:917px;
    display: inline-block;
    left: 50%;
    opacity: 0;
    padding: 15px;
    position: fixed;
    text-align: justify;
    top: 40%;
    visibility: hidden;
    z-index: 10;

    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);

    -webkit-transition: opacity .5s, top .5s;
    -moz-transition: opacity .5s, top .5s;
    -ms-transition: opacity .5s, top .5s;
    -o-transition: opacity .5s, top .5s;
    transition: opacity .5s, top .5s;
}
.overlay:target+.popup {
    top: 50%;
    opacity: 1;
    visibility: visible;
}
input#name{
	margin-top:52px;
}
input#name,input#tel{
	height:66px;
	width:654px;
	background:#c8c9cf;
	opacity:0.7;
	font-size:19px;
}
input#name-order,input#tel-order{
	width:222px;
	height:38px;
	border:2px solid #c2c2c2;
}
input#name-order::-webkit-input-placeholder,
input#tel-order::-webkit-input-placeholder {
	color:black;
	font-weight:bold;
	font-size:19px;
}
input#name-order:-moz-placeholder,
input#tel-order:-moz-placeholder {
	color:black;
	font-weight:bold;
}
input#name::-webkit-input-placeholder,
input#tel::-webkit-input-placeholder {
	padding-left:30px;
	color:black;
	font-size:19px;
}
input#name::-webkit-input-placeholder,
input#tel::-webkit-input-placeholder {
	padding-bottom:50px;
}
input#name-order::-webkit-input-placeholder,
input#tel-order::-webkit-input-placeholder {
	padding-bottom:50px;
}
input#name:-moz-placeholder,
input#tel:-moz-placeholder {
	padding-left:30px;
	color:black;
	font-size:19px;
	font-weight:bold;
}
.no-padding {
    padding: 0;
}
.no-gutter > [class*=col-] {
    padding-right: 0;
    padding-left: 0;
}
:focus {outline:none;}
::-moz-focus-inner {border:0;}
.head-form{background:#f1f1f1;}
#no-dash{
	list-style-type:none;
}
/* -------------------------------- 

Modules - reusable parts of our design

-------------------------------- */
.cd-img-replace {
  /* replace text with a background-image */
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}

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

Main components 

-------------------------------- */
.cd-section {
  min-height: 100%;
  position: relative;
  padding: 2em 0;
}
.cd-section:nth-of-type(odd) {
  background-color: #3e3947;
}
.cd-section:nth-of-type(odd) p {
  color: #898099;
}
.cd-section:nth-of-type(even) {
  background-color: #745360;
}
.cd-section:nth-of-type(even) p {
  color: #bda3ad;
}
.cd-section h1, .cd-section p {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  width: 90%;
  max-width: 768px;
  text-align: center;
}
.cd-section h1 {
  color: white;
  font-weight: 300;
  text-transform: uppercase;
  font-size: 20px;
  font-size: 1.25rem;
}
.cd-section p {
  line-height: 1.6;
}
@media only screen and (min-width: 768px) {
  .cd-section h1 {
    font-size: 30px;
    font-size: 1.875rem;
  }
  .cd-section p {
    font-size: 20px;
    font-size: 1.25rem;
    line-height: 2;
  }
}

.cd-scroll-down {
  position: absolute;
  left: 50%;
  right: auto;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: 20px;
  width: 38px;
  height: 44px;
  background: url("../img/cd-arrow-bottom.svg") no-repeat center center;
}

/* No Touch devices */
.cd-nav-trigger {
  display: none;
}

.no-touch #cd-vertical-nav {
  position: fixed;
  right: 40px;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 1;
}
.no-touch #cd-vertical-nav li {
  text-align: right;
}
.no-touch #cd-vertical-nav a {
  display: inline-block;
  /* prevent weird movements on hover when you use a CSS3 transformation - webkit browsers */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.no-touch #cd-vertical-nav a:after {
  content: "";
  display: table;
  clear: both;
}
.no-touch #cd-vertical-nav a span {
  float: right;
  display: inline-block;
  -webkit-transform: scale(0.6);
  -moz-transform: scale(0.6);
  -ms-transform: scale(0.6);
  -o-transform: scale(0.6);
  transform: scale(0.6);
}
.no-touch #cd-vertical-nav a:hover span {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
.no-touch #cd-vertical-nav a:hover .cd-label {
  opacity: 1;
}
.no-touch #cd-vertical-nav a.is-selected .cd-dot {
  background-color: white;
}
.no-touch #cd-vertical-nav .cd-dot {
  position: relative;
  /* we set a top value in order to align the dot with the label. If you change label's font, you may need to change this top value*/
  top: 8px;
  height: 22px;
  width: 22px;
  border-radius: 50%;
  background-color: #f4982c;
  -webkit-transition: -webkit-transform 0.2s, background-color 0.5s;
  -moz-transition: -moz-transform 0.2s, background-color 0.5s;
  transition: transform 0.2s, background-color 0.5s;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
.no-touch #cd-vertical-nav .cd-label {
  position: relative;
  margin-right: 10px;
  padding: .4em .5em;
  color: #f4982c;
  font-weight:bold;
  font-size: 14px;
  font-size: 1.875rem;
  -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
  -moz-transition: -moz-transform 0.2s, opacity 0.2s;
  transition: transform 0.2s, opacity 0.2s;
  opacity: 0;
  -webkit-transform-origin: 100% 50%;
  -moz-transform-origin: 100% 50%;
  -ms-transform-origin: 100% 50%;
  -o-transform-origin: 100% 50%;
  transform-origin: 100% 50%;
}

/* Touch devices */
.touch .cd-nav-trigger {
  display: block;
  z-index: 2;
  position: fixed;
  bottom: 30px;
  right: 5%;
  height: 44px;
  width: 44px;
  border-radius: 0.25em;
  background: rgba(255, 255, 255, 0.9);
}
.touch .cd-nav-trigger span {
  position: absolute;
  height: 4px;
  width: 4px;
  background-color: #3e3947;
  border-radius: 50%;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}
.touch .cd-nav-trigger span::before, .touch .cd-nav-trigger span::after {
  content: '';
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  background-color: inherit;
  border-radius: inherit;
}
.touch .cd-nav-trigger span::before {
  top: -9px;
}
.touch .cd-nav-trigger span::after {
  bottom: -9px;
}

.touch #cd-vertical-nav {
  position: fixed;
  z-index: 1;
  right: 5%;
  bottom: 30px;
  width: 90%;
  max-width: 400px;
  max-height: 90%;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  -webkit-transform-origin: right bottom;
  -moz-transform-origin: right bottom;
  -ms-transform-origin: right bottom;
  -o-transform-origin: right bottom;
  transform-origin: right bottom;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  transition-duration: 0.2s;
  border-radius: 0.25em;
  background-color: rgba(255, 255, 255, 0.9);
}
.touch #cd-vertical-nav a {
  display: block;
  padding: 1em;
  border-bottom: 1px solid rgba(62, 57, 71, 0.1);
}
.touch #cd-vertical-nav a span:first-child {
  display: none;
}
.touch #cd-vertical-nav a.is-selected span:last-child {
  color: #d88683;
}
.touch #cd-vertical-nav.open {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
.touch #cd-vertical-nav.open + .cd-nav-trigger {
  background-color: transparent;
}
.touch #cd-vertical-nav.open + .cd-nav-trigger span {
  background-color: rgba(62, 57, 71, 0);
}
.touch #cd-vertical-nav.open + .cd-nav-trigger span::before, .touch #cd-vertical-nav.open + .cd-nav-trigger span::after {
  background-color: #3e3947;
  height: 3px;
  width: 20px;
  border-radius: 0;
  left: -8px;
}
.touch #cd-vertical-nav.open + .cd-nav-trigger span::before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 1px;
}
.touch #cd-vertical-nav.open + .cd-nav-trigger span::after {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
  bottom: 0;
}
.touch #cd-vertical-nav li:last-child a {
  border-bottom: none;
}

@media only screen and (min-width: 768px) {
  .touch .cd-nav-trigger, .touch #cd-vertical-nav {
    bottom: 40px;
  }
}
