@use '../utils' as *;
/*============================================

   Theme Name: Evente - Conference and Event HTML Template
   Author : ThemeGenix
   Author URI: https://themeforest.net/user/themegenix
   Support: themegenix@gmail.com
   Description: Evente - Conference and Event HTML Template
   Version: 2.0

==============================================*/

/* CSS Index
==============================================

	// components
	01. Animation
	02. background
	03. Breadcrumb
	04. Button
	05. minicart
	06. Mobile Menu
	07. Nice Select
	08. OffCanvas
	09. Preloader
 	10. Scroll Top
	11. Search
	12. Section Title
	13. spacing default responsive

	// Layout
    01. about
	02. banner
	03. blog
	04. brands
	05. contact
	06. countdown scss
	07. counter scss
	08. cta
	09. faq
	10. feature scss
	11. footer
	12. gallery
	13. Header
	14. hero
	15. location
	16. map
	17. postbox
	18. price
	19. product
	20. schedule
	21. team
	22. testimonial
	23. text
	24. tickets
	25. venue
	26. video

==============================================*/



/*============================================
/*  01. Theme Default CSS
==============================================*/

@import url($font-url);


/*=============================
	Typography css start
===============================*/
body {
	font-family: var(--td-ff-body);
	font-size: 16px;
	font-weight: 400;
	color: var(--td-grey-1);
	line-height: 26px;
}
img,
.img {
	max-width: 100%;
	@include transition(.3s);
}
a,
button {
	color: inherit;
	outline: none;
	border: none;
	background: transparent;
	text-decoration: none;
	@include transition(.3s);
}
a:focus,
.btn:focus,
.button:focus {
	text-decoration: none;
	outline: none;
	@include box-shadow(none);
}
a:hover,
button:hover {
	color: var(--td-common-black);
	text-decoration: none;
}
ul {
    margin: 0px;
    padding: 0px;
}
li{
	list-style: none;
}
.scrool-bar::-webkit-scrollbar {
	width: 5px;
	display: block;
	overflow: hidden;
	position: relative;
	margin-left: 5px;
}
.scrool-bar::-webkit-scrollbar-thumb {
	background-color: #e1e1e1;
	outline: 1px solid #e1e1e1;
}
.scrool-bar::-mos-webkit-scrollbar-thumb {
	background-color: #e1e1e1;
	outline: 1px solid #e1e1e1;
}
.scrool-height{
	width: 100%;
	height: 240px;
	overflow-y: scroll;
}
button:focus,
input:focus,
input:focus,
textarea,
textarea:focus {
	outline: 0;
}
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="url"],
textarea{
	outline: none;
	background-color: #fff;
	height: 56px;
	width: 100%;
	line-height: 56px;
	font-size: 15px;
	color:  var(--td-grey-1);
	padding-left: 26px;
	padding-right: 26px;
	border: 1px solid #a2a9ac;
	@include placeholder{
		color: var(--td-grey-1);
	}
}
h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--td-common-black);
	font-weight: 700;
	line-height: 1.1;
	text-transform: unset;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	color: inherit;
}
h1 {
	font-size: 48px;
}
h2 {
	font-size: 36px;
}
h3 {
	font-size: 24px;
}
h4 {
	font-size: 18px;
}
h5 {
	font-size: 17px;
}
h6 {
	font-size: 16px;
}
p {
	margin-bottom: 15px;
}
label {
	color: var(--td-common-black);
	cursor: pointer;
}

input[type="color"] {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	background: none;
	border: 0;
	cursor: pointer;
	height: 100%;
	width: 100%;
	padding: 0;
	border-radius: 50%;
}

*::-moz-selection {
	background: var(--td-theme-primary);
	color: var(--td-common-white);
	text-shadow: none;
}
::-moz-selection {
	background: var(--td-theme-primary);
	color: var(--td-common-white);
	text-shadow: none;
}
::selection {
	background: var(--td-theme-primary);
	color: var(--td-common-white);
	text-shadow: none;
}

/*=============================
    - Input Placeholder
===============================*/
input,
textarea {
    color: var(--td-grey-1);
}
*::-moz-placeholder {
	color: var(--td-grey-1);
	font-size: 16px;
	opacity: 1;
}
*::placeholder {
	color: var(--td-grey-1);
	font-size: 16px;
	opacity: 1;
}

/*=============================
    - Common Classes
===============================*/
.fix {
    overflow:hidden
}
.clear {
    clear: both;
}
.p-relative{
	position: relative;
}
.p-absolute{
	position: absolute;
}
.lh-28{
	line-height: 28px;
}
.td-round-15{
	border-radius: 15px;
}
.td-round-25{
	border-radius: 25px;
}

.z-index-m-1{
	z-index: -1;
}
.z-index-1{
	z-index: 1;
}
.z-index-2{
	z-index: 2;
}
.z-index-3{
	z-index: 3;
}
.z-index-4{
	z-index: 4;
}
.z-index-5{
	z-index: 5;
}
.z-index-6{
	z-index: 6;
}
.z-index-7{
	z-index: 7;
}
.z-index-8{
	z-index: 8;
}
.z-index-9{
	z-index: 9;
}
.z-index-10{
	z-index: 10;
}
.z-index-999{
	z-index: 999;
}
.gx-10{
	--bs-gutter-x: 10px;
}
.gx-15{
	--bs-gutter-x: 15px;
}
.gx-20{
	--bs-gutter-x: 20px;
}
.gx-24{
	--bs-gutter-x: 24px;
}
.gx-30{
	--bs-gutter-x: 30px;
}
.gx-40{
	--bs-gutter-x: 40px;
}
.gx-45{
	--bs-gutter-x: 45px;
}
.gx-50{
	--bs-gutter-x: 50px;
}
.gx-60{
	--bs-gutter-x: 60px;
}
.gx-70{
	--bs-gutter-x: 70px;
}
.gx-80{
	--bs-gutter-x: 80px;
}
.gx-90{
	--bs-gutter-x: 90px;
}
.gx-100{
	--bs-gutter-x: 100px;
}
.underline-black{
	@include tdborder(#000, 0,0);
	@include td-transition(all .4s ease);
	&:hover{
			@include tdborder(#000, 0,100%);
			@include td-transition(all .4s ease);
	}
}

.underline-white{
	@include tdborder(#fff, 0,0);
	@include td-transition(all .4s ease);
	&:hover{
		@include tdborder(#fff, 0,100%);
		@include td-transition(all .4s ease);
	}
}
.td-transparent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
}
.fix{
	overflow: hidden;
}
.text-right{
	text-align: right
}
.bg-position{
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}
/*=============================
    - Bootstrap Custom
=============================*/


.include-bg{
	@include background();
}

.slide-transtion {
    -webkit-transition-timing-function: linear;
    transition-timing-function: linear;
}

// custom-container-here
$container:(1680, 1700);

@each $number in $container{
	@media (min-width:1400px) {
		.container-#{$number}{
			max-width: #{$number}px;
		}
	}
}