/*------------------------------------------------------------------
[Master Stylesheet]

Project:	OnePager - Responsive one page multipurpose HTML Template
Version:	1.0.0
Assigned to:	Themeforest
Primary use:	App, App landing, Business, Company, Corporate
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
[Table of contents]

1 Fonts
2 Body
3 Common Css
	3.1 Reset Style
	3.2 Form Inputs
	3.3 Button Style
	3.4 Search Bar
	3.4 Padding Style
	3.5 Margin Style
4 Social Icon
5 Header Style
6 Banner & Slider
7 Theme Heading
8 Services Style
9 Banner Style
10 About App
11 Itg Slider
12 FAQ
13 Testimonial
14 Counter
15 Pricing Plane
16 Team
17 Features Section
18 Our Blog
19 Partners css
20 Owl nav Style
21 Preloader css
22 Footer Style
23 Comming Soon
24 Error Style

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

/*---Boostrap CSS ---*/
@import url("bootstrap.min.css");
/*---Nav menu CSS ---*/
@import url("../plugin/megamenu/css/hover-dropdown-menu.css");
/*---Owl Carousal CSS ---*/
@import url("../plugin/owl-carousel/css/owl.carousel.css");
@import url("../plugin/owl-carousel/css/owl.theme.default.css");
/*---Fontawesome CSS ---*/
@import url("../plugin/font-awesome/css/font-awesome.min.css");
/*---Jquery ui CSS ---*/
@import url("../plugin/acordian/css/jquery-ui.css");

/*
==========================
1 Fonts
==========================
*/

@import url('https://fonts.googleapis.com/css?family=Oxygen:300,400,700');
/*
==========================
2 Body
==========================
*/

body {
    font-family: 'Oxygen', sans-serif;
    font-size: 16px;
    color: #626161;
    line-height: 1.6em;
    background: #ffffff;
    -webkit-font-smoothing: antialiased;
    max-width: 100%;
    overflow-x: hidden;
}
/*
==========================
3 Common Css
==========================
*/
/* 3.1 Reset Style */

img {
    max-width: 100%;
    float: left;
}
a {
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
    color: inherit;
}
a:hover,
a:focus,
a:visited {
    text-decoration: none;
    outline: none;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
    color: inherit;
}
p,
em {
    font-family: 'Oxygen', sans-serif;
    font-size: 16px;
    line-height: 1.6em;
    color: #808080;
    margin-bottom: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    position: relative;
    font-weight: 400;
    margin: 0px;
    background: none;
    line-height: 1.6em;
    font-family: 'Oxygen', sans-serif;
    color: #262626;
    clear: both;
}
figure {
    float: left;
    width: 100%;
}
.high-theme-clr {
    font-weight: 600;
}
ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
ul li a {
    display: inline-block;
}
.clear {
    clear: both;
}
.parallax-style {
    background-attachment: fixed;
}
.grey_bg {
    background-color: #eee;
}
.positionR{
	position:relative;
}
/* 3.2 Form Inputs */

input[type=text],
input[type=email],
input[type=search],
input[type=password],
input[type=number],
select {
    padding: 5px 20px;
    border: 0;
    display: inline-block;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.12);
    outline: none;
    height: 40px;
    font-size: 13px;
    color: #000;
}
textarea {
    padding: 5px 20px;
    border: 0;
    display: inline-block;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.12);
    outline: none;
    font-size: 13px;
    color: #000;
    float: left;
}
input[type=radio] {
    position: absolute;
    visibility: hidden;
}
input[type=checkbox] {
    position: absolute;
    visibility: hidden;
}
.box-check:before {
    display: block;
    position: absolute;
    content: "\f00c";
    border-radius: 0;
    top: 0;
    left: 1px;
    margin: auto;
    transition: background 0.25s linear;
    -webkit-transition: background 0.25s linear;
    font: normal normal normal 11px/1 FontAwesome;
    opacity: 0;
}
.box-check {
    display: block;
    position: absolute;
    border: 2px solid;
    border-radius: 0;
    height: 15px;
    width: 15px;
    top: 17px;
    margin-top: -10px;
    left: 0;
    z-index: 5;
    transition: border .25s linear;
    -webkit-transition: border .25s linear;
}
.check {
    border: 5px solid #FFFFFF;
}
.check::before {
    display: block;
    position: absolute;
    content: '';
    height: 10px;
    width: 10px;
    top: 4px;
    left: 4px;
    margin: auto;
    transition: background 0.25s linear;
    -webkit-transition: background 0.25s linear;
    visibility: hidden;
}
.check {
    display: block;
    position: absolute;
    border: 2px solid;
    height: 20px;
    width: 20px;
    top: 50%;
    margin-top: -10px;
    left: 15px;
    z-index: 5;
    transition: border .25s linear;
    -webkit-transition: border .25s linear;
}
input[type=radio]:checked ~ .check::before {
    visibility: visible;
}
input[type=radio]:checked ~ label {
    #color: #2e2e2e;
}
input[type=checkbox]:checked ~ .box-check {
    border: 2px solid;
}
input[type=checkbox]:checked ~ label {
    #color: #2e2e2e;
}
input[type=checkbox]:checked ~ .box-check:before {
    opacity: 1;
}
ul.list label.radio-label,
label.radio-label {
    display: block;
    position: relative;
    font-size: 16px;
    padding: 5px 0px 0px 15px;
    margin: 0 auto;
    height: 30px;
    z-index: 9;
    cursor: pointer;
    -webkit-transition: all 0.25s linear;
    text-transform: capitalize;
}
label {
    display: inline-block;
    font-weight: 400;
    margin: 0 0 5px 0px;
    color: #777;
}
input::-webkit-input-placeholder,
select::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #777;
}
input::-moz-placeholder,
select::-moz-placeholder,
textarea::-moz-placeholder {
    color: #777;
}
input:-ms-input-placeholder,
select:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: #777;
}
input:-moz-placeholder,
select:-moz-placeholder,
textarea:-moz-placeholder {
    color: #777;
}
section {
    position: relative;
    width: 100%;
    float: left;
}

/* 3.3 Button Style */

.itg-button {
    font-size: 18px;
    padding: 10px 30px;
    display: inline-block;
    line-height: 1.2em;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
    text-transform: capitalize;
    background-color: transparent;
    border-radius: 30px;
    text-transform: uppercase;
	border:0;
	
}
.itg-button.one {
    border: 2px solid #fff;
    color: #fff;
}
.itg-button.two {
    border: 2px solid;
}
.itg-button.two:hover {
    color: #fff;
}
.itg-button.active:hover,
.itg-button.active {
    color: #fff;
}
.itg-button.one:hover {
    background-color: #fff;
}
/* 3.4 Search Bar */

