/* Site Stylesheet
  1. Global Styles
  2. Menu styles
  3. Jumbotron - Pozitiva.lt page styles
  4. Jumbotron - Pozitiva.lt/Katalogas page styles
  5. Releases Pozitiva.lt page styles
  6. Catalogue styles (Pozitiva.lt/Katalogas page)
  7. PhpMailer form styles
  8. Contact us styles
  9. Main container, Catalogue, Releases, Contact us, Footer common styles
  10. Style changes 2021.11.03 Spotify and Pakartot
  11. Style changes 2022.04.05 for small screens
======================================== */

/* 1. Global Styles
======================================== */
body {
  padding-top: 70px;
  padding-bottom: 15px;
  background-color: white;
  font-family: "Ubuntu", sans-serif;
}


/* 2. Menu styles
======================================== */
.navbar-default {
  background-color: white;
}

.navbar-default .navbar-brand {
  color: white;
}

.navbar-right {
    padding-right: 20px;
}

.navbar-brand .image-responsive {
  width: 100%;
  height: auto;
  padding-left: 20px;
}

.navbar .navbar-nav>li>a {
  color: #dd863b;
}

.navbar .navbar-nav>li>a:hover {
  background-color: white;
  color: black;
}

.navbar-brand .image-responsive:hover {
  opacity: 0.7;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}

.image-responsive {
    display: block;
    /* margin-left: auto;  */
    margin-right: auto;
    width: 30%;
}


/* 3. Jumbotron - Pozitiva.lt page styles
======================================== */
.jumbotron {
  color: #dd863b;
  /* background-color: white; */
  margin-top: 50px;
  background: url("../images/microphone.jpg");
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  margin-left: 15px;
  margin-right: 15px;
  min-height: 200px;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -ms-grid-row-align: center;
  align-items: center;
}

.jumbotron:hover {
  opacity: 0.9;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
}

.page-header {
  padding: 0px 20px;
  text-align: center;
}

.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}


