/*
Theme Name: Altrust Investment Solutions
Description: Custom designed theme specially for Altrust Investment Solutions
Version: 0.9
Author: Rob Williams, DevUp Inc <hello@devup.ca>
Tags: custom template
*/

/* Default Styles */

html, body {
    width:                  100%;
    height:                 100%;
    font-family:            'Raleway', 'Arial', sans-serif;
    background:             white;
}

p { padding: 0 0 1em 0; line-height: 1.5em; font-size: 1.3em; }
.bold { font-weight: bold; }
.italic { font-style: italic; }
.textleft { text-align: left; }
.textcenter { text-align: center; }
.textright { text-align: right; }
.clear { clear: both; }
.floatleft { float: left; }
.floatright { float: right; }

img.centered {
	display: block;
	margin: 0 auto;
}

img.alignright {
	padding: 4px;
	margin: 0 0 1em 1em;
	display: inline;
}

img.alignleft {
	display: inline;
}

img.aligncenter {
    display: block;
}

.alignright { float: right; }
.alignleft { float: left; }
.aligncenter { margin: 0 auto; }


/* Basic styles */

a { text-decoration: none; color: #7D7DB1; font-weight: 800; }
a:hover { color: blue; }

h1 { color: #000066; font-family: 'Oswald', sans-serif; font-weight: bold; font-size: 3em; line-height: 1.4em; position: relative; padding: 1em 0 0.5em; }
h1:after { content: ''; position: absolute; top: 1em; right: 102%; width: 81px; height: 77px; background-image: url(/wp-content/uploads/2020/04/altrust_logo_mark.png); background-size: cover; }
h2 { color: #000066; font-family: 'Oswald', sans-serif; font-weight: normal; font-size: 2.3em; padding: 1em 0; line-height: 1.4em; }
h2.underline { border-bottom: 2px #000066 solid; padding-bottom: 0; margin-bottom: 0.5em; }

h3 { color: #000066; font-family: 'Oswald', sans-serif; font-weight: bold; font-size: 1.5em; padding-bottom: 1em; }
h4 { color: #000066; font-family: 'Oswald', sans-serif; font-weight: normal; font-size: 1.5em; padding-bottom: 1em; }
h5 { color: #000066; font-family: 'Oswald', sans-serif; font-weight: bold; font-size: 1.2em; padding-bottom: 1em; }
h6 { color: #000066; font-family: 'Oswald', sans-serif; font-weight: normal; font-size: 1.2em; padding-bottom: 1em; }

header { background: #000066; padding: 1em 0; position: fixed; top: 0; left: 0; width: 100%; z-index: 50; }
.logged-in header { margin-top: 32px; }
header .logo svg { height: 75px; width: 410px; padding: 1em; background: white; margin-left: 3em; }
.menu-nav-menu-container { float: right; line-height: 100px; margin-right: 3em; }
.nav_menu { list-style: none outside; }
.nav_menu li { display: inline-block; position: relative; line-height: 1.4em; background: transparent; transition: 0.5s all; }
.nav_menu li a { font-weight: normal; font-size: 1.1em; color: white; padding: 0.5em 1em; text-transform: uppercase; position: relative; display: inline-block; z-index: 5; transition: 0.5s all; }
.nav_menu li:hover { background: white; }
.nav_menu li:hover a { color: #000066; }

.home .logo { display: none; }
.home .nav_menu li a { text-shadow: #000 0 0 5px, #000 0 0 10px; }
.home .nav_menu li:hover { background: #000066; }
.home .nav_menu li:hover a { color: white; }

.slider-wrapper { position: relative; }
.altrust_slider_content { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -55%); z-index: 10000; width: 40%; }
.altrust_slider_content p { color: white; font-weight: 300; font-size: 1.5em; text-shadow: #000 0 0 5px, #000 0 0 10px; width: 100%; max-width: 1120px; }
.altrust_slider_content svg { padding: 1em; background: white; }

main { background: url(/wp-content/uploads/2020/04/main_bg.jpg) white bottom center no-repeat; min-height: calc( 100vh - 150px ); padding-bottom: 2em; }
.home main { margin-top: 0; padding-bottom: 0; }
main h2, main h3, main h4, main h5, main h6, .container { max-width: 95; max-width: 1024px; margin: 0 auto; }
.container { padding-top: 130px; width: 95%; max-width: 1024px; }
.container:after { content: ''; display: table; clear: both; }
main h1, main h3, main p, main .offset { width: 95%; max-width: 950px; margin: 0 auto; padding-left: 25px; }
main .offset { margin-top: -1em; }
main .logo { padding: 1em 0; }


.blog article { padding: 1em 0; margin-bottom: 1em; border-bottom: 1px #000066 solid; }

article h2, article h3 { width: 100% !important; max-width: 9999px !important; padding-left: 0 !important; }
article h5 { font-weight: normal; margin: -1em 0 1em; }


.team { list-style: none outside; text-align: center; width: 95%; max-width: 1024px; margin: 2em auto 0; padding-bottom: 2em; }
.team li { display: inline-block; width: 21%; margin: 0 1.5% 1em; vertical-align: top; text-align: center; }
.team li img { width: 100% !important; height: auto !important; }
.team li h2 { font-size: 2em; text-align: center; padding: 0 0 0.25em; }
.team li h4 { font-size: 1.3em; text-align: center; padding: 0 0 1em; }
.team li p { font-size: 1.2em; padding: 0 0 1em; }
.altr_desc { margin-bottom: 1em; }

main ol { list-style: decimal outside; width: 95%; max-width: 980px; margin: 2em auto 0; padding: 0 0 2em 2em; }
main ol li { margin-bottom: 1em; font-size: 1.2em; }

.team_bio { display: inline-block; width: 65%; padding: 0 10% 4em 0; vertical-align: top; }
aside { display: inline-block; width: 20%; vertical-align: top; }
aside p { width: 100% !important; padding: 0; margin: 4em 0 6em; }
aside .team_image { width: 100% !important; height: auto !important; }
.team_bio .team_image { display: none; }

.certifications { margin-bottom: 1em !important; }

.team_links { list-style: none outside; }
.team_links li { padding-bottom: 1em; }
.team_links h4 { padding-bottom: 0.5em; }

.altrust_button, aside > p > a { background: #000066; border: 2px #000066 solid; color: white; display: inline-block; padding: 0.5em 1em; transition: 0.5s all; }
.altrust_button:hover, aside > p > a:hover { color: #000066; background: white; }
aside > p > a { width: calc( 100% - 4px ); padding: 0.5em 0; text-align: center; margin-top: 0.5em; }

.nivo-caption { left: 50% !important; bottom: auto !important; top: 50%; background: transparent !important; transform: translate(-50%,-50%); font-size: 4em; font-weight: 300 !important; line-height: 1.7em; opacity: 1 !important; width: 50% !important; text-align: center; padding: 0 !important; text-shadow: #000 0 0 5px, #000 0 0 10px; }

#mapp0 { width: 45% !important; }

.smalltext { font-size: 0.9em; }

footer { background: #000066; text-align: center; padding: 1em 0; }
footer h5 { color: white; }
footer p { color: white; }
footer p.devup { font-size: 0.8em; padding: 0; }
footer a { color: white; }
footer a:hover { color: white; text-decoration: underline; }

.footer_menu { list-style: none outside; }
.footer_menu > li { position: relative; }
.footer_menu > li > a { font-size: 0.8rem; font-weight: normal; }
.footer_menu > li > .sub-menu { position: absolute; bottom: 100%; left: 50%; transform: translate(-50%,0); background: #2e2e89; display: none; list-style: none outside; }
.footer_menu > li > .sub-menu > li { padding: 0.75em 1em; }
.footer_menu > li:hover > .sub-menu, .footer_menu > li > .sub-menu:hover { display: block; }

.left_half, .right_half { display: inline-block; width: 35%; box-sizing: border-box; margin-right: 1em; vertical-align: top; }
.right_half { width: 60%; }
.left_half h3, .right_half h3 { width: 100% !important; margin: 0 !important; padding: 0 !important; max-width: 9999px; }

.insight img { width: 250px !important; height: auto !important; display: inline-block; vertical-align: top; }
.insight .insight_content { display: inline-block; width: calc( 100% - 275px ); margin-left: 20px; vertical-align: top; }

#mc4wp-form-1 { width: 50%; padding-left: 25px; }
#mc4wp-form-1 label { display: block; font-size: 0.8em; font-weight: bold; }
#mc4wp-form-1 input, #mc4wp-form-1 select { width: 100%; padding: 0.25em 0; text-indent: 0.5em; border: 1px black solid; font-family: 'Raleway', sans-serif; font-size: 1em; }
#mc4wp-form-1 input[type="submit"] { border: 3px #000066 solid; background: #000066; color: white; text-indent: 0; }
#mc4wp-form-1 input[type="submit"]:hover { background: white; color: #000066; cursor: pointer; }
.mobile_slider { display: none; }

.swal-modal { width: 60%; }
.who_is_accredited { list-style: disc outside; padding-left: 2em; }
.who_is_accredited li { text-align: left; margin-bottom: 0.5em; }

.accredited { background-color: #449435; }
.accredited:hover { background-color: #6acd57 !important; }
.not_accredited { background-color: #b74848; }
.not_accredited:hover { background-color: #dd7979 !important; }

.accreditation_required .container h2, .accreditation_required .half, .accreditation_required article { opacity: 0; }

@media screen and (max-width: 1400px) {
    header { display: table; text-align: center; }
    header .logo { display: table-header-group; }
    .menu-nav-menu-container { display: table-footer-group; float: none; }
    .container { padding-top: 200px; }
}

@media screen and (max-width: 1024px) {
    .menu-nav-menu-container { line-height: 75px; margin-right: 2em; }
 	header .logo svg { height: 75px; margin-left: 2em; }
	.nivo-caption { width: 80% !important; font-size: 3em; }
	.nav_menu li a { font-size: 1rem; }
	h1 { position: relative; left: 2.2em; }
	h1:after { right: 100%; }
	.team li h2 { font-size: 1.75em; }
	.team_bio h2, .team_bio h3, .team_bio h4 { padding-left: 135px; width: calc(100% - 135px); line-height: 1.3em; }
	.swal-modal { width: 90%; }
	.who_is_accredited li { font-size: 0.8em; margin-bottom: 1em; line-height: 1.4em; }
}

@media screen and (max-width: 900px) {
	.nav_menu { padding: 0; }
	.nav_menu li a { font-size: 0.9em; }
}

@media screen and (max-width: 768px) {
    .menu-nav-menu-container { margin: 0; float: none; line-height: 1.2em; position: absolute; top: auto; bottom: 0; left: 0; width: 100%; }
	header { text-align: center; position: relative; padding: 0; }
	header .logo { width: 100%; }
	header .logo svg { margin: 1.5em 0; }
	h1 { font-size: 2em; line-height: 1.4em; position: relative; padding: 1em 0 0.5em; left: 2.4em; }
	h1:after { width: 52px; height: 50px; }
	h2 { font-size: 1.5em; }
	p { font-size: 0.7em; }
	footer h5 { font-size: 0.9em; }
	footer p.devup { font-size: 0.5em; }
	main { margin-top: 0; }
	.team li h2 { font-size: 1.25em; }
	.team li h4 { font-size: 1.1em; }
	.team li p { font-size: 0.9em; }
	.team_bio h2, .team_bio h3, .team_bio h4 { padding-left: 70px; width: calc(100% - 135px); line-height: 1.3em; }
	.team_bio h3 { font-size: 1.1em; }
	.team_bio h4 { padding-bottom: 0; }
	.altrust_slider_content { width: 60%; }
	.altrust_slider_content p { font-size: 1.1em; }
	.menu-nav-menu-container { position: relative; }
	body:not(.home) .menu-nav-menu-container { top: calc(50px + 2em + 3px); }
	header .logo { position: relative; top: -2em; }
	header .logo svg { height: 50px; }
	.container { padding-top: 0; }
	/*.page-template-default .container p { font-size: 0.6em; }*/
}

@media screen and (max-width: 450px) {
	header .logo svg { height: auto; width: 70%; }
    main h1 { width: 70%; max-width: 70%; margin: 0; }
	.nav_menu li a { font-size: 0.9em; }
	.nivo-caption { width: 80% !important; font-size: 2em; line-height: 1.4em; padding-left: 1em !important; }
	footer p.devup { font-size: 0.7em; }
	footer h5 span { visibility: hidden; margin-left: -1em; }
	footer h5 span:before { content: "\A"; white-space: pre; }
	.team li { width: 42%; }
	.team_bio { width: 95%; }
	.team_bio .team_image { display: inline; float: right; width: 35%; padding: 0 0 1em 1em; }
	aside { width: 95%; }
	aside .team_image { display: none; }
	#mapp0 { float: none !important; width: 95% !important; margin-bottom: 1em; }
	#mapp0 .mapp-wrapper { height: 300px !important; }
	.altrust_slider_content { width: 80%; }
	.altrust_slider_content svg { width: 90%; }
	.altrust_slider_content p { font-size: 0.8em; font-weight: bold; padding-left: 0; }
	.main_slider { display: none; }
	.mobile_slider { display: block; }
	.container > p { width: 90%; position: relative; left: -1em; }
	.postid-49 h1 { width: 70% !important; margin: 0 !important; }
	.postid-49 h1:after { top: 1em; }
	#mc4wp-form-1 { width: 90%; padding-left: 0; }
    .half { width: 95%; margin: 0 auto 1em; }
    .insight img { width: 95% !important; margin: 0 auto 2em; display: block; }
    .insight .insight_content { width: 95%; margin: 0 auto; }
    .insight .insight_content p { padding-left: 0; }
}

