body, html{
  font-family: 'Poppins', sans-serif;
  font-size: 100%;
  margin: 0;
  padding: 0;
}

a:hover {
  text-decoration: none !important;
}

.wrapper {
  padding-bottom: 10.417vw;
}

/* White background*/
.background{
  align-content: center;
  background-color: white;
  height: fit-content;
  position: relative;
  width: 100%;
  
}
.content{
  background-color: white;
  height: fit-content;
  margin: auto;
  width: auto;
}

/* Grey background*/
.background1{
  align-content: center;
  background-color: #F5F5F5;
  height: fit-content;
  position: relative;
  width: 100%;
  
}
.content1{
  background-color: #0E0E0E;
  height: fit-content;
  margin: auto;
  width: auto;
}

/* Black background*/
.background2{
  align-content: center;
  background-color: #0E0E0E;
  height: fit-content;
  position: relative;
  width: 100%;
  
}
.content2{
  background-color: white;
  height: fit-content;
  margin: auto;
  width: auto;
}

/* Header background*/
.content-box{
  background-color: white;
  height: fit-content;
  margin-left: 7.292vw;/*140px*/
  margin-right: 7.292vw;
  width: auto;
}

/* HEADER */
.header{
  display: grid; 
  gap: 0px 0px; 
  grid-template-columns: 1fr 1fr 1fr; 
  grid-template-rows: fit-content fit-content; 
  margin: auto auto auto auto;/*67px*/
  padding-top: 3.490vw;
  width: auto;
  grid-template-areas: 
    ". header email"
    ". branch ."; 
}

.header .designerio{
  align-self: start; 
  display: inline;
  font-family: 'Poppins', sans-serif;
  font-size: 1.667vw;
  font-weight: 400;
  grid-area: header;
  justify-self: center; 
  margin:  0px 0px 0px 0px;
}

.header p.branch{
  align-self: start; 
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 400;
  grid-area: branch; 
  justify-self: center; 
  margin: 0px 0px 0px 0px;
}

.header p.email{
  align-self: start; 
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  font-size: 0.938vw;
  font-weight: 300;
  grid-area: email; 
  justify-self: end; 
  margin: 0px 0px 0px 0px;
}

/* MENU NAV BAR */
.menu-bar{
  justify-content: center;
  padding-bottom: 1.042vw;
  margin-top: 0.885vw;
}

.menu-bar ul {
  background-color: transparent;
  display: flex;
  justify-content: center;
  list-style-type: none;
  margin: 0;
  overflow: hidden;
  padding: 0;
}

.menu-bar li a {
  color: #000000;
  cursor: pointer;
  display: block;
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 300;
  padding: 0px 0.521vw;
  text-align: center;
  text-decoration: none;
  width: 13.542vw;/*260*/
}

.menu-bar li a:hover, #menu-btn:hover{
  font-weight: 400;
}

.menu-bar li .menu-btn{
  font-weight: 300;
}

.menu-bar li .menu-btn-active{
  font-weight: 400;
}

/* SIDENAV Paslaugos menu */
.curtains{
  animation-duration: 1s;
  animation-name: Lighte;
  background-color: #000000!important;
  opacity:1;
  position: relative;
  z-index: 1;
}

body{
  background-color: #000000;
}

.curtains-active{
  animation-duration: 1s;
  animation-name: Darke;
  background-color: #000000!important;
  height: 100%;
  opacity:0.3;
  overflow:auto;
  position: absolute;
  position: fixed;
  width: 100%;
  z-index: 1;
}

@keyframes Darke {
  0% {opacity:0;}
  100% {opacity:0.3;}
}

@keyframes Lighte {
  0% {opacity:0.3;}
  100% {opacity:0;}
}

.sidenav {
  background-color: #FFFFFF;
  height: 100vh;
  margin-left: 7.188vw;
  overflow-x: hidden;
  padding-top: 3.802vw;
  position: fixed;
  right: 0;
  top: 0;
  transition: 0.5s;
  width: 0;
  z-index: 100;
}

#sidenav-header{
  font-family: 'Poppins', sans-serif;
  font-size: 3.125vw;
  font-weight: 400;
  margin-bottom: 2.344vw;
  margin-left: 7.188vw;
}

.sidenav #link {
  color: #000000;
  display: block;
  font-size: 1.042vw;
  font-weight: 300;
  padding: 0px 0px 2.604vw 7.188vw;
  text-decoration: none;
  transition: 0.3s;
}

#link:hover{
  font-weight: 400;
}

.sidenav .blog-btn-primary a{
  color: white;
  font-family: 'Poppins', sans-serif;
  font-size: 1.250vw;
  font-weight: 400;
  margin: auto;
  text-decoration: none;
  transition: color 0.3s ease-in; 
}

.sidenav #link-active{
  color: #000000;
  cursor: default;
  display: block;
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 400;
  padding: 0px 0px 2.604vw 7.188vw;
  text-decoration: none;
}

.sidenav-btn-box{
  background-color: #000000;
  border-radius: 1.354vw;
  border: 0.026vw #000000 solid;
  cursor: pointer;
  display: flex;
  height: 4.010vw;
  margin-left: 7.188vw;
  text-align: center;
  transition: background-color 0.3s ease-in;
  width: 15.729vw;
}

.sidenav a:hover {
  font-weight: 400;
}

.sidenav .closebtn {
  color: #000000;
  font-family: 'Poppins', sans-serif;
  font-size: 1.250vw;
  font-weight: 400;
  left: 34vw;
  margin-right: 7.292vw;
  position: relative;
  text-decoration: none;
  top: 0vw;
  
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 0.781vw;}
  .sidenav a {font-size: 0.938vw;}
}

.sidenav-btn-box .btn-btn-primary{
  color: white;
  font-family: 'Poppins', sans-serif;
  font-size: 1.250vw;
  font-weight: 400;
  margin: auto;
  text-decoration: none;
  transition: color 0.3s ease-in; 
}

.sidenav-btn-box:hover > .btn-btn-primary{
  background-color: transparent;
  color: #0E0E0E;
}

.sidenav-btn-box:hover{
  background-color: transparent;

}

.sidenav-btn-box{
  background-color: #000000;
  border-radius: 1.354vw;
  border: 0.026vw #000000 solid;
  cursor: pointer;
  display: flex;
  height: 4.010vw;
  margin-left: 7.188vw;
  text-align: center;
  transition: background-color 0.3s ease-in;
  width: 15.729vw;
}

/* Section Title in Main page */ 
.main-header-title {
  grid-area: 1 / 1 / 2 / 3;
  font-family: 'Poppins', sans-serif;
  font-size: 3.125vw;
  font-weight: 400;
  margin-bottom: 6.250vw;
  margin-top: 6.250vw;
  text-align: center;
}

/* MAIN PHOTO */
.main-photo{
  background-image: url("../images/web-slider-new.png");
  background-position: center; 
  background-size:cover;
  display: flex;
  grid-column-gap: 0px;
  grid-row-gap: 0px; 
  height: 100%;
  width: 100%;
}

.image-box{
  height: 100%;
  width: 100%;
}

.responsive-slider{
  height: 100%;
  width: 100%;
}

.head-text-box{
  color: #F9F9F9;
  display: inline-block;
  font-family: 'Poppins', sans-serif;
  font-size: 2.969vw;
  font-weight: 400;
  line-height: 4.167vw;
}


.text-border{
  display: flex;
  height: 16.8vw;
  justify-content: center;
  left: 17.448vw;
  width: 23.958vw;
}

