/*
Theme Name: Ruou Han Quoc 2020
Description: This is a child theme for Ruou Han Quoc 2020
Author: MuaTheme.com
Template: flatsome
Version: 1.0.0
*/

/**
 * Global
 */
p {
	margin-bottom: 10px;
}

.mh-no-margin {
	margin: 0 !important;
}

.mh-no-padding {
	padding: 0 !important;
}

.mh-no-margin-bottom {
	margin-bottom: 0 !important;
}

.mh-no-padding-bottom {
	padding-bottom: 0 !important;
}

.mh-font-size-x-large {
	font-size: 25px !important;
}

.mh-font-size-large {
	font-size: 22px;
}

.mh-font-size-normal {
	font-size: 19px !important;
}

.mh-font-size-small {
	font-size: 17px !important;
}

.mh-font-small {
	font-size: 14px;
}

.mh-font-normal {
	font-weight: normal !important;
}

.mh-font-bold {
	font-weight: bold;
}

.mh-font-italic {
	font-style: italic;
}

.mh-color-primary {
	color: var(--primary-color) !important;
}

.mh-text-justify {
	text-align: justify;
}

.mh-fontawesome::before,
.mh-fontawesome::after,
.menu-item > a::before,
.menu-item > a::after {
	display: inline-block;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font-family: "Font Awesome 5 Pro";
	font-weight: 900;
	margin-right: 7px;
}

.mh-flex-row {
	display: flex !important;
	flex-direction: row;
}

.mh-list {
	list-style-type: none;
}

.mh-list > li {
	margin: 0;
}

/* Form */
select, input, textarea,
.mh-input {
	box-shadow: none !important;
	-moz-box-shadow: none !important;
	-webkit-box-shadow: none !important;
	-o-box-shadow: none !important;
}

input::placeholder,
textarea::placeholder,
select.mh-input::placeholder,
input.mh-input::placeholder,
input.mh-input[type='date']::placeholder {
	font-weight: 300;
}

.wpcf7-form {
	margin-bottom: 0;
}

.mh-form-2-col,
.mh-form-3-col {
	justify-content: space-between;
	align-items: center;
}

.mh-form-2-col > label {
	flex-basis: 49%;
}

/* UX Theme */
.mh-col-no-divider .is-divider {
	display: none;
}

	/* Title */
.mh-title-simple {
	padding: 0;
}

.mh-title-simple b {
	display: none;
}

.mh-title-simple .section-title,
.mh-title-simple .section-title-main{
	border: 0;
	padding: 0;
	margin: 0;
}

.mh-title-simple.center .section-title {
	justify-content: center;
}

.mh-title-simple.right .section-title {
	justify-content: flex-end;
}

.mh-title-simple.bold .section-title,
.mh-title-simple.bold .section-title-main {
	font-weight: 700;
}

.mh-title-simple.initial .section-title-main {
	text-transform: initial;
	position: relative;
}

.mh-title-simple.alba-matter .section-title,
.mh-title-simple.alba-matter .section-title-main {
	font-family: 'alba-matter';
	font-weight: normal;
}

/* Custom fonts */
@font-face {
	font-family: 'beautiful-caps';
	src: url('assets/fonts/beautiful-caps/200114033306Beautiful-Caps.woff2') format('woff2'),
	url('assets/fonts/beautiful-caps/200114033306Beautiful-Caps.woff') format('woff');
	font-display:swap;
}

@font-face {
	font-family: 'alba-matter';
	src: url('assets/fonts/alba-matter/200115033553Alba-Matter.woff2') format('woff2'),
		url('assets/fonts/alba-matter/200115033553Alba-Matter.woff') format('woff');
	font-display:swap;
}

.alba-matter {
	font-family: 'alba-matter' !important;
}

.beautiful-caps {
	font-family: 'beautiful-caps' !important;
}

/* Slider */
.mh-slider-custom-arrow .flickity-button {
	background-color: #6e6e6e70;
	border: 1px solid #6e6e6e00;
	max-height: 45px;
	min-width: 45px;
	margin: 0 !important;
}

.mh-slider-custom-arrow:hover .flickity-button {
	opacity: 1;
}

