.pozadie {
    background-image: url("../img/mapa_bg.png");
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: 85%; /* Resize the background image to cover the entire container */
 }

.nav-link{
    font-family: 'Open Sans', sans-serif;
    font-size: 0.97rem;
    line-height: 100px;
}

.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 1.5rem;
    padding-left: 1.5rem;
}



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

Basic Style

-------------------------------- */
.cd-breadcrumb, .cd-multi-steps {
  width: 100%;
  max-width: 980px;
  padding: 0.5em 1em;
  margin: 1em auto;
  background-color: #edeff0;
  border-radius: .25em;
}
.cd-breadcrumb:after, .cd-multi-steps:after {
  content: "";
  display: table;
  clear: both;
}
.cd-breadcrumb li, .cd-multi-steps li {
  display: inline-block;
  float: left;
  margin: 0.5em 0;
}
.cd-breadcrumb li::after, .cd-multi-steps li::after {
  /* this is the separator between items */
  display: inline-block;
  content: '\00bb';
  margin: 0 .6em;
  color: #959fa5;
}
.cd-breadcrumb li:last-of-type::after, .cd-multi-steps li:last-of-type::after {
  /* hide separator after the last item */
  display: none;
}
.cd-breadcrumb li > *, .cd-multi-steps li > * {
  /* single step */
  display: inline-block;
  font-size: 1.4rem;
  color: white;
}
.cd-breadcrumb li.current > *, .cd-multi-steps li.current > * {
  /* selected step */
  color: #55b7ff;
  text-decoration: none;
}
.no-touch .cd-breadcrumb a:hover, .no-touch .cd-multi-steps a:hover {
  /* steps already visited */
  color: #96c03d;
}


.cd-breadcrumb.custom-icons li:not(.current):nth-of-type(2) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(2) > *::before {
  /* change custom icon using image sprites */
  background-position: -20px 0;
}
.cd-breadcrumb.custom-icons li:not(.current):nth-of-type(3) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(3) > *::before {
  background-position: -40px 0;
}
.cd-breadcrumb.custom-icons li:not(.current):nth-of-type(4) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(4) > *::before {
  background-position: -60px 0;
}
.cd-breadcrumb.custom-icons li.current:first-of-type > *::before, .cd-multi-steps.custom-icons li.current:first-of-type > *::before {
  /* change custom icon for the current item */
  background-position: 0 -20px;
}
.cd-breadcrumb.custom-icons li.current:nth-of-type(2) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(2) > *::before {
  background-position: -20px -20px;
}
.cd-breadcrumb.custom-icons li.current:nth-of-type(3) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(3) > *::before {
  background-position: -40px -20px;
}
.cd-breadcrumb.custom-icons li.current:nth-of-type(4) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(4) > *::before {
  background-position: -60px -20px;
}



@media only screen and (min-width: 1000px) {
  .cd-breadcrumb, .cd-multi-steps {
    padding: 0 1.2em;
  }
  .cd-breadcrumb li, .cd-multi-steps li {
    margin: 1.2em 0;
  }
  .cd-breadcrumb li::after, .cd-multi-steps li::after {
    margin: 0 1em;
  }
  .cd-breadcrumb li > *, .cd-multi-steps li > * {
    font-size: 1.6rem;
  }
}

