
/*
* Colours
*/
:root {
	--shs-colour1: rgb(30,79,93);
	--shs-colour2: rgb(83,153,156);
	/*--shs-colour3: #80c1b9;*/
	--shs-colour3: #50999c;
	--shs-colour4: rgb(174,203,193);
	--shs-colour5: rgb(228,228,222);

	--shs-colour1-hover: rgb(10,59,73);
	--shs-colour2-hover: rgb(63,133,136);
	--shs-colour4-hover: rgb(154,183,173);
}

/*
* Typology
*/
body {font-family: 'Work Sans', sans-serif;font-weight: 300;font-size:16px}
h1 {font-size: 28px;font-weight:600}
h2 {font-size: 22px;font-weight:400}
h3, legend {font-size: 18px;font-weight:400;color:var(--shs-colour3)}
h4 {font-size: 17px;font-weight:400;}
a {text-decoration:none}
h4, a h4 {color:var(--shs-colour1)}

.text-muted {color:var(--shs-colour4)!important}
.bg-primary {background-color:var(--shs-colour3)!important}
.bg-secondary {background-color:var(--shs-colour2)!important}
.bg-colour5 {background-color:var(--shs-colour5)!important}

#content p a,#content li a,#content .form-group a,a.btn-link  {font-weight: 400;color:var(--shs-colour3);text-decoration: none;}