.border-img{
  height: 15.156vw;
  width: 23.958vw;
}

.text-box{
  color: #F9F9F9;
  display: block;
  font-family: 'Poppins', sans-serif;
  font-size: 1.389vw;
  font-weight: 300;
  margin-top: 1.042vw;
  width: 25vw;
}

/* SERVICES Main page*/
.services{
  align-content: center;
  display: flex;
  margin: auto;
  width: fit-content;
}
  

.content-box2{
  height: fit-content;
  margin: auto;
  margin-bottom:4.844vw;/*93px*/
  width: 56.667vw;/*1088*/
}

.cards{
  height: fit-content;
}

.list-wrapper {
  position:relative;
}

.list-item-wrapper {
  margin-bottom:4.479vw;/*86*/
  position:relative;
}

.card {
  --vw: Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);
  border-color: #000000;
  border-radius: 1.563vw;/*30px*/
  border-style: solid;
  border-width: 0.026vw;
  height: 17.135vw;/*329*/
  margin-right: 0px;
  margin: auto;
  width: 42.292vw;/*812px*/
  opacity: 0;
}

.card.fade-in {
  opacity: 1;
  margin-top: 0; /* Set margin to 0 when the "fade-in" class is added */
}

  
.card-body {
  border-radius: 1.563vw;
  display:table;
/*  padding-bottom: 2.25vw;*/
  padding-left: 2.604vw;
  padding-right: 2.604vw;
  transition: background-color 0.3s ease-in;
  vertical-align:middle;
  height: inherit;
}

.card-body:hover{
  background-color: #000000;
}

.card-body:hover > .card-title, .card-body:hover > .card-text
{
  color: #FFFFFF;
}

.card-body:hover > .btn-box{
  background-color: #FFFFFF;
}

.card-title {
  color: #000000;
  font-family: 'Poppins', sans-serif;
  font-size: 1.667vw;/*32px*/
  font-weight: 400;
  margin-bottom: 1.302vw;
  margin-top: 2.552vw;/*49px*/
  transition: color 0.3s ease-in;
}

.card-text {
  color: #000000;
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;/*20px*/
  font-weight: 300;
  margin-bottom: 1.302vw;/*25*/
  margin-top: 0px;
  transition: color 0.3s ease-in;
}

.btn-box{
  background-color: #000000;
  border-radius: 1.354vw;/*26px*/
  border: 0.026vw #000000 solid;
  cursor: pointer;
  display: flex;
  height: 4.010vw;/*77px*/
  text-align: center;
  transition: background-color 0.3s ease-in;
  width: 15.729vw;/*302px*/
}

.btn-box:hover{
  background-color: #FFFFFF;

}

.btn-btn-primary{
  color: white;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  font-size: 1.250vw;/*24*/
  font-weight: 400;
  margin: auto;
  text-decoration: none;
  transition: color 0.3s ease-in;
}

.btn-box:hover > .btn-btn-primary{
  background-color: transparent;
  color: #0E0E0E;
}

.card-body:hover > .btn-box .btn-btn-primary
{
  background-color: transparent;
  color: #0E0E0E;
}

/*Main page line and bullets*/
.list-bullet {
  background:#b4b4b4;
  border-radius:5.208vw;
  bottom: 0px;
  float: left;
  height:1.042vw;/*20px*/
  left: 0px;
  line-height:1.563vw;
  margin-right:1.042vw;
  position: absolute;
  width:1.042vw;
}

.black-line {
  background:#F5F5F5;
  float:left;
  height:17.135vw;
  margin-left:0.495vw; /*10px*/
  position: absolute;
  top: 0px;
  width:0.1vw;
}

.black-line2 {
  background:#F5F5F5;
  float:left;
  height:126%;
  margin-left:0.495vw;
  position: absolute;
  top: 0px;
  width:0.1vw;
}

/* BLOG Main page*/
.blog-index{
  align-items: center;
  background-color: #F5F5F5;
  display: flex;
}

.blog-content-index{
  display: grid;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-columns: repeat(2, auto);
  grid-template-rows: repeat(3, auto);
  height: fit-content;
  margin: auto;
  width: 56.667vw;
}

.blog-card-index {
  color: #000000;
  text-decoration: none;
}

.blog-card-index:hover .blog-card-header-index,
.blog-card-index:hover .blog-date-index,
.blog-card-index:hover .blog-text-index {
  color: #555555;
}

.blog-card-index:hover .blog-photo-index {
  border: 0.104vw solid #555555;
}

.blog-card-body1-index {
  grid-area: 2 / 1 / 3 / 2;
  cursor: pointer;
  height: fit-content;
  width: 25.156vw;
}
.blog-card-body2-index {
  grid-area: 2 / 2 / 3 / 3;
  cursor: pointer;
  height: fit-content;
  margin-left: auto;
  width: 25.156vw;
} 
.blog-btn-box-index{
  grid-area: 3 / 1 / 4 / 3;
}
.blog-photo-index{
  background-color: transparent;
  border-radius: 1.563vw;
  height: 10.417vw;
  width: 25vw;
}
.blog-photo-index img{
  border-radius: 1.563vw;
}
.blog-card-body1-index a:visited {
  color: #000000;
  text-decoration: none;
}
.blog-card-body2-index a:visited {
  color: #000000;
  text-decoration: none;
}
.blog-date-index{
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 300;
  margin-bottom: 1.146vw;
  margin-top: 1.146vw;
  text-align: left;
}
.blog-card-header-index{
  font-family: 'Poppins', sans-serif;
  font-size: 1.667vw;
  font-weight: 400;
  margin-bottom: 1.146vw;
  text-align: left;
}
.blog-text-index{
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 300;
  text-align: left;
}
.blog-btn-box-index{
  background-color: #000000;
  border-radius: 1.354vw;
  border: 0.026vw solid #000000;
  cursor: pointer;
  display: inline-flex;
  height: 4.010vw;
  margin: auto;
  margin-bottom:10.417vw;
  margin-top: 2.604vw;
  text-align: center;
  transition: color 0.3s ease-in;
  width: 15.729vw;
    
}
.blog-btn-box-index:hover{
  background-color: transparent;
}

.blog-btn-primary-index{
  color: white;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  font-size: 1.250vw;
  font-weight: 400;
  margin: auto;
  text-align: center;
  text-decoration: none;
  transition: background-color 0.3s ease-in;
}

.blog-btn-box-index:hover > .blog-btn-primary-index{
  background-color: transparent;
  color: #0E0E0E;
}

/* ARTICLE */
.article-box{
  display: flex;
  justify-content: center;
  background-color: #F5F5F5;
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: repeat(4, auto);
  grid-column-gap: 0px;
  grid-row-gap: 0px; 
}

.article-header{
  grid-area: 1 / 1 / 2 / 2;
  margin: auto;
  margin-top: 6.250vw;
  width: 49.479vw;
  margin-bottom: 1.563vw;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 3.125vw;
  text-align: center;
}

.article-photo{
  grid-area: 3 / 1 / 4 / 2;
  margin: auto;
  width: 49.479vw;
  height: 20.625vw;
  border-radius: 1.563vw;
  margin-bottom: 3.333vw;
}

.article-date{
  grid-area: 2 / 1 / 3 / 2;
  margin: auto;
  margin-bottom: 1.563vw;
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 1.042vw;
  text-align: center;
}

.article{
  grid-area: 4 / 1 / 5 / 2;
  margin: auto;
  width: 49.479vw;
  margin-bottom: 9.375vw;
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 1.042vw;
  text-align: left;
  line-height: 1.5;
}