/* 4. Jumbotron - Pozitiva.lt/Katalogas page styles
======================================== */
.albumai {
  color: white;
  font-weight: 900;
  background: -webkit-linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ), url("../images/s-record-player.jpg");
  background: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ), url("../images/s-record-player.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}


/* 5. Releases Pozitiva.lt page styles
======================================== */
.col-lg-4.col-sm-6 {
  padding: 10px 25px;
}

.trans:hover {
  transform: translate(-1px, -0.5%);
  -webkit-transform: translate(-1px, -0.5%);
  -ms-transform: translate(-1px, -0.5%);
  -o-transform: translate(-1px, -0.5%);
}

.trans {
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  width: 100%;
}

.thumbnail {
   overflow: hidden;
}

.btn-primary {
  background-color: white;
  border-color: #d3d3d3;
  color: #dd863b;
}

.btn-primary:hover {
  background-color: #3BC2DD !important;
  border-color: dimgrey !important;
  color: white !important;
}

.btn-primary:active {
  background-color: #dd863b !important;
  border-color: dimgrey;
}

.btn-primary:focus {
  background-color: white;
  border-color: #d3d3d3;
  color: #0A7A90;
}

.btn.btn-primary.btn-block {
  color: #0A7A90;
}

.btn.btn-primary.btn-block:hover {
  color: white;
}

.fas.fa-envelope.fa-lg,
.fas.fa-volume-up,
.fas.fa-shopping-cart {
  color: #0A7A90;
}

.fas.fa-envelope.fa-lg:hover,
.fas.fa-volume-up:hover,
.fas.fa-shopping-cart:hover {
  color: #3BC2DD;
}


/* 6. Catalogue styles (Pozitiva.lt/Katalogas page)
======================================== */

.pirmas {
  padding-top: 35px;
}

.anchor:before {
  height: 60px;
  display: block;
  content: '';
  visibility: hidden;
}

.col-md-9 img:hover {
  transform: scale(1.03);
  -webkit-transform: scale(1.03);
}

.col-md-9 img {
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
  width: 100%;
}

.col-md-9 {
   overflow: hidden;
}

.pakartot img:hover {
  transform: scale(1.03);
  -webkit-transform: scale(1.03);
}

.pakartot img {
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
  width: 100%;
}

.pakartot {
   overflow: hidden;
}

.row.katalogas {
  padding-bottom: 30px;
}

.row.katalogas.col-md-3 {
  width: 410px;
  height: 307px;
}

.nav-tabs>li>a {
  color: #0A7A90;
}

.nav-tabs>li>a:hover {
  background-color: #f3f3f3;
  color: #333;
}

.col-md-9 {
  padding-left: 30px;
}

.col-md-9 img {
  display: inline;
  min-width: 115px;
  width: 19%;
  height: auto;
  margin-top: 10px;
  margin-left: 3px;
  position: relative;
  top: 3px; /* adjust this to taste */
  vertical-align: middle;
}

.col-md-3 img:hover {
  transform: scale(1.01);
  -webkit-transform: scale(1.01);
}

.col-md-3 img {
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
  width: 100%;
}

.tab-pane {
  margin: 0 15px;
  outline: none;
  text-align: justify;
}

.half-rule {
  margin-top: 0;
  margin-left: 0;
  text-align: center;
  width: 100%;
  padding-bottom: 30px;
  border-top: 1px solid #e3e3e3;
}

.half-rule-2 {
  text-align: center;
  width: 100%;
  border-top: 1px solid #e3e3e3;
}

  /* Container needed to position the button. Adjust the width as needed */
.youtube {
  position: relative;
  width: 100%;
}

  /* Make the image responsive */
.youtube img {
  width: 100%;
  height: auto;
}

  /* Style the button and place it in the middle of the container/image */
.videoklipai .col-md-3 .youtube a {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  color: #ff0000;
  font-size: 20px;
  background-color: #ffffff;
  padding: 5px 10px;
  border-radius: 12px!important;
  border: none;
  cursor: pointer;
  border-radius: 0;
}

.videoklipai .col-md-3 .youtube:hover a {
  color: #282828;
  background-color: #ffffff;
}

.youtube .img-responsive.thumbnail:hover {
  opacity: 0.8;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}

@media only screen and (max-width: 768px) {
  .col-centered {
    float: none;
    margin: 0 auto;
  }
}


/* 7. PhpMailer form styles
======================================== */
.btn-send {
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    margin-bottom: 20px;
}

.help-block.with-errors {
    color: #ff5050;
    margin-top: 5px;
}

.papildomai {
    display: none;
}


/* 8. Contact us styles
======================================== */
.kreipkis {
  padding-top: 65px;
}

label {
    color: #333;
}

@media only screen and (max-width: 1024px) {
  .controls {
    width: 95%;
    margin: 0 auto;
  }
}


/* 9. Main container, Catalogue, Releases, Contact us, Footer common styles
======================================== */
.row h3 {
  letter-spacing: 0.05em;
}

.text-center {
  color: #0A7A90;
  padding-top: 65px;
  outline: none;
}

#arrow a {
  color: #0A7A90;
}

#arrow a:hover {
  color: #3BC2DD;
}

/* 10. Style changes 2021.11.03 Spotify and Pakartot
======================================== */

i.fab.fa-spotify {
    margin-bottom: 20px;
    color: #1DB954;
}

i.fab.fa-spotify:hover {
    transform: scale(1.03);
    -webkit-transform: scale(1.03);
}

.tab-pane .pakartot img {
  width: 5%;
  height: auto;
  margin-bottom: 15px;
}

@media only screen and (max-width: 767.98px) {
.tab-pane .pakartot img {
  width: 15%;
    }
}

/* 11. Style changes 2022.04.05 for small screens
======================================== */

@media only screen and (max-width: 414px) {
    p,
    a,
    span,
    h5,
    h6,
    p.text-muted,
    label,
    input#form_name,
    input#form_lastname,
    input#form_email,
    input#form_phone,
    textarea#form_message,
    textarea#form_papildomai,
    .btn {
    font-size: 16px;
  }
    #arrow a {
    font-size: 30px;    
    }
}