/*
Theme Name: Moramoli
Text Domain: moramoli
Version: 1.0
Requires at least: 4.7
Requires PHP: 5.2.4
Description: Our default theme for 2020 is designed to take full advantage of the flexibility of the block editor. Organizations and businesses have the ability to create dynamic landing pages with endless layouts using the group and column blocks. The centered content column and fine-tuned typography also makes it perfect for traditional blogs. Complete editor styles give you a good idea of what your content will look like, even before you publish. You can give your site a personal touch by changing the background colors and the accent color in the Customizer. The colors of all elements on your site are automatically calculated based on the colors you pick, ensuring a high, accessible color contrast for your visitors.
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks, accessibility-ready
Author: Tuxideas
Author URI: https://tuxideas.com/
Theme URI: https://moramoli.com/
*/

body {
	color: rgb(153, 153, 153);
}

.navbar {
	justify-content: center;
}

.navbar .navbar-burger {
	color: #fff;
}

.navbar.is-transparent {
	background-color: rgba(32,32,32,.0);
	color: #fff;
	transition: all ease .5s;
}

.navbar.active {
	background-color: rgba(32,32,32,1);
}

.navbar .navbar-menu {
	flex-grow: 0;
}

.navbar .navbar-item {
	color: #fff;
}

.navbar .navbar-item:hover,
.navbar .navbar-item:focus,
.navbar .navbar-item:active {
	color: #e74c3c;
}

.navbar-item img {
	max-height: 3.75rem;
	transition: all ease .5s;
}

.navbar.active .navbar-item img {
	max-height: 2.75rem;
}

.navbar .navbar-menu a:hover,
.navbar .navbar-menu a.active {
	font-weight: bold;
	border-bottom: 4px solid #e74c3c;
}


@media (max-width: 1023px) {
	.navbar-menu {
		background-color: rgba(32,32,32,.6);
	}
}

.text-orange {
	color: #e74c3c;
}

.button.is-danger {
	background-color: #e74c3c;
}

.button.is-danger:hover {
	background-color: #bf2718;
}

.carousel-item {
	display: none;
}

.carousel-item.active {
  display: block;
}

.slider-navigation-previous, .slider-navigation-next {
	background: rgba(255, 255, 255, .5);
	border-radius: 2px;
	border: none;
	width: 36px;
	height: 36px;
	color: #4a4a4a;
}

.slider-navigation-previous:hover , .slider-navigation-next:hover {
	background: #e74c3c;
	color: #fff;
}

.slider-navigation-previous {
	left: 20px;
}

.slider-navigation-next {
	right: 20px;
}

.section-cursos {
	padding: 80px 0;
	position: relative;
	background: linear-gradient(90deg, #fff 25%, #e74c3c 25%);
	color: #fff;
	overflow: hidden;
	border-top: 1px solid #f4f5f9;
}

.section-gallery {
	overflow: hidden;
}

.section-cursos .content h3 {
	color: #fff;
}

.section-cursos .content ul {
	margin-left: 0;
}

.section-customers,
.section-contact {
	background-color: #f4f5f9;
	overflow: hidden;
}

.hero.has-background {
	position: relative;
	overflow: hidden;
}

.hero .hero-background {
	position: absolute;
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
}

.hero .hero-background.is-transparent {
      opacity: 0.3;
}

.hero.has-carousel {
	overflow: hidden;
	position: relative;
}

.triangle-left {
	width: 80%;
    height: 0;
    padding-bottom: 15%;
    overflow: hidden;

	bottom: 0;
	left: 0;
	position: absolute;
	z-index: 1;
}

.triangle-left:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-right: 2400px solid transparent;
    border-bottom: 500px solid #fff;
}

.triangle-right {
	width: 80%;
    height: 0;
    padding-bottom: 15%;
    overflow: hidden;

	bottom: 0;
	right: 0;
	position: absolute;
	z-index: 1;

	transform: scaleX(-1);
}

.triangle-right:after {
	content: "";
    display: block;
    width: 0;
    height: 0;
    border-right: 2400px solid transparent;
    border-bottom: 500px solid #fff;
}