.search_bar {
    position: relative;
    width: 100%;
    float: left;
    border-radius: 25px;
    overflow: hidden;
}
.search_bar .itg-button {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    outline: none;
}
/* 3.4 Padding Style */

.pad0 {
    padding: 0px;
}
.pad5 {
    padding: 5px;
}
.pad10 {
    padding: 10px;
}
.pad15 {
    padding: 15px;
}
.pad20 {
    padding: 20px;
}
.pad30 {
    padding: 30px;
}
.pad40 {
    padding: 40px;
}
.pad50 {
    padding: 50px;
}
.pad60 {
    padding: 60px;
}
.pad70 {
    padding: 70px;
}
.pad80 {
    padding: 80px;
}
.pad90 {
    padding: 90px;
}
.pad100 {
    padding: 100px;
}
.padTB0 {
    padding: 0px 0;
}
.padTB5 {
    padding: 5px 0;
}
.padTB10 {
    padding: 10px 0;
}
.padTB15 {
    padding: 15px 0;
}
.padTB20 {
    padding: 20px 0;
}
.padTB30 {
    padding: 30px 0;
}
.padTB40 {
    padding: 40px 0;
}
.padTB50 {
    padding: 50px 0;
}
.padTB60 {
    padding: 60px 0;
}
.padTB70 {
    padding: 70px 0;
}
.padTB80 {
    padding: 80px 0;
}
.padTB90 {
    padding: 90px 0;
}
.padTB100 {
    padding: 100px 0;
}
.padT0 {
    padding-top: 0px;
}
.padT5 {
    padding-top: 5px;
}
.padT10 {
    padding-top: 10px;
}
.padT15 {
    padding-top: 15px;
}
.padT20 {
    padding-top: 20px;
}
.padT30 {
    padding-top: 30px;
}
.padT40 {
    padding-top: 40px;
}
.padT50 {
    padding-top: 50px;
}
.padT60 {
    padding-top: 60px;
}
.padT70 {
    padding-top: 70px;
}
.padT80 {
    padding-top: 80px;
}
.padT90 {
    padding-top: 90px;
}
.padT100 {
    padding-top: 100px;
}
.padB0 {
    padding-bottom: 0px;
}
.padB5 {
    padding-bottom: 5px;
}
.padB10 {
    padding-bottom: 10px;
}
.padB20 {
    padding-bottom: 20px;
}
.padB30 {
    padding-bottom: 30px;
}
.padB40 {
    padding-bottom: 40px;
}
.padB50 {
    padding-bottom: 50px;
}
.padB60 {
    padding-bottom: 60px;
}
.padB70 {
    padding-bottom: 70px;
}
.padB80 {
    padding-bottom: 80px;
}
.padB90 {
    padding-bottom: 90px;
}
.padB100 {
    padding-bottom: 100px;
}
.padL0 {
    padding-left: 0px;
}
.padL5 {
    padding-left: 5px;
}
.padL10 {
    padding-left: 10px;
}
.padL20 {
    padding-left: 20px;
}
.padL30 {
    padding-left: 30px;
}
.padL40 {
    padding-left: 40px;
}
.padL50 {
    padding-left: 50px;
}
.padL60 {
    padding-left: 60px;
}
.padL70 {
    padding-left: 70px;
}
.padL80 {
    padding-left: 80px;
}
.padL90 {
    padding-left: 90px;
}
.padL100 {
    padding-left: 100px;
}
.padLR0 {
    padding-left: 0px;
}
.padLR5 {
    padding-left: 5px;
}
.padLR10 {
    padding-left: 10px;
}
.padLR20 {
    padding-left: 20px;
}
.padLR30 {
    padding-left: 30px;
}
.padLR40 {
    padding-left: 40px;
}
.padLR50 {
    padding-left: 50px;
}
.padLR60 {
    padding-left: 60px;
}
.padLR70 {
    padding-left: 70px;
}
.padLR80 {
    padding-left: 80px;
}
.padLR90 {
    padding-left: 90px;
}
.padLR100 {
    padding-left: 100px;
}
.padR0 {
    padding-right: 0px;
}
.padR5 {
    padding-right: 5px;
}
.padR10 {
    padding-right: 10px;
}
.padR20 {
    padding-right: 20px;
}
.padR30 {
    padding-right: 30px;
}
.padR40 {
    padding-right: 40px;
}
.padR50 {
    padding-right: 50px;
}
.padR60 {
    padding-right: 60px;
}
.padR70 {
    padding-right: 70px;
}
.padR80 {
    padding-right: 80px;
}
.padR90 {
    padding-right: 90px;
}
.padR100 {
    padding-right: 100px;
}
/* 3.5 Margin Style */

.mar0 {
    margin: 0px;
}
.mar5 {
    margin: 5px;
}
.mar10 {
    margin: 10px;
}
.mar15 {
    margin: 15px;
}
.mar20 {
    margin: 20px;
}
.mar30 {
    margin: 30px;
}
.mar40 {
    margin: 40px;
}
.mar50 {
    margin: 50px;
}
.mar60 {
    margin: 60px;
}
.mar70 {
    margin: 70px;
}
.mar80 {
    margin: 80px;
}
.mar90 {
    margin: 90px;
}
.mar100 {
    margin: 100px;
}
.marT0 {
    margin-top: 0px;
}
.marT5 {
    margin-top: 5px;
}
.marT10 {
    margin-top: 10px;
}
.marT15 {
    margin-top: 15px;
}
.marT20 {
    margin-top: 20px;
}
.marT30 {
    margin-top: 30px;
}
.marT40 {
    margin-top: 40px;
}
.marT50 {
    margin-top: 50px;
}
.marT60 {
    margin-top: 60px;
}
.marT70 {
    margin-top: 70px;
}
.marT80 {
    margin-top: 80px;
}
.marT90 {
    margin-top: 90px;
}
.marT100 {
    margin-top: 100px;
}
.marB0 {
    margin-bottom: 0px;
}
.marB5 {
    margin-bottom: 5px;
}
.marB15 {
    margin-bottom: 15px;
}
.marB10 {
    margin-bottom: 10px;
}
.marB20 {
    margin-bottom: 20px;
}
.marB30 {
    margin-bottom: 30px;
}
.marB40 {
    margin-bottom: 40px;
}
.marB50 {
    margin-bottom: 50px;
}
.marB60 {
    margin-bottom: 60px;
}
.marB70 {
    margin-bottom: 70px;
}
.marB80 {
    margin-bottom: 80px;
}
.marB90 {
    margin-bottom: 90px;
}
.marB100 {
    margin-bottom: 100px;
}
.marL0 {
    margin-left: 0px;
}
.marL5 {
    margin-left: 5px;
}
.marL10 {
    margin-left: 10px;
}
.marL20 {
    margin-left: 20px;
}
.marL30 {
    margin-left: 30px;
}
.marL40 {
    margin-left: 40px;
}
.marL50 {
    margin-left: 50px;
}
.marL60 {
    margin-left: 60px;
}
.marL70 {
    margin-left: 70px;
}
.marL80 {
    margin-left: 80px;
}
.marL90 {
    margin-left: 90px;
}
.marL100 {
    margin-left: 100px;
}
.marR0 {
    margin-right: 0px;
}
.marR5 {
    margin-right: 5px;
}
.marR10 {
    margin-right: 10px;
}
.marR20 {
    margin-right: 20px;
}
.marR30 {
    margin-right: 30px;
}
.marR40 {
    margin-right: 40px;
}
.marR50 {
    margin-right: 50px;
}
.marR60 {
    margin-right: 60px;
}
.marR70 {
    margin-right: 70px;
}
.marR80 {
    margin-right: 80px;
}
.marR90 {
    margin-right: 90px;
}
.marR100 {
    margin-right: 100px;
}
/*
==========================
4 Social Icon
==========================
*/