.article > h1{
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 2.292vw;
}
/* BLOG */
.blog-article{
  display: flex;
  align-content: center;
  background-color: #FFFFFF;
}
.blog-content-article{
  width: 56.667vw;
  margin: auto;
  margin-bottom: 11.250vw;
  height: fit-content;
  display: grid;
  grid-template-columns: repeat(2, auto);
  grid-template-rows: repeat(2, auto);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
}
  
.blog-header-article {
  grid-area: 1 / 1 / 2 / 3;
  margin: auto;
  margin-top: 10.417vw;
  margin-bottom: 4.479vw;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 3.125vw;
  text-align: center;
}

.blog-card-body1-article {
  grid-area: 2 / 1 / 3 / 2;
  width: 25.156vw;
  height: fit-content;
}

.blog-card-body2-article {
  grid-area: 2 / 2 / 3 / 3;
  width: 25.156vw;
  height: fit-content;
  margin-left: auto;
} 

.blog-btn-box-article{
  grid-area: 3 / 1 / 4 / 3;
}

.blog-photo-article{
  width: 25vw;
  height: 10.417vw;
  background-color: transparent;
  border-radius: 1.563vw;
}

.blog-date-article{
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 1.042vw;
  margin-top: 1.146vw;
  margin-bottom: 1.146vw;
  text-align: left;
}
.blog-card-header-article{
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 1.667vw;
  margin-bottom: 1.146vw;
  text-align: left;
}
.blog-text-article{
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 1.042vw;
  text-align: left;
}
.blog-btn-box-article{
  display: inline-flex;
  background-color: #000000;
  border-radius: 1.354vw;
  width: 15.729vw;
  height: 4.010vw;
  text-align: center;
  margin: auto;
  margin-top: 4.479vw;
  margin-bottom: 10.417vw;
}

.blog-card-body1-article a:visited {
  text-decoration: none;
  color: #000000;
}
.blog-card-body2-article a:visited {
  text-decoration: none;
  color: #000000;
}

/* REPETITIVE ELEMENTS */ 

/* Page Title Headers */
.page-title{
  color: #000000;
  font-family: 'Poppins', sans-serif;
  font-size: 3.125vw;
  font-weight: 400;
  margin-bottom: 6.250vw;
  padding-top: 6.250vw;
  text-align: center;
}

.service-page-title{
  color: #000000;
  font-family: 'Poppins', sans-serif;
  font-size: 3.125vw;
  font-weight: 400;
  margin-bottom: 1.563vw;
  margin-top: 0;
  text-align: center;
}

.services-text{
  grid-area: 3 / 1 / 4 / 2;
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 1.042vw;
  color: #000000;
  text-align: center;
  margin-bottom: 3.385vw;
  width: 55.417vw;
  margin-left: auto;
  margin-right: auto;
}

/* Paslaugų puslapių background + nav-bar */
.style{
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: repeat(4, auto);
  grid-column-gap: 0px;
  grid-row-gap: 0px; 
  align-content: center;
  background-color: transparent;
  width: 71.042vw;
  margin: auto;
}

.style-print{
  display: grid;
  grid-template-columns: repeat(1, auto);
  grid-template-rows: repeat(4, auto);
  grid-column-gap: 0px;
  grid-row-gap: 0px; 
  align-content: center;
  background-color: transparent;
  width: 71.042vw;
  margin-left: auto;
  margin-right:auto;
}

.services-content{
  align-content: center;
  background-color: transparent;
  display: grid;
  grid-column-gap: 0px;
  grid-row-gap: 0px; 
  grid-template-columns: auto;
  grid-template-rows: repeat(4, auto);
  margin: auto;
  width: 71.042vw;
}

.services-nav-bar{
  display: block;
  grid-area: 1 / 1 / 2 / 2;
}

.services-nav-bar li a{
  color: #000000;
  cursor: pointer;
  display: block;
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 300;
  margin-right: 2.083vw;
  margin-top: 4.167vw;
  margin-bottom: 4.167vw;
}

.services-nav-bar li a:hover{
  font-weight: 400;
}

.services-nav-bar ul{
  background-color: transparent;
  cursor: pointer;
  display: flex;
  justify-content: left;
  list-style-type: none;
  overflow: hidden;
  padding: 0;
  will-change: transform;
}

.services-nav-bar li a::before{
  content: attr(title);
  display: block;
  font-weight: bold;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

/* Paslaugų puslapių button */
.form-btn-primary{
  color: white;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  font-size: 1.250vw;
  font-weight: 400;
  margin: auto;
  text-decoration: none;
  transition: color 0.2s ease-in;
}


/* ABOUTME designerio.lt/apie-mus */
.about-me{
  align-content: center;
  background-color: transparent;
  display: grid;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-columns: repeat(2, auto);
  grid-template-rows: repeat(2, auto);
  margin: auto;
  width: 59.271vw;
}
*, ::after, ::before {
  box-sizing: content-box;
}

.aboutme-text{
  grid-area: 2 / 1 / 3 / 2;
  width: 24.219vw;
}

.aboutme-text .in-submit{
  grid-area: 5 / 1 / 6 / 3;
  background-color: #000000;
  border-radius: 1.354vw;
  border: 0.026vw #000000 solid;
  cursor: pointer;
  display: inline-flex;
  height: 4.010vw;
  margin: auto;
  margin-bottom: 10.417vw;
  margin-top: 2.604vw;
  text-align: center;
  text-decoration: none;
  transition: background-color 0.2s ease-in;
  width: 15.729vw;
}

.aboutme-text .in-submit:hover > .form-btn-primary{
  background-color: transparent;
  color: #0E0E0E;
  text-decoration: none;
}

.aboutme-text .in-submit:hover{
  background-color: transparent;

}
.aboutme-hello{
  font-family: 'Poppins', sans-serif;
  font-size: 1.250vw;
  font-weight: 300;
  margin-bottom: 1.823vw;
  text-decoration: none;
}

.aboutme-paragraph{
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 300;
  text-decoration: none;
}


/* LOGO designerio.lt/logotipu-kurimas & package*/
.logo-package-nav-bar{
  grid-area: 1 / 1 / 2 / 2;
}

.logo-package-nav-bar li a{
  display: block;
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 1.042vw;
  margin-right: 2.083vw;
  color: #000000;
  text-decoration: none;
}

.logo-package-nav-bar li a:hover{
font-weight: 400;
}

.logo-package-nav-bar ul{
  list-style-type: none;
  margin: 0;
  margin-top: 4.479vw;
  margin-bottom: 4.479vw;
  padding: 0;
  overflow: hidden;
  background-color: transparent;
  display: flex;
  justify-content: left;
  will-change: transform;
}
.logo-package-nav-bar li a::before{
  display: block;
  content: attr(title);
  font-weight: bold;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

.logo-cards-box{
  grid-area: 4 / 1 / 5 / 2;
  display: grid;
  grid-template-columns: repeat(2, auto);
  grid-template-rows: auto;
  grid-column-gap: 0px;
  grid-row-gap: 0px; 
  width: 46.458vw;
  margin-left: auto;
  margin-right: auto;
}

.card1-logo{
  grid-area: 1 / 1 / 2 / 2;
}

.card2-logo{
  grid-area: 1 / 2 / 2 / 3;
  margin-left: auto;
}

.card3{
  grid-area: 1 / 2 / 3 / 4;
  margin-left: auto;
}

#card-logo{
  width: 21.875vw;
  border: 0.052vw solid #000000;
  border-radius: 1.563vw;
  height: fit-content;
  animation-duration: 1s;
}

.card-icon-package{
  justify-content: center;
  display: flex;
  margin-top: 2.865vw;
  margin-bottom: 2.865vw;
}

.card-icon-label{
  justify-content: center;
  display: flex;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2.083vw;
  margin-bottom: 2.083vw;
}

.label-title{
  color: #000000;
  font-family: 'Poppins', sans-serif;
  font-size: 3.125vw;
  font-weight: 400;
  margin-bottom: 3.385vw;
  margin-top: 0;
  text-align: center;
}

#card-logo .in-submit{
  display: flex;
  background-color: #000000;
  border-radius: 1.354vw;
  width: 15.729vw;
  height: 4.010vw;
  text-align: center;
  margin: auto;
  border: 0.026vw #000000 solid;
  margin-bottom: 2.083vw;
  margin-left: auto;
  margin-right: auto;
  transition: background-color 0.2s ease-in;
  cursor: pointer;
}

