/* General popup styles */
 
.popup {
    display: flex; /* Use flexbox to center the content */
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    justify-content: center; 
    align-items: center; 
    z-index: 1000; 
    opacity: 0; 
    transform: translateY(-30px); 
    transition: opacity 0.5s ease, transform 0.5s ease; 
}

    /* Popup content styles */
    .popup-content {
    background-color: #fff;
    padding: 30px;
    width: 460px;
    text-align: center;
    position: relative;
    max-height: calc(100vh - 90px);
    overflow: auto;
}

/* Close button styles */
.close {
    position: absolute;
    top: 10px;
    right: 20px;
    font-size: 25px;
    cursor: pointer;
}
@media screen and (max-width: 767px) {
    .popup-content {
        width: 460px;
    }
}
/* Keyframes for fadeInDown animation */
@keyframes fadeInDown {
    0% {
        opacity: 0;
        transform: translateY(-30px); 
    }
    100% {
        opacity: 1;
        transform: translateY(0); 
    }
}

.popup.visible {
    z-index: 10000;
    opacity: 1;
    transform: translateY(0); /* Slide into view */
    animation: fadeInDown 0.5s ease forwards; /* Apply the fadeInDown animation */
}

/* Hide popup with transition */
.popup.hidden {
    display: none; /* Hide the element completely */
}
.tmpcoder-newsletter-img{
    text-align:center
    
}
.tmpcoder-newsletter-img img{
    vertical-align:middle;display:inline-block; margin-bottom: 20px;      
}

.tmpcoder-newsletter-first-header{
    margin-bottom: 0;
    font-size: 25px !important;
}
.tmpcoder-newsletter-text{
    margin-bottom: 20px;
    color: #838383;
}
#newsletterPopup  .wpcf7-email{
    margin-bottom: 10px
}
#newsletterPopup  .wpcf7-submit{
    font-weight: 600;
    margin-bottom: 0;
    width: 100%;
    margin-bottom:10px;
    background-color: transparent;
    background-image: linear-gradient(120deg, #5729D9 0%,  #BF1864 100%);
    border: none;

}
#newsletterPopup .wpcf7-spinner{
    position: absolute;
    right: 29px;
    /* top: 5px; */
    z-index: 2;
    margin: 7px;
}