.social-icon {
    text-align: center;
}
.social-icon li {
    display: inline-block;
}
.social-icon a {
    width: 35px;
    height: 35px;
    background-color: #fff;
    text-align: center;
    font-size: 15px;
    border-radius: 100%;
    padding: 8px 0;
    color: #000;
    margin: 0 5px;
    line-height: 1.2em;
}
.social-icon a:hover {
    color: #fff;
}
/*
==========================
5 Header Style
==========================
*/

#header {
    position: absolute;
    width: 100%;
    float: left;
    top: 0;
    z-index: 1;
}
a.navbar-brand {
    padding: 25px 0;
}
.navbar-nav>li>a {
    padding: 8px 20px;
    border-radius: 30px;
}
.navbar-default .navbar-nav>li>a {
    color: #fff;
}
.navbar-default .navbar-nav li a {
    color: #fff;
    background-color: transparent;
    text-transform: capitalize;
    font-size: 16px;
    letter-spacing: 1px;
}
.navbar-default {
    background-color: transparent;
}
.navbar-nav {
    padding: 30px 0;
}
/*
==========================
6 Banner & Slider
==========================
*/

#main-slider.owl-theme .owl-nav .owl-prev, #main-slider.owl-theme .owl-nav .owl-next{
	color:#fff;
}
#main-slider.owl-theme .owl-dots {
    position: absolute;
    padding-top: 0;
    bottom: 50px;
}
#main-slider.owl-theme .owl-dots .owl-dot span{
	border:1px solid #fff;
}
#main-slider.owl-theme .owl-dots .owl-dot.active span, #main-slider.owl-theme .owl-dots .owl-dot:hover span{
	background-color:#fff;
}
#header{
	z-index: 9;
}
/*
===================================
7 Theme Heading
===================================
*/

.theme-heading {
    max-width: 600px;
    margin: auto;
    text-align: center;
    margin-bottom: 50px;
    position: relative;
}
.theme-heading h2 {
    position: relative;
    font-weight: 600;
    font-size: 36px;
    text-transform: uppercase;
}
.theme-heading.dark h2 {
    color: #fff;
}
.heading-circle {
    position: relative;
    width: 20px;
    height: 20px;
    display: inline-block;
    background-color: transparent;
    border-radius: 100%;
    border: 1px solid #808080;
    padding: 2px;
}
.heading-circle:after {
    content: "";
    width: 60px;
    height: 1px;
    top: 50%;
    position: absolute;
    right: 30px;
    margin-top: -1px;
}
.heading-circle:before {
    content: "";
    width: 60px;
    height: 1px;
    top: 50%;
    position: absolute;
    left: 30px;
    margin-top: -1px;
}
.theme-heading.dark .heading-circle:before {
    background-color: #fff;
}
.theme-heading.dark .heading-circle:after {
    background-color: #fff;
}
i.heading-pink-circle {
    width: 12px;
    height: 12px;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -6px;
    margin-top: -6px;
    border-radius: 100%;
}
/*
===================================
8 Services Style
===================================
*/

.service-box {
    float: left;
    width: 100%;
    position: relative;
    text-align: center;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
    padding-top: 80px;
    padding-bottom: 30px;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 50px;
    border: 1px solid #eee;
}
#services .margin-small {
    margin-bottom: 30px;
}
.service-box:hover {
    -moz-box-shadow: 10px 10px 5px #222;
    -webkit-box-shadow: 10px 10px 5px #222;
    box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.2);
}
.service-box:hover .service-icon {
    color: #fff;
}
.service-icon-box {
    display: inline-block;
    position: absolute;
    top: 0;
    margin-top: -50px;
    left: 50%;
    margin-left: -50px;
    width: 100px;
    height: 100px;
    background-color: #fff;
    border-radius: 100%;
    padding: 5px;
    box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.2);
}
.service-icon {
    background-color: #eeeeee;
    text-align: center;
    font-size: 30px;
    display: table;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
    position: relative;
    width: 100%;
    border-radius: 100%;
    height: 100%;
}
.service-icon i {
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    margin-top: -15px;
}
.service-box h3 {
    line-height: 1em;
    margin-bottom: 15px;
    position: relative;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
}
.service-box p {
    margin-bottom: 0;
    font-size: 16px;
}
/*
===================================
9 Banner Style
===================================
*/

