/* Global styles
---------------------------
victus grau = #515151 /
              rgb(81, 81, 81)
hell grau 20% = #d8d8d8
            rgb(216, 216, 216)

heller grau 15% = #d8d8d8
(font dunkel grau = #252525)
victus red =  #dd052a
              rgb(221, 5, 42)

---------------------------*/
html, body, .view{
    height: 100%;
}
@media screen and (min-width: 600px) {
  .container-fluid {
    padding-right: 3rem;
    padding-left: 3rem;
  }
}

body {
  color: #515151;
}

body *{
  font-weight: 100;
}

.small {
  font-weight: 100;
  font-size: 90%;
}

a, a:link, a:visited, a:hover, a:active{
  text-decoration: none;
}

/* safari blue border problem */
*:focus {
  outline: 0;
}

/* safari blue border problem */
button:focus {
  outline: 0;
}

a.anchor {
    display: block;
    position: relative;
    top: -100px;
    visibility: hidden;
}


/*---------------------
---- IMPORTANT!!! ----
----------------------*/
.container-fluid {
  max-width: 1200px;
}

.display-1, .display-2,
.display-3, .display-4{
  font-weight: 100;
}

.display-5{
  font-size: 3rem;
  padding: auto;
}

.display-6{
  font-size: 2rem;
  padding: auto;
}

.textsm{
  font-size: 0.9rem;
}

.xscroll{
  overflow-x: scroll;
}

/* --------------------------
      Return to top
---------------------------*/
.cd-top {
  display: inline-block;
  height: 15px;
  width: 35px;
  position: fixed;
  bottom: 40px;
  right: 15px;

  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: url(../_images/cd-top-arrow.svg) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s, background-color .3s 0s;
  transition: opacity .3s 0s, visibility 0s .3s, background-color .3s 0s;
}

.cd-top.cd-top--show,
.cd-top.cd-top--fade-out,
.cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s, background-color .3s 0s;
  transition: opacity .3s 0s, visibility 0s 0s, background-color .3s 0s;
}

.cd-top.cd-top--show {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}

.cd-top.cd-top--fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: .5;
}

.cd-top:hover {
  opacity: 1;
}

@media only screen and (max-width: 991px) {
  .cd-top {
    display: none;
    right: 12px;
    bottom: 40px;
  }
}

/* @media only screen and (min-width: 991px) {
  .cd-top {
    height: 26px;
    width: 60px;
    right: 10px;
    bottom: 40px;
  }
} */

/* --------------------------
      Header & Footer
---------------------------*/

/* Header
---------------------*/
header nav, header nav * {
  font-size: 0.9rem;
}

/* Header-Language button */
.z1035{
  z-index: 1035;
}

div.navbar.navbar-expand-lg.navbar-custom.bg-none,
div.container-fluid.bg-none{
  background-color: transparent;
}

.grey{
  background-color: #d8d8d8;
  color: #515151;
  padding: 0.25rem;
  margin-left:auto;
  margin-right: 0.75rem;
}

.grey:hover{
  color: #fff;
  background-color: #dd052a;
}
/* END Header-Language button*/

/* Header-Nav Bar
---------------------*/
.navbar-custom {
    background-color: #fff;
    text-transform: uppercase;
}

/* change the link color */
.navbar-custom .navbar-nav .nav-link {
    color: #515151;
}

/* change the color of active or hovered links*/
/*.navbar-custom .nav-item.active .nav-link,
 */
.navbar-custom .nav-item:hover .nav-link{
    color: #dd052a;
}


/* change the mobile menu hamburger icon*/
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3c?xml version='1.0' encoding='utf-8'?%3e%3c!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3e%3c!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='30px' height='21px' viewBox='0 0 30 21' enable-background='new 0 0 30 21' xml:space='preserve'%3e%3cline fill='none' stroke='%23515151' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' x1='1' y1='1' x2='29' y2='1'/%3e%3cline fill='none' stroke='%23515151' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' x1='1' y1='20' x2='29' y2='20'/%3e%3cline fill='none' stroke='%23515151' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' x1='1' y1='10.5' x2='29' y2='10.5'/%3e%3c/svg%3e");
}