.swishy-short {padding:10px 0;text-align: center;color:#fff;background: url('/export/system/modules/au.com.simplyhomeschool.template2022/resources/img/front-page-swish-medium.png') no-repeat 50% 50%}
.swishy-long {margin-top:2rem;padding:10px 0;text-align: center;color:#fff;background: url('/export/system/modules/au.com.simplyhomeschool.template2022/resources/img/front-page-swish-long.png') no-repeat 50% 50%;background-size: cover;}
.water-colour {margin-top:2rem;padding:30px 0;text-align: center;color:#fff;background: url('/export/sites/simplyhomeschool/images/website/home-watercolour-strip.jpg') no-repeat 50% 50%;background-size: cover;}
h2.water-colour  {font-size: 28px;font-weight:600}

.grey-heading {padding: 20px 0;text-align: center;background-color:var(--shs-colour5);}
a .grey-heading {color:#212529}
a:hover .grey-heading {color:var(--shs-colour2-hover)}

.feature-bg {background-color: var(--shs-colour4);padding:15px 0;}
.feature-bg p {margin: 0 auto;max-width:720px}

.peach-bg {background-color:#f2c6b6;color:white;padding:30px;text-align:center;margin-bottom:30px}
.peach-bg h1,.peach-bg h2,.peach-bg p {color:white}

.image-rounded {border-radius:200px}
img.text-center  {margin-left: auto;margin-right:auto;display: block;}

#content {padding-top:56px;padding-bottom:100px}
@media (min-width:992px) {
	#content {padding-top:115px;}
}
/*
* hone landing page
*/
.full-page-content {position: relative;}
.full-page-content-inner {
	position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
.home-logo-centre {position: absolute;top: 25%;width: 100%;}
.home-logo-centre-inner {max-width: 400px;margin: 0 auto;text-align: center;padding:0 15px}
.home-welcome-text {font-size:16px;font-weight:300;padding:0 15px}
@media (min-width:768px) {
	.home-welcome-text {font-size:18px}
}

.home-sub-text {font-size:15px}
.water-colour-strip {background-image:url('/export/sites/simplyhomeschool/images/website/home-watercolour-strip.jpg');
	background-size:cover;
	height:100px;
	margin-top:-100px;
}
.home-shadow-box {border:1px solid #eee;display:inline-block;

	-webkit-box-shadow: 3px 3px 5px 0px rgba(153,153,153,1);
	-moz-box-shadow: 3px 3px 5px 0px rgba(153,153,153,1);
	box-shadow: 3px 3px 5px 0px rgba(153,153,153,1);
}

.home-key-images {max-width:388px;margin:0 auto}

.ongoing-support {
	max-width:800px;
	margin:0 auto;
	position:relative
}
.ongoing-support img {
	left:0;
	top:-50px
}
.ongoing-support p {
	font-size:18px;
	font-weight:bold;
	margin:
}
@media (min-width:768px) {
	.ongoing-support p {
		padding-left:50px;
	}
}

/* Nav */
.dropdown-menu {background-color: #f8f9fa;border:none;}
.dropdown-item {color: rgba(0,0,0,.55);font-weight: 300;}
@media (max-width: 767px) {
    .navbar .container {
        max-width: 100%;
    }
}

/* ============ desktop view ============ */
@media all and (min-width: 992px) {
 .dropdown-menu li{ position: relative; 	}
 .nav-item .submenu{
	 display: none;
	 position: absolute;
	 left:100%; top:-7px;
 }
 .nav-item .submenu-left{
	 right:100%; left:auto;
 }
 .dropdown-menu > li:hover{ background-color: #f1f1f1 }
 .dropdown-menu > li:hover > .submenu{ display: block; }
}
/* ============ desktop view .end// ============ */

/* ============ small devices ============ */
@media (max-width: 991px) {
  .dropdown-menu .dropdown-menu{
	  margin-left:0.7rem; margin-right:0.7rem; margin-bottom: .5rem;
  }
}
@media all and (max-width: 500px) {
	h1.swishy-short {font-size:18px}
}
/* ============ small devices .end// ============ */

/*
* Scroll To Top
*/
#content .btn-to-top {
	position: fixed;
	bottom: 25px;
	z-index: 1020;
	opacity: 0;
	display: none;
	right: 15px;
	padding:0
}
#content .btn.btn-icon {
    width: 50px;
	min-width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    border-radius: 25px;
}
#content .btn-to-top.show {
    opacity: 1.0;
    display: block;
    -webkit-animation: btnFadeIn 0.2s ease;
    -moz-animation: btnFadeIn 0.2s ease;
    -ms-animation: btnFadeIn 0.2s ease;
    -o-animation: btnFadeIn 0.2s ease;
    animation: btnFadeIn 0.2s ease;
}
/*
* Footer
*/
.footer-inner {color:#fff;background-color:var(--shs-colour1);padding:10px 0;text-align: center;}
.footer-inner h3 {font-weight: 600}
.footer-inner p,.footer-inner a {color:#fff;margin-bottom:0;font-weight: 600;}

@media (min-width:768px) {
html {position: relative;min-height: 100%;}
body {margin: 0 0 409px;}
.footer {position: absolute;left: 0;bottom: 0;height: 409px;width: 100%;}
}



/*
* Form
*/
.form-group {margin-bottom: 1rem}
.dia-form-field input,.dia-form-field select,.dia-form-field textarea,.form-group input,.form-group select,.form-group textarea {background-color: var(--shs-colour5);border-color:var(--shs-colour5);color:var(--shs-colour3); }
.dia-form-field input::placeholder,.dia-form-field select::placeholder,.dia-form-field textarea::placeholder,.form-group input::placeholder,.form-group select::placeholder,.form-group textarea::placeholder {color:var(--shs-colour3);font-weight: 300 }


/*
* Buttons
*/
.btn {text-transform: uppercase;}
#content .btn {min-width:120px}
.btn-primary {background-color: var(--shs-colour2);border-color:var(--shs-colour2) }
.btn-primary:hover,.btn-primary:active,.btn-primary:focus {background-color:var(--shs-colour2-hover);border-color:var(--shs-colour2-hover);}

.btn-secondary {background-color: var(--shs-colour1);border-color:var(--shs-colour1) }
.btn-secondary:hover,.btn-secondary:active,.btn-secondary:focus {background-color:var(--shs-colour1-hover);border-color:var(--shs-colour1-hover);}

.btn-white {background-color: #fff;border-color: #fff }
.btn-white:hover,.btn-white:active,.btn-white:focus {background-color:#c6c6c3;border-color:#c6c6c3;}

.shs-icon {padding:6px 10px;width:34px;height:34px;background:var(--shs-colour3);color:#fff;border-radius: 16px;margin-right:10px}

.btn-special {background-color:#f79431;border-color:#f79431;color:#fff}
.btn-special:hover, .btn-special:focus, .btn-check:checked+.btn-special, .btn-check:active+.btn-special, .btn-special:active, .btn-special.active, .show>.btn-special.dropdown-toggle {background-color:#d77411;border-color:#d77411;color:#fff}

.btn-peach {background-color:#fe9b7f;border-color:#fe9b7f;color:#fff}
.btn-peach:hover, .btn-peach:focus, .btn-check:checked+.btn-peach, .btn-check:active+.btn-peach, .btn-peach:active, .btn-peach.active, .show>.btn-peach.dropdown-toggle {background-color:#ee8b6f;border-color:#ee8b6f;color:#fff}


/*
* Helpers
*/
.mw-400 {max-width: 400px;margin-left: auto;margin-right:auto;}
.mw-600 {max-width: 600px;margin-left: auto;margin-right:auto;}
.mw-720 {max-width: 720px;margin-left: auto;margin-right:auto;}

.container-sm {max-width: 720px;}
@media (min-width:740px) {
	.container-sm {padding-left:0;padding-right:0}
}
.container-lg {max-width: 1110px;}
/*
* Pricing Plan
*/
.pricing-plan-table td {font-size:14px}
.pricing-plan-table th {line-height: 1;vertical-align:top}
.pricing-plan-price {font-size:30px;font-weight: 800;color:var(--shs-colour3)}
.pricing-plan-icon {font-size: 20px}

.pricing-plan-not-included {color:#dbdbdb}

.pricing-plan-table thead {background-color: #fff;position:sticky;top: 56px;}
/*
* Membership Form
*/
.membership-form li {margin-bottom:1rem}

/*------------------------------------*\
    MATERIAL PHOTO GALLERY
\*------------------------------------*/
.m-p-g {
  max-width: 100%;
  margin: 0 auto;
}
.m-p-g__thumbs-img {
  margin: 0;
  float: left;
  vertical-align: bottom;
  cursor: pointer;
  z-index: 1;
  position: relative;
  opacity: 0;
  filter: brightness(100%);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  will-change: opacity, transform;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.m-p-g__thumbs-img.active {
  z-index: 50;
}
.m-p-g__thumbs-img.layout-completed {
  opacity: 1;
}
.m-p-g__thumbs-img.hide {
  opacity: 0;
}
.m-p-g__thumbs-img:hover {
  filter: brightness(110%);
}
.m-p-g__fullscreen {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0);
  visibility: hidden;
  transition: background 0.25s ease-out, visibility 0.01s 0.5s linear;
  will-change: background, visibility;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
.m-p-g__fullscreen.active {
  transition: background 0.25s ease-out, visibility 0.01s 0s linear;
  visibility: visible;
  background: rgba(0, 0, 0, 0.95);
}
.m-p-g__fullscreen-img {
  pointer-events: none;
  position: absolute;
  transform-origin: left top;
  top: 50%;
  left: 50%;
  max-height: 100vh;
  max-width: 100%;
  visibility: hidden;
  will-change: visibility;
  transition: opacity 0.5s ease-out;
}
.m-p-g__fullscreen-img.active {
  visibility: visible;
  opacity: 1 !important;
  transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.5s ease-out;
}
.m-p-g__fullscreen-img.almost-active {
  opacity: 0;
  transform: translate3d(0, 0, 0) !important;
}
.m-p-g__controls {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 200;
  height: 20vh;
  background: linear-gradient(to top, transparent 0%, rgba(0, 0, 0, 0.55) 100%);
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.m-p-g__controls.active {
  opacity: 1;
  visibility: visible;
}
.m-p-g__controls-close, .m-p-g__controls-arrow {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  background: none;
}
.m-p-g__controls-close:focus, .m-p-g__controls-arrow:focus {
  outline: none;
}
.m-p-g__controls-arrow {
  position: absolute;
  z-index: 1;
  top: 0;
  width: 20%;
  height: 100vh;
  display: flex;
  align-items: center;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  opacity: 0;
}
.m-p-g__controls-arrow:hover {
  opacity: 1;
}
.m-p-g__controls-arrow--prev {
  left: 0;
  padding-left: 3vw;
  justify-content: flex-start;
}
.m-p-g__controls-arrow--next {
  right: 0;
  padding-right: 3vw;
  justify-content: flex-end;
}
.m-p-g__controls-close {
  position: absolute;
  top: 9vh;
  right: 3vw;
  z-index: 1000;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.m-p-g__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.07);
  transition: all 0.25s ease-out;
}
.m-p-g__btn:hover {
  background: rgba(255, 255, 255, 0.15);
}
.m-p-g__alertBox {
  position: fixed;
  z-index: 999;
  max-width: 700px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
  padding: 25px;
  border-radius: 3px;
  text-align: center;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.23), 0 10px 40px rgba(0, 0, 0, 0.19);
  color: grey;
}
.m-p-g__alertBox h2 {
  color: red;
}