.banner {
    /*background-image: url('../img/all/banner-background.jpg');*/
    text-align: center;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
}
.banner.second {
    margin-bottom: 100px;
    /*background-image: url('../img/all/banner-video-background.jpg');*/
}
.banner:before {
    content: "";
    background-color: rgba(0, 0, 0, 0.85);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.banner-content {
    width: 100%;
    float: left;
    text-align: center;
}
.banner-content h2.banner-title {
    color: #fff;
    font-size: 50px;
    margin-bottom: 10px;
    line-height: 1.2em;
}
.banner-content h2 {
    font-size: 36px;
    color: #fff;
    margin-bottom: 20px;
}
.banner-video {
    max-width: 600px;
    margin: auto;
    display: inline-block;
    margin-bottom: -220px;
    margin-top: 50px;
}
.banner-content.two {
    max-width: 500px;
    margin: auto;
    float: none;
}
.banner-content.two h2{
    color: #fff;
}
.banner-video figure {
    position: relative;
}
.banner-video video {
    width: 100%;
}
.banner-video figcaption {
    position: absolute;
    width: 71%;
    left: 15%;
    top: 11%;
    max-height: 240px;
}
.playpause {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.playpause.bg {
    background-image: url('../video/video-poster.png');
    background-size: cover;
    background-repeat: no-repeat;
}
.playpause a {
    position: absolute;
    left: 50%;
    margin-left: -50px;
    top: 50%;
    margin-top: -50px;
    display: inline-block;
    background-color: #eeeded;
    width: 100px;
    height: 100px;
    border-radius: 100%;
    font-size: 30px;
    border: 7px solid #fff;
    text-align: center;
}
.playpause a img {
    width: 24px;
    position: absolute;
    top: 50%;
    margin-top: -12px;
    margin-left: -12px;
    left: 50%;
}
/*
===================================
10 About App
===================================
*/

.about-app-img {
    float: left;
    width: 100%;
}
.about-app-details {
    float: left;
    width: 100%;
}
.about-app {
    float: left;
    width: 100%;
    position: relative;
}
.about-app h3 {
    line-height: 1.2em;
    margin-bottom: 30px;
}
.about-app p {
    margin-bottom: 30px;
}
/*
===================================
11 Itg Slider
===================================
*/

.d_slider {
    float: left;
    width: 100%;
    position: relative;
    padding-top: 70px;
    padding-bottom: 15px;
}
.itg_d_box {
    margin: 0 auto;
    width: 160px;
    position: relative;
    perspective: 1000px;
    height: 421px;
    padding-top: 51px;
}
.itg_carousel {
    height: 100%;
    width: 100%;
    position: absolute;
    transform-style: preserve-3d;
    transition: transform 1s;
}
.itg_d_slide_mobile {
    position: absolute;
    top: 12px;
    transform: scale(1.5);
}
.itg_carousel .item {
    display: block;
    position: absolute;
    width: auto;
    opacity: 1;
}
.itg_carousel .a {
    transform: rotateY(0deg) translateZ(250px);
    background: #ed1c24;
}
.itg_carousel .b {
    transform: rotateY(60deg) translateZ(250px);
    background: #0072bc;
}
.itg_carousel .c {
    transform: rotateY(120deg) translateZ(250px);
    background: #39b54a;
}
.itg_carousel .d {
    transform: rotateY(180deg) translateZ(250px);
    background: #f26522;
}
.itg_carousel .e {
    transform: rotateY(240deg) translateZ(250px);
    background: #630460;
}
.itg_carousel .f {
    transform: rotateY(300deg) translateZ(250px);
    background: #8c6239;
}
.itg_next {
    position: absolute;
    top: 50%;
    right: 0;
    font-size: 50px;
    margin-top: -25px;
    cursor: pointer;
    padding: 10px;
}
.itg_prev {
    position: absolute;
    top: 50%;
    left: 0;
    font-size: 50px;
    margin-top: -25px;
    cursor: pointer;
    padding: 10px;
}
/*
===================================
12 FAQ
===================================
*/

#faq_section h3 {
    margin-bottom: 20px;
}
.ui-accordion .ui-accordion-content {
    margin-bottom: 20px;
    padding: 10px 30px;
}
.ui-accordion .ui-accordion-header {
    margin-top: 0;
    margin-bottom: 20px;
    color: #000;
    outline: none;
    background-color: #eee;
    border-color: #eee;
    border-radius: 0;
    padding: 10px 30px;
}
.ui-accordion .ui-accordion-content h4 {
    color: #fff;
}
.ui-accordion .ui-accordion-content p {
    color: #fff;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    background-color: #eee;
    border: 1px solid #eee;
}
.faqs .ui-icon {
    float: right;
    margin-top: 5px;
}
/*
===================================
13 Testimonial
===================================
*/

.testimonial {
    background-color: #060506;
}
.testimonial-slider {
    max-width: 800px;
    margin: auto;
    text-align: center;
}
.testimonial-slider .owl-item figure {
    width: 160px;
    overflow: hidden;
    border-radius: 100%;
    margin: auto;
    margin-bottom: 30px;
    float: none;
}
.testimonial-slider p {
    margin-bottom: 30px;
}
.testimonial-slider.owl-theme .owl-dots {
    margin-top: 30px;
    position: relative;
    line-height: 1em;
}
.testimonial-slider.owl-theme .owl-dots .owl-dot span {
    width: 15px;
    height: 15px;
    background-color: transparent;
    border: 1px solid #fff;
    margin: 0 10px;
}
/*
==========================
14 Counter
==========================
*/

.facts {
    width: 100%;
    float: left;
    text-align: center;
}
.facts .count-number h2 {
    color: #fff;
    font-weight: 600;
    font-size: 42px;
}
.facts h2 {
    color: #fff;
    font-weight: 600;
}
.facts .count-number h2 i {
    margin-left: 10px;
}
/*
===================================
15 Pricing Plane
===================================
*/

.pricing {
    width: 100%;
    float: left;
    text-align: center;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
}
.pricing:hover .itg-button.two {
    color: #fff;
}
.pricing .caption {
    color: #fff;
    padding: 20px 0;
    position: relative;
    overflow: visible;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}
.pricing .caption h3 {
    color: #fff;
    margin-bottom: 10px;
}
.pricing .caption .price {
    color: #fff;
    line-height: 1em;
}
.pricing-list {
    width: 100%;
    float: left;
    margin: 0;
    background-color: #eee;
    position: relative;
    padding: 0 15px;
    padding-top: 20px;
}
.pricing-list li:first-child {
    border-top: 1px solid #e5e9eb;
}
.pricing-list li {
    padding: 15px 5px;
    border-bottom: 1px solid #e5e9eb;
    font-size: 16px;
    font-weight: 600;
}
.pricing-btn {
    float: left;
    width: 100%;
    padding: 30px;
    background-color: #eee;
    position: relative;
}
/*
===================================
16 Team
===================================
*/

.team-member {
    width: 100%;
    float: left;
    position: relative;
    overflow: hidden;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
}
.team-member figure {
    position: relative;
    overflow: hidden;
}
.team-member figure figcaption {
    position: absolute;
    bottom: -50%;
    width: 100%;
    padding: 10px;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
}
.team-member:hover figure figcaption {
    bottom: 0;
}
.team-member figure:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
    opacity: 0;
}
.team-member figure img {
    width: 100%;
}
.team-member:hover figure:before {
    opacity: 1;
}
.team-member:hover {
    -moz-box-shadow: 10px 10px 5px #222;
    -webkit-box-shadow: 10px 10px 5px #222;
    box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.2);
}
.team_social,
.name_designation {
    display: inline-block;
    float: left;
    width: 50%;
}
.team-member a:hover {
    color: #fff;
}
.name_designation h4 {
    color: #fff;
}
.name_designation label {
    color: #fff;
    font-size: 14px;
    margin-bottom: 0;
}
.team_social ul {
    float: left;
    width: 100%;
    text-align: right;
}
.team_social ul li {
    display: inline-block;
    margin-left: 10px;
    color: #fff;
}
.team_social ul li:first-child {
    margin-left: 0;
}
.team_social ul {
    float: left;
    width: 100%;
    text-align: right;
    padding: 14px 0;
}
/*
===================================
17 Features Section
===================================
*/

