/* Custom overrides and responsive video handling for Ernie Smith Portfolio */

/* Mobile video adjustments (from your original CSS) */
@media screen and (max-width: 768px) {
    .hero-video {
        display: initial;
    }
    .hero-video video {
        max-width: 224vw !important;
        height: 100vh;
        left: 60%;
        min-height: 100%;
        min-width: 100%;
        position: absolute;
        top: 50%;
        -webkit-transform: translate3d(-50%, -50%, 0);
        transform: translate3d(-50%, -50%, 0) rotate(90deg);
    }
}

/* Ensure smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* Any additional custom styles or overrides can go here */
.continue-button .button:hover {
  background: rgba(255,255,255,0.1) !important;
  border-color: white !important;
}

/* Portfolio visual layout specific styles (if needed for the creative portfolio section) */
.portfolio-grid {
  position: relative;
  min-height: 800px;
}

/* Portfolio item hover effects */
.portfolio-item {
  cursor: pointer;
  transition: transform 0.2s ease;
}

.portfolio-item:hover {
  transform: scale(1.05);
}

/* Mobile responsive for portfolio */
@media (max-width: 768px) {
  .portfolio-grid {
    min-height: 600px;
  }
  
  .portfolio-item {
    position: relative !important;
    margin-bottom: 20px;
    width: 100% !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
  }
}/* Custom styles for Ernie Smith Portfolio */

/* Smooth scrolling for anchor links */
html {
  scroll-behavior: smooth;
}

/* Custom spacing and typography adjustments */
.content.is-large p {
  margin-bottom: 1.5rem;
}

/* Card hover effects */
.card {
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
}

/* Portfolio box hover effects */
.box {
  transition: transform 0.2s ease-in-out;
}

.box:hover {
  transform: translateY(-1px);
}

/* Image styling */
.image img.is-rounded {
  border-radius: 50%;
}

/* Link styling */
a {
  transition: color 0.2s ease-in-out;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .hero-body .columns {
    flex-direction: column-reverse;
  }
  
  .section .columns {
    flex-direction: column-reverse;
  }
}


.tornpaper.barn a {
    color: white;
}

@media screen and (max-width: 768px) {
  .tornpaper.barn::before {
    height: 300px;
    background-image: url(https://images.tedium.co/uploads/barn.png);
  }
}
@media screen and (min-width: 769px), print {
  .tornpaper.barn {
    min-height: 400px;
    max-height: 450px;
    height: 450px;
    background-image: url(https://images.tedium.co/uploads/barn.png);
    background-position: center;
  }
}
@media screen and (min-width: 1024px) {
  .tornpaper.barn {
    max-height: 600px;
    height: 600px;
  }
}
@media screen and (min-width: 1216px) {
  .tornpaper.barn {
    height: 600px;
    width: 600px;
  }
}
@media screen and (max-width: 768px) {
  .tornpaper.barn h3 {
    justify-content: end;
  }
}
@media screen and (min-width: 769px), print {
  .tornpaper.barn h3 {
    padding: 10em 4em 4em 4em;
    font-size: 14pt;
    line-height: 20pt;
    text-align: center;
    text-shadow: 0px 1px 7px black;
    justify-content: flex-start;
  }
}
@media screen and (min-width: 1024px) {
  .tornpaper.barn h3 {
    padding: 0;
    font-size: 16pt;
    line-height: 24pt;
    text-align: center;
    justify-content: center;
    padding: 7em 4em 4em 4em;
    text-shadow: 0px 1px 7px black;
  }
}
@media screen and (min-width: 1216px) {
  .tornpaper.barn h3 {
    padding: 0;
    line-height: 28pt;
    font-size: 24pt;
    text-align: center;
    justify-content: center;
  }
}
@media screen and (min-width: 1216px) {
  .tornpaper.barn h3 {
    padding: 7em 4em 4em 4em;
    text-shadow: 0px 1px 7px black;
  }
}


.tornpaper.battery a {
    color: black;
}

@media screen and (max-width: 768px) {
  .tornpaper.battery::before {
    height: 300px;
    background-image: url(https://static.tedium.co/uploads/battery.png);
  }
}
@media screen and (min-width: 769px), print {
  .tornpaper.battery {
    min-height: 250px;
    max-height: 250px;
    height: 250px;
    width: 300px;
    background-image: url(https://static.tedium.co/uploads/battery.png);
    background-position: left;
    margin-top: 50px;
  }
}
@media screen and (min-width: 1024px) {
  .tornpaper.battery {
    min-height: 300px;
    max-height: 300px;
    margin-top: 100px;
    height: 300px;
    width: 350px;
  }
}
@media screen and (min-width: 1216px) {
  .tornpaper.battery {
    min-height: 350px;
    max-height: 350px;
    margin-top: 50px;
    height: 350px;
    width: 400px;
  }
}
@media screen and (max-width: 768px) {
  .tornpaper.battery h3 {
    justify-content: end;
  }
}
@media screen and (min-width: 769px), print {
  .tornpaper.battery h3 {
    padding: 3em 0em 1em 4em;
    font-size: 16pt;
    line-height: 24pt;
    text-align: left;
    justify-content: flex-start;
  }
}
@media screen and (min-width: 1024px) {
  .tornpaper.battery h3 {
    padding: 0;
    font-size: 16pt;
    line-height: 24pt;
    text-align: left;
    justify-content: center;
    padding: 7em 2em 4em 6em;
  }
}
@media screen and (min-width: 1216px) {
  .tornpaper.battery h3 {
    padding: 0;
    line-height: 28pt;
    font-size: 21pt;
    text-align: left;
    justify-content: center;
  }
}
@media screen and (min-width: 1216px) {
  .tornpaper.battery h3 {
    padding: 7em 0em 4em 5em;
  }
}

.tornpaper.gamegenie a {
    color: black;
}

@media screen and (max-width: 768px) {
  .tornpaper.gamegenie::before {
    height: 300px;
    background-image: url(https://static.tedium.co/uploads/gamegenie_isolated.png);
  }
}
@media screen and (min-width: 769px), print {
  .tornpaper.gamegenie {
    min-height: 125px;
    max-height: 125px;
    height: 125px;
    width: 350px;
    background-image: url(https://static.tedium.co/uploads/gamegenie_isolated.png);
    background-position: right;
  }
}
@media screen and (min-width: 1024px) {
  .tornpaper.gamegenie {
    max-height: 175px;
    height: 200px;
    width: 450px;
  }
}
@media screen and (min-width: 1216px) {
  .tornpaper.gamegenie {
    height: 200px;
    width: 450px;
  }
}
@media screen and (max-width: 768px) {
  .tornpaper.gamegenie h3 {
    justify-content: end;
  }
}
@media screen and (min-width: 769px), print {
  .tornpaper.gamegenie h3 {
    padding: 1em 10em 0 0;
    font-size: 16pt;
    line-height: 20pt;
    text-align: right;
    justify-content: flex-start;
  }
}
@media screen and (min-width: 1024px) {
  .tornpaper.gamegenie h3 {
    padding: 0;
    font-size: 16pt;
    line-height: 24pt;
    text-align: right;
    justify-content: center;
    padding: 0 14em 0 0;
  }
}
@media screen and (min-width: 1216px) {
  .tornpaper.gamegenie h3 {
    padding: 0;
    line-height: 20pt;
    font-size: 16pt;
    text-align: right;
    justify-content: center;
  }
}
@media screen and (min-width: 1216px) {
  .tornpaper.gamegenie h3 {
    padding: 0 14em 0 0;
  }
}