#card-logo .in-submit:hover > .form-btn-primary, #style-card-middle .in-submit:hover > .form-btn-primary{
  background-color: transparent;
  color: #0E0E0E;
}

#card-logo .in-submit:hover, #style-card-middle .in-submit:hover{
  background-color: transparent;
}

.label-cards-box{
  grid-area: 3 / 1 / 4 / 2;
  display: grid;
  grid-template-columns: repeat(1, auto);
  grid-template-rows: auto;
  grid-column-gap: 0px;
  grid-row-gap: 0px; 
  width: 21.875vw;
  margin-left: auto;
  margin-right: auto;
}


/*Brandbook Stiliaus knyga*/
.brandbook-cards-box-logo{
  grid-area: 4 / 1 / 5 / 2;
  display: grid;
  grid-template-columns: repeat(3, min-content);
  grid-template-rows: repeat(2, auto);
  grid-column-gap: 2.604vw;
  grid-row-gap: 0px;
  width: 71.042vw;
  margin-left: auto;
  margin-right: auto;
}

.card-icon-brandbook{
  height: 5.208vw;
  width: 13.177vw;
  display: flex;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2.083vw;
  margin-bottom: 2.083vw;
}


.brandbook-note-logo{
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 0.938vw;
  color: #000000;
  text-align: left;
  margin-top: 3.385vw;
  width: 37.708vw;
}



/* DIGITAL DESIGN designerio.lt/skaitmeninis-dizainas + PRINT /spaudos-maketavimas */
.print-nav-bar{
  grid-area: 1 / 1 / 2 / 2;
  display: grid;
  margin-top: 4.167vw;
  grid-template-columns: repeat(1, auto);
  grid-template-rows: repeat(2, auto);
  grid-column-gap: 0px;
  grid-row-gap: 0px; 
  align-content:flex-start;
  cursor: pointer;
}

.print-nav-bar li a{
  display: block;
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 1.042vw;
  margin-right: 2.083vw;
  color: #000000;
  text-decoration: none;
}

.print-nav-bar li a:hover{
  font-weight: 400;
}

.print-nav-bar li a::before{
  display: block;
  content: attr(title);
  font-weight: bold;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

.print-nav-bar ul{
  list-style-type: none;
  margin: 0;
  margin-top: 1.042vw;
  will-change: transform;
  padding: 0;
  overflow: hidden;
  background-color: transparent;
  display: flex;
  justify-content: left;
}

#go-to-section{
  grid-area: 1 / 1 / 2 / 2;
  grid-area: 2 / 1 / 3 / 2;
}

#go-to-section-2{
  grid-area: 2 / 1 / 3 / 2;
}

.card-box-digital{
  grid-area: 4 / 1 / 5 / 2;
  display: grid;
  grid-template-columns: repeat(3, min-content);
  grid-template-rows: repeat(2, auto);
  grid-column-gap: 2.604vw;
  grid-row-gap: 0px;
  width: 71.042vw;
  margin-left: auto;
  margin-right: auto;
}

.card-box-print{
  grid-area: 4 / 1 / 5 / 2;
  display: grid;
  grid-template-columns: repeat(3, min-content);
  grid-template-rows: repeat(3, auto);
  grid-column-gap: 2.604vw;
  grid-row-gap: 3.646vw;
  width: 71.042vw;
  margin-left: auto;
  margin-right: auto;
}

  @keyframes toBlack {
    0% {background-color: #f5f5f5;}
    25% {background-color: #000000;}
    50% {background-color: #000000;}
    100% {background-color: #f5f5f5;}
  }

  @keyframes toWhite {
    0% {color: #0E0E0E;}
    25% {color: #FFFFFF;}
    50% {color: #FFFFFF;}
    100% {color: #0E0E0E;}
  }
  
  @keyframes toGrey {
    0% {box-shadow: none;}
    25% {box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);}
    50% {box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);}
    100% {box-shadow: none;}
  }

.card-1-digital-print{
  grid-area: 1 / 1 / 2 / 2;
  will-change: transform;
} 

.card-2-digital-print{
  grid-area: 1 / 2 / 2 / 3;
  margin-left: auto;
  will-change: transform;
}

.card-3-digital{
  grid-area: 1 / 3 / 3 / 4;
  margin-left: auto;
}

.card-3-print{
  grid-area: 1 / 3 / 2 / 4;
  margin-left: auto;
  will-change: transform;
}

.card-4-print{
  grid-area: 2 / 1 / 3 / 2;
  will-change: transform;
}

.card-5-print{
  grid-area: 2 / 2 / 3 / 3;
  margin-left: auto;
  will-change: transform;
}

.card-6-print{
  grid-area: 2 / 3 / 3 / 4;
  margin-left: auto;
  will-change: transform;
}

.card-7-print{
  grid-area: 3 / 1 / 4 / 2;
  will-change: transform;
}

.card-8-print{
  grid-area: 3 / 2 / 4 / 3;
  margin-left: auto;
  will-change: transform;
}

.card-9-print{
  grid-area: 3 / 3 / 4 / 4;
  margin-left: auto;
  will-change: transform;
}

#card-1-digital-print, #card-3-digital, #card-3-print, #card-4-print, #card-6-print, #card-8-print, #card-9-print {
  width: 21.875vw;
  border: 0.052vw solid #000000;
  border-radius: 1.563vw;
  height: fit-content;
  background-color: transparent;
  animation-duration: 1s;
}

#card-2-digital-print, #card-5-print, #card-7-print{
  width: 21.875vw;
  border: 0.052vw solid #000000;
  border-radius: 1.563vw;
  margin-left: auto;
  margin-right: auto;
  height: fit-content;
  animation-duration: 1s;
  background-color: transparent;
}

.cost{
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 2.604vw;
  text-align: center;
  margin-bottom: 1.042vw;
animation-duration: 1s;
}

.card-icon{
  height: 5.208vw;
  width: 10.833vw;
  display: flex;
  align-content: center;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2.083vw;
  margin-bottom: 2.083vw;
}

.card-icon-digital{
  height: 5.208vw;
  width: 5.781vw;
  display: flex;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2.083vw;
  margin-bottom: 2.083vw;
}

.card-icon-print{
  height: 5.208vw;
  display: flex;
  margin-top: 2.083vw;
  margin-bottom: 2.083vw;
  justify-content: center;
}

.card-8-icon-style{
  height: 5.208vw;
  display: flex;
  margin-top: 2.500vw;
  margin-bottom: 2.240vw;
  justify-content: center;
}

.card-icon-banner{
  height: 5.208vw;
  width: 8.542vw;
  display: flex;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2.083vw;
  margin-bottom: 2.083vw;
}

#step1, #step2, #step3-digital-logo {
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 0.938vw;
  text-align: center;
  margin-bottom: 1.563vw;
  margin-right: auto;
  margin-left: auto;
  width: 19.531vw;
  animation-duration: 1s;
}

#step3-print, #step-collection3, #step4, #step5, #step-collection6{
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 0.938vw;
  text-align: center;
  margin-bottom: 1.823vw;
  margin-right: auto;
  margin-left: auto;
  width: 19.531vw;
  animation-duration: 1s;
}

#step6, #step7{
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 0.938vw;
  text-align: center;
  margin-bottom: 0.625vw;
  margin-right: auto;
  margin-left: auto;
  width: 19.531vw;
  animation-duration: 1s;
}

#step8{
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 0.938vw;
  text-align: center;
  margin-bottom: 3.25vw;
  margin-right: auto;
  margin-left: auto;
  width: 19.531vw;
}