.features-section {
    /*background-image: url('../img/all/features-banner.jpg');*/
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}
.features-section:before {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.8);
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.features-img {
    max-width: 250px;
    margin: auto;
    display: table;
}
.feature-box {
    width: 100%;
    float: left;
    margin-bottom: 50px;
    position: relative;
}
.feature-box:last-child {
    margin-bottom: 0px;
}
.features-details {
    float: left;
    width: 100%;
    padding-left: 30px;
    border-left: 1px dashed #fff;
    margin-top: 30px;
}
.feature-box .feature-icon {
    width: 80px;
    height: 80px;
    border-radius: 100%;
    background-color: #eeedec;
    text-align: center;
    border: 5px solid #fff;
    font-size: 30px;
    padding: 20px 0;
    float: left;
}
.feature-box .feature-description {
    float: right;
    width: 85% !important;
}
.feature-box .feature-description h3 {
    color: #fff;
    line-height: 1.2em;
    text-transform: uppercase;
    margin-bottom: 20px;
}
.feature-box .feature-description p {
    color: #eee;
}
.feature-box .heading-circle {
    position: absolute;
    left: -40px;
    top: 30px;
}
/*
===================================
18 Our Blog
===================================
*/

.our-blog {
    background-image: url('../img/all/blog-background.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
}
.our-blog:before {
    background-color: rgba(0, 0, 0, 0.8);
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
}
.blog {
    float: left;
    width: 100%;
    position: relative;
    background-color: #fff;
}
.blog-caption {
    width: 100%;
    float: left;
    position: relative;
}
.blog .caption {
    background-color: #fff;
    text-align: left;
    float: left;
    width: 100%;
    padding-bottom: 10px;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
}
.blog:hover .caption {
    box-shadow: 0 6px 12px rgba(225, 225, 225, .175);
}
.blog:hover .blog-meta label {
    color: #fff;
}
.blog-meta {
    padding: 10px 20px;
    width: 100%;
    float: left;
    border-bottom: 1px solid #eee;
}
.blog-meta label {
    color: #000;
    font-size: 14px;
    margin-right: 15px;
    margin-bottom: 0;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
}
.blog-meta label:last-child {
    margin-right: 0px;
}
.blog-detail {
    float: left;
    width: 100%;
    padding: 10px 20px;
}
.blog figure {
    float: left;
    width: 100%;
    position: relative;
}
.blog figure img {
    width: 100%;
}
.blog figure:before {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.7);
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
}
.blog:hover figure:before {
    opacity: 1;
}
.blog-detail h4 {
    margin-bottom: 10px;
    font-weight: 600;
}
.blog-detail h4 a {
    color: #262626;
}
.blog:hover .blog-detail a {
    color: #fff;
}
.blog:hover .blog-detail a:hover {
    color: #fff;
}
.blog-detail p {
    margin-bottom: 10px;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
}
.blog:hover .blog-detail h4 a,
.blog:hover .blog-detail p {
    color: #fff;
}
.blog figcaption {
    position: absolute;
    top: 50%;
    width: 100%;
    text-align: center;
    opacity: 0;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
    margin-top: -40px;
}
.blog figcaption a {
    width: 80px;
    height: 80px;
    display: inline-block;
    background-color: #ecebeb;
    border-radius: 100%;
    font-size: 30px;
    padding: 20px 0;
    border: 5px solid #fff;
}
.blog:hover figcaption {
    opacity: 1;
}
.blog-slider.owl-theme .owl-nav .owl-prev,
.blog-slider.owl-theme .owl-nav .owl-next {
    color: #eee;
}
/*
==========================
19 Partners css
==========================
*/

.partner-slider figure {
    border: 1px solid #e0dfdf;
    margin-bottom: 1px;
}
/*
===================================
20 Owl nav Style
===================================
*/

.carousel-style-1 {
    position: relative;
}
.carousel-style-1 figure {
    margin-bottom: 1px;
}
.carousel-style-1.owl-theme .owl-nav .owl-prev {
    margin-left: -6%;
}
.carousel-style-1.owl-theme .owl-nav .owl-next {
    margin-right: -6%;
}
.owl-theme .owl-nav {
    position: absolute;
    top: 50%;
    width: 100%;
    margin-top: -38px;
    z-index: -1;
}
.owl-theme .owl-nav .owl-prev,
.owl-theme .owl-nav .owl-next {
    line-height: 1.2em;
    font-size: 50px;
    -webkit-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -ms-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
    background-color: transparent;
    border: 0;
    text-align: center;
    padding: 3px 0;
    border-radius: 0;
    color: #808080;
}
.owl-theme .owl-nav [class*='owl-']:hover {
    background-color: transparent;
    color: #808080;
}
.owl-theme .owl-nav .owl-prev {
    float: left;
    margin-left: -50px;
}
.owl-theme .owl-nav .owl-next {
    float: right;
    margin-right: -50px;
}
.owl-dots {
    position: relative;
    width: 100%;
    padding-top: 20px;
}
.owl-theme .owl-dots .owl-dot span {
    margin: 0;
}
.owl-theme .owl-dots .owl-dot span {
    margin: 0 6px;
    height: 15px;
    width: 15px;
    background-color: transparent;
    border: 1px solid;
}
/*
==========================
21 Preloader css
==========================
*/