.mh-slider-custom-arrow .flickity-button.previous {
	left: -2%;
}

.mh-slider-custom-arrow .flickity-button.next {
	right: -2%;
}

.mh-slider-custom-arrow .flickity-button > svg {
	display: none;
}

.mh-slider-custom-arrow .flickity-button.previous::before,
.mh-slider-custom-arrow .flickity-button.next::before {
	content: '';
	height: 12px;
	width: 12px;
	display: block;
	transform: translate(0,-50%) rotate(45deg);
	-moz-transform: translate(0,-50%) rotate(45deg);
	-webkit-transform: translate(0,-50%) rotate(45deg);
	-o-transform: translate(0,-50%) rotate(45deg);
	z-index: 2;
	margin: auto;
	position: absolute;
}

.mh-slider-custom-arrow .flickity-button.previous::before {
	left: 17px;
}

.mh-slider-custom-arrow .flickity-button.next::before {
	right: 17px;
}

.mh-slider-custom-arrow .flickity-button:hover {
	background-color: var(--primary-color);
	border-color: var(--primary-color);
}

.mh-slider-custom-arrow .flickity-button.previous::before {
	border-bottom: 3px solid #fff;
	border-left: 3px solid #fff;
}

.mh-slider-custom-arrow .flickity-button.next::before {
	border-top: 3px solid #fff;
	border-right: 3px solid #fff;
}

.mh-slider-custom-arrow .flickity-button:hover::before {
	border-color: #fff;
}

/**
 * Header
 */
/* Topbar */
#top-bar {
	padding: 10px 0 0;
}

#top-bar .searchform .search-field {
	min-width: 245px;
	min-height: 32px;
	line-height: 32px;
	background-color: #0039e6;
	font-size: 13px;
}

#top-bar .searchform .ux-search-submit {
	border: 0;
  line-height: 32px;
}

#top-bar .searchform .ux-search-submit i {
	color: var(--primary-color);
}

#top-bar .social-icons a {
	font-size: 16px;
	color: #919191;
}

#top-bar .cart-item span {
	color: var(--primary-color);
	font-size: 14px;
	font-weight: bold;
}

#top-bar .cart-item .icon-shopping-bag {
	display: none;
}

/* Main */
#masthead .hide-for-medium.flex-left .html_topbar_right {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	background-color:rgba(113,27,26,0.9);
	padding:4px;
	color:#ffffff;
	min-width: 285px;
}
#masthead .hide-for-medium.flex-left .html_topbar_right a, #masthead .hide-for-medium.flex-left .html_topbar_right a:visited{
	color:#ffffff;
}
#masthead .hide-for-medium.flex-left .html_topbar_right::before {
	content: "\f879";
	display: inline-flex;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font-family: "Font Awesome 5 Pro";
	font-weight: 100;
	margin-right: 10px;
	min-width: 40px;
	min-height: 40px;
	align-items: center;
	justify-content: center;
	border: 1px solid #ffffff;
	color: #ffffff;
	font-size: 16px;
	border-radius: 100%;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	-o-border-radius: 100%;
}

#masthead .mh-top-hotline .hotline,
#masthead .mh-top-hotline .hotline a {
	color: #ffffff;
	text-transform: uppercase;
	font-size: 18px;
	font-weight: bold;
	line-height: 1.3;
}

#masthead .mh-top-hotline p,
#masthead .mh-top-hotline p a {
	font-size: 14px;
  color: #8a8a8a;
	line-height: 1.3;
}

#masthead .hide-for-medium.flex-right .html_topbar_left {
	width: 100%;
}

#masthead .hide-for-medium.flex-right .html_topbar_left p {
	color: var(--primary-color);
	font-size: 30px;
}

#masthead .hide-for-medium.flex-right .html_topbar_left p span {
	display: block;
}

#masthead #logo img {
	position: absolute;
  top: -20px;
  /* left: 48%; */
  max-height: 126px;
}

/* Bottom */
#wide-nav .hide-for-medium.flex-left {
	margin: 0;
}

#wide-nav .hide-for-medium.flex-left #mega-menu-wrap {
	background-color: var(--primary-color);
}

#wide-nav .hide-for-medium.flex-left #mega-menu-wrap:hover {
	background-color: #62bf33;
}