#step9, #step-package{
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 0.938vw;
  text-align: center;
  margin-bottom: 2.083vw;
  margin-top: 2.083vw;
  margin-right: auto;
  margin-left: auto;
  width: 19.531vw;
}

.head-1{
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 1.875vw;
  color: #000000;
  text-align: center;
  margin-bottom: 2.083vw;
}

.head-2{
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 1.875vw;
  color: #000000;
  text-align: center;
  margin-bottom: 3.125vw;
}

.head-3{
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 1.875vw;
  color: #000000;
  text-align: center;
  margin-bottom: 1.042vw;
}

#card-1-digital-print .in-submit, #card-2-digital-print .in-submit, #card-3-digital .in-submit, #card-3-print .in-submit, #card-4-print .in-submit, #card-5-print .in-submit, #card-6-print .in-submit, #card-7-print .in-submit, #card-8-print .in-submit, #card-9-print .in-submit{
  display: flex;
  background-color: #000000;
  border-radius: 1.354vw;
  width: 15.729vw;
  height: 4.010vw;
  text-align: center;
  margin: auto;
  border: 0.026vw #000000 solid;
  transition: background-color 0.2s ease-in;
  margin-bottom: 2.083vw;
  margin-left: auto;
  margin-right: auto;
  cursor: pointer;
  animation-duration: 1s;
}

#card-1-digital-print .in-submit:hover > .form-btn-primary, #card-2-digital-print .in-submit:hover > .form-btn-primary, #card-3-digital .in-submit:hover > .form-btn-primary, #card-3-print .in-submit:hover > .form-btn-primary, #card-4-print .in-submit:hover > .form-btn-primary, #card-5-print .in-submit:hover > .form-btn-primary, #card-6-print .in-submit:hover > .form-btn-primary, #card-7-print .in-submit:hover > .form-btn-primary, #card-8-print .in-submit:hover > .form-btn-primary, #card-9-print .in-submit:hover > .form-btn-primary{
  background-color: transparent;
  color: #0E0E0E;
}

#card-1-digital-print .in-submit:hover, #card-2-digital-print .in-submit:hover, #card-3-digital .in-submit:hover, #card-3-print .in-submit:hover, #card-4-print .in-submit:hover, #card-5-print .in-submit:hover, #card-6-print .in-submit:hover, #card-7-print .in-submit:hover, #card-8-print .in-submit:hover, #card-9-print .in-submit:hover{
  background-color: transparent;
}

.run-animation-toBlack{
  animation-name: toBlack;
}
.run-animation-toWhite{
  animation-name: toWhite;
}
.run-animation-toGrey {
animation-name: toGrey;
}

/* Digital design Ilgalaikio bendradarbiavimo card*/
.style-note-container{
  grid-area: 2 / 1 / 3 / 3;
  display: flex;
  width: 46.510vw;
  height: 8.333vw;
  margin-top: auto;
}

#note-card{
  background-color: transparent;
  border-radius: 1.563vw;
  animation-duration: 1s;
}

.style-note{
  display: grid;
  grid-template-columns: repeat(2, auto);
  grid-template-rows: auto;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 0.938vw;
  border: 0.052vw solid #000000;
  border-radius: 1.563vw;
  color: #000000;
  text-align: left;
  width: 46.510vw;
}

.style-note #note-button{
  grid-area: 1 / 2 / 2 / 3;
  display: flex;
  background-color: #0E0E0E;
  border-radius: 1.354vw;
  width: 15.729vw;
  height: 4.010vw;
  text-align: center;
  margin: auto;
  margin-bottom: 2.188vw;
  margin-left: auto;
  margin-right: 3.385vw;
  margin-top: 2.188vw;
  transition: background-color 0.2s ease-in;
  border: 0.026vw #000000 solid;
  cursor: pointer;
}
.style-note #note-button:hover > .form-btn-primary{
  background-color: transparent;
  color: #0E0E0E;
}

.style-note #note-button:hover{
  background-color: transparent;
}

.style-note .message{
  grid-area: 1 / 1 / 2 / 2;
  width: 18.490vw;
  margin-bottom: auto;
  margin-top: auto;
  margin-left: 3.385vw;
}

/* BLOG designerio.lt/tinklarastis */
.data-container{
  display: flex;
  justify-content: center;
 }
 @keyframes example {
  from {opacity: 0;}
  to {opacity: 1;}
}

.list-wrap{
  animation-direction: both;
  animation-duration: 1s;
  animation-name: example;
  margin-bottom: 0;
  margin-top: 0;
  padding-left: 0;
  width: fit-content;
}

.article-photo img{
  width: inherit;
  height: inherit;
}
 
.list{
  list-style-type: none;
  margin-bottom: 4.427vw;
  width: fit-content;
}

.blog-card-body1 {
  grid-area: 2 / 1 / 3 / 2;
  border-radius: 1.563vw;
  border:#0E0E0E 0.052vw solid;
  cursor: pointer;
  display: grid;
  grid-column-gap: 0px;
  grid-row-gap: 0px; 
  grid-template-columns: 27.865vw auto;
  grid-template-rows: auto;
  height: 20.469vw;
  width: 56.667vw;
}
   
.blog-btn-box{
  grid-area: 3 / 1 / 4 / 3;
}

.blog-photo{
  grid-area: 1 / 1 / 2 / 2;
  background-color: transparent;
  border-bottom-left-radius: 1.563vw;
  border-top-left-radius: 1.563vw;
  height: inherit;
  width: 27.865vw;
}

.blog-photo img{
  height: inherit; 
  width: inherit;
  border-top-left-radius: 1.563vw; 
  border-bottom-left-radius: 1.563vw;
}

.blog-content{
  grid-area: 1 / 2 / 2 / 3;
  border-bottom-right-radius: 1.563vw;
  border-top-right-radius: 1.563vw;
}

.blog-date{
  grid-area: 1 / 2 / 2 / 3;  
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 300;
  margin-bottom: 0.8vw;
  margin-left: 3.281vw;
  margin-top: 2.083vw;
  text-align: left;
}

.blog-card-header{
  grid-area: 1 / 2 / 2 / 3;
  font-family: 'Poppins', sans-serif;
  font-size: 1.667vw;
  font-weight: 400;
  margin-bottom: 1vw;
  margin-left: 3.281vw;
  text-align: left;
  width: 21.5vw;
}

.blog-text{
  grid-area: 1 / 2 / 2 / 3;
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 300;
  margin-left: 3.281vw;
  text-align: left;
  width: 22.396vw;
  margin-bottom: 1vw;
}

