/*
 Theme Name:   Steelcut
 Theme URI:    https://steelcut.ch
 Description:  GeneratePress child theme
 Author:       Licinio
 Template:     generatepress
 Version:      0.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  generatepress-child
*/

.separate-containers .site-main {
	margin-top: 0;
	margin-bottom: 0;
}

.separate-containers .inside-article {
	padding-top: 0;
	padding-bottom: 0;
}

/* Homepage slideshow background images */

@keyframes bgSlideshow {
  0%      { opacity: 1; }
  25%     { opacity: 1; }
  33.33%  { opacity: 0; }
  91.67%  { opacity: 0; }
  100%    { opacity: 1; }
}

/* Contact Form 7 styling */
.wpcf7-form {
	padding: 0 !important;
	margin: 0 !important;
}

.wpcf7 input {
	width: 100%;
}

.wpcf7-textarea {
	width: 100%;
    height: 100px;
}

/*
---------------------------------------
  Styling the price page
---------------------------------------
*/

.preise-title {
  cursor: pointer;
  position: relative;
  padding: 1em 0.5em;
  user-select: none;
  margin-bottom: 0;
}

.preise-title::after {
  content: ">";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.4em;
  font-weight: bold;
  line-height: 1;
  transition: transform 0.3s ease;
  padding-right: 0.5em !important;
}

.preise-title.active::after {
  content: "v";
  padding-right: 0.5em !important;
}

.preise-content {
  max-height: 0;
  overflow: hidden;
  padding-left: 1.7em !important;
  transition: max-height 0.4s ease;
}

.preise-content.open {
  max-height: 1000px;
  padding-left: 1.7em !important;
}

.preise-item {
  border-bottom: 1px solid #e0e0e0;
}

.stretch-link{
	position: relative;
}

.stretch-link a::after{
	content: '';
	position: absolute;
	inset: 0;
}

.stretch-link a:is(:focus-visible)::after{
	outline: 2px solid;
}

.stretch-link a:is(:hover, :focus){
	outline: none;
}

/*
---------------------------------------
  End of price page style
---------------------------------------
*/

/*
---------------------------------------
  Hover effect on homepage pictures
  when passing the mouse over it
  reveals the text inside the DIV
---------------------------------------
*/

/* The wrapper that holds everything */
.hover-reveal {
    position: relative;
}

/* The overlay div */
.hover-reveal-overlay {
    background-color: rgba(0, 0, 0, 0);
    transition: background-color 0.4s ease;
}

/* Dark overlay on hover */
.hover-reveal:hover .hover-reveal-overlay {
    background-color: rgba(0, 0, 0, 0.8);
}

/* Hide text by default */
.hover-reveal-overlay h4,
.hover-reveal-overlay p {
    opacity: 0;
    transform: translateY(15px);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

/* Show text on hover */
.hover-reveal:hover .hover-reveal-overlay h4,
.hover-reveal:hover .hover-reveal-overlay p {
    opacity: 1;
    transform: translateY(0);
}

/*
---------------------------------------
  End of hover effect
---------------------------------------
*/







/*
---------------------------------------
  Topbar fade-in fade-out effect
---------------------------------------
*/

.top-bar {
    background-image: linear-gradient(to bottom, var(--base) 0%, var(--base) 75%, transparent 100%);
    margin: 0px;
    padding: 0em;
}

/*
---------------------------------------
  Adjusting the top bar to show
  properly in the mobile version
---------------------------------------
*/

@media (max-width: 768px) {
  .inside-top-bar {
    padding-right: 1rem;
    padding-left: 1rem;
  }
	
  .top-bar .inside-top-bar:last-child {
    margin-right: 0;
  }

  .top-bar .inside-top-bar:first-child {
    margin-left: 0;
  }

  .top-bar .inside-top-bar {
    justify-content: left;
  }

  .top-bar .inside-top-bar p {
    margin-bottom: 0;
  }
}

/* Custom error404 page */

.error404 .entry-header {
    margin-top: 10vh;
	margin-left: 5%;
	margin-right: 5%;
}

.error404 .entry-content {
    margin-bottom: 40vh;
	margin-left: 5%;
	margin-right: 5%;
}

.error404 h1 {
    font-size: 32px;
	font-family: Roboto, sans-serif;
}