/*!
Theme Name: AnMedia Portafolio
Theme URI: http://wwwanmedia.es
Author: AnMedia
*/

/* --- Wordpress --- */
* {
    box-sizing: border-box;
    outline: none;
}
body,
html {
    padding: 0;
    margin: 0;
    min-height: 100%;
	overscroll-behavior-y: none;
}
body.anmedia-albums-template--slider,
body.anmedia-albums-template--ribbon {
	overscroll-behavior: none;
}
body {
    overflow-x: hidden;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 28px;
	font-weight: 500;
    color: #808080;
	content: '';
    /*position: fixed;*/
    left: 0;
    top: 0;
   /* width: 100vh;
    height: 100vh;*/
    background: radial-gradient(ellipse at left top, #28282E 0%,#000000 30%);
	opacity: 0;
	/*pointer-events: none;*/
}
/* Siatka galerii */
.anmedia-albums-grid {
    display: flex;
    /*grid-template-columns: repeat(3, 1fr); /* 3 kolumny o równej szerokości */
    gap: 20px; /* Odstęp między elementami */
}
/* Wewnętrzny kontener elementu */
.anmedia-grid-item--inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}
/* Obrazek */
.anmedia-album-item__image {
    width: 100%;
    height: auto;
}
.anmedia-image img {
    width: 100%;
    height: auto;
    object-fit: cover; /* Dopasowanie obrazka do kontenera */
    display: block;
}

/* Tytuł */
.anmedia-album-item h5 {
    margin: 10px 0;
    text-align: center;
    font-size: 16px;
}

/* Link */
.anmedia-link {
	text-decoration: none;
	text-transform: capitalize;
	color: #c8c8c8c;
}
/* Wstęp */
.anmedia-intro {
    text-align: center;
    margin-bottom: 20px;
    font-size: 18px;
}


/* --- PSWP Opcje --- */
body.pswp-click-to-zoom .pswp__item img {
	pointer-events: auto;
}
.pswp:not(.pswp--open) .anmedia-pswp-media--video {
    pointer-events: none;
}
.anmedia-pswp-image-wrap {
	position: absolute;
	left: 0;
	top: 0;
	pointer-events: all;
}
.anmedia-pswp-image-wrap img {
	position: static;
	pointer-events: none;
}

/* --- PSWP Video Slides */
.anmedia-pswp-media--video,
.anmedia-pswp-media--iframe {
	position: absolute;
	overflow: hidden;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
.anmedia-pswp-media--video video,
.anmedia-pswp-media--iframe iframe {
	width: 100%;
	height: 100%;
	pointer-events: all;
	will-change: transform, opacity;
	transition: transform 0.3s, opacity 0.3s;
	opacity: 0;
	transform: scale(0.75);
	position: absolute;
	left: 0;
	top: 0;
	border: none;
}
.anmedia-pswp-media--video.is-inview video,
.anmedia-pswp-media--iframe.is-inview iframe {
	opacity: 1;
	transform: scale(1);
}


.anmedia-opis {
	z-index: 1;
    display: flex;
    flex-direction: column; /* Elementy w pionie */
    align-items: center; /* Wyśrodkowanie w poziomie po obrocie */
    transform: rotate(270deg); /* Obrót o 90 stopni */
    transform-origin: center; /* Punkt obrotu w środku */
    width: 580px; /* Stała szerokość diva (dostosuj) */
    height: 180px; /* Stała wysokość diva (dostosuj) */
    position: absolute; /* Pozycjonowanie, by obrót nie psuł layoutu */
    top: 270px;
    left: -50px;
    margin: -100px 0 0 -150px; /* Centrowanie (połowa height i width) */
background: -webkit-linear-gradient(270deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
background: -o-linear-gradient(270deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
background: linear-gradient(360deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
    /* Efekt animacji przy załadowaniu */
    opacity: 1; /* Początkowo niewidoczny */
    /*transform: rotate(270deg) translateY(50px); /* Obrót + przesunięcie w dół */
    /*animation: slideIn 2s ease-out forwards; /* Animacja najazdu */
}

/* Tytuł */
.anmedia-opis h2 {
    font-size: 24px; /* Rozmiar tytułu */
    /*font-family: Arial, sans-serif; /* Przykładowa czcionka */
    margin: 30px 0px 0px 0px; /* Odstęp od dołu */
    /*color: #333; /* Kolor tytułu */
	animation: slideIn 2s ease-out forwards;
	-webkit-animation: slide-top 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-top 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@-webkit-keyframes slide-top {
  0% {
    -webkit-transform: translateX(30px);
            transform: translateX(30px);
  }
  100% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px);
  }
}
@keyframes slide-top {
  0% {
    -webkit-transform: translateX(30px);
            transform: translateX(30px);
  }
  100% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px);
  }



}

/* Linia */
.anmedia-opis a {
	text-decoration: none;
	color: #c8c8c8;
}
.anmedia-opis a:hover {
	color: #41C0F2;
}
.anmedia-opis hr {
    width: 100%; /* Linia na całą szerokość diva */
    border: none; /* Usunięcie domyślnego stylu */
    height: 1px; /* Grubość linii */
    background-color: #c8c8c8; /* Kolor linii */
    margin: 20px 0; /* Odstępy góra/dół */
}

/* Opis */
.anmedia-opis p {
    font-size: 16px; /* Rozmiar tekstu */
    font-family: Arial, sans-serif; /* Przykładowa czcionka */
    color: #c8c8c8; /* Kolor opisu */
    text-align: center; /* Wyśrodkowanie tekstu */
    margin: 0; /* Bez marginesów */
}