.in-submit{
  background-color: #000000;
  border-radius: 1.354vw;
  border: 0.026vw #000000 solid;
  cursor: pointer;
  display: flex;
  height: 4.010vw;
  margin-bottom: auto;
  margin-left: 3.281vw;
  margin-top: 1.042vw;
  text-align: center;
  transition: background-color 0.3s ease-in;
  width: 15.729vw;
}
  
.blog-btn-primary{
  color: white;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  font-size: 1.250vw;
  font-weight: 400;
  margin: auto;
  text-decoration: none;
  transition: background-color 0.3s ease-in;
}

.in-submit:hover > .blog-btn-primary{
  background-color: transparent;
  color: #0E0E0E;
  text-decoration: none;
}

.in-submit:hover{
  background-color: transparent;
}

.pagination {
  display: inline-block;
}

#pagination-demo1{
  display: flex;
  justify-content: center;
}

.pagination a {
  color: black;
  float: left;
  padding: 0.417vw 0.833vw;
  text-decoration: none;
}

.paginationjs {
  box-sizing: initial;
  display: flex;
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 300;
  line-height: 1.6;
  margin-bottom: 4.167vw;
  width: 56.667vw;
}

.paginationjs .paginationjs-pages li > a {
  background: transparent;
  color: #333;
  cursor: pointer;
  display: block;
  font-size: 1.042vw;
  height: 1.458vw;
  line-height: 1.563vw;
  min-width: 2.083vw;
  text-align: center;
  text-decoration: none;
  transition: transform 0.5s ease-out;
}

.paginationjs .paginationjs-pages li.paginationjs-next > a{
  border-right: transparent;
  font-size: 1.563vw;
}

.paginationjs .paginationjs-pages li:first-child, .paginationjs .paginationjs-pages li:first-child > a {
  font-size: 1.563vw;
}

.paginationjs .paginationjs-pages li.active > a {
  background: transparent;
  color: #000000;
  cursor: default;
  font-weight: 400;
  height: 1.563vw;
  line-height: 1.563vw;
}

.paginationjs .paginationjs-pages li > a:hover {
  background: transparent;
}

.paginationjs .paginationjs-pages li.paginationjs-next {
  border-right: transparent;
}

.paginationjs .paginationjs-pages li {
  border-right: none;
  border: transparent;
  float: left;
  list-style: none;
}


/* GIFS designerio.lt/judanti-grafika */
.in-submit:hover > .gifs-btn-primary{
    background-color: transparent;
    color: #0E0E0E;
  }
.in-submit:hover{
    background-color: transparent;
  
  }
.in-submit{
  display: flex;
  background-color: #000000;
  border-radius: 1.354vw;
  width: 15.729vw;
  height: 4.010vw;
  text-align: center;
  margin: auto;
  border: 0.026vw #000000 solid;
    transition: background-color 0.2s ease-in;
  cursor: pointer;
  margin-left: auto;
  margin-right: auto;
}
.gifs-btn-primary{
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  text-decoration: none;
  transition: color 0.2s ease-in;
  font-size: 1.250vw;
  color: white;
  margin: auto;
}

.package-img {
  width: 15.573vw;
  height: 3.646vw;
}

/* FOOTER */
.footer{
  align-content: center;
  background-color: #0E0E0E;
  display: flex;
  height: auto;
}
.footer-content{
  display: grid;
  grid-column-gap: auto;
  grid-row-gap: 0px; 
  grid-template-columns: repeat(3, auto);
  grid-template-rows: repeat(2, auto);
  height: fit-content;
  margin: auto;
  width: 56.667vw;
}
.footer-header{
  grid-area: 1 / 1 / 2 / 2;
  color: #F9F9F9;
  display: inline-flex;
  font-family: 'Poppins', sans-serif;
  font-size: 3.125vw;
  font-weight: 400;
  margin-top: 10.938vw;
  text-align: left;
}
.footer-menu{
  grid-area: 1 / 2 / 2 / 3;
  display: inline-flex;
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 300;
  list-style-type: none;
  margin-left: auto;
  margin-top: 11.771vw;
  text-align: left;
}
.footer-menu-list{
  list-style-type: none;
  margin-bottom: 0px;
  margin-top: 0px;
  padding-left: 0px;
  
}
.footer-menu-list li a{
  color: #F9F9F9;
  text-decoration: none;
 pointer: cursor;
}
.footer-contacts{
  grid-area: 1 / 3 / 2 / 4;
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 300;
  list-style-type: none;
  margin-left: 10.417vw;
  margin-top: 11.771vw;
  text-align: right;
  width: auto;
}
.footer-menu-list li a::before{
  content: attr(title);
  display: block;
  font-weight: bold;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}
.footer-menu-list-contacts li a::before{
  content: attr(title);
  display: block;
  font-weight: bold;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}
.footer-menu-list li a:hover{
  font-weight: 400;
}

.footer-menu-list-contacts li a:hover{
  font-weight: 400;
}
.footer-menu-list-contacts{
  float: right;
  list-style-type: none;
  margin-top: 0px;
  padding-left: 0px;
}
.footer-menu-list-contacts li a{
  color: #F9F9F9;
  cursor: pointer;
  text-decoration: none;
}
.footer-menu-list-contacts li{
  margin-bottom: 1.302vw;
}
.footer-menu-list li{
  margin-bottom: 1.302vw;
}
.copyright{
  grid-area: 2 / 1 / 3 / 4;
  color: #F9F9F9;
  font-family: 'Poppins', sans-serif;
  font-size: 1.042vw;
  font-weight: 300;
  margin-left: auto;
  margin-right: auto;
  margin-top: 9.740vw;
  margin-bottom: 5.208vw;
  text-align: center;
}

/* Back to Top button*/
#ToTOP {
  align-items: center;
  background-color: #0E0E0E;
  border-radius: 0.208vw;
  border: none;
  bottom: 4.688vw;
  color: white;
  cursor: pointer;
  display: none;
  font-size: 2.604vw;
  font-weight: 400;
  height: 2.604vw;
  justify-content: center;
  opacity: 1;
  outline: none;
  padding: 0;
  position: fixed;
  right: 3.906vw;
  width: 2.604vw;
  z-index: 99;
}


/* Error page /404 */
.container-error {
  background-color: transparent;
  text-align: center;
  padding: 120px;
}

.error-img {
  max-width: 100%;
}

.text-error {
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 1.042vw;/*20px*/
  color: #000000;
  text-align: center;
}

.header-text-error {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 3.125vw;
  color: #000000;
  margin-top: 2.604vw;
  text-align: center;
}

.error-btn-box{
  display: inline-flex;
  background-color: #000000;
  border-radius: 1.354vw;
  border: 0.026vw solid #000000;
  width: 15.729vw;
  height: 4.010vw;
  text-align: center;
  margin: auto;
  margin-top: 2.604vw;
  margin-bottom:2.604vw;
  transition: color 0.2s ease-in;
}

.error-btn-box:hover{
  background-color: transparent;
}

.error-btn-primary{
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  text-decoration: none;
  text-align: center;
  font-size: 1.250vw;
  transition: background-color 0.2s ease-in;
  color: white;
  margin: auto;
  cursor: pointer;
}

.error-btn-box:hover > .error-btn-primary {
  color: #0E0E0E;
  background-color: transparent;
}

.soc-icon {
  width: 3.125vw;
}

@media (min-width:992px){
  #section-mobile-menu {
    display: none;
  }

  .main-text-box{
    grid-area: 1 / 1 / 3 / 2;
    margin-bottom: 10%;
    margin-left: 18.125vw;
    margin-top: 10%;
  }
}

