/* Table of Content
==================================================
	#Font-Face
	#Site Styles
	#Media Queries */

/* #Font-Face
================================================== */


/* #Site Styles
================================================== */
:root {
	--width-base: 1110px;
	--font-base-size: 16px;
	--font-size-medium: 20px;
	--color-white: #fff;
	--color-black: #000;
	--color-base: #002147;
	--color-grey: #f5f5f5;
	--color-grey-100: #f6f6f6;
	--color-green: #075f48;
	--color-orange: #f4ad0b;
	--font-family-base: 'Poppins', sans-serif;
	--font-family-icon: 'icomoon', sans-serif;
	--line-height-base: 1.6;
	--font-size-h1: 36px;
	--font-size-h2: 32px;
	--font-size-h3: 20px;
	--font-size-h4: 20px;
	--font-size-h5: 18px;
	--font-size-h6: 16px;
	--line-height-heading: 1.1;
	--duration: all 0.3s;
	--width: 100%;
	--height: 100%;
}

/* ### general ### */
* { margin: 0; padding: 0; box-sizing: border-box; }
html,
body { font-family: var(--font-family-base); font-size: var(--font-base-size); font-weight: 400; line-height: var(--line-height-base); color: var(--color-base); background: var(--color-white) url('../images/body-bg.jpg'); background-repeat: no-repeat; background-position: top center; background-size: cover; }
input,
select,
textarea { padding: 10px 20px; width: var(--width); min-height: 48px; font-family: var(--font-family-base); font-size: var(--font-base-size); color: var(--color-black); border: 1px solid var(--color-grey); background-color: var(--color-white); }
input::placeholder { color: rgba(74, 85, 103, 0.6); }
textarea { padding: 13px 20px; min-height: 144px; }
textarea::placeholder { color: rgba(74, 85, 103, 0.6); }
label { margin-bottom: 1px; display: block; font-weight: 400; }
img { display: block; max-width: var(--width); }
ul,
li { list-style: none; }
p { margin-bottom: 25px; }
a { display: inline-block; text-decoration: none; transition: var(--duration); }
h1,
h2,
h3,
h4,
h5,
h6 { margin-bottom: 20px; font-family: var(--font-family-base); font-weight: 600; line-height: var(--line-height-heading); color: var(--color-base); }
h1,
.h1 { font-size: var(--font-size-h1); }
h2,
.h2 { font-size: var(--font-size-h2); }
h3,
.h3 { font-size: var(--font-size-h3); }
h4,
.h4 { font-size: var(--font-size-h4); }
h5,
.h5 { font-size: var(--font-size-h5); }
h6,
.h6 { font-size: var(--font-size-h6); }
.button { padding: 15px 29px; display: inline-flex; align-items: center; justify-content: center; font-size: var(--font-base-size); font-weight: 700; color: var(--color-base); border-radius: 30px; background-color: var(--color-orange); transition: var(--duration); }
.button:focus,
.button:hover { color: var(--color-white); background-color: var(--color-base); }

/* ### global classes ### */
.clear { visibility: hidden; clear: both; height: 0; line-height: 0; }
.centered { padding-right: 15px; padding-left: 15px; }

/* ### wrapper ### */
.wrapper { position: relative; display: block; width: var(--width); min-height: var(--height); overflow: hidden; }

/* ### header ### */
.header { padding-top: 15px; padding-bottom: 15px; display: flex; align-items: center; justify-content: space-between; background-color: var(--color-grey-100); }
.header-logo { width: 113px; }
.header-info { display: none; }
.header-info li:not(:last-of-type) { margin-right: 24px; }
.header-info li a { font-size: var(--font-base-size); font-weight: 500; color: var(--color-base); }
.header-info li a:focus,
.header-info li a:hover { color: var(--color-orange); }
.header-info li i { margin-right: 8px; font-size: 16px; }
.header-info .icon-phone { margin-right: 3px; }

/* ### intro ### */
.intro { padding-top: 36px; padding-bottom: 34px; }
.intro-text { margin-bottom: 40px; }
.intro h1 { margin-bottom: 20px; line-height: 1.2; }
.intro-text p:first-of-type { font-size: 18px; }
.intro-image { margin: 0 auto; width: 220px; text-align: center; }

/* ### quote-block ### */
.quote-block { padding-top: 26px; padding-bottom: 26px; background: url('../images/quote-bg.jpg') no-repeat; background-size: cover; }
.quote-holder { padding: 36px 24px 33px; background-color: rgba(7, 95, 72, 0.9); }
.quote-block h2 { margin-bottom: 0; line-height: 1.2; color: var(--color-white); }

/* ### text-block ### */
.text-block { padding-top: 35px; padding-bottom: 15px; }
.text-block-holder { margin: 0 auto; max-width: 730px; line-height: 1.65; }
.text-block h3 { margin-bottom: 15px; font-weight: 500; }
.text-block-item { margin-bottom: 31px; }

/* ### footer ### */
.footer { padding-top: 30px; padding-bottom: 34px; background-color: var(--color-grey); }
.footer-holder { padding-top: 28px; border-top: 2px solid var(--color-base); }
.footer-left { margin-bottom: 35px; font-size: 18px; }
.footer-title { margin-bottom: 7px; font-size: 24px; font-weight: 600; }
.footer-info li:not(:last-of-type) { margin-bottom: 9px; }
.footer-info li a { font-size: 18px; font-weight: 500; color: var(--color-base); }
.footer-info li i { margin-right: 8px; font-size: 14px; }
.footer-info li a:focus,
.footer-info li a:hover { color: var(--color-orange); }

/* #Media Queries
================================================== */
@media only screen and (min-width: 768px) {
	:root {
		--font-size-h2: 40px;
		--font-size-h3: 24px;
	}
	.header-logo { width: auto; }
	.header-info { display: flex; }
	.intro { padding-top: 50px; padding-bottom: 56px; display: flex; justify-content: space-between; }
	.intro-text { width: 58%; }
	.intro-image { margin: unset; width: 38%; text-align: unset; }
	.quote-holder { padding: 55px 70px 53px; }
	.text-block { padding-top: 95px; padding-bottom: 55px; }
	.text-block-item { margin-bottom: 52px; }
	.footer { padding-top: 46px; padding-bottom: 30px; }
	.footer-holder { padding-top: 25px; display: flex; justify-content: space-between; }
	.footer-left { margin-bottom: 0; width: 44%; font-size: 20px; }
	.footer-title { margin-bottom: 5px; font-size: 32px; }
	.footer-info { padding-top: 1px; }
	.footer-info li { margin-bottom: 12px; }
	.footer-info li i { margin-right: 12px; font-size: 16px; }
}

@media only screen and (min-width: 1025px) {
	:root {
		--font-size-h1: 64px;
	}
	.header-info li a { font-size: var(--font-size-medium); }
	.intro { padding-top: 80px; }
	.intro h1 { margin-bottom: 33px; }
	.intro-text p:first-of-type { font-size: 20px; }
	.intro-image { width: 31.5%; }
	.quote-holder { padding: 55px 190px 53px; }
	.footer-left { width: 30%; }
	.footer-info li a { font-size: 20px; }
}

@media only screen and (min-width: 1430px) {
	.centered { padding-right: calc((100% - var(--width-base)) / 2); padding-left: calc((100% - var(--width-base)) / 2); }
}