#wide-nav .hide-for-medium.flex-left #mega-menu-wrap i {
	opacity: 1;
	font-size: 20px;
	position: relative;
	top: 3px;
}

#wide-nav .hide-for-medium.flex-left #mega-menu-title {
	min-height: 50px;
	line-height: 50px;
	padding: 0 20px;
  font-size: 16px;
}

#wide-nav .hide-for-medium.flex-right {
	border-bottom: 1px solid var(--primary-color);
  border-top: 1px solid var(--primary-color);
}

#wide-nav .hide-for-medium.flex-right > .header-nav > li {
	margin: 0 25px;
}

#wide-nav .hide-for-medium.flex-right > .header-nav > li > a:hover,
#wide-nav .hide-for-medium.flex-right > .header-nav > li.active > a {
  font-weight: bold;
}

#wide-nav #mega-menu-wrap #mega_menu {
	border-color: var(--primary-color);
}

#wide-nav #mega-menu-wrap #mega_menu > li > a {
	background-color: var(--primary-color);
	border-color: var(--primary-color);
	font-size: 16px;
	color: #fff;
}
.nav>li>a:hover, .nav>li.active>a, .nav>li.current>a, .nav>li>a.active, .nav>li>a.current, .nav-dropdown li.active>a, .nav-column li.active>a, .nav-dropdown>li>a:hover, .nav-column li>a:hover {
    color: var(--primary-color);
}
#wide-nav #mega-menu-wrap #mega_menu > li > a:hover {
	color: #62bf33;
}

#wide-nav #mega-menu-wrap #mega_menu > li > a::after {
  border-left-color: #fff;
}

#wide-nav #mega-menu-wrap #mega_menu > li > .sub-menu > li > a {
	font-size: 16px;
	min-width: 285px;
}

/**
 * Footer
 */
/* Main */
.mh-custom-footer {
	border-top: 10px solid #a63433;
	border-bottom: 15px solid #430200;
}

.mh-col-footer .widget {
	padding: 0;
	margin: 0;
}

.mh-col-footer .section-title-main {
	font-weight: normal;
	font-size: 18px;
}

.mh-col-footer p {
  margin: 0 0 5px;
}

.mh-col-footer p,
.mh-col-footer a {
	font-size: 13px;
}

.mh-col-footer a:hover {
	text-decoration: underline;
}

.mh-col-footer .menu li {
	border: 0;
}

.mh-col-footer .menu li a {
	padding: 3px 0;
}

.mh-col-footer .social-icons {
	margin: 0 0 20px;
}

.mh-col-footer .social-icons a {
	font-size: 18px;
  margin: 0 10px;
}

.mh-col-footer .social-icons a:last-child {
	margin-right: 0;
}

.mh-col-footer .wpcf7-form p {
	margin: 0;
}

.mh-col-footer .wpcf7-form input {
	min-height: 35px;
	line-height: 35px;
	font-size: 13px;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	font-weight: normal;
}

.mh-col-footer .wpcf7-form .wpcf7-submit {
	background-color: #000;
	border: 0;
	margin: 0;
}

.mh-col-footer .mh-copyright {
	font-weight: bold;
	font-size: 14px;
	margin: 0;
}

/* Bottom */
.absolute-footer {
	display: none;
}

/**
 * Blog
 */
/* Global */
/* body.single-post .blog-wrapper > .row > .col,
body.archive.category .blog-wrapper > .row > .col {
	max-width: 100%;
	-ms-flex-preferred-size: 100%;
	flex-basis: 100%;
} */

.blog-wrapper .entry-image .badge,
.blog-archive .badge,
.blog-wrapper .is-divider {
	display: none;
}

/* Archive */
.archive-page-header .page-title {
	font-size: 30px;
	font-weight: normal;
	font-family: 'alba-matter';
	text-transform: initial;
	margin: 0 0 20px;
	color: var(--primary-color);
}

/* .blog-archive .col.post-item .box-image {
  width: 30% !important;
} */

.blog-archive .col.post-item .box-text {
	vertical-align: top;
}

.blog-archive .col.post-item .box-text-inner {
	display: flex;
	flex-direction: column;
}