@media only screen and (min-width: 1000px) {
  .cd-breadcrumb.triangle {
    /* reset basic style */
    background-color: transparent;
    padding: 0;
  }
  .cd-breadcrumb.triangle li {
    position: relative;
    padding: 0;
    margin: 0px 0px 0px 0;
  }
  .cd-breadcrumb.triangle li:last-of-type {
    margin-right: 0;
  }

  .cd-breadcrumb.triangle li> * {
    position: relative;
    padding: 1em 2.5em 1em 3.52em;
    font-size: 1rem;
    text-decoration: none;
  }

  .cd-breadcrumb.triangle li:hover> * {
    color: white;
  }


  .cd-breadcrumb.triangle li:first-of-type {
    color: #2c3f4c;
    background-image: linear-gradient(to right, #7868ff , #9178ff);
    border-color: #9178ff;
  }
  .cd-breadcrumb.triangle li:nth-of-type(2) {
    color: white;
    background-image: linear-gradient(to right, #5dd7c3 , #50c2f5);
    /* the border color is used to style its ::after pseudo-element */
    border-color: #50c2f5;
  }
  .cd-breadcrumb.triangle li:nth-of-type(3) {
    color: white;
    background-image: linear-gradient(to right, #5aabff , #6c82ff);
    border-color: #6c82ff;
  }
  .cd-breadcrumb.triangle li:nth-of-type(4) {
    color: white;
    background-image: linear-gradient(to right, #7868ff , #9178ff);
    /* the border color is used to style its ::after pseudo-element */
    border-color: #9178ff;
  }

  .cd-breadcrumb.triangle li.current > * {
    /* selected step */
    color: black;
    background-color: white;
    border-color: white;
  }

  .current.step_number {
    color: #55b7ff;
  }

  .cd-breadcrumb.triangle li:first-of-type > * {
    padding-left: 2.5em;
    padding-right: 2.2em;
    border-radius: 0px;
    text-decoration: none;
  }
  .cd-breadcrumb.triangle li:last-of-type > * {
    padding-left: 3.51em;
    padding-right: 3em;
    border-radius: 0px;
    text-decoration: none;
  }
  .no-touch .cd-breadcrumb.triangle a:hover {
    /* steps already visited */
    color: #ffffff;
    background-color: #2c3f4c;
    border-color: #2c3f4c;
    text-decoration: none;
  }
  .cd-breadcrumb.triangle li::after, .cd-breadcrumb.triangle li > *::after {
    /*
    	li > *::after is the colored triangle after each item
    	li::after is the white separator between two items
    */
    content: '';
    position: absolute;
    top: 0;
    left: 100%;
    content: '';
    height: 0;
    width: 0;
    border: 24px solid transparent;
    border-right-width: 0;
    border-left-width: 20px;
  }
  
  .cd-breadcrumb.triangle li > ::after {
    border-left-color: transparent !important;
  }

  .cd-breadcrumb.triangle li.current > ::after {
    border-left-color: white !important;
  }

  .cd-breadcrumb.triangle li::after {
    /* this is the white separator between two items */
    z-index: 1;
    -webkit-transform: translateX(4px);
    -moz-transform: translateX(4px);
    -ms-transform: translateX(4px);
    -o-transform: translateX(4px);
    transform: translateX(4px);
    border-left-color: transparent;
    /* reset style */
    margin: 0;
  }
  .cd-breadcrumb.triangle li > *::after {
    /* this is the colored triangle after each element */
    z-index: 2;
    border-left-color: inherit;
  }
  .cd-breadcrumb.triangle li:last-of-type::after, .cd-breadcrumb.triangle li:last-of-type > *::after {
    /* hide the triangle after the last step */
    display: none;
  }
  .cd-breadcrumb.triangle.custom-separator li::after {
    /* reset style */
    background-image: none;
  }
  .cd-breadcrumb.triangle.custom-icons li::after, .cd-breadcrumb.triangle.custom-icons li > *::after {
    /* 50px is the height of the <a> element */
    border-top-width: 45px;
    border-bottom-width: 45px;
  }
  .cd-breadcrumb.triangle.custom-icons li::after, .cd-breadcrumb.triangle.custom-icons li:first-of-type *::after {
    /* 50px is the height of the <a> element */
    /*color: #9178ff;*/
  }
  .cd-breadcrumb.triangle.custom-icons li::after, .cd-breadcrumb.triangle.custom-icons li:nth-of-type(2) *::after {
    /* 50px is the height of the <a> element */
    /*color: #50c2f5;*/
  }
  .cd-breadcrumb.triangle.custom-icons li::after, .cd-breadcrumb.triangle.custom-icons li:nth-of-type(3) *::after {
    /* 50px is the height of the <a> element */
    /*color: #6c82ff;*/
  }


  @-moz-document url-prefix() {
    .cd-breadcrumb.triangle li::after,
    .cd-breadcrumb.triangle li > *::after {
      /* fix a bug on Firefix - tooth edge on css triangle */
      border-left-style: dashed;
    }
  }
}
/* --------------------------------

Custom icons hover effects - breadcrumb and multi-steps

-------------------------------- */
@media only screen and (min-width: 1000px) {
  .no-touch .cd-breadcrumb.triangle.custom-icons li:first-of-type a:hover::before, .cd-breadcrumb.triangle.custom-icons li.current:first-of-type a::before, .no-touch .cd-multi-steps.text-center.custom-icons li:first-of-type a:hover::before, .cd-multi-steps.text-center.custom-icons li.current:first-of-type a::before {
    /* change custom icon using image sprites - hover effect or current item */
    background-position: 0 -40px;
  }
  .no-touch .cd-breadcrumb.triangle.custom-icons li:nth-of-type(2) a:hover::before, .cd-breadcrumb.triangle.custom-icons li.current:nth-of-type(2) a::before, .no-touch .cd-multi-steps.text-center.custom-icons li:nth-of-type(2) a:hover::before, .cd-multi-steps.text-center.custom-icons li.current:nth-of-type(2) a::before {
    background-position: -20px -40px;
  }
  .no-touch .cd-breadcrumb.triangle.custom-icons li:nth-of-type(3) a:hover::before, .cd-breadcrumb.triangle.custom-icons li.current:nth-of-type(3) a::before, .no-touch .cd-multi-steps.text-center.custom-icons li:nth-of-type(3) a:hover::before, .cd-multi-steps.text-center.custom-icons li.current:nth-of-type(3) a::before {
    background-position: -40px -40px;
  }
  .no-touch .cd-breadcrumb.triangle.custom-icons li:nth-of-type(4) a:hover::before, .cd-breadcrumb.triangle.custom-icons li.current:nth-of-type(4)::before, .no-touch .cd-multi-steps.text-center.custom-icons li:nth-of-type(4) a:hover::before, .cd-multi-steps.text-center.custom-icons li.current:nth-of-type(4) a::before {
    background-position: -60px -40px;
  }
}


.btn-callback{
  color: white;
 /* text-shadow: 0px 0px 10px rgba(0,0,0,0.2);*/
    box-shadow: 0 0 20px #eee;
    background-size: 200% auto;
    line-height: 1.5;
    border-radius: 35px;
    transition: 0.5s;
    font-size: 0.97rem;
    padding: .675rem 2rem;
    font-family: 'Open Sans', sans-serif;
    text-transform: uppercase;
    background-image: linear-gradient(to right, #379df1 0%, #29d2e3 51%, #379df1 100%);
}

.btn-callback:hover {
  background-position: right center; /* change the direction of the change here */
}


.btn-next-step{
  color: white;
 /* text-shadow: 0px 0px 10px rgba(0,0,0,0.2);*/
    box-shadow: 0 0 20px #eee;
    background-size: 200% auto;
    line-height: 1.5;
    border-radius: 35px;
    transition: 0.5s;
    font-size: 0.97rem;
    padding: .975rem 2.6rem;
    font-family: 'Open Sans', sans-serif;
    background-image: linear-gradient(to right, #379df1 0%, #29d2e3 51%, #379df1 100%);
    margin-bottom: 10px;
}

.btn-next-step:hover {
  background-position: right center; /* change the direction of the change here */
}

h5 {
    font-size: 0.9rem;
    color: #444;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 1px;
}
h2 {
    font-size: 2.1rem;
    color: #444;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    text-align: center;
    margin-bottom: 70px;
}
h3 {
    font-size: 1.4rem;
    color: #272727;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    text-align: center;
    margin-top: 70px;
    margin-bottom: 70px;
    text-transform: uppercase;
}


a {
    color: #272727;
    text-decoration: none;
    background-color: transparent;
    -webkit-text-decoration-skip: objects;

}

a:hover {
    color: #7f7bff;
    text-decoration: none;
}

.company_name {
    font-size: 0.8rem;
    color: #282828;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    text-align: center;

}

.company_img {
    text-align: center;
    margin-bottom: 10px;
}


.navbar-expand-lg .navbar-nav .nav-link {
    padding: 0 1.5rem;
    color: #a3a3a3;
}

.mr-auto, .mx-auto {
    margin-right: auto!important;
    margin-left: auto!important;
}

.table th:first-child {
    padding: 0.60rem;
    vertical-align: top;
    border-top: 1px solid #dee2e6;
    background: #f9fafc;
    padding-left: 50px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 0.9rem;
    max-width: 130px;
}




.table .thead-light th {
    color: #282828;
    background-color: #f9fafc;
    border-color: #dee2e6;
    text-align: left;
    border-bottom: 0px;
    vertical-align: middle;
    font-family: 'Open Sans', sans-serif;
}

.table .thead-top th {
    color: #282828;
    background-color: #fff;
    border-color: #dee2e6;
    text-align: left;
    border-bottom: 0px;
    vertical-align: middle;
    font-family: 'Open Sans', sans-serif;
}

.table-sm td, .table-sm th {
    padding: .3rem;
    text-align: left;
    padding-left: 50px;
    vertical-align: middle;
    max-width: 120px;
    font-size: 0.8rem;
}





.check {
    position: relative;
    width: 16px;
    height: 12px;
    content: url(../img/check.svg);
    margin-top: 4px;
    margin-left: -25px;
    margin-right: 8px;
}


.table-light {
    color: #212529;
    background-color: white;
}

.table-hover tbody tr:hover {
    background-color: rgba(0,0,0,.012);
}

.yes {
    position: relative;
    width: 18px;
    height: 18px;
    content: url(../img/yes.svg);
    margin-top: 6px;
    margin-left: 0px;
}

.no {
    position: relative;
    width: 18px;
    height: 18px;
    content: url(../img/no.svg);
    margin-top: 6px;
    margin-left: 0px;
}

.collapse_closed {
    position: relative;
    width: 9px;
    height: 15px;
    content: url(../img/collapse_closed.svg);
    top: 2px;
    margin-left: -20px;
    margin-right: 11px;
}

.collapse_open {
    position: relative;
    width: 16px;
    height: 10px;
    content: url(../img/collapse_open.svg);
    top: 1px;
    margin-left: -25px;
    margin-right: 10px;
}


.table td, .table th {
    border-bottom: 1px solid #dee2e6;
}


.riadok {
    color: #495057;
    background-color: #e9ecef;
    border-color: #dee2e6;
    text-align: left;
}


.titulok{
    font-size: 0.9rem;
    color: #6194ff;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
}

.button_02 {
    color: #fff;
    transition: 0.5s;
    font-size: 0.95rem;
    padding: .675rem 2rem;
    background-size: 200% auto;
    line-height: 1.2;
    border-radius: 0px;
    font-family: 'Open Sans', sans-serif;
    background-image: linear-gradient(to right, #379df1 0%, #29d2e3 51%, #379df1 100%);
    border: none;
    text-align: left;
    margin-left: -20px;
    border-radius: 6px;
}

.button_02:hover {
  background-position: right center; /* change the direction of the change here */
}


.button_03 {
    color: #fff;
    transition: 0.5s;
    font-size: 0.90rem;
    padding: .675rem 2rem;
    background-size: 200% auto;
    line-height: 1.2;
    border-radius: 0px;
    font-family: 'Open Sans', sans-serif;
    background-image: linear-gradient(to right, #5dd7c2 0%, #5bc5f7 51%, #5dd7c2 100%);
    border: none;
    text-align: center;
    border-radius: 6px;
}

.button_03:hover {
  background-position: right center; /* change the direction of the change here */
}

b, strong {
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}


.table .thead-light-footer th {
    color: #282828;
    background-color: #f1f3f6;
    border-color: #f1f3f6;
    text-align: left;
    border-bottom: 0px;
    vertical-align: middle;
    font-family: 'Open Sans', sans-serif;
}

.table {
    margin-bottom: 3rem;
}

footer {
    background-color: rgba(255, 255, 255, 0.2);
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 0.90rem;
    color: white;
}



.top_header {
    background-image: linear-gradient(to right, #379df1 0%, #29d2e3 100%);
    padding-left: 30px;
    padding-top: 5px;
    border-bottom: 0px;
    height: 50px;
}


.companies {
    background: white;
    padding-left: 30px;
    padding-top: 5px;
    border-bottom: 0px;
    height: 50px;
}

.bordered {
    border-left: 1px solid #d7dbe8;
    border-right: 1px solid #d7dbe8;
}

.top_header_title {
    color: white;
    text-align: left;
    vertical-align: middle;
    font-family: 'Open Sans', sans-serif;
    padding-right: 20px;
    font-size: 0.90rem;
    display: inline;
    text-transform: uppercase;
    padding-bottom: 10px;
}

.top_header_button {
    color: white;
    text-align: left;
    vertical-align: middle;
    font-family: 'Open Sans', sans-serif;
    padding-right: 20px;
    font-size: 0.90rem;
    display: inline;
    text-transform: uppercase;
    background-color: rgba(255, 255, 255, 0.1);
    padding: 16px;


}


.change_data_icon {
    position: relative;
    width: 31px;
    height: 27px;
    background: url(../img/change_data.svg);
    border: 0px;
    top: 6px;
    margin-left: 5px;
}




@media only screen and (max-width: 800px) {
/* .table th:first-child {
    min-width: 230px;
}
.table-sm td, .table-sm th {
    min-width: 200px;
} */

.top_header {
    padding-right: 30px;
    height: 180px;
}
.top_header_title {
    display: table;

}}

.content {
    max-width: 980px;
    background: white;
    margin: 0 auto;

}

.step_title {
    font-family: 'Poppins', sans-serif;
    text-align: left;
    display: inherit;
    line-height: 17px;
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 0rem;

}


.step_title-quote {
    font-family: 'Poppins', sans-serif;
    text-align: left;
    display: inherit;
    line-height: 20px;
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 0rem;
}


.step_number {
    font-size: 2.4rem;
    font-family: 'Open Sans', sans-serif;
    font-weight: 200;
    padding-right: 10px;


}

.step_number-quote {
    font-size: 2.4rem;
    font-family: 'Open Sans', sans-serif;
    font-weight: 200;
    padding-right: 10px;


}



.step_01_container {
    max-width: 900px;
    text-align: center;
    padding: 20px;
    margin: 0 auto;


}

ul.info_check {
text-align: left;
padding-top: 10px;
margin-left: -15px;
}

.info_container {
    max-width: 900px;
    text-align: center;
    padding: 20px;
    margin: 0 auto;


}

.info_container_obsah {
    max-width: 800px;
    text-align: center;
    padding: 20px;
    margin: 0 auto;


}

p.info_text {
    font-size: 13px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 200;
    text-align: justify;
    padding-top: 15px;


}

p.info_text_footer  {
    font-family: 'Open Sans', sans-serif;
    font-size: 0.97rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    padding-top: 10px;
}

.content_info  {
    max-height: 800px;
    overflow-y: scroll;
}


p {
    margin-top: 0;
    margin-bottom: 0.2rem;
}

.align_left {
    text-align: left;
}


.step_01_name {
    display: block;
    text-align: center;
    font-size: 1.3rem;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    margin-top: 15px;
    margin-bottom: 10px;


}

.step_03_name {
    display: block;
    text-align: center;
    font-size: 1.3rem;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    margin-top: 15px;
    margin-bottom: 0px;


}


.col-step_01:hover {
  color: #7f7bff;
  cursor: pointer;

}

.dot {
    height: 8px;
    width: 8px;
    background-color: #e2daf9;
    border-radius: 50%;
    display: inline-block;
}

.dot.active {
    background-color: #379df1;
}



.cc-selector input{
    margin:0;padding:0;
    -webkit-appearance:none;
       -moz-appearance:none;
            appearance:none;
}
.man{background-image:url(../img/man.png);}
.woman{background-image:url(../img/woman.png);}

.cc-selector input:active +.drinkcard-cc{opacity: 1.0;}
.cc-selector input:checked +.drinkcard-cc{
    -webkit-filter: none;
       -moz-filter: none;
            filter: none;
}
.drinkcard-cc{
    cursor:pointer;
    background-size:contain;
    background-repeat:no-repeat;
    display:inline-block;
    width:16px;height:44px;
    margin: 0 auto;
    padding-right: 30px;
    -webkit-transition: all 100ms ease-in;
       -moz-transition: all 100ms ease-in;
            transition: all 100ms ease-in;
    -webkit-filter: brightness(1.4) grayscale(1) opacity(1);
       -moz-filter: brightness(1.4) grayscale(1) opacity(1);
            filter: brightness(1.4) grayscale(1) opacity(1);
}
.drinkcard-cc:hover{
    -webkit-filter: brightness(1) grayscale(0) opacity(1);
       -moz-filter: brightness(1) grayscale(0) opacity(1);
            filter: brightness(1) grayscale(0) opacity(1);
}


.form_label {
    display: inline-block;
    margin-bottom: .6rem;
    font-family: 'Poppins', sans-serif;
    font-size: 0.9rem;
    text-transform: uppercase;
    float: left;
    color: #6f7480;
}


.form_label_center {
    display: inline-block;
    margin-bottom: .6rem;
    font-family: 'Poppins', sans-serif;
    font-size: 0.9rem;
    text-transform: uppercase;
    color: #6f7480;
    text-align: center;
}




.form_label_currency {
    display: inline-block;
    margin-bottom: 0px;
    font-family: 'Poppins', sans-serif;
    font-size: 0.9rem;
    text-transform: uppercase;
    float: left;
    color: #6f7480;
}



.form-control {
    margin-bottom: 15px;
}


/*tooltip Box*/
.con-tooltip {

  position: relative;


  border-radius: 9px;
  padding: 0 20px;
  margin: 0px;

  display: inline-block;

  transition: all 0.3s ease-in-out;
  cursor: default;

}

/*tooltip */
.tooltip {
  visibility: hidden;
  z-index: 1;
  opacity: .40;

  width: 250px;
  padding: 10px;

  background: #f5f5f5;
  color: #484848;

  position: absolute;
  top:-100px;
  left: -55%;

  text-align: center;
  border-radius: 9px;
  font: 16px;

  /*transform: translateY(9px);*/
  /*transition: all 0.3s ease-in-out;*/
  border: none;
  box-shadow: none;
}


/* tooltip  after*/
.tooltip::after {
  content: " ";
  width: 0;
  height: 0;

  border-style: solid;
  border-width: 12px 12.5px 0 12.5px;
  border-color: #f5f5f5 transparent transparent transparent;

  position: absolute;
  left: 10%;

}

.con-tooltip:hover .tooltip{
  visibility: visible;
  /*transform: translateY(-10px);*/
  opacity: 1;
  transition: .3s linear;
  animation: odsoky 1s ease-in-out infinite  alternate;

}
@keyframes odsoky {
  0%{
    transform: translateY(6px);
  }

  100%{
    transform: translateY(1px);
  }

}

/*hover ToolTip*/
.left:hover {transform: translateX(-6px); }
.top:hover {transform: translateY(-6px);  }
/*.bottom:hover {transform: translateY(6px);}*/
.right:hover {transform: translateX(6px); }



/*bottom*/

.bottom .tooltip { top:135%; left:-131%; }

.bottom .tooltip::after{
  top:-10px;
  left:40%;
  transform: rotate(180deg);
}

 /*get a quote kroky*/

-------------------------------- */
.cd-breadcrumb-quote, .cd-multi-steps-quote {
  width: 90%;
  max-width: 768px;
  padding: 0.5em 1em;
  margin: 1em auto;
  background-color: #edeff0;
  border-radius: .25em;
}
.cd-breadcrumb-quote:after, .cd-multi-steps-quote:after {
  content: "";
  display: table;
  clear: both;
}
.cd-breadcrumb-quote li, .cd-multi-steps-quote li {
  display: inline-block;
  float: left;
  margin: 0.5em 0;
}
.cd-breadcrumb-quote li::after, .cd-multi-steps-quote li::after {
  /* this is the separator between items */
  display: inline-block;
  content: '\00bb';
  margin: 0 .6em;
  color: #959fa5;
}
.cd-breadcrumb-quote li:last-of-type::after, .cd-multi-steps-quote li:last-of-type::after {
  /* hide separator after the last item */
  display: none;
}
.cd-breadcrumb-quote li > *, .cd-multi-steps-quote li > * {
  /* single step */
  display: inline-block;
  font-size: 1.4rem;
  color: #2c3f4c;
}
.cd-breadcrumb-quote li.current > *, .cd-multi-steps-quote li.current > * {
  /* selected step */
  color: #96c03d;
}
.no-touch .cd-breadcrumb-quote a:hover, .no-touch .cd-multi-steps-quote a:hover {
  /* steps already visited */
  color: #96c03d;
}
.cd-breadcrumb-quote.custom-separator li::after, .cd-multi-steps.custom-separator li::after {
  /* replace the default arrow separator with a custom icon */
  content: '';
  height: 16px;
  width: 16px;
  background: url(../img/cd-custom-separator.svg) no-repeat center center;
  vertical-align: middle;
}
.cd-breadcrumb-quote.custom-icons-quote li > *::before, .cd-multi-steps-quote.custom-icons-quote li > *::before {
  /* add a custom icon before each item */
  content: '';
  display: inline-block;
  height: 20px;
  width: 20px;
  margin-right: .4em;
  margin-top: -2px;
  background: url(../img/cd-custom-icons-01.svg) no-repeat 0 0;
  vertical-align: middle;
}
.cd-breadcrumb-quote.custom-icons-quote li:not(.current):nth-of-type(2) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(2) > *::before {
  /* change custom icon using image sprites */
  background-position: -20px 0;
}
.cd-breadcrumb-quote.custom-icons-quote li:not(.current):nth-of-type(3) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(3) > *::before {
  background-position: -40px 0;
}
.cd-breadcrumb-quote.custom-icons-quote li:not(.current):nth-of-type(4) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(4) > *::before {
  background-position: -60px 0;
}
.cd-breadcrumb-quote.custom-icons-quote li.current:first-of-type > *::before, .cd-multi-steps.custom-icons li.current:first-of-type > *::before {
  /* change custom icon for the current item */
  background-position: 0 -20px;
}
.cd-breadcrumb.custom-icons-quote li.current:nth-of-type(2) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(2) > *::before {
  background-position: -20px -20px;
}
.cd-breadcrumb.custom-icons-quote li.current:nth-of-type(3) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(3) > *::before {
  background-position: -40px -20px;
}
.cd-breadcrumb.custom-icons-quote li.current:nth-of-type(4) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(4) > *::before {
  background-position: -60px -20px;
}
@media only screen and (min-width: 1000px) {
  .cd-breadcrumb-quote, .cd-multi-steps {
    padding: 0 1.2em;
  }
  .cd-breadcrumb-quote li, .cd-multi-steps li {
    margin: 1.2em 0;
  }
  .cd-breadcrumb-quote li::after, .cd-multi-steps li::after {
    margin: 0 1em;
  }
  .cd-breadcrumb-quote li > *, .cd-multi-steps li > * {
    font-size: 1.6rem;
  }
}

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

Triangle breadcrumb

-------------------------------- */
@media only screen and (min-width: 1000px) {
  .cd-breadcrumb-quote.triangle-quote {
    /* reset basic style */
    background-color: transparent;
    padding: 0;
  }
  .cd-breadcrumb-quote.triangle-quote li {
    position: relative;
    padding: 0;
    margin: 4px 4px 4px 0;
  }
  .cd-breadcrumb-quote.triangle-quote li:last-of-type {
    margin-right: 0;
  }
  .cd-breadcrumb-quote.triangle-quote li > * {
    position: relative;
    padding: 1em .8em 1em 2.5em;
    color: #2c3f4c;
    background-color: #edeff0;
    /* the border color is used to style its ::after pseudo-element */
    border-color: #edeff0;
  }
  .cd-breadcrumb-quote.triangle-quote li.current > * {
    /* selected step */
    color: #ffffff;
    background-color: #96c03d;
    border-color: #96c03d;
  }
  .cd-breadcrumb-quote.triangle-quote li:first-of-type > * {
    padding-left: 1.6em;
    border-radius: .25em 0 0 .25em;
  }
  .cd-breadcrumb-quote.triangle-quote li:last-of-type > * {
    padding-right: 1.6em;
    border-radius: 0 .25em .25em 0;
  }
  .no-touch .cd-breadcrumb-quote.triangle-quote a:hover {
    /* steps already visited */
    color: #ffffff;
    background-color: #2c3f4c;
    border-color: #2c3f4c;
  }
  .cd-breadcrumb.triangle-quote li::after, .cd-breadcrumb.triangle-quote li > *::after {
    /*
    	li > *::after is the colored triangle after each item
    	li::after is the white separator between two items
    */
    content: '';
    position: absolute;
    top: 0;
    left: 100%;
    content: '';
    height: 0;
    width: 0;
    /* 48px is the height of the <a> element */
    border: 24px solid transparent;
    border-right-width: 0;
    border-left-width: 20px;
  }
  .cd-breadcrumb-quote.triangle-quote li::after {
    /* this is the white separator between two items */
    z-index: 1;
    -webkit-transform: translateX(4px);
    -moz-transform: translateX(4px);
    -ms-transform: translateX(4px);
    -o-transform: translateX(4px);
    transform: translateX(4px);
    border-left-color: #ffffff;
    /* reset style */
    margin: 0;
  }
  .cd-breadcrumb-quote.triangle-quote li > *::after {
    /* this is the colored triangle after each element */
    z-index: 2;
    border-left-color: inherit;
  }
  .cd-breadcrumb-quote.triangle-quote li:last-of-type::after, .cd-breadcrumb-quote.triangle-quote li:last-of-type > *::after {
    /* hide the triangle after the last step */
    display: none;
  }
  .cd-breadcrumb-quote.triangle-quote.custom-separator li::after {
    /* reset style */
    background-image: none;
  }
  .cd-breadcrumb-quote.triangle-quote.custom-icons-quote li::after, .cd-breadcrumb-quote.triangle-quote.custom-icons-quote li > *::after {
    /* 50px is the height of the <a> element */
    border-top-width: 25px;
    border-bottom-width: 25px;
  }

  @-moz-document url-prefix() {
    .cd-breadcrumb-quote.triangle-quote li::after,
    .cd-breadcrumb-quote li > *::after {
      /* fix a bug on Firefix - tooth edge on css triangle */
      border-left-style: dashed;
    }
  }
}
/* --------------------------------

Custom icons hover effects - breadcrumb and multi-steps

-------------------------------- */
@media only screen and (min-width: 1000px) {
  .no-touch .cd-breadcrumb-quote.triangle-quote.custom-icons-quote li:first-of-type a:hover::before, .cd-breadcrumb.triangle.custom-icons li.current:first-of-type em::before, .no-touch .cd-multi-steps.text-center.custom-icons li:first-of-type a:hover::before, .cd-multi-steps.text-center.custom-icons li.current:first-of-type em::before {
    /* change custom icon using image sprites - hover effect or current item */
    background-position: 0 -40px;
  }
  .no-touch .cd-breadcrumb-quote.triangle-quote.custom-icons-quote li:nth-of-type(2) a:hover::before, .cd-breadcrumb-quote.triangle-quote.custom-icons-quote li.current:nth-of-type(2) em::before, .no-touch .cd-multi-steps.text-center.custom-icons li:nth-of-type(2) a:hover::before, .cd-multi-steps.text-center.custom-icons li.current:nth-of-type(2) em::before {
    background-position: -20px -40px;
  }
  .no-touch .cd-breadcrumb-quote.triangle-quote.custom-icons-quote li:nth-of-type(3) a:hover::before, .cd-breadcrumb-quote.triangle-quote.custom-icons-quote li.current:nth-of-type(3) em::before, .no-touch .cd-multi-steps.text-center.custom-icons li:nth-of-type(3) a:hover::before, .cd-multi-steps.text-center.custom-icons li.current:nth-of-type(3) em::before {
    background-position: -40px -40px;
  }
  .no-touch .cd-breadcrumb-quote.triangle-quote.custom-icons-quote li:nth-of-type(4) a:hover::before, .cd-breadcrumb-quote.triangle-quote.custom-icons-quote li.current:nth-of-type(4) em::before, .no-touch .cd-multi-steps.text-center.custom-icons li:nth-of-type(4) a:hover::before, .cd-multi-steps.text-center.custom-icons li.current:nth-of-type(4) em::before {
    background-position: -60px -40px;
  }
}


 /*end kroky*/


 @media only screen and (max-width: 999px) {

.cd-breadcrumb li::after, .cd-multi-steps li::after {
  content: " ";
}

.cd-breadcrumb li > *, .cd-multi-steps li > * {
  /* single step */
  display: inline-block;
  font-size: 1.0rem;
  color: #eee;
  text-decoration: none;
}

.cd-breadcrumb li.current > *, .cd-multi-steps li.current > * {
  color: #fff;
  font-weight: bold;
}

.step_title {
  font-size: 0.8rem;
  text-decoration: none;
}
.step_number {
    font-size: 2.0rem;
    font-family: 'Open Sans', sans-serif;
    font-weight: 200;
    padding-right: 10px;
    text-decoration: none;
}

.step_01_name {
    display: block;
    text-align: center;
    font-size: 1.3rem;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    margin-top: 15px;
    margin-bottom: 40px;


}
.step_03_name {
    display: block;
    text-align: center;
    font-size: 1.3rem;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    margin-top: 15px;
    margin-bottom: 0px;


}
.bordered {
    border-left: 0px solid #d7dbe8;
    border-right: 0px solid #d7dbe8;
}}