.preloader.loaderout {
    top: -100%;
    -webkit-transition: all 0.80s ease-in-out;
    -moz-transition: all 0.80s ease-in-out;
    -o-transition: all 0.80s ease-in-out;
    -ms-transition: all 0.80s ease-in-out;
    transition: all 0.80s ease-in-out;
}
.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    z-index: 9999;
}
.cssload-container {
    display: block;
    width: 100px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -50px;
    margin-top: -14px;
}
.cssload-loading i {
    width: 25px;
    height: 5px;
    display: inline-block;
    border-radius: 0;
}
.cssload-loading i:first-child {
    opacity: 0;
    animation: cssload-loading-ani2 0.58s linear infinite;
    -o-animation: cssload-loading-ani2 0.58s linear infinite;
    -ms-animation: cssload-loading-ani2 0.58s linear infinite;
    -webkit-animation: cssload-loading-ani2 0.58s linear infinite;
    -moz-animation: cssload-loading-ani2 0.58s linear infinite;
    transform: translate(-19px);
    -o-transform: translate(-19px);
    -ms-transform: translate(-19px);
    -webkit-transform: translate(-19px);
    -moz-transform: translate(-19px);
}
.cssload-loading i:nth-child(2),
.cssload-loading i:nth-child(3) {
    animation: cssload-loading-ani3 0.58s linear infinite;
    -o-animation: cssload-loading-ani3 0.58s linear infinite;
    -ms-animation: cssload-loading-ani3 0.58s linear infinite;
    -webkit-animation: cssload-loading-ani3 0.58s linear infinite;
    -moz-animation: cssload-loading-ani3 0.58s linear infinite;
}
.cssload-loading i:last-child {
    animation: cssload-loading-ani1 0.58s linear infinite;
    -o-animation: cssload-loading-ani1 0.58s linear infinite;
    -ms-animation: cssload-loading-ani1 0.58s linear infinite;
    -webkit-animation: cssload-loading-ani1 0.58s linear infinite;
    -moz-animation: cssload-loading-ani1 0.58s linear infinite;
}
@keyframes cssload-loading-ani1 {
    100% {
        transform: translate(39px);
        opacity: 0;
    }
}
@-o-keyframes cssload-loading-ani1 {
    100% {
        -o-transform: translate(39px);
        opacity: 0;
    }
}
@-ms-keyframes cssload-loading-ani1 {
    100% {
        -ms-transform: translate(39px);
        opacity: 0;
    }
}
@-webkit-keyframes cssload-loading-ani1 {
    100% {
        -webkit-transform: translate(39px);
        opacity: 0;
    }
}
@-moz-keyframes cssload-loading-ani1 {
    100% {
        -moz-transform: translate(39px);
        opacity: 0;
    }
}
@keyframes cssload-loading-ani2 {
    100% {
        transform: translate(19px);
        opacity: 1;
    }
}
@-o-keyframes cssload-loading-ani2 {
    100% {
        -o-transform: translate(19px);
        opacity: 1;
    }
}
@-ms-keyframes cssload-loading-ani2 {
    100% {
        -ms-transform: translate(19px);
        opacity: 1;
    }
}
@-webkit-keyframes cssload-loading-ani2 {
    100% {
        -webkit-transform: translate(19px);
        opacity: 1;
    }
}
@-moz-keyframes cssload-loading-ani2 {
    100% {
        -moz-transform: translate(19px);
        opacity: 1;
    }
}
@keyframes cssload-loading-ani3 {
    100% {
        transform: translate(19px);
    }
}
@-o-keyframes cssload-loading-ani3 {
    100% {
        -o-transform: translate(19px);
    }
}
@-ms-keyframes cssload-loading-ani3 {
    100% {
        -ms-transform: translate(19px);
    }
}
@-webkit-keyframes cssload-loading-ani3 {
    100% {
        -webkit-transform: translate(19px);
    }
}
@-moz-keyframes cssload-loading-ani3 {
    100% {
        -moz-transform: translate(19px);
    }
}
/*
===================================
22 Footer Style
===================================
*/

.top-footer {
    float: left;
    width: 100%;
    position: relative;
}
.top-footer h1 {
    font-size: 40px;
    font-weight: 600;
    color: #fff;
}
.top-footer h4 {
    color: #fff;
}
.bottom-footer {
    background-color: #1a1a1a;
    color: #bfbfbf;
    float: left;
    width: 100%;
    text-align: left;
    padding: 20px 0;
}
.bottom-footer p {
    color: #bfbfbf;
    margin-bottom: 0px;
}
.theme-form input,
.theme-form textarea {
    margin-bottom: 30px;
}
.theme-form input.itg-button {
    margin-bottom: 0px;
}
.foot_social ul li {
    display: inline-block;
    margin-left: 20px;
    font-size: 20px;
}
.foot_social ul {
    float: left;
    width: 100%;
    text-align: right;
}
#scroll-top {
    position: fixed;
    bottom: 50px;
    right: 50px;
    width: 50px;
    height: 50px;
    text-align: center;
    font-size: 25px;
    padding: 6px 0;
    opacity: 0;
    visibility: hidden;
    z-index: 9;
    background-color: #eee;
    border-radius: 200%;
    border: 5px solid #fff;
}
#scroll-top.showScrollTop {
    opacity: 1;
    visibility: visible;
}

/*
===================================
23 Comming Soon
===================================
*/
.comming-soon-content {
    z-index: 3;
    position: fixed;
    width: 100%;
    top: 50%;
    margin-top: -272px;
	text-align:center;
}
.special-style-fixed {
    position: fixed;
}
.comming-soon-style-1 {
    background-image: url(../img/all/comming-soon-back.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    opacity:1;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index:1;
	background-color:#000;
}
.timer {
    width: 100%;
    float: left;
    margin-bottom: 50px;
}
.timer ul li {
    float: left;
    width: 20%;
    text-align: center;
    padding: 40px 0;
	min-height:152px;
}
.timer ul li span {
    font-size: 60px;
    display: block;
	color:#fff;
}
.timer ul li span.normal {
    font-size: 14px;
}
.after-border {
    position: relative;
}
.after-border:after {
    content: "";
    height: 100%;
    width: 1px;
    background-color: #96918f;
    position: absolute;
    right: 0;
    top: 0;
}
.comming-soon-content h1 {
    color: #fff;
    font-weight: 300;
    text-align: center;
    margin-bottom: 20px;
}
.comming-soon-content p {
    color: #fff;
    width:60%;
    margin: auto;
    display: table;
    margin-bottom: 50px;
}
.comming-soon-content figure {
    margin: auto;
    display: inline-block;
    margin-bottom: 30px;
    float: none;
    width: auto;
}

/*
===================================
24 Error Style
===================================
*/
.error-content {
    z-index: 3;
    position: fixed;
    width: 100%;
    top: 50%;
    margin-top: -240.5px;
	text-align:center;
}
.special-style-fixed {
    position: fixed;
}
.error-style-1 {
    background-image: url(../img/all/error-back.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    opacity:1;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index:1;
}
.special-section {
    position: fixed;
    right: 0;
	top:0;
	bottom:0;
	left:0;
}
.dark-overlay:before {
    content: "";
    background-color: rgba(0, 0, 0, 0.8);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    z-index: 2;
}
.error-content h1 {
    color: #fff;
    font-weight: 300;
    text-align: center;
    margin-bottom: 10px;
}
.error-content p {
    color: #fff;
    width:60%;
    margin: auto;
    display: table;
    margin-bottom: 30px;
}
.error-content figure {
    margin: auto;
    display: inline-block;
    margin-bottom: 10px;
	float:none;
	width:auto;
}
.error-content figure.error-img{
	max-width:400px;
	margin-bottom:30px;
}
.error-content .itg-button{
	margin-right:20px;
}
.error-content .itg-button:last-child{
	margin-right:0px;
}
.video-wrapper {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 */
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
    background: #000;
}

.video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Header fijo con fondo al hacer scroll */
#header.fixed {
    position: fixed;
    background: rgba(0,0,0,0.92);
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

#header.fixed .navbar-nav {
    padding: 10px 0;
}

#header.fixed a.navbar-brand {
    padding: 10px 0;
}


@media (max-width: 768px) {
    .slide-content {
        top: 10% !important;
        margin-top: 0 !important;
        padding: 0 20px !important;
        max-width: 100% !important;
    }

    .slide-content h1,
    .slide-content h2 {
        font-size: 26px !important;
        line-height: 1.3em !important;
    }

    .slide-content p {
        font-size: 16px !important;
        margin-bottom: 20px !important;
    }
}