.blog-archive .col.post-item .post-title {
	font-weight: normal;
	margin: 0 0 5px;
	font-size: 22px;
	color: var(--primary-color);
	order: 1;
}

.blog-archive .col.post-item .box-text .post-meta,
.blog-archive .col.post-item .box-text .from_the_blog_excerpt {
	margin: 0;
	font-size: 14px;
  color: #000;
	opacity: 1;
}

.blog-archive .col.post-item .box-text .post-meta {
	order: 2;
}

.blog-archive .col.post-item .box-text .post-meta i {
	margin-right: 5px;
}

.blog-archive .col.post-item .box-text .from_the_blog_excerpt {
	order: 3;
}

.blog-archive .col.post-item .box-text .from_the_blog_excerpt span {
  font-size: 15px;
	color: var(--primary-color);
}

.blog-archive .col.post-item .box-text .mh-readmore {
	order: 4;
	background-color: #000;
	color: #fff;
	display: inline-block;
	max-width: 120px;
	font-weight: normal;
	font-size: 14px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-o-border-radius: 5px;
	text-transform: inherit;
}

/* Single */
.blog-single .entry-header .entry-category {
	display: none;
}

.blog-single .entry-header .entry-header-text {
	text-align: center;
	padding-bottom: 10px;
}

.blog-single .entry-header .entry-title {
  font-size: 26px;
  line-height: 40px;
	font-weight: normal;
	font-family: 'alba-matter';
	text-transform: initial;
	margin: 0 0 10px;
	color: var(--primary-color);
}

.blog-single .entry-header .entry-meta {
	font-size: 14px;
  text-transform: initial;
}

.blog-single .entry-header .entry-meta::before {
	content: '\f073';
	display: inline-block;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font-family: "Font Awesome 5 Pro";
	margin-right: 5px;
}

.blog-single .entry-content.single-page {
  text-align: justify;
  padding: 10px 0 0;
}

/**
 * Woocommerce
 */
/* Global */
.badge span {
	font-weight: normal;
}

.price-wrapper .price {
	display: flex;
	flex-direction: row;
	font-weight: normal;
}

.price-wrapper > .price > .mh-price-prefix {
	order: 1;
	margin-right: 5px;
}

.price-wrapper > .price > ins,
.price-wrapper > .price > span.amount {
	order: 2;
}

.price-wrapper > .price > del {
	order: 3;
}

.price-wrapper > .price > ins {
	margin-right: 5px;
}

.price-wrapper > .price > del span {
	opacity: 1;
	color: #818181;
}

/* Archive */
.shop-page-title .flex-col > .is-large {
	display: none;
}

.shop-page-title .flex-col {
	font-size: 13px;
}

.shop-page-title .shop-page-title {
	font-family: 'alba-matter';
	color: var(--primary-color);
	font-size: 30px;
	margin: 0;
	font-weight: normal;
}

/* Box product */
.product-small.box .box-image {
	border: 1px solid #ccc;
}

.product-small.box .box-text-products {
	padding: 20px 0;
}

.product-small.box .box-text-products .name.product-title {
	margin: 0 0 7px;
}

.product-small.box .box-text-products .name.product-title a {
	margin: 0;
	font-size: 16px;
	color: #868686;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 2;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	min-height: 45px;
	line-height: 1.4;
}

.product-small.box .box-text-products .price-wrapper .price {
	font-size: 15px;
	color: #868686;
	justify-content: center;
}

.box-text-products .price-wrapper .price > span.amount,
.box-text-products .price-wrapper ins span {
	color: var(--primary-color);
}

.box-text-products .price-wrapper del span {
	font-size: 14px;
}

/* Single */
.product-gallery .product-gallery-slider,
.product-gallery .product-thumbnails a:hover,
.product-gallery .product-thumbnails .is-nav-selected a {
  border: 1px solid #ddd;
}

.product-gallery .badge span {
  font-size: 17px;
}

.product-info .woocommerce-breadcrumb {
	display: none;
}

.product-info .product-title {
	font-family: 'alba-matter';
	text-transform: initial;
	margin: 0 0 25px;
	color: var(--primary-color);
	font-size: 30px;
	font-weight: normal;
}