/* Header-Nav Bar-Dropdown
---------------------------*/

.dropdown-menu-custom {
  padding: 0;
  margin: 0;
  color: #515151;
  background-color: #fff;
  border: 0;
  border-top: 0.25rem solid #dd052a;
  border-radius: 0;
}

.dropdown-menu-custom {
  border-top: 0;
}

.dropdown-item {
  line-height: 2.5;
  color: #515151;
  border: 0;
}

.dropdown-item:hover, .dropdown-item:focus,
 .dropdown-item:active {
  color: #fff;
  font-weight: 400;
  text-decoration: none;
  background-color: #dd052a;
}

/*---- caret right icon ----*/
.dropdown-menu .show > .dropdown-toggle::after{
    transform: rotate(-90deg);
}



a.dropdown-item.psub2{
  padding-left: 10%;
}

a.dropdown-item.psub3{
  padding-left: 15%;
}
/* END Header-Nav Bar-Dropdown
---------------------------*/


/* Header Full Page CAROUSEL
----------------------------*/


.carousel-item.one{
  height: 100vh;
  background-image: url("../_images/home1.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-color: gray;
}
.carousel-item.two{
  height: 100vh;
  background-image: url("../_images/home2.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-color: gray;
}

.carousel-item.three{
  height: 100vh;
  background-image: url("../_images/home3.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-color: gray;
}

.carousel-item.four{
  height: 100vh;
  background: url("../_images/home4.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-color: gray;
}

.carousel-item.five{
  height: 100vh;
  background: url("../_images/home5.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-color: gray;
}

/*---- carousel caption ----*/
.cap-box{
  background-color: rgba(221, 5, 42, .7);
  bottom: 50px;
  padding: 50px 10px;
}

.carousel a, .carousel a:link{
  color: #fff;
  font-weight: 300;
}

.carousel a:hover{
  color: #fff;
  font-weight: 500;
}

/*---- carousel control icon ----*/
.carousel-control-prev .carousel-control-prev-icon.left {
  width: 70px;
  height:120px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='70' height='120'%3E%3Cpath fill='none' stroke='%23FFF' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M49 31L25 60l24 29'/%3E%3C/svg%3E");
}

.carousel-control-next .carousel-control-next-icon.right {
  width: 70px;
  height:120px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='70' height='120'%3E%3Cpath fill='none' stroke='%23FFF' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M25 31l24 29-24 29'/%3E%3C/svg%3E");

}

/* überlegen welche höhe passt, orginal war -10px */
.carousel-indicators li {
    bottom: 15px;

}

/* carousel fade with background image -funktioniert nicht
.carousel.carousel-fade .carousel-item {
    display: block;
    opacity: 0;
    transition: opacity ease-out .7s;
}

.carousel.carousel-fade .carousel-item.active {
    opacity: 1 !important;
} */


/* scroll without bouncing */

.ct-btn-scroll {
    width: 49px;
    height: 49px;
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    margin: auto;
    padding-top: 0px;
    z-index: 9;

    -webkit-transition: background-color 0.25s ease-in-out;
    transition: background-color 0.25s ease-in-out;
}

/* END scroll without bouncing */


/* scroll bouncing */
.downArrow{
	position: absolute;
	bottom: 2%;
	left: 50%;
  margin-left: -28px;
}



.bounce {
	-moz-animation: bounce 3s infinite;
	-webkit-animation: bounce 3s infinite;
	animation: bounce 3s infinite;
}
@-moz-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -moz-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}
@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -moz-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}
/* END scroll bouncing */



/* END Header Full Page CAROUSEL
----------------------------*/

/* breadcrumb
-------------- */
.breadcrumb{
  background-color: inherit;
  padding: 0;
}

.breadcrumb .breadcrumb-item{
  font-size: 0.8rem;

}

.breadcrumb-item a{
  color: #dd052a;
  font-size: 0.8rem;
}

.breadcrumb-item a:hover{
  font-weight: 500;
}

.breadcrumb-item + .breadcrumb-item::before {
  color: #515151;
  content: ">";
}

.breadcrumb-item.active {
  color: #515151;
}

/* hero image
-------------- */
.hero{
  padding-top: 80px;
}

/* END Header
---------------------*/

/* Footer
-----------------------------*/

footer{
  background-color: #515151;
  color: #fff;
  font-size: 0.8rem;
  line-height: 1.8;
}

.menutitle{
  font-weight: 500;
  text-transform:uppercase;
}

footer a, footer a:link,
footer li{
  color: #fff;
}

footer a:hover{
  color: #dd052a;
  font-weight: 700;
}

.imprint{
  background-color: #d8d8d8;
  color: #515151;
  font-size: 0.7rem;
}

.imprint a, .imprint a:link,
.imprint li{
  color: #515151;
}

.imprint a:hover{
  color: #515151;
}


/* END Footer
---------------------------*/


/* END Header & Footer-------
-----------------------------*/



/* --------------------------
------------Main -----------
-----------------------------*/

main a, main a:link{
  color: #dd052a;
  font-weight: 300;
}

main a:hover{
  color: #dd052a;
  font-weight: 500;
}

.title{
  width: fit-content;
  padding-bottom: 20px;
  border-bottom: 5px solid #dd052a;
  margin: auto;
  margin-bottom: 3.5rem;

}

.titlesub{
  width: fit-content;
  padding-bottom: 10px;
  border-bottom: 4px solid #dd052a;
  margin: auto;
  margin-bottom: 3.5rem;

}

.head-margin{
  margin-bottom: 5.5rem;
}

.section-margin{
  margin-bottom: 4rem;
}

/* ----- Side Navigation-lg ---- */
aside {
  position: relative;
}

aside li a, aside li a:link{
  color: #515151;
  font-weight: 300;
}

aside li a:hover{
  color: #dd052a;
}

div.sidenav{
  position: absolute;
  z-index: 100;
  top: 170px;
  right: 10px;
  background-color: #e4e4e4;
  padding: 1rem 1rem;
  font-size: 0.8rem;
  line-height: 1.2;
  width: 20%;
  min-width: 200px;
  box-shadow: 0px 5px 6px -2px rgba(81, 81, 81, 0.4);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}
/* -- CHeCK THIS TRANSITION IF NEEDED -- */

.sidenav .text-nowrap {
	font-weight: 300;
}

.sidenav ul{
    padding: 0 0.8rem;
    margin: 0;
    list-style-type: none;
}

.sidenav ul li{
  margin: 2rem 0;
  font-weight: 300;
}

.sidenav ul li ul li{
  margin: 1.5rem 0;
}

.sidenav ul li ul li ul li{
  margin: 1rem 0;
}

.sidenav li{
    position: relative;
    display: block;
}

.sidenav ul ul {
    position: relative;
    display: none;
}

.sidenav li:hover ul{
    display: block;
}

.sidenav li:hover ul ul{
  position: relative;
  display: none;
}

.sidenav li ul li:hover ul {
    display: block;
    left: 0.8rem;
}
/* ----- END Side Navigation-lg ---- */

/* Equipment Cards */

.card{
  border: 1px solid #d8d8d8;
  /* box-shadow: 3px 5px 6px -3px rgba(81, 81, 81, 0.4); */
}

.w28{
  min-width: 29%;
}

.w44{
  min-width: 44%;
}

.card a img{
  display: block;
  width: 75%;
  margin-left: auto;
  margin-right: auto;
}


.carousel.carousel-fade .carousel-item {
    display: block;
    opacity: 0;
    transition: opacity ease-out 1.7s;
    left: 0;
    top: 0;
    position: absolute;
}
.carousel.carousel-fade .carousel-item.active {
    opacity: 1 !important;
}
.carousel.carousel-fade .carousel-item:first-child {
    top: auto;
    position: relative;
    transition: opacity ease-out 1.7s;
}
.carousel.carousel-fade .carousel-item:second-child {
    top: auto;
    position: relative;
    transition: opacity ease-out 1.7s;
}

/* sealpac traysealer collapse btn */
.mybtn{
  color:inherit;
  font: inherit;
  border: none;
  background-color: #d8d8d8;
  padding: 0.75rem 1.25rem;
  border-radius: 0;
}

.mybtn:hover {
  color: #fff;
  background-color: #515151;
}

.btn-info:focus, .btn-info.focus {
  box-shadow: none;
}

.btn-info.disabled, .btn-info:disabled {
  color: #fff;
  background-color: #fff;
  border-color: none;
}

.btn-info[aria-expanded=true] {
  color: #fff;
  background-color: #515151;
}

.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active,
.show > .btn-info.dropdown-toggle {
  color: #fff;
  background-color: #515151;
  border-color: none;
}

.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus,
.show > .btn-info.dropdown-toggle:focus {
  box-shadow: none;
}

.btn[aria-expanded=false] span:before {
  content: "+";
  float: right;
  transition: all .5s;
  /* -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    transform: rotate(90deg); */
}

.btn[aria-expanded=true] span:before {
  content: "-";
  float: right;
  transition: all .5s;
  /* -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    transform: rotate(270deg); */
}

/* clean room table */
.table{
  font-size: 0.9rem;
}

.table-border {
  border: none;
}

.table.table-border td {

  border-top: 1px solid #d8d8d8;
  border-bottom: 1px solid #d8d8d8;
}

.thead-gray{
  background-color: #d8d8d8;
}

tr.td-red{
  color: #fff;
  background-color: #dd052a;
}

.txt-red{
  color: #dd052a;
  font-size: 1.5rem;
}

.news-img {
  position: relative;
  text-align: right;
  color: white;
}

.news-title {
  position: absolute;
  bottom: 1rem;
  right: 1rem;
  padding: 0.5rem 1rem ;
  background-color: rgba(0, 0, 0, 0.3);
}

.newsbtn{
  font: inherit;
  font-weight: 300;
  background-color: #dd052a;
  color: #fff;
  padding: 0.75rem 1.25rem;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

.newsbtn:hover {
  font-weight: bold;
  color: #fff;
  background-color: #dd052a;
}

.newsbtn:focus, .newsbtn.focus {
  box-shadow: none;
}

/* END Main -----------------
-----------------------------*/




/* -----------------------------------
-----------media inquiries------------
-------------------------------------*/

@media (max-width: 575px) {
  .card{
    border: none;
  }
}

@media (max-width: 768px) {
  .head-margin{
    margin-bottom: 3rem;
  }
  .display-3{
    font-size: 3.5rem;
  }
  .display-5{
    font-size: 2.5rem;
  }
  .display-6{
    font-size: 1.5rem;
  }

  .w28, .w44{
    margin: 0 -15px;
  }
}

@media (max-width: 991px) {
    /*partial fix of nav fixed-top scroll max-height:100vh, max-height:80vh fixed it*/
    .navbar .navbar-collapse.in {
          max-height: 80vh !important;
          overflow-y: scroll !important;
          overflow-x: hidden !important;
    }

}

@media (min-width: 992px) {
      .dropdown-menu-custom {
        box-shadow: 0px 5px 6px -2px rgba(81, 81, 81, 0.4);
      }

      .text-lg-nowrap {
        white-space: nowrap!important;
      }

      /* ---- hide caret ----*/
      /* li.hidecaret .dropdown-toggle::after{
          border: 0;
      } */

      /* Carousel Caption Box*/
      .cap-box{
        /* width: 580px; */
        padding: 50px;
        right: auto;
        left: auto;
        bottom: 100px;
        /* padding: 50px; */
        text-align: left;
      }


      /*---- carousel control icon ----*/
      .carousel-control-prev .carousel-control-prev-icon.left {
        margin-left: -80%;
      }

      .carousel-control-next .carousel-control-next-icon.right {
        margin-right: -80%;
      }

      /* ---- News & Events Line ---- */
      .row.vdivide [class*='col-md-8']:after {
        background: #e0e0e0;
        width: 1px;
        content: "";
        display:block;
        position: absolute;
        top:0;
        bottom: 0;
        right: 0;
        min-height: 70px;
        margin-bottom: -48px;
      }

}

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

TIMELINE

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

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

Primary style

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


/* a {
  color: #acb7c0;
  text-decoration: none;
} */

/* img {
  max-width: 50%;

} */

/* h1, h2 {
  font-family: "Open Sans", sans-serif;
  font-weight: bold;
} */

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

Patterns - reusable parts of our design

-------------------------------- */
@media only screen and (min-width: 788px) {
  .cd-is-hidden {
    visibility: hidden;
  }
}

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

Vertical Timeline - by CodyHouse.co

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

.cd-timeline {
  overflow: hidden;
  /* margin: 2em auto;
  padding-top: 3em;
  background-color: yellow; * color UKINUTI */
}

.cd-timeline__container {
  position: relative;
  width: 90%;              /* CHeCK*/
  max-width: 1200px;
  margin: 0 auto 4em;         /* CHeCK*/
  padding: 2em 0;
  /* background-color: blue;  color UKINUTI*/
}

.cd-timeline__container::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  height: 100%;
  width: 0.15em;
  background: #dd052a;
}

@media only screen and (min-width: 788px) {
  .cd-timeline {
    margin: 0;
  }
  /* .cd-timeline__container::before {
    left: 50%;
    margin-left: -2px;
  }*/
}

.cd-timeline__block {
  position: relative;
  margin: 10em 0;
  padding-top: 4em;
  /* background-color: green;  color UKINUTI*/
}

.cd-timeline__block:after {
  /* clearfix */
  content: "";
  display: table;
  clear: both;
}

.cd-timeline__block:first-child {
  margin-top: 0;
}

.cd-timeline__block:last-child {
  margin-bottom: 0;
}

/* @media only screen and (min-width: 788px) {
  .cd-timeline__block {
    margin: 0;
  }
} */

.cd-timeline__year {
  position: absolute;
  top: 0em;
  left: 50%;
  margin-left: -50px;
  width: auto;
  height: auto;
  background-color: white;    /* color UKINUTI*/
  font-size: 2.5rem;
  padding: 0 0.3rem;
}

.cd-timeline__year {
  /* Force Hardware Acceleration */
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}
.cd-timeline__year.cd-timeline__year--bounce-in {
  visibility: visible;
  -webkit-animation: cd-bounce-1 0.6s;
          animation: cd-bounce-1 0.6s;
}

/* .cd-timeline__year img {
  display: block;
  width: 28px;
  height: 12px;
  position: relative;
  left: 50%;
  top: 50%;
  margin-left: -12px;
  margin-top: -12px;
} */

/* .cd-timeline__year.cd-timeline__year--picture {
  background: #75ce66;
}

.cd-timeline__year.cd-timeline__year--movie {
  background: #c03b44;
}

.cd-timeline__year.cd-timeline__year--location {
  background: #f0ca45;
} */

/* @media only screen and (min-width: 788px) {
  .cd-timeline__year {
    left: 50%;
    margin-left: -50px;
    /* Force Hardware Acceleration
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
  }*/
  /* .cd-timeline__year.cd-timeline__year--bounce-in {
    visibility: visible;
    -webkit-animation: cd-bounce-1 0.6s;
            animation: cd-bounce-1 0.6s;
  }
} */

@-webkit-keyframes cd-bounce-1 {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes cd-bounce-1 {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

.cd-timeline__content {
  position: relative;
  /* margin-left: 60px; */
  background: white;
  margin-top: 1em;
  text-align: justify;
  /* padding: 1.6em;
  -webkit-box-shadow: 0 3px 0 #d7e4ed;
          box-shadow: 0 3px 0 #d7e4ed; */
}

.cd-timeline__content:after {
  /* clearfix */
  content: "";
  display: table;
  clear: both;
}

/* TREBA UKINUTI
.cd-timeline__content::before {
  /* triangle next to content block
  content: '';
  position: absolute;
  top: 16px;
  right: 100%;
  height: 0;
  width: 0;
  border: 7px solid transparent;
  border-right: 7px solid white;
} */

.cd-timeline__content h2 {
  color: purple;      /* color UKINUTI ili promijeniti*/
}

/* .cd-timeline__content p,
.cd-timeline__img {
  font-size: 1rem;        /* provjeriti
} */

/* .cd-timeline__content p {    /* provjeriti
  margin: 1em 0;
  line-height: 1.6;
} */

/* VjeroVATNO UKINUTI
 .cd-timeline__read-more,
.cd-timeline__img {
  display: inline-block;
}

.cd-timeline__read-more {
  float: right;
  padding: .8em 1em;
  background: #acb7c0;
  color: white;
  border-radius: 0.25em;
}

.cd-timeline__read-more:hover {
  background-color: #bac4cb;
}
*/
.cd-timeline__img {
  display: block;
  margin: 0 auto;
  float: none;
  padding: 0;
  max-width: 80%;
}

.cd-timeline__imgh {
  display: block;
  margin: 0 auto;
  float: none;
  padding: 0;
  max-height: 80%;


}

/* @media only screen and (min-width: 768px) {
  .cd-timeline__content h2 {
    font-size: 2rem;
  }
  .cd-timeline__content p {
    font-size: 1.6rem;
  }
  .cd-timeline__read-more,
  .cd-timeline__img {
    font-size: 1.4rem;
  }
} */

@media only screen and (min-width: 788px) {
  .cd-timeline__content {
    margin-left: 0;
    margin-top: 0;
    /* padding: 1.6em; */
    width: 45%;
    text-align: right;
    /* Force Hardware Acceleration */
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
  }
  .cd-timeline__content::before {
    top: 24px;
    left: 100%;
    /* border-color: transparent;
    border-left-color: white; */
  }
  /* VjeroVATNO UKINUTI
  .cd-timeline__read-more {
    float: left;
  }*/
  .cd-timeline__img {
    position: absolute;
    width: 100%;
    left: 122%;
    top: 0px;
  }

  .cd-timeline__imgh {
    position: absolute;
    height: 100%;
    left: 122%;
    top: 0px;
  }

  .cd-timeline__block:nth-child(even) .cd-timeline__content {
    float: right;
  }
  /* VjeroVATNO UKINUTI
  .cd-timeline__block:nth-child(even) .cd-timeline__content::before {
    top: 24px;
    left: auto;
    right: 100%;
    border-color: transparent;
    border-right-color: white;
    background-color: black;
  } */
  /* VjeroVATNO UKINUTI
  .cd-timeline__block:nth-child(even) .cd-timeline__read-more {
    float: right;
  } */
  .cd-timeline__block:nth-child(even) .cd-timeline__img {
    left: auto;
    right: 122%;
    text-align: right;        /* promijeniti date u image */
  }

  .cd-timeline__block:nth-child(even) .cd-timeline__imgh {
    left: auto;
    right: 122%;
    text-align: right;        /* promijeniti date u image */
  }

  .cd-timeline__block:nth-child(even) .cd-timeline__content {
    text-align: left;        /* ja dodala */
  }

  .cd-timeline__content.cd-timeline__content--bounce-in {
    visibility: visible;
    -webkit-animation: cd-bounce-2 0.6s;
            animation: cd-bounce-2 0.6s;
  }
}

@media only screen and (min-width: 788px) {
  /* inverse bounce effect on even content blocks */
  .cd-timeline__block:nth-child(even) .cd-timeline__content.cd-timeline__content--bounce-in {
    -webkit-animation: cd-bounce-2-inverse 0.6s;
            animation: cd-bounce-2-inverse 0.6s;
  }
}

@-webkit-keyframes cd-bounce-2 {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px);
  }
  60% {
    opacity: 1;
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@keyframes cd-bounce-2 {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px);
  }
  60% {
    opacity: 1;
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@-webkit-keyframes cd-bounce-2-inverse {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100px);
            transform: translateX(100px);
  }
  60% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
            transform: translateX(-20px);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@keyframes cd-bounce-2-inverse {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100px);
            transform: translateX(100px);
  }
  60% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
            transform: translateX(-20px);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}