/*!
Theme Name: ukrbus
Theme URI: http://underscores.me/
Author: Dima Krupa
Author URI: https://t.me/dima_krupa
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: ukrbus
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

ukrbus is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/


/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/



/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}


/* USER VARIABLES SECTION */
/* FONTS LOAD SECTION */
/* GENERAL CSS SETTINGS */
::placeholder {
	color: #666;
  }
  
  ::selection {
	background-color: #59267C;
	color: #fff;
  }
  
  input, textarea {
	outline: none;
  }
  
  input:focus:required:invalid, textarea:focus:required:invalid {
	border-color: red;
  }
  
  input:required:valid, textarea:required:valid {
	border-color: green;
  }
  
  * {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
  }
  
  html {
	scroll-behavior: smooth;
  }
  
  body {
	font-family: "Montserrat", sans-serif;
	font-size: 16px;
	line-height: 1.2;
	color: #646464;
	overflow-x: hidden;
	position: relative;
  }
  
  .container {
	max-width: 1220px;
	margin: 0 auto;
	padding: 0 20px;
  }
  
  @keyframes fade {
	from {
	  opacity: 0;
	}
	to {
	  opacity: 1;
	}
  }
  @keyframes fade-left {
	from {
	  transform: translateX(-100%);
	}
	to {
	  transform: translateX(0);
	}
  }
  @keyframes fade-right {
	from {
	  transform: translateX(200%);
	}
	to {
	  transform: translateX(0);
	}
  }
  @-webkit-keyframes shakeY {
	from, to {
	  -webkit-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0);
	}
	10%, 30%, 50%, 70%, 90% {
	  -webkit-transform: translate3d(0, -5px, 0);
	  transform: translate3d(0, -5px, 0);
	}
	20%, 40%, 60%, 80% {
	  -webkit-transform: translate3d(0, 5px, 0);
	  transform: translate3d(0, 5px, 0);
	}
  }
  @keyframes shakeY {
	from, to {
	  -webkit-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0);
	}
	10%, 30%, 50%, 70%, 90% {
	  -webkit-transform: translate3d(0, -5px, 0);
	  transform: translate3d(0, -5px, 0);
	}
	20%, 40%, 60%, 80% {
	  -webkit-transform: translate3d(0, 5px, 0);
	  transform: translate3d(0, 5px, 0);
	}
  }
  .animate__shakeY {
	-webkit-animation-name: shakeY;
	animation: shakeY 3s linear infinite;
  }
  
  /* USER STYLES */
  a, a:visited {
	text-decoration: none;
	font-size: 14px;
	transition: color 0.3s ease-in-out;
  }
  
  a:hover {
	color: #B02E61;
  }
  
  #go-top {
	position: fixed;
	bottom: 25px;
	right: 30px;
	text-align: center;
	cursor: pointer;
	display: none;
	padding: 30px 30px;
	border-radius: 50px;
	background: #FFCD04;
	color: #fff;
	transition: all 0.3s ease-in-out;
	z-index: 1000;
  }
  
  #go-top span {
	font-size: 25px;
	display: flex;
	align-items: center;
	justify-content: center;
  }
  
  #go-top:hover {
	background: #fadbdb;
	color: #000;
  }
  
  .stop-scroll {
	overflow-y: hidden;
  }
  
  .decor_items {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: -1;
	overflow: hidden;
  }
  
  .decor_item-1 {
	width: 598px;
	height: 598px;
	border-radius: 100%;
	background: rgba(116, 73, 147, 0.2);
	filter: blur(51.5px);
	position: absolute;
	top: -280px;
	left: -370px;
  }
  
  .decor_item-3 {
	width: 962px;
	height: 962px;
	border-radius: 962px;
	background: rgba(111, 67, 142, 0.09);
	filter: blur(35.5px);
	position: absolute;
	bottom: -780px;
	left: -500px;
	z-index: -1;
  }
  
  .header {
	padding: 15px 0;
  }
  
  .header_container {
	display: flex;
	align-items: center;
	justify-content: space-between;
  }
  
  .decor_item-2 {
    width: 324px;
    height: 324px;
    border-radius: 324px;
    background: rgba(121, 79, 151, 0.13);
    filter: blur(51.5px);
    position: absolute;
    top: -192px;
    right: -40px;
  }
  
  .logo {
	width: 130px;
  }
  
  .phrase {
	border-radius: 20px;
	background: #FDFAFF;
	box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
	padding: 15px 20px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	position: relative;
	z-index: 10;
  }
  .phrase::after {
	content: "";
	position: absolute;
	bottom: -12px;
	right: 50px;
	filter: drop-shadow(0px 8px 4px rgba(0, 0, 0, 0.25));
	width: 0;
	height: 0;
	border: 0 solid transparent;
	border-left-width: 9px;
	border-right-width: 9px;
	border-top: 15px solid #fff;
	z-index: 1;
  }
  
  .phrase_icon {
	font-size: 40px;
	margin-right: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
  }
  
  .phrase_text {
	color: #333;
	font-size: 16px;
	font-style: normal;
	font-weight: 300;
  }
  
  .hero {
	padding-top: 50px;
	padding-bottom: 50px;
  }
  
  .hero_content {
	display: flex;
	align-items: center;
	justify-content: space-between;
  }
  
  .hero_left {
	width: 702px;
  }
  
  .hero_title {
	color: #000;
	font-size: 36px;
	font-weight: 700;
  }
  
  .hero_text {
	display: block;
	width: 580px;
	color: #000;
	font-size: 16px;
	font-weight: 400;
	margin-top: 15px;
  }
  
  .advantages {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-top: 10px;
	width: 680px;
  }
  
  .advantage {
	width: 275px;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	margin-top: 20px;
	margin-right: 20px;
	margin-bottom: 10px;
  }
  
  .advantage_icon {
	font-size: 35px;
	margin-right: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #A989C1;
  }
  
  .advantage_text {
	color: #000;
	font-size: 15px;
	font-weight: 500;
  }
  
  .viber-cards {
	width: 680px;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
  }
  
  .viber-card {
	width: 320px;
	margin-right: 14px;
	margin-top: 14px;
	margin-bottom: 14px;
	border-radius: 20px;
	padding: 20px 15px;
	background: linear-gradient(180deg, #59267C 41.76%, rgba(143, 93, 183, 0.67) 100%);
	box-shadow: 5px 4px 18px 0px rgba(0, 0, 0, 0.32);
	color: #fff;
	transition: box-shadow 0.3s ease-in-out;
	display: flex;
	flex-direction: column;
	gap: 15px;
  }
  .viber-card:hover {
	box-shadow: 5px 4px 18px 0px rgba(0, 0, 0, 0.562);
  }
  
  .viber-card_header {
	display: flex;
	align-items: center;
	justify-content: flex-start;
  }
  
  .viber-card_icon {
	font-size: 35px;
	margin-right: 15px;
	color: #fff;
	display: flex;
	align-items: center;
  }
  
  .viber-card_title-wrap {
	display: flex;
	flex-direction: column;
  }
  
  .viber-card_title {
	font-size: 18px;
	font-weight: 700;
  }
  
  .viber-card_subtitle {
	font-size: 13px;
	font-weight: 300;
	margin-top: 3px;
  }
  
  .viber-card_text {
	text-align: center;
  }
  
  .viber-card_cost {
	font-size: 16px;
  }
  
  .viber-card_cost-name {
	font-weight: 500;
  }
  
  .viber-card_cost-value {
	font-weight: 700;
  }
  
  .viber-card_time {
	font-size: 15px;
	font-weight: 700;
	margin-top: 15px;
  }
  
  .viber-card_cta-text {
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
	margin-top: 5px;
  }
  
  .button {
	border-radius: 20px;
	background-color: #F58D3D;
	padding: 10px 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: #000;
	font-size: 15px;
	font-weight: 700;
	border: none;
	text-transform: uppercase;
	transition: background-color 0.3s ease-in-out;
  }
  .button:hover {
	background-color: #f07d24;
	color: #000;
	cursor: pointer;
  }
  
  .hero_right {
	width: 615px;
	margin-right: -140px;
  }
  
  .hero_right img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
  }
  
  .hero_right_small_img {
	display: none;
  }
  
  .footer {
	background: #FFF;
	box-shadow: 0px -2px 12px 0px rgba(0, 0, 0, 0.15);
	padding: 20px;
	color: #797979;
	font-size: 15px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	text-align: center;
	z-index: 1;
  }
  
  .footer_content {
	display: flex;
	align-items: center;
	justify-content: center;
  }
  /* Модальне вікно */
#redirectModal {
    display: none; /* Приховане за замовчуванням */
    position: fixed; /* Залишатися на місці */
    z-index: 1; /* Лежить над усіма іншими елементами */
    left: 0;
    top: 0;
    width: 100%; /* Повна ширина */
    height: 100%; /* Повна висота */
    overflow: auto; /* Додати прокрутку, якщо потрібно */
    background-color: rgb(0,0,0); /* Чорний колір з невеликою прозорістю */
    background-color: rgba(0,0,0,0.4); /* Чорний колір з невеликою прозорістю */
}
/* Модальне вмістове вікно */
#redirectModalContent {
    background-color: #fefefe;
    margin: 15% auto; /* 15% від верху та по центру */
    padding: 20px;
    border: 1px solid #888;
    width: 80%; /* 80% ширина */
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}
/* Додаткові стилі для екранів менше 600 пікселів */
@media screen and (max-width: 600px) {
    #redirectModalContent {
        width: 100%;
    }
}
/*# sourceMappingURL=main.css.map */