.product-info .product-page-price {
	align-items: flex-end;
  margin: 0 0 15px;
}

.product-info .product-page-price > del span {
	margin: 0;
	font-size: 16px;
}

.product-info .product-page-price > ins span {
	font-weight: normal;
	color: #62bf33;
}

.product-info .product-page-price > .mh-price-prefix {
	font-size: 15px;
  margin-right: 7px;
}

.product-info form.cart .mh-before-quantity {
	display: inline-block;
	line-height: 36px;
	margin-right: 10px;
	font-size: 15px;
}

.product-info form.cart .quantity,
.product-info form.cart .single_add_to_cart_button {
	margin-bottom: 0;
}

.product-info form.cart .single_add_to_cart_button {
	border-radius: 25px;
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	-o-border-radius: 25px;
	border: 0;
	font-weight: normal;
	font-size: 14px;
	line-height: 36px;
	min-height: 36px;
	padding: 0 30px;
}

.product-info .product_meta {
	font-size: 15px;
}

.product-info .product_meta > span {
	padding: 15px 0 0;
}

.product-info .product_meta > span,
.product-info .product_meta a {
	color: #818181;
	font-size: 15px;
}

.product-info .mh-more-info {
	margin: 0 0 25px;
}

.product-info .mh-more-info p {
	font-size: 15px;
	color: #818181;
	margin: 0 0 5px;
}

.product-info .mh-more-info p span {
	font-weight: bold;
}

.product-footer .woocommerce-tabs,
.product-footer .related {
	border: 0;
}

.product-footer .related > h3,
.product-footer .woocommerce-tabs > ul {
	border-bottom: 1px solid #ececec;
}

.product-footer .related > h3,
.product-footer .woocommerce-tabs > ul > li > a {
	font-family: 'alba-matter';
	color: var(--primary-color);
	font-size: 25px;
	text-align: center;
	font-weight: normal;
}

.product-footer .woocommerce-tabs > ul > li > a::before {
	display: none;
}

.product-footer .woocommerce-tabs .tab-panels {
  padding-top: 20px;
}

.product-footer .related > h3 {
	max-width: 100%;
  margin: 0 0 30px;
}

/* ===== Page ===== */
/**
 * Global
 */
.mh-col-title .beautiful-caps {
  font-size: 40px;
  margin: 0 0 10px;
}

.mh-col-title .mh-sub-title {
  font-size: 18px;
  line-height: 30px;
  color: #868686;
  margin: 0;
}

/**
 * Homepage
 */
/* Category */
.mh-box-category .box-text h4 {
  text-shadow: 3px 3px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
  text-transform: uppercase;
  font-size: 24px;
  line-height: 35px;
  color: var(--primary-color);
  font-family: 'alba-matter';
  font-weight: normal;
}

/* Blog */
.mh-widget-blog .post-title {
  margin: 0 0 7px;
  color: var(--primary-color);
  font-size: 16px;
}

.mh-widget-blog .post-meta,
.mh-widget-blog .from_the_blog_excerpt  {
  margin: 0;
  font-size: 12px;
}

.mh-widget-blog .post-meta::before {
  content: "\f073";
  display: inline-block;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font-family: "Font Awesome 5 Pro";
	font-weight: 100;
	margin-right: 5px;
}

/**
 * Page: Liên hệ
 */
/* Thông tin ... */
.mh-box-contact {
  align-items: center;
}

.mh-box-contact .icon-box-img img {
  border-radius: 100%;
  -moz-border-radius: 100%;
  -webkit-border-radius: 100%;
  -o-border-radius: 100%;
  box-shadow: 0 1px 3px -2px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  -moz-box-shadow: 0 1px 3px -2px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  -webkit-box-shadow: 0 1px 3px -2px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  -o-box-shadow: 0 1px 3px -2px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}

.mh-box-contact .icon-box-text {
  padding-left: 25px !important;
}

.mh-box-contact .icon-box-text h5.uppercase {
  color: var(--primary-color);
  font-size: 14px;
}

.mh-box-contact .icon-box-text p {
  font-size: 14px;
}

.mh-box-contact .mh-time-work > span:not(:first-child) {
  padding-left: 56px;
  display: block;
}