/* --- Hero mejorado en móvil --- */
.scroll-indicator {
    margin-top: 12px;
    font-size: 13px;
    color: #ffffff;
    opacity: 0.85;
    display: block;
    text-align: center;
}

.scroll-indicator i {
    font-size: 20px;
    margin-top: 4px;
    animation: scroll-bounce 1.4s infinite;
    display: block;
    margin-left: auto;
    margin-right: auto;
}


@keyframes scroll-bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(6px); }
}

@media (max-width: 768px) {
    .banner-section {
        height: auto;
        min-height: 100vh;
        padding-top: 90px;   /* espacio para el header */
        padding-bottom: 30px;
    }

    .slide-caption {
        height: auto;
    }

    .slide-content {
        position: relative;
        top: 0;
        margin-top: 0;
        max-width: 100%;
        padding: 0 20px;
        background: transparent !important;
    }

    .slide-content h1 {
        font-size: 26px;
        line-height: 1.3em;
        margin-bottom: 8px;
    }

    .slide-content h2 {
        font-size: 20px;
        line-height: 1.3em;
        margin-bottom: 15px;
    }

    .slide-content p {
        font-size: 15px;
        margin-bottom: 15px;
    }

    .slide-content .itg-button {
        font-size: 15px;
        padding: 10px 26px;
        margin-top: 5px;
        margin-bottom: 10px;
    }

    .slide-image {
        position: relative;
        right: auto;
        top: auto;
        max-width: 80%;
        margin: 25px auto 0;
    }

    .slide-image figure img {
        float: none;
        width: 100%;
    }
}

.hero-text-mobile {
    display: none;
}

@media (max-width: 768px) {
    .hero-text-desktop {
        display: none;
    }
    .hero-text-mobile {
        display: block;
    }
}
@media (min-width: 769px) {
    .hero-text-mobile {
        display: none;
    }
}



@media (min-width: 992px) {
    .scroll-indicator {
        display: flex !important;
        flex-direction: column;
        align-items: center;
        font-size: 15px;
        opacity: 0.9;
        margin-top: 30px;
    }
}




.hero-photo-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
        to bottom,
        rgba(0,0,0,0.55) 0%,
        rgba(0,0,0,0.35) 45%,
        rgba(0,0,0,0.40) 100%
    ) !important;
}

.hero-photo-inner {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 620px;
}

.hero-photo-inner h1,
.hero-photo-inner h2,
.hero-photo-inner p {
  color: #fff;
}

.hero-photo-inner h1 {
  font-size: 42px;
  line-height: 1.2;
  font-weight: 700;
  margin-bottom: 10px;
}

.hero-photo-inner h2 {
  font-size: 22px;
  margin: 15px 0 20px;
}

.hero-photo-inner p {
  margin-bottom: 8px;
}

.hero-photo .itg-button.active {
  background: #9b2822;
  border-radius: 999px;
}

/* centrado y más compacto en móvil */
@media (max-width: 768px) {
  .hero-photo-inner {
    max-width: 100%;
    text-align: left;
    padding-top: 100px;
  }

  .hero-photo-inner h1 {
    font-size: 30px;
  }

  .hero-photo-inner h2 {
    font-size: 18px;
  }
}
/* HERO FOTO PANTALLA COMPLETA */
.hero-photo {
    position: relative !important;
    background-image: url('../img/screen-shot-one/playa4.webp') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    height: 100vh !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden;
}

.hero-photo-overlay {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(0,0,0,0.4) !important;
    z-index: 2 !important;
}

.hero-photo-inner {
    position: relative !important;
    z-index: 3 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    min-height: 100vh !important;
    max-width: 620px !important;
}
.banner-shape {
    display: none !important;
}
.slide-image {
    display: none !important;
}

@media (min-width: 992px) {
    .hero-photo {
        background-position: center bottom !important;
        background-size: cover !important;
    }
}


@media (max-width: 768px) {
    .hero-photo {
        background-position: 30% center !important;
    }
}



/* Caja visual del formulario (fondo claro sobre el rojo) */
.preinsc-box {
    background: #ffffff;
    border-radius: 8px;
    padding: 20px;
}

/* Inputs cómodos y alineados */
.top-footer .theme-form input,
.top-footer .theme-form select,
.top-footer .theme-form textarea {
    margin-bottom: 10px;
    width: 100%;
}

/* Mensaje de error discreto pero visible */
.form-error {
    color: #ffd1d1;
    margin-top: 10px;
    font-size: 13px;
}

/* Botón principal de preinscripción */
#preinscripcion .theme-form .itg-button.one {
    background: #ffffff !important;      /* fondo blanco */
    color: #9b2c2c !important;           /* rojo del fondo para el texto */
    border: 2px solid #ffffff !important;
    font-weight: 600;
    display: block;
    margin: 20px auto 0;                 /* centrado */
    padding: 12px 30px;
}
#preinscripcion .theme-form .itg-button.one:hover {
    background: #f2f2f2 !important;
}
@media (max-width: 767px) {
    #preinscripcion .theme-form .itg-button.one {
        width: 100%;
        border-radius: 30px;
    }
}

/* Estados de error en el formulario */
#form-preinscripcion .has-error {
    border-color: #ff8a80 !important;
}

#form-preinscripcion .field-error {
    color: #ffd1d1;
    font-size: 13px;
    margin-top: 3px;
    margin-bottom: 8px;
}

/* Mismo estilo cuando el campo está activo (focus) */
.theme-form input:focus,
.theme-form select:focus,
.theme-form textarea:focus {
    border-color: #cccccc;      /* mismo gris que los otros */
    outline: none;
    box-shadow: none;
}

input[type=text],
input[type=email],
input[type=search],
input[type=password],
input[type=number],
input[type=tel],
select {
    padding: 5px 20px;
    border: 0;
    display: inline-block;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.12);
    outline: none;
    height: 40px;
    font-size: 13px;
    color: #000;
}

.alert-preinscripcion {
    background: #e2f7e6;
    border-left: 4px solid #32a852;
    color: #245b34;
    padding: 10px 15px;
    margin-bottom: 15px;
    border-radius: 6px;
    font-size: 14px;
}

/* Estado del campo con error */
#form-preinscripcion .has-error {
    border-color: #ff4e4e !important;   /* Rojo fuerte pero elegante */
    background: #ffecec !important;     /* Fondo suave rosado */
}

/* Mensaje de error debajo del campo */
#form-preinscripcion .field-error {
    color: #c62828;                      /* Rojo oscuro para texto */
    font-size: 14px;                     /* Más legible */
    margin-top: 4px;
    margin-bottom: 12px;
    font-weight: 500;
    line-height: 1.3;
}

