@font-face {

    font-family: 'Montserrat';

    src: url('../assets/fonts/Montserrat/Montserrat-Bold.woff2') format('woff2'),

        url('../assets/fonts/Montserrat/Montserrat-Bold.woff') format('woff');

    font-weight: bold;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Montserrat';

    src: url('../assets/fonts/Montserrat/Montserrat-Regular.woff2') format('woff2'),

        url('../assets/fonts/Montserrat/Montserrat-Regular.woff') format('woff');

    font-weight: normal;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Montserrat';

    src: url('../assets/fonts/Montserrat/Montserrat-SemiBold.woff2') format('woff2'),

        url('../assets/fonts/Montserrat/Montserrat-SemiBold.woff') format('woff');

    font-weight: 600;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Montserrat';

    src: url('../assets/fonts/Montserrat/Montserrat-Medium.woff2') format('woff2'),

        url('../assets/fonts/Montserrat/Montserrat-Medium.woff') format('woff');

    font-weight: 500;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Montserrat';

    src: url('../assets/fonts/Montserrat/Montserrat-Light.woff2') format('woff2'),

        url('../assets/fonts/Montserrat/Montserrat-Light.woff') format('woff');

    font-weight: 300;

    font-style: normal;

    font-display: swap;

}





html {

  scroll-behavior: smooth;

}

:root {

	--black: #000;

	--yellow: #FFD100;

	--dark-blue: #051940;

	--footer: #121B2A;

	--blue: #35B0CB;

	--white: #fff;

	--grey: #EFEFEF;

}

body{

	font-family: 'Montserrat';

	font-weight: 400;

}

/* General Styles */

.container{

	width: 100%;

	max-width: 1519px;

	padding: 0 20px;

	margin: 0 auto;

}

.button, #searchsubmit{

	background-color: var(--yellow);

	padding: 10px 35px;

	color: var(--dark-blue);

	font-weight: 400;

	display: inline-block;

	border-radius: 25px;

	cursor: pointer;

	transition: background-color 0.3s ease, color 0.3s ease;

	font-size: 20px;

}

.button:hover, #searchsubmit:hover{

	background-color: #B89B00;

	color: #fff;

}

.white-section {

	background-color: var(--white);

}

.grey-section {

	background-color: var(--grey);

}

.dark-section {

	background-color: var(--dark-blue);

}

.blue-section {

	background-color: var(--blue);

}

/* End General Styles */

/* Font Style */

h1, h2, h3, h4, h5, h6{

	font-family: 'Montserrat';

	color: var(--dark-blue);

	margin-bottom: 20px;

	font-weight: 700;

}

h1{

	font-size: 55px;

}

h2{

	font-size: 50px;

}

h3{

	font-size: 33px;

}

h4{

	font-size: 30px;

}

h5{

	font-size: 25px;

}

h6{

	font-size: 17px;

}

.pageTitle h1 {

	color: var(--white);

}

p, li,  td, th, #s {

	font-size: 24px;

	line-height: 1.6em;


	color: var(--dark-blue);

}
a {
	color: var(--dark-blue);
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a{

	font-size: inherit;

	line-height: inherit;

	font-weight: inherit;

}

.white-text {

	color: var(--white);

}

.yellow-text {

	color: var(--yellow);

}

img {

	max-width: 100%;

	height: auto;

}

p, ul, ol, table{

	margin-bottom: 20px;

}

p:last-child{

	margin-bottom: 0;

}

blockquote{

	margin-bottom: 20px;

}

blockquote p {

	font-weight: 600;

	font-size: 120%;

	line-height: 1.4em;

}

ul, ol {

	padding-left: 20px;

	margin-top: -10px;

}

ul{

	list-style-type: disc;

}

ol{

	list-style-type: decimal;

}

ul ul, ol ol, ul ol, ol ul{

	margin-bottom: 0;

	margin-top: 0;

}

b {

	font-weight: 700;

}

table{

	width: 100%;

}

table th {

	background-color: #999999;

	color: #000;

	font-weight: 600;

	text-align: left;

}

table th, table td{

	padding: 5px;

	border: 1px solid #999;

}

table tr:nth-child(2n){

	background-color: #eee;

}

a, i, #searchsubmit{

	transition: all .5s ease-in-out;

}

a{

	color: #55acee;

	text-decoration: none;

}

a:hover{

	color: #2E79B1;

}

/* End Font Style */



/* Search */

#searchform {

	margin-bottom: 20px;

}

#searchform #s {

	border: 1px solid #333;

}

#searchsubmit {

	border: 0;

	font-size: 16px;

	line-height: 1.6em;

	cursor: pointer;

	padding: 3px 22px;

	font-family: 'Montserrat';

}

/* End of Search */

/* Menu */

.menu, .menu ul {

	padding: 0;

	list-style-type: none;

	margin: 0;

}

.menu{

	display: flex;

	gap: 20px;

}

.menu li{

	position: relative;

}

.sub-menu {

	display: none;

	position: absolute;

	background-color: #55acee;

	min-width: 150px;

	z-index: 8;

}

.sub-menu .sub-menu {

	right: -100%;

	top: 0;

}

.menu li a {

	width: 100%;

	display: block;

}

.sub-menu li a{

	padding: 5px 15px;

}

/* End Menu */

#ContentWrap {

	padding: 50px 0;

}



.pageWrap {

	margin: 50px 0 100px;

}

/* Archive */

.archive-loop {

	display: flex;

	flex-wrap: wrap;

	max-width: 100%;

	gap: 40px;

	justify-content: center;

}

.archiveItem {

	flex: 1 1 calc(33% - 40px);

	min-width: 380px;

	max-width: 550px;

}

.featuredImg {

	background-size: cover;

	background-repeat: no-repeat;

	background-position: center;

	height: auto;

	max-width: 550px;

	aspect-ratio: 550 / 225;

	margin-bottom: 20px;

}

.archiveTitle a {

	color: var(--dark-blue);

}

.articleDate {

	margin: 0;

	font-size: 20px;

}

.navigation {

	text-align: center;

	margin-top: 20px;

}

.page-numbers {

	background-color: var(--dark-blue);

	padding: 4px 10px;

	color: var(--white);

	font-size: 24px;

}

a.page-numbers:hover, .page-numbers.current{

	background-color: var(--yellow);

	color: var(--black);

}



.blogDate {

	font-size: 20px;

}

.archiveImage {

	float: right;

	max-width: 530px;

	width: 100%;

}

/* End of Archive */





/* Device = Most of the Smartphones Mobiles (Portrait) */

@media only screen and (max-width: 480px) {

	.postTitle h1 {

		font-size: 40px;

	}

}