@media (max-width: 992px) {

  .text-4 li a {
    color: #212529 !important;
  }

  .content-box{
    margin-left: 4vw !important;
    margin-right: 4vw !important;
  }
  /* Mobile menu */
  #section-menu {
    display: none;
  }

  .mobile-header {
    display: grid; 
    gap: 0px 0px; 
    grid-template-columns: 1fr 1fr; 
    grid-template-rows: fit-content fit-content; 
    padding-top: 12px;
    padding-bottom: 8px;
  }

  .mobile-menu-icon {
    align-self: end; 
    justify-self: end; 
  }

  /* Main section */
  .main-photo{
    background-image: none;
    background-color: black;
    display: flex;
    grid-column-gap: 0px;
    grid-row-gap: 0px; 
    height: 100%;
    width: 100%;
  }

  .main-text-box{
    width: 100%;
    margin-bottom: 5%;
    text-align: center;
    margin-top: 5%;
  }

  .head-text-box {
    font-size: 5.5vw;
    line-height: 1.5;
  }

  .text-box {
    width: 80%;
    font-size: 4vw;
    padding-left: 10%;
    padding-right: 10%;
    margin-top: 15px;
  }

  /* SERVICES Main page*/
.services{
  width: 100%;
}

.content-box2{
  width: 100%;
}

.main-header-title {
  font-size: 6vw;
}

.card-title, .article-header {
  text-align: center;
  font-size: 5.5vw;
  padding-bottom: 10px;
}

.article-header {
  width: 90%;
}

.article-date, .blog-date {
  font-size: 3.5vw;
}

.card-text {
  text-align: center;
  font-size: 3.7vw;
  padding-bottom: 10px;
}

.card {
  height: auto;
  width: 90%;
  border-radius: 28px !important;
  border: 1px solid #000000;
}

.card-body {
  border-radius: 28px !important;
  padding: 7%;
}

.card-body:hover {
  border-radius: 28px;
  padding: 7%;
}

.btn-box {
  padding-top:9px;
  padding-bottom: 9px;
  margin-left: 40px;
  margin-right: 40px;
  height: auto;
  width: auto;
  margin-bottom: 10px;
  border-radius: 15px;
}

.btn-box a{
  padding-top: 9px;
  padding-bottom: 9px;
  font-size: 4vw;
}

.btn-box a:hover{
  text-decoration:none;
}

/* Main page blog */
.blog-content-index{
  display: grid;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-columns: auto;
  grid-template-rows: repeat(3, auto);
  height: fit-content;
  margin: auto;
  width: 90%;
}

.blog-card-body1-index {
  grid-area: 2 / 1 / 3 / 2; /* Adjusted grid area to span from row 2 to row 3, and from column 1 to column 2 */
  width: 90vw;
}

.blog-card-body2-index {
  grid-area: 3 / 1 / 4 / 2; /* Adjusted grid area to span from row 3 to row 4, and from column 1 to column 2 */
  margin-left: auto;
  width: 90vw;
}

.blog-photo-index{
  background-color: transparent;
  height: auto;
  border-radius: 28px;
  width: 100%;
}

.blog-photo-index img{
  border-radius: 28px;
}

.blog-date-index {
  font-size: 3.7vw;
}

.blog-card-header-index {
  font-size: 6vw;
}

.blog-text-index {
  font-size: 3.7vw;
  padding-bottom: 15px;
}

/* Footer */
.footer {
  display: block;
}

.footer-header {
  display: none;
}

.footer-menu-list {
  font-size: 3.7vw;
}

.footer-menu-list li{
  margin-bottom: 20px !important;
}

.footer-menu-list-contacts {
  font-size: 3.7vw;
}

.footer-menu-list-contacts li{
  margin-bottom: 20px;
}

.soc-icon {
  width: 7.5vw;
}

.copyright {
  font-size: 3.7vw;
}

/* text */

.line-height-2 {
  line-height: 2;
}

.text-4 {
  font-size: 4vw;
  font-family: 'Poppins', sans-serif;
  color: #212529;
}

.text-4 a:hover {
  color: inherit;
  text-decoration: none;
}

.modal-menu-botton:hover{
  background-color: #0E0E0E !important;
  color: #fff !important;
}

.modal-menu-botton-text:hover {
  color: #fff !important;
}

.logo-package-nav-bar {
  display: none;
}

.style{
  width: 85vw;
}

.service-page-title{
  font-size: 6vw;
}

.services-text{
  font-size: 3.8vw;
  color: #000000;
  width: 100%;
  text-align: left;
}

.logo-cards-box{
  display: block;
  width: 100%;
}

#card-logo{
  width: 100%;
  border: 0.052vw solid #000000;
  border-radius: 1.563vw;
  height: fit-content;

}


.card1-logo{
  width: 100%;
  grid-area: 1 / 1 / 2 / 2;
}

.card2-logo{
  grid-area: 2 / 2 / 3 / 3;
  margin-left: auto;
}

#step1, #step2, #step3-digital-logo {
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 4vw;
  text-align: center;
  margin-bottom: 1.563vw;
  margin-right: auto;
  margin-left: auto;
  width: 90%;
  animation-duration: 1s;
  margin-top: 20px;
}

#card-logo{
  width: 100%;
  border: 1px solid #000000;
  border-radius: 25px;
  height: fit-content;
  margin-top: 25px;
  margin-bottom: 25px;
  padding-top: 25px;
  padding-bottom: 25px;
  will-change: transform;
}

.card-icon{
  height: auto;
  width: 100%;
}

.card-icon img {
  width: 150px;
  margin-left:auto;
  margin-right: auto;
  padding-bottom: 10px;
}

.cost{
  font-weight: 400;
  font-size: 12vw;
}

.in-submit {
 padding-top: 9px;
  padding-bottom: 9px;
  width: 75%;
  height: auto;
  border-radius: 15px;
  border: 1px #000000 solid;
}

#card-logo .in-submit {
  padding-top: 18px;
  padding-bottom: 18px;
  width: 75%;
  height: auto;
  border-radius: 15px;
  border: 1px #000000 solid;
}

.form-btn-primary{
  font-size: 4vw;
  font-weight: 400;
}

.brandbook-cards-box-logo {
  display: block;
  width: 100%;
}


.card-1-digital-print{
  grid-area: 1 / 1 / 2 / 2;
  will-change: transform;
} 

.card-2-digital-print{
  grid-area: 2 / 2 / 3 / 3;
  margin-left: auto;
  will-change: transform;
}

.card-3-digital{
  grid-area: 3 / 3 / 4 / 4;
  margin-left: auto;
}

#card-1-digital-print, #card-2-digital-print, #card-3-digital, #card-3-print, #card-4-print, #card-6-print, #card-8-print, #card-9-print, #card-5-print, #card-7-print {
  width: 100%;
  border: 1px solid #000000;
  border-radius: 25px;
  height: fit-content;
  background-color: transparent;
  animation-duration: 1s;
  padding-top: 25px;
  padding-bottom: 25px;
  margin-top: 25px;
  margin-bottom: 25px;
}

.head-1{
  font-weight: 400;
  font-size: 6vw;
  margin-bottom: 2.083vw;
}

.card-icon-brandbook{
  height: auto;
  width: 100%;
}

.card-icon-brandbook img{
  height: auto;
  width: 150px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 10px;
}