/* Espacio uniforme entre campos con error */
#form-preinscripcion .theme-form input.has-error,
#form-preinscripcion .theme-form select.has-error,
#form-preinscripcion .theme-form textarea.has-error {
    margin-bottom: 5px;
}

.swal2-popup.swal-tekuenta {
    border-radius: 16px;
    font-family: inherit;
}

/* Estilos del checkbox */
.politica-label {
    font-size: 14px;
    color: #444;
    display: flex;
    gap: 8px;
    align-items: center;
    margin-top: 10px;
}

.politica-label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.politica-label a {
    text-decoration: underline;
    color: #9b2c2c;
}

#wrap-politica.has-error {
    border: none !important;
}

#wrap-politica .field-error {
    margin-top: 4px;
}

/* --- SWITCH TEKUENTA (checkbox custom) --- */

.tq-switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 22px;
    margin-right: 10px;
}

.tq-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.tq-slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: #ccc;
    transition: .3s;
    border-radius: 30px;
}

.tq-slider:before {
    position: absolute;
    content: "";
    height: 16px;
    width: 16px;
    left: 3px;
    bottom: 3px;
    background-color: #fff;
    transition: .3s;
    border-radius: 50%;
}

.tq-switch input:checked + .tq-slider {
    background-color: #9b2c2c; /* rojo TeKuenta */
}

.tq-switch input:checked + .tq-slider:before {
    transform: translateX(18px);
}

/* texto del aviso legal */
.tq-politica-text {
    font-size: 14px;
    color: #444;
    vertical-align: middle;
}

.tq-politica-text a {
    color: #9b2c2c;
    text-decoration: underline;
}

/* error en el switch */
#wrap-politica.has-error .tq-politica-text {
    color: #c62828;
    font-weight: 600;
}

#wrap-politica .field-error {
    margin-top: 5px;
}


/* === Ajuste versión móvil sección HISTORIA TEKUENTA === */
@media (max-width: 768px) {

  /* Sin iconos ni circulitos */
  .historia-tekuenta .feature-icon,
  .historia-tekuenta .heading-circle,
  .historia-tekuenta .heading-pink-circle {
    display: none !important;
  }

  /* Quitar la línea vertical y márgenes extra */
  .historia-tekuenta .features-details {
    border-left: none !important;   /* adiós línea punteada */
    margin-top: 20px !important;
    padding: 0 16px !important;     /* padding suave a ambos lados */
  }

  /* Que la caja del texto ocupe todo el ancho disponible */
  .historia-tekuenta .feature-box {
    float: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }

  /* El grid interno sin padding raro */
  .historia-tekuenta .container,
  .historia-tekuenta .row,
  .historia-tekuenta .col-md-7,
  .historia-tekuenta .col-sm-12,
  .historia-tekuenta .col-xs-12 {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
  }

  /* Tipografía un poquito más compacta en móvil */
  .historia-tekuenta .feature-description h3 {
    font-size: 20px;
    margin-bottom: 14px;
  }
  .historia-tekuenta .feature-description p {
    font-size: 15px;
    line-height: 1.5;
    margin-bottom: 10px;
  }
}

/* ==== ARREGLA EL ESPACIO LATERAL EN MÓVIL === */
@media (max-width: 768px) {

    /* Los contenedores del grid de esta sección deben resetear floats */
    .historia-tekuenta .col-md-5,
    .historia-tekuenta .col-md-7 {
        float: none !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Evitar padding del container interno */
    .historia-tekuenta .container,
    .historia-tekuenta .row {
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
    }

    /* features-details no debe tener márgenes heredados */
    .historia-tekuenta .features-details {
        border-left: none !important;
        padding: 0 15px !important;
        margin: 0 !important;
    }

    /* La línea punteada la elimina esto */
    .historia-tekuenta .features-details::before {
        display: none !important;
    }

    /* Eliminar padding del feature-box */
    .historia-tekuenta .feature-box {
        padding: 0 !important;
        margin: 0 !important;
        float: none !important;
        width: 100% !important;
    }
}
/* Ajuste fino solo para móvil en la historia */
@media (max-width: 768px) {

  /* Empujar el bloque de texto hacia la izquierda */
  .historia-tekuenta .feature-description {
    margin-left: -85px !important;  /* puedes probar -10px o -20px si quieres afinar */
    padding-left: 0px !important;
  }
}

/* ============================
   ESTILO APPLE PARA FORMULARIOS
   ============================ */

.theme-form label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #5f5f5f; /* Gris Apple */
    margin-bottom: 6px;
    margin-top: 18px;
    letter-spacing: 0.4px; /* sutil y elegante */
}

/* Inputs / Textareas estilo Apple */
.theme-form input[type="text"],
.theme-form textarea,
.theme-form select {
    font-size: 15px;
    font-weight: 400;
    color: #1c1c1e; /* texto Apple */
    border-radius: 10px;
    border: 1px solid #d2d2d7; 
    padding: 5px 14px;
    background-color: #ffffff;
    transition: all 0.25s ease;
    -webkit-appearance: none;
}

/* Hover suave */
.theme-form input:hover,
.theme-form textarea:hover,
.theme-form select:hover {
    border-color: #a1a1a6; /* Gris Apple hover */
}

/* Focus estilo Apple */
.theme-form input:focus,
.theme-form textarea:focus,
.theme-form select:focus {
    border-color: #B03A2E; /* tono TeKuenta */
    box-shadow: 0 0 0 3px rgba(176, 58, 46, 0.15);
    outline: none;
}

/* Placeholder Apple */
.theme-form ::placeholder {
    color: #8e8e93; 
    opacity: 1;
}

/* Para dar armonía de espacio entre textarea y label */
.theme-form textarea {
    min-height: 95px;
    line-height: 1.4;
    resize: vertical;
}

/* ===== SELECT estilo Apple (matching con inputs) ===== */

form select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    width: 100%;
    padding: 12px 16px;
    font-size: 16px;
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    background-color: #ffffff;

    font-family: 'SF Pro Text', -apple-system, BlinkMacSystemFont, sans-serif;

    transition: all 0.2s ease;
    color: #444;

    background-image: url("data:image/svg+xml;utf8,<svg fill='%23666' height='20' viewBox='0 0 20 20' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M5.516 7.548l4.484 4.383 4.484-4.383c.268-.262.7-.258.966.01.265.27.26.7-.01.966l-4.927 4.82a.67.67 0 0 1-.946 0l-4.927-4.82a.68.68 0 0 1-.01-.966c.266-.268.698-.272.966-.01z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 18px;
}

/* Hover */
form select:hover {
    border-color: #cfcfcf;
}

/* Focus */
form select:focus {
    background-color: #fff;
    border-color: #007aff; /* Apple blue */
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.15);
}