/* Form */
.mh-col-form-contact input {
  min-height: 40px;
}

.mh-col-form-contact textarea {
  min-height: 130px;
}

.mh-col-form-contact .mh-input,
.mh-col-form-contact .mh-submit {
  border-radius: 5px;;
  -moz-border-radius: 5px;;
  -webkit-border-radius: 5px;;
  -o-border-radius: 5px;
  font-size: 13px;
}

.mh-col-form-contact .mh-submit {
  min-width: 125px;
  border: 0;
  margin: 0;
  background-color: #000 !important;
}

/* ===== Responsive ===== */
/**
 * Tablet + Mobile
 */
@media only screen and (min-width: 320px) and (max-width: 860px) {
/* Global */
  /* Slider */
  .mh-slider-custom-arrow .flickity-button {
    display: none;
  }

/* Header */
  #masthead #logo img {
    position: static;
    max-height: 95px;
  }

  #masthead .icon-shopping-bag {
    color: #62bf33;
  }

/* Homepage */
	/* Tiêu đề */
	.mh-col-title .mh-sub-title {
		font-size: 15px;
		line-height: 1.3;
	}

  /* Danh mục ... */
  .mh-box-category .box-text h4 {
    margin: 0;
  }


}

/**
 * Tablet
 */
@media only screen and (min-width: 426px) and (max-width: 860px) {

}

/**
 * Mobile
 */
@media only screen and (min-width: 320px) and (max-width: 425px) {

}

@media only screen and (max-width: 320px) {

}

/*
 * Animated CSS button
 * Copyright Alexander Bodin 2019-09-07
 *
 * Useage: .class {@import button($button-size, $hue, $sat);}
 */
