/* Template: Leno - Mobile App HTML Landing Page Template
   Author: Inovatik
   Created: Mar 2019
   Description: Master CSS file
*/

/*****************************************
Colors:

- Text, navbar links - white #f1f1f8 --> B1B4BE -->
- Buttons, bullets, icons - turquoise #00c9db --> 12afd8 --> CCE4EA --> A58542 --> fcd739
- Navbar - navy #4633af --> 282d35 --> 144A5E -- > 396289 --> 88a9c3
- Backgrounds - dark denim #262431 --> 1D4553 --> 00596D --> 2b4257
- Backgrounds - denim #2f2c3d --> 53616E --> 446171 --> 88a9c3 --> 345e7d
- small highlights - 990228 --> D20337 --> B7352D --> fcd739
- rotating text - 40e0ee --> B7352D --> B7352D --> fcd739
******************************************/


/******************************/
/*        General Styles      */
/******************************/


* {
    box-sizing: border-box;
  }

body,
html {
    width: 100%;
    height: 100%;
}

body, p {
	color: #f1f1f8;
	font: 400 0.875rem/1.375rem "Open Sans", sans-serif;
}

.p-large {
	color: #f1f1f8;
	font: 400 1rem/1.5rem "Open Sans", sans-serif;
}

.p-small {
	color: #f1f1f8;
	font: 400 0.75rem/1.25rem "Open Sans", sans-serif;
}

.p-heading {
	margin-bottom: 3.75rem;
	text-align: center;
}

.li-space-lg li {
	margin-bottom: 0.375rem;
}

.indent {
	padding-left: 1.25rem;
}

h1 {
	color: white;
	font: 700 2.5rem/2.875rem "Montserrat", sans-serif;
}

h1.highlight {
	color: #345e7d;
}

h2 {
	color: #f1f1f8;
	font: 700 2.25rem/2.75rem "Montserrat", sans-serif;
}

h3 {
	color: #f1f1f8;
	font: 700 1.75rem/2.125rem "Montserrat", sans-serif;
}

h4 {
	color: #f1f1f8;
	font: 700 1.375rem/1.75rem "Montserrat", sans-serif;
}

h5 {
	color: #f1f1f8;
	font: 700 1.125rem/1.625rem "Montserrat", sans-serif;
}

h6 {
	color: #f1f1f8;
	font: 700 1rem/1.5rem "Montserrat", sans-serif;
}

a {
	color: #f1f1f8;
	text-decoration: underline;
}

a:hover {
	color: #f1f1f8;
	text-decoration: underline;
}

a.turquoise {
	color: #00c9db;
}

a.white {
	color: #fff;
}

highlight {
  color: #fcd739
}

.v-center {
    margin-top: auto;
    margin-bottom: auto;
}


/* Referencing locally used fonts */
@font-face {
    font-family: 'Montserrat';
    src: url('../../fonts/Montserrat/Montserrat-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../../fonts/Montserrat/Montserrat-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../../fonts/Montserrat/Montserrat-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../../fonts/OpenSans/OpenSans-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../../fonts/OpenSans/OpenSans-Italic.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../../fonts/OpenSans/OpenSans-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../../fonts/OpenSans/OpenSans-BoldItalic.woff2') format('woff2');
    font-weight: 700;
    font-style: italic;
}

/* Use the fonts in your site */
body {
    font-family: 'Open Sans', sans-serif;
}

h1, h2, h3 {
    font-family: 'Montserrat', sans-serif;
}

/* Font Awesome font references*/
@font-face {
    font-family: 'Font Awesome 5 Free';
    src: url('../../webfonts/fa-solid-900.woff2') format('woff2');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Font Awesome 5 Free';
    src: url('../../webfonts/fa-regular-400.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Font Awesome 5 Brands';
    src: url('../../webfonts/fa-brands-400.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

.darker-logo {
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	position: relative;
	background-color: #2b4257;
}

.darker-background {
  background-color: #2b4257
}

.lighter-background {
  background-color: #345e7d;
}


/* Min-width width 768px */
@media (min-width: 768px) {

    .p-heading {
		width: 85%;
		margin-right: auto;
		margin-left: auto;
	}

	h1 {
		font: 700 3.25rem/3.75rem "Montserrat", sans-serif;
	}

}


/* Min-width width 992px */
@media (min-width: 992px) {

	/* General Styles */
	.p-heading {
		width: 65%;
	}
	/* end of general styles */

}


/* Min-width width 1200px */
@media (min-width: 1200px) {


	/* General Styles */
	.p-heading {
		width: 44%;
	}
	/* end of general styles */

}