#card-1-digital-print .in-submit, #card-2-digital-print .in-submit, #card-3-digital .in-submit, #card-3-print .in-submit, #card-4-print .in-submit, #card-5-print .in-submit, #card-6-print .in-submit, #card-7-print .in-submit, #card-8-print .in-submit, #card-9-print .in-submit{
  border-radius: 15px;
  width: 75%;
  padding-top: 18px;
  padding-bottom: 18px;
  border: 1px #000000 solid;
  height: auto;
}

.brandbook-note-logo{
  font-size: 3.5vw;
  text-align: left;
  margin-top: 3.385vw;
  width: 100%;
}

.carousel-header, .blog-header-article {
  font-size: 6vw;
}

.services-nav-bar {
  display: none;
}

.card-box-digital{
  display: block;
  width: 100%;
}

.card-icon-digital{
  height: auto;
  width: 100%;
}

.card-icon-banner {
  height: auto;
  width: 100%;
}

.card-icon-digital img{
  height: auto;
  width: 150px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 10px;
}

.card-icon-banner img{
  height: auto;
  width: 150px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 10px;
}

.card-1-digital-print .in-submit {
  font-size: 4vw;
}

.style-note-container{
  width: 100%;
  height: auto;
  margin-top: auto;
}

.style-note{
  display: block;
  font-weight: 300;
  font-size: 4vw;
  border: 1px solid #000000;
  border-radius: 15px;
  color: #000000;
  text-align: left;
  width: 100%;
}

.style-note .message{
  width: 80%;
  margin-bottom: 20px;
  text-align: center;
  margin-left: 10%;

}

.style-note #note-button{
  grid-area: 1 / 2 / 2 / 3;
  display: flex;
  background-color: #0E0E0E;
  border-radius: 15px;
  width: 75%;
  height: auto;
  text-align: center;
  margin: auto;
  margin-bottom: 2.188vw;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2.188vw;
  transition: background-color 0.2s ease-in;
  border: 1px #000000 solid;
  cursor: pointer;
  padding-top: 18px;
  padding-bottom: 18px;
}

.print-nav-bar {
  display: none;
}

.card-box-print{
  display: block;
  width: 85vw;
  margin-left: auto;
  margin-right: auto;
}

.card-icon-print, .card-8-icon-style{
  height: 100%;
}

.card-icon-print img{
  height: 150px;
  padding-bottom: 10px;
}

.card-8-icon-style img{
  height: 150px;
  padding-bottom: 10px;
}

#step3-print, #step4, #step5, #step6, #step7, #step8, #step9, #step-package {
  font-size: 4vw;
  width: 90%;
}

#step-collection3, #step-collection6 {
  font-size: 3.5vw;
  width: 90%;
}

.head-2, .head-3 {
  font-size: 6vw;
}

.package-img {
  width: 150px;
  height: auto;
}

.label-cards-box{
  display: block;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.gifs-btn-primary {
  padding-top: 6px;
  padding-bottom: 6px;
  font-size: 4vw;
}

.article-photo{
  grid-area: 3 / 1 / 4 / 2;
  width: 100%;
  height: auto;
  border-radius: 1.563vw;
  margin-bottom: 3.333vw;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.article-photo img{
  width: 90%;
  height: auto;
  margin-right: auto;
  margin-left: auto;
}

.article {
  grid-area: 4 / 1 / 5 / 2;
  margin: auto;
  width: 90%;
  margin-bottom: 9.375vw;
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 4vw;
  text-align: left;
  line-height: 1.5;
}

.article h1{
    font-size: 7vw
}

.blog-content-article{
  display: block;
  width: 90%;
}

.blog-card-body1-article {
  width: 100%;
}

.blog-card-body2-article {
  width: 100%;
} 

.blog-photo-article {
  width: 100%;
  height: auto;
}

.blog-date-article {
  font-size: 4vw;
}

.blog-card-header-article {
  font-size: 5vw;
}

.blog-text-article{
  font-size: 4vw;
  margin-bottom: 25px;
}

.page-title{
  font-size: 6vw;
}

/* ABOUTME designerio.lt/apie-mus */
.about-me{
  display: block;
  width: 100%;
}

.aboutme-text{
  width: 90%;
  margin-right: auto;
  margin-left: auto;
}

.aboutme-hello {
  font-size: 4.5vw;
}

.aboutme-paragraph {
  font-size: 4vw;
}

.aboutme-text .in-submit{
  display: flex;
  border-radius: 15px;
  border: 1px #000000 solid;
  height: auto;
  margin-bottom: 10.417vw;
  margin-top: 2.604vw;
  text-align: center;
  text-decoration: none;
  width: 70%;
  padding-top: 15px;
  padding-bottom: 15px;
  justify-content: center;
}

#about-us-button {
  font-size: 4vw;
}

.list-wrap{
  width: 100%;
}

.list{
  width: 100%;
}

.blog-card-body1 {
  border-radius: 15px;
  border:#0E0E0E 1px solid;
  cursor: pointer;
  display: block;
  height: auto;
  width: 90%;
  margin-right: auto;
  margin-left: auto;
  padding-bottom: 15px;
}

.blog-photo{
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-left-radius: none;
  height: inherit;
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.blog-photo img{
  height: inherit; 
  width: inherit;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-left-radius: 0px;
}

.blog-card-header {
  font-size: 5vw;
  font-weight: 400;
  width: 90%;
}

.blog-text{
  font-size: 4vw;
  width: 90%;
  margin-bottom: 15px;
}

.blog-btn-primary {
  font-size: 4vw;
  padding-top: 10px;
  padding-bottom: 10px;
}

.container-error {
  background-color: transparent;
  text-align: center;
  padding-top: 10%;
  padding-right: 0px;
  padding-left: 0px;
  padding-bottom: 10%;
}

.header-text-error {
  font-size: 6vw;
}

.text-error {
  font-size: 4vw;
  text-align: left;
  padding-left: 5vw;
  padding-right: 5vw;
}

.error-btn-box{
  display: inline-flex;
  background-color: #000000;
  border-radius: 15px;
  border: 1px solid #000000;
  width: 70%;
  height: auto;
  text-align: center;
  margin: auto;
  padding-top: 15px;
  padding-bottom: 15px;
  margin-top: 15px;
}

.error-btn-primary {
  font-size: 4vw;
}

.top-button {
  font-size: 20px;
}

.to-top-section {
    display: none;
}

#ToTOP {
  align-items: center;
  background-color: #0E0E0E;
  border-radius: 5px;
  border: none;
  bottom: 4.688vw;
  color: white;
  cursor: pointer;
  display: none;
  font-size: 45px;
  font-weight: 400;
  height: 50px;
  justify-content: center;
  opacity: 1;
  outline: none;
  padding: 0;
  position: fixed;
  right: 3.906vw;
  width:45px;
  z-index: 99;
}

.blog-btn-box-index {
  display: none;
}

.style-note {
  padding-top: 20px;
  padding-bottom: 20px;
}

.paginationjs {
  font-size: 4vw !important;
  width: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
}

.paginationjs .paginationjs-pages li:first-child, .paginationjs .paginationjs-pages li:first-child > a, .paginationjs .paginationjs-pages li.paginationjs-next > a, .paginationjs .paginationjs-pages li.active > a {
  font-size: 6vw;
}

.paginationjs-page a{
  font-size: 4vw; 
}

.copyright {
  margin-bottom: 0px;
}




}

@media only screen and (max-device-width: 992px) and (-webkit-min-device-pixel-ratio: 2) {
  .modal-menu-botton {
    margin-bottom: 0px !important; /* Custom margin-bottom for iPhones */
  }
}