.animated-button {
  background: linear-gradient(-30deg, #0b1b3d 50%, #08142b 50%);
  padding: 5px 10px 5px 10px;
  margin: 1px;
  display: inline-block;

  border-radius: 10px;
  -webkit-transform: translate(0%, 0%);
          transform: translate(0%, 0%);
  overflow: hidden;
  color: #d4e0f7;
  font-size: 10px;
  letter-spacing: 1.2px;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  -webkit-box-shadow: 0 5px 25px rgba(0, 0, 0, 0.5);
          box-shadow: 0 5px 25px rgba(0, 0, 0, 0.5);
}

.animated-button::before {
  content: '';
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: #8592ad;
  opacity: 0;
  -webkit-transition: .2s opacity ease-in-out;
  transition: .2s opacity ease-in-out;
}

.animated-button:hover::before {
  opacity: 0.2;
}

.animated-button span {
  position: absolute;
}


.animated-button span:nth-child(1) {
  top: 0px;
  left: 0px;
  width: 100%;
  height: 2px;
  background: -webkit-gradient(linear, right top, left top, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to left, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateTop linear infinite;
          animation: 2s animateTop linear infinite;
}
.animated-button span:nth-child(2) {
  top: 0px;
  right: 0px;
  height: 100%;
  width: 2px;
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to top, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateRight linear -1s infinite;
          animation: 2s animateRight linear -1s infinite;
}
.animated-button span:nth-child(3) {
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 2px;
  background: -webkit-gradient(linear, left top, right top, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to right, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateBottom linear infinite;
          animation: 2s animateBottom linear infinite;
}
.animated-button span:nth-child(4) {
  top: 0px;
  left: 0px;
  height: 100%;
  width: 2px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to bottom, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateLeft linear -1s infinite;
          animation: 2s animateLeft linear -1s infinite;
}

.animated-button1 {
  background: transparent;
  padding: 5px 10px 5px 10px;
  margin: 1px;
  display: inline-block;
    border: 1px solid #2662d9;
  border-radius: 10px;
  -webkit-transform: translate(0%, 0%);
          transform: translate(0%, 0%);
  overflow: hidden;
  color: #2662d9;
  font-size: 10px;
  letter-spacing: 1.2px;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  -webkit-box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
          box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
}

.animated-button1::before {
  content: '';
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: transparent;
  opacity: 0;
  -webkit-transition: .2s opacity ease-in-out;
  transition: .2s opacity ease-in-out;
}

.animated-button1:hover::before {
  opacity: 0.2;
}

.animated-button1 span {
  position: absolute;
}

.animated-button1 span:nth-child(1) {
  top: 0px;
  left: 0px;
  width: 100%;
  height: 2px;
  background: -webkit-gradient(linear, right top, left top, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to left, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateTop linear infinite;
          animation: 2s animateTop linear infinite;
}
.animated-button1 span:nth-child(2) {
  top: 0px;
  right: 0px;
  height: 100%;
  width: 2px;
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to top, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateRight linear -1s infinite;
          animation: 2s animateRight linear -1s infinite;
}
.animated-button1 span:nth-child(3) {
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 2px;
  background: -webkit-gradient(linear, left top, right top, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to right, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateBottom linear infinite;
          animation: 2s animateBottom linear infinite;
}
.animated-button1 span:nth-child(4) {
  top: 0px;
  left: 0px;
  height: 100%;
  width: 2px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to bottom, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateLeft linear -1s infinite;
          animation: 2s animateLeft linear -1s infinite;
}









.animated-button2 {
  background: rgba(255, 255, 255, 0.6);
  padding: 5px 10px 5px 10px;
  margin: 1px;
  display: inline-block;
    border: 1px solid #2662d9;
  border-radius: 10px;
  -webkit-transform: translate(0%, 0%);
          transform: translate(0%, 0%);
  overflow: hidden;
  color: #00203f;
  font-size: 11px;
  letter-spacing: 1.3px;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.9);
          box-shadow: 0 2px 5px rgba(0, 0, 0, 0.9);
}

.animated-button2::before {
  content: '';
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: transparent;
  opacity: 0;
  -webkit-transition: .2s opacity ease-in-out;
  transition: .2s opacity ease-in-out;
}

.animated-button2:hover::before {
  opacity: 0.2;
}

.animated-button2 span {
  position: absolute;
}

.animated-button2 span:nth-child(1) {
  top: 0px;
  left: 0px;
  width: 100%;
  height: 2px;
  background: -webkit-gradient(linear, right top, left top, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to left, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateTop linear infinite;
          animation: 2s animateTop linear infinite;
}
.animated-button2 span:nth-child(2) {
  top: 0px;
  right: 0px;
  height: 100%;
  width: 2px;
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to top, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateRight linear -1s infinite;
          animation: 2s animateRight linear -1s infinite;
}
.animated-button2 span:nth-child(3) {
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 2px;
  background: -webkit-gradient(linear, left top, right top, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to right, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateBottom linear infinite;
          animation: 2s animateBottom linear infinite;
}
.animated-button2 span:nth-child(4) {
  top: 0px;
  left: 0px;
  height: 100%;
  width: 2px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(8, 20, 43, 0)), to(#2662d9));
  background: linear-gradient(to bottom, rgba(8, 20, 43, 0), #2662d9);
  -webkit-animation: 2s animateLeft linear -1s infinite;
          animation: 2s animateLeft linear -1s infinite;
}

@-webkit-keyframes animateTop {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

@keyframes animateTop {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}


@-webkit-keyframes animateRight {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}
@keyframes animateRight {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}

@-webkit-keyframes animateBottom {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

@keyframes animateBottom {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

@-webkit-keyframes animateLeft {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}

@keyframes animateLeft {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}

/* New button styles */
.wpforms-form input[type=submit], 
.wpforms-form button[type=submit] {
    padding: 3px 10px 3px 10px !important; /* Increase distance between text and border */
    width: 30% !important; /* Make the button full-width */
  height: 40px !important;
  display: inline-block !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  letter-spacing: 1.2px !important;
    background-color: transparent !important; /* Red background */
    color: #0099CC !important; /* White text */
    border: 2px double #0099CC !important; /* Dark red, double-line border */
}

/* New button hover styles */
.wpforms-form input[type=submit]:hover, 
.wpforms-form input[type=submit]:active, 
.wpforms-form button[type=submit]:hover, 
.wpforms-form button[type=submit]:active, 
.wpforms-form .wpforms-page-button:hover, 
.wpforms-form .wpforms-page-button:active {
    background-color: transparent !important; /* Dark red background */
    border: 3px double #0099CC !important; /* Red, double-line border */
}