h2.tmpcoder-newsletter-first-header {
    background: linear-gradient(to right, #5729D9, #BF1864);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


/* Homepage Css */
.theme-demo{
    overscroll-behavior: none;
    scroll-behavior: smooth;
    transform: translateX(-80px);
    transition: all 0ms ease;
}
.theme-demo > .elementor-container{
    overscroll-behavior: none;
    scroll-behavior: smooth;
	flex-wrap: nowrap;
}
.theme-demo > .elementor-container > .elementor-column{
    width: 22.50% !important;
    min-width: 22.50% !important;
    padding-right: 25px !important;
}
.theme-demo .elementor-image-box-img{
    display: flex !important;
}
.feature-box{
    margin-right: -15px;
    margin-left: -15px;
}
.test-slider .slick-slide > div{
    display: flex;
    height: 100%;
    align-items: stretch;
}
.test-slider .tmpcoder-testimonial-carousel{
    overflow: hidden;
}
.test-slider .slick-slide{
    margin: 0px 8px !important;
}

@media (max-width: 1024px){
	.theme-demo > .elementor-container > .elementor-column{
		width: 24.50% !important;
		min-width: 24.50% !important;
	}
	.feature-box{
		margin-right: -10px;
		margin-left: -10px;
	}
}
@media (max-width: 767px){
	.theme-demo > .elementor-container > .elementor-column{
		width: 38.50% !important;
		min-width: 38.50% !important;
		padding-right: 15px !important;
	}
	.feature-box{
		margin-right: 0px;
		margin-left: 0px;
	}
	.theme-demo{
    	transform: unset;
	}

}

/*======== Documentation image popup style [START] ========*/

.betterdocs-content img {
	cursor: zoom-in;
}

.img-popup {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    display: none;
    z-index: 9999999 !important;
    padding: 50px 0px 50px 0px;
    text-align: center;
}

.img-popup img {
    max-width: 90%;
    /*width: 100%;*/
    opacity: 0;
    transform: translateY(-100px);
    -webkit-transform: translateY(-100px);
    -moz-transform: translateY(-100px);
    -ms-transform: translateY(-100px);
    -o-transform: translateY(-100px);
    display: inline-block;
}

.close-btn {
    width: 35px;
    height: 30px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    /*position: absolute;*/
    position: fixed;
    top: 20px;
    right: 20px;
    margin-right: 20px;
    cursor: pointer;
}

.close-btn .bar {
    height: 4px;
    background: #fff;
}

.close-btn .bar:nth-child(1) {
    transform: rotate(45deg);
}

.close-btn .bar:nth-child(2) {
    transform: translateY(-4px) rotate(-45deg);
}

.opened {
    /*display: flex;*/
    display: inline-block;
    overflow: auto;
}

.opened img {
    animation: animatepopup 1s ease-in-out .8s;
    -webkit-animation: animatepopup .3s ease-in-out forwards;
}

body.img-popup-opened {
	overflow: hidden;
}

@keyframes animatepopup {
    to {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
    }
}

@media screen and (max-width: 880px) {
    .container .container__img-holder:nth-child(3n+1) {
        margin-left: 16px;
    }
}

/*======== Documentation image popup style [END] ========*/

.tmpcoder-import-demo-preview-iframe {
    height: calc(100vh - 0px);
    display: block;
    padding-top: 57px;
}
.priview-page-header {
    padding: 10px 20px;
    background: #111111;
    box-shadow: 0px 0px 20px 1px rgba(255, 255, 255, 0.1);
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 1;
    border-bottom: 1px solid rgba(255, 255, 255,  0.2);
}
.priview-page-header .container {
    margin: 0 auto;
}
.priview-page-header .priview-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.priview-page-header .priview-page-logo {
    padding: 0px 10px;
    width: 200px;
}
.priview-page-header .preview-theme-content-data {
    padding: 0px 10px;
    width: calc(100% - 690px);
	color:#ccc;
	font-size: 14px;
	display: flex;
}
.priview-page-header .preview-theme-content-data h1{
	font-size:18px;
	font-weight:500;
	color:#FFF;
	display:inline-block;
	line-height:unset;
	text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
	width: 100%;
}
.priview-page-header .tmpcoder-import-demo-dropdown-parent {
    padding: 0px 10px;
    width: 300px;
}
.priview-page-header .priview-page-header-button {
    padding: 0px 10px;
    width: 170px;
}
.priview-page-header .priview-page-logo img {
    max-width: 165px;
    max-height: 38px;
}
.priview-page-header .priview-page-header-button .buttons {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
}
.priview-page-header .priview-page-header-button .button {
    font-size: 14px;
    font-weight: 500;
    line-height: 14px;
    letter-spacing: 0.15px;
    background-color: transparent;
    border-style: none;
    border-radius: 30px 30px 30px 30px;
    padding: 11px 20px 11px 20px;
    color: var(--button-text-color);
    fill: var(--button-text-color);
    transition: all .4s ease;
    background-image: linear-gradient(120deg, var(--e-global-color-tmpcoderprimarycolor) 0%, var(--e-global-color-tmpcodersecondarycolor) 100%);
}
.priview-page-header .priview-page-header-button .button:hover {
    background-color: transparent;
    background-image: linear-gradient(120deg, var(--e-global-color-tmpcodersecondarycolor) 0%, var(--e-global-color-tmpcoderprimarycolor) 100%);
}
.priview-page-header .tmpcoder-import-demo-dropdown-parent select {
    border: 1px solid #E6E8EA;
    border-radius: 50px;
    padding: 6px 18px;
    max-width: 300px;
    transition: all 400ms ease;
    appearance: none;
    background: url(../images/down-arrow.png);
    background-position: calc(100% - 15px);
    background-repeat: no-repeat;
    background-size: 10px;
    font-size: 14px;
    color: #fff;
}
.priview-page-header .tmpcoder-import-demo-dropdown-parent select option {
    color: #000;
}
.single-elementor-templates #tmpcoder-iframe-loader {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #fff;
}
.single-elementor-templates #tmpcoder-iframe-loader .tmpcoder-iframe-loader-inner {
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding-top: 57px;
}
.single-elementor-templates #tmpcoder-iframe-loader .tmpcoder-iframe-loader-inner p {
    width: 100%;
    margin: 0;
    font-size: 30px;
    color: #010101;
    font-weight: 500;
}
.single-elementor-templates #tmpcoder-iframe-loader .tmpcoder-iframe-loader-inner p span[class^="dot-"] {
    opacity: 0;
}
.single-elementor-templates #tmpcoder-iframe-loader .tmpcoder-iframe-loader-inner p .dot-one{
  animation: dot-one 2s infinite linear
}
.single-elementor-templates #tmpcoder-iframe-loader .tmpcoder-iframe-loader-inner p .dot-two{
  animation: dot-two 2s infinite linear
}
.single-elementor-templates #tmpcoder-iframe-loader .tmpcoder-iframe-loader-inner p .dot-three{
  animation: dot-three 2s infinite linear
}
@keyframes dot-one{
  0%{
    opacity: 0;
  }
  15%{
    opacity: 0;
  }
  25%{
    opacity: 1;
  }
  100%{
    opacity: 1;
  }
}

@keyframes dot-two{
  0%{
    opacity: 0;
  }
  25%{
    opacity: 0;
  }
  50%{
    opacity: 1;
  }
  100%{
    opacity: 1;
  }
}

@keyframes dot-three{
  0%{
    opacity: 0;
  }
  50%{
    opacity: 0;
  }
  75%{
    opacity: 1;
  }
  100%{
    opacity: 1;
  }
}

.tmpcoder-is-pro-demo-0{display:none;}

@media(max-width: 1199px) {
	.priview-page-header .preview-theme-content-data {display: none;}	
	.priview-page-header .tmpcoder-import-demo-dropdown-parent {width: calc(100% - 370px);}
	.priview-page-header .tmpcoder-import-demo-dropdown-parent select {margin-left: auto;}
}

@media(max-width: 1024px) {
	.priview-page-header .priview-page-logo {
		order: 1;
	}
	.priview-page-header .preview-theme-content-data {
		width: 100%;
		order: 4;
		text-align: center;
		padding-top: 15px;
	}
	.priview-page-header .tmpcoder-import-demo-dropdown-parent {
		order: 2;
		width: calc(100% - 370px);
	}
	.priview-page-header .priview-page-header-button {
		order: 3;
	}
	.priview-page-header .tmpcoder-import-demo-dropdown-parent select {
		margin-left: auto;
	}
}
@media(max-width: 767px) {
	.priview-page-header .priview-page-logo {
		width: calc(100% - 170px);
	}
	.priview-page-header .tmpcoder-import-demo-dropdown-parent {
		width: 100%;
		padding-top: 20px;
		order: 3;
		display: none;
	}
	.priview-page-header .tmpcoder-import-demo-dropdown-parent select {
		margin-left: auto;
		margin-right: auto;
	}
	.priview-page-header .priview-page-header-button {
		width: 170px;
		order: 2;
	}
	.priview-page-header {
		padding: 10px 10px;align-content
	}
}