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

    Template Name: Aidzone
    Author: Theme_Pure
    Support: https://help.themepure.net/support/
    Description: Template
    Version: 1.01

-----------------------------------------------------------------------------------

/************ TABLE OF CONTENTS ***************

	-----------------
    01. THEME CSS
	-----------------
		1.1 Theme Default
		1.2 Common Classes
		1.3 Default Spacing
		
	-----------------
    02. COMPONENTS css
	-----------------
		2.1 Back to top
		2.2 Buttons
		2.3 Animations
		2.4 Preloader
		2.5 Background
		2.6 Nice Select
		2.7 Pagination
		2.8 Offcanvas
		2.9 Breadcrumb
		2.10 Accordion
		2.11 Section Title
		2.12 Search
	-----------------
    03. HEADER CSS
	-----------------
		3.1 Header Style 1
		3.2 Header Style 2
		3.3 Header Style 3
		3.4 Header Style 4


    ---------------------------------
	04. MENU CSS
	---------------------------------
		4.1 Main menu css
		4.2 Mobilemenu css

	---------------------------------
	05. BLOG CSS
	---------------------------------
		5.1 Postbox css
		5.2 Recent Post css
		5.3 Sidebar css
		5.4 Blog css

	---------------------------------
	06. FOOTER CSS
	---------------------------------
		6.1 Footer Style 1
		6.2 Footer Style 2
		6.3 Footer Style 3

	
	---------------------------------
	07. PAGES CSS
	---------------------------------
		7.1 About css
		7.2 Award css
		7.3 Brand css
		7.4 contact css
		7.5 funfact css
		7.6 Slider css
		7.7 price css
		7.8 Services css
		7.9 Testimonial css
		7.10 Banner css
		7.11 Choose css
		7.12 Cta css
		7.13 Discover css
		7.14 Error css
		7.15 Event css
		7.16 Faq css
		7.17 Featured css
		7.18 Order css
		7.19 Portfolio css
		7.20 Team css
		7.21 Video css
		7.22 Text-slider css
		7.23 Shop css
		7.24 Cart css
		7.25 Checkout css
		
**********************************************/


/*----------------------------------------*/
/*  1.1 Theme Default
/*----------------------------------------*/

@import url($font-url);

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

/*---------------------------------
	typography css start 
---------------------------------*/
body {
	font-size: 14px;
	line-height: 26px;
	font-weight: normal;
	color: var(--tp-text-body);
	font-family: var(--tp-ff-body);
}

img {
	max-width: 100%;
}

a {
	text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin-top: 0px;
	font-weight: 500;
	line-height: 1.2;
	@include tp-transition(color);
	color: var(--tp-common-black);
	font-family: var(--tp-ff-heading);
}

h1 {
	font-size: 40px;
}

h2 {
	font-size: 36px;
}

h3 {
	font-size: 28px;
}

h4 {
	font-size: 24px;
}

h5 {
	font-size: 20px;
}

h6 {
	font-size: 16px;
}

ul {
	margin: 0px;
	padding: 0px;
}

p {
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 15px;
	line-height: 1.9;
	font-family: var(--tp-ff-p);
	color: var(--tp-text-body);
}


a,
button,
p,
input,
select,
textarea,
li,
.transition-3 {
	@extend %transition;
}

a:not([href]):not([class]),
a:not([href]):not([class]):hover {
	color: inherit;
	text-decoration: none;
}

a:focus,
.button:focus {
	text-decoration: none;
	outline: none;
}

a:focus,
a:hover {
	color: inherit;
	text-decoration: none;
}

a,
button {
	color: inherit;
	outline: none;
	border: none;
	background: transparent;
}

button:hover {
	cursor: pointer;
}

button:focus {
	outline: 0;
}

.uppercase {
	text-transform: uppercase;
}

.capitalize {
	text-transform: capitalize;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="url"],
textarea {
	outline: none;
	height: 56px;
	width: 100%;
	line-height: 56px;
	font-size: 14px;
	padding-left: 26px;
	padding-right: 26px;
	color: var(--tp-common-black);
	border: 1px solid var(--tp-common-black);
	background-color: var(--tp-common-white);

	@include tp-placeholder {
		color: var(--tp-common-black);
	}

	&:focus {
		border: 1px solid var(--tp-theme-1);

		&::placeholder {
			opacity: 0;
		}
	}

}

textarea {
	line-height: 1.4;
	padding-top: 17px;
	padding-bottom: 17px;
}

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(--tp-common-black);
	color: var(--tp-common-white);
	text-shadow: none;
}

::-moz-selection {
	background: var(--tp-common-black);
	color: var(--tp-common-white);
	text-shadow: none;
}

::selection {
	background: var(--tp-common-black);
	color: var(--tp-common-white);
	text-shadow: none;
}

*::-moz-placeholder {
	color: var(--tp-common-black);
	font-size: 14px;
	opacity: 1;
}

*::placeholder {
	color: var(--tp-common-black);
	font-size: 14px;
	opacity: 1;
}

.z-index-1 {
	position: relative;
	z-index: 2;
}