.icon-scroll {
	position: absolute;
	left: 50%;
	bottom: 5%;
	margin-left: -25px;
	width: 50px;
	height: 50px;
	border: 3px solid rgba(255, 255, 255, .5);
	z-index: 1;
	border-radius: 50px;
	overflow: hidden;

	animation-duration: 3s;
	animation-name: zoom-bottom;
	animation-iteration-count: infinite;
}

.icon-scroll div {
	background-color: #fff;
	padding: 8px;
	width: 100%;
	height: 100%;
}

.icon-scroll svg {
	width: 100%;
	height: auto;
	fill: #e74c3c;
}

.logos-partidos {
	background-color: #fff;
	border-radius: 2px;
	transition: all ease .5s;
}

.logos-partidos:hover {
	-webkit-box-shadow: 0px 0px 5px 6px #ccc;
	-moz-box-shadow:    0px 0px 5px 6px #ccc;
	box-shadow:         0px 0px 5px 6px #ccc;
	transform: scale(1.1);
}

.gallery-item {
	width: 100%;
	position: relative;
}

.gallery-item img {
	display: block;
	width: 100%;
	height: auto;
}

.gallery-item .gallery-item-content {
	background-color: rgba(231, 76, 60, .7);
	position: absolute;
	z-index: 1;
	min-width: 100%;
	min-height: 50%;
	padding: 20px;
	color: #fff;
	bottom: 0;
	left: 0;
	opacity: 0;
	transition: all ease .5s;

	display: flex;
	justify-content: flex-end;
	flex-direction: column;
}

.gallery-item .gallery-item-content .line {
	width: 30px;
	height: 3px;
	background-color: #fff;
	margin-bottom: 15px;
}

.gallery-item:hover .gallery-item-content {
	opacity: 1;
	min-height: 100%;
}

.contact-block {
	background-color: #fff;
	padding: 40px;
}

.contact-block p,
.contact-block address,
.contact-block p a {
	text-decoration: none;
	color: rgb(153, 153, 153);
	font-style: normal;
}

.contact-block input,
.contact-block textarea {
	border: none;
	border-bottom: 1px solid rgb(153, 153, 153);
	color: rgb(153, 153, 153);
	box-shadow: none;
	border-radius: 0;
	resize: none;
}

#returntop {
	position: fixed;
	display: none;
	background-color: #e74c3c;
	border: 1px solid #e74c3c;
	border-radius: 50px;
	width: 45px;
	height: 45px;
	padding: 15px;
	right: 20px;
	bottom: 40px;
	justify-content: center;
	z-index: 2;
	transition: all ease .5s;
}

#returntop img {
	max-width: 100%;
	height: auto;
}

#returntop:hover {
	background-color: #202020;
	border: 1px solid #fff;
}

#returntop.active {
	display: flex;
}

.line-heading {
	width: 5px;
	height: 5px;
	border-radius: 5px;
	background-color: #e74c3c;
	margin: 0px auto 30px auto;
	position: relative;
}

.carousel-item .line-heading {
	margin: -10px auto 10px;
}

.line-heading:before,
.line-heading:after {
	content: " ";
	display: block;
	position: absolute;
	top: 2px;
	width: 60px;
	height: 1px;
	background-color: rgb(154, 154, 154);
}

.line-heading:before {
	left: -65px;
}

.line-heading:after {
	right: -65px;
}

@media (hover: none) {
	.gallery-item .gallery-item-content {
		opacity: 1;
	}
}

footer {
	padding: 10px;
	background-color: #202020;
	color: #fff;
}

footer .button.is-black {
	background-color: #202020;
}

footer .button.is-black:hover {
	color: #e74c3c;
}

@media (max-width: 768px) {
	.triangle-left {
		width: 100%;
		padding-bottom: 20%;
	}

	.triangle-right {
		width: 100%;
		padding-bottom: 20%;
	}

	.icon-scroll {
		bottom: 3%;
	}

	.section-cursos {
		padding: 0 0 80px 0;
		background: linear-gradient(90deg, #fff 0%, #e74c3c 0%);
	}

	.section-cursos img {
		margin-bottom: 40px;
	}

	.section-cursos .column {
		/*padding: 0;*/
	}

	footer {
		text-align: center;
	}

	footer .buttons {
		justify-content: center;
	}
}

@keyframes zoom-bottom {
  0% { transform: scale(1); }
  50% { transform: scale(1.2); }
  100% { transform: scale(1); }
}