/* New Modal / Login Styling (Can be added to core css)
    --------------------------------*/

    .new-modal-mask {
      position: fixed;
      z-index: 9998;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(255, 255, 255, 1);
      display: table;
    }

    .new-modal-wrapper {
      display: table-cell;
      vertical-align: middle;
    }

    .new-modal-container {
      width: 90%;
      max-width:400px;
      margin: 0px auto;
      background-color: #fff;
      box-shadow: 0 2px 8px rgba(0, 0, 0, .33);
      overflow:hidden;
      padding:1em 2em;
      text-align: center;
    }


/* Base
---------------------------------------------- */

html {
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font: 300 16px/1.55 'Roboto', sans-serif;
}

*,:before,:after {
    box-sizing: inherit;
}

body {
  margin: 0;
  height: auto;
 /* background-color: #f5f5f5;*/
}

body[data-state='noscroll'] {
  overflow: hidden;
  height: 100%;
}

main, main2 {
  display: block;
  padding: 2em 0 0 0;
  text-align: center;
  background-color: #fff;
}

@media only screen and (min-width: 500px) {
  main {
    font-size: 17px;
  }
}

@media only screen and (min-width: 600px) {
  main {
    font-size: 18px;
  }
}

@media only screen and (min-width: 700px) {
  main {
    font-size: 19px;
  }
}

button {
  font: inherit;
  font-weight: 300;
  background: none;
  border: 0;
  line-height: normal;
  overflow: visible;
  padding: 0;
  -webkit-user-select: none; /* for button */
     -moz-user-select: none;
      -ms-user-select: none;
}

button:hover {
  cursor: pointer;
  outline: 0;
}

h1 {
  font-size: 1.5em; 
  line-height: 1.5em;
  margin:1.5em 0 0 0;
}

h2 {
  font-size: 1.25em; 
  line-height: 1.5em;
  margin:2em 0 1em 0;
}

h3 {
  font-size: 1.125em; 
  line-height: 1.5em;
  margin:2em 0 1em 0;
}

h1,h2,h3, b, strong  {
  font-weight: 400;
}

p {
  margin: 1.5em 0;
}

blockquote {
  margin:1em 0 2.5em 0;
  border-left: 1px solid #ccc;
  padding-left:1em;
  font-style: italic;
}

ul, ol {
  margin:1em 0;
}

hr {
  border: 0;
  color: #ccc;
  background-color: rgba(0,0,0,.08);
  height: 1px;
  margin: 2em 0 2em 0;
  overflow: hidden;
}

img {
  max-width: 100%;
}

figure {
  margin:0;
}

.circle-image {
  border-radius: 50%;
}

.centered-text {
  text-align: center;
}






/* Links
---------------------------------------------- */

a {
  color: #333;
  text-decoration: none;
  -webkit-transition: color 0.18s ease-in-out;
  -moz-transition: color 0.18s ease-in-out;
  transition: color 0.18s ease-in-out;
}

a:hover {
  color: #aaa;
  text-decoration: none;
}

main a, footer a {
  color:#467ebd;
}



/* Containers
---------------------------------------------- */

.container {
  width: 90%;
  max-width: 720px;
  margin: 0 auto;
  clear: both;
  overflow: hidden;
}

.container-wide {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  clear: both;
}

.container-extra-wide {
  width:90%;
  margin: 0 auto;
  max-width: 1800px;
}






/* HEADERS & NAVIGATION

//////////////////////////////////////////////////////////////////////////////// */




/* Headers
---------------------------------------------- */

.header-large {
  display: none;
  width: 100%;
  padding:1em 0 0 0;
  z-index: 444;
  height:9em;
  -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,.15);
  box-shadow: 2px 2px 2px 0 rgba(0,0,0,.15);
  position: fixed;
  background-color: #fff;
  top:0;
}

.header-small {
  padding:0;
  background-color: #fff;
  -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,.15);
  box-shadow: 2px 2px 2px 0 rgba(0,0,0,.15);
}

.logo-and-title {
  float: left;
}

.logo {
  width:60px;
  height:60px;
  /* background-color: #222; */
  float: left;
  /* padding: .70em .75em .80em .75em; */
  
  padding: 0;
  
  border-radius: 50%;
  margin: 1em 1em 0 0;
  transition: background-color .3s;

}

.logo:hover {
   /* background-color: #999; */
}

.logo-small {
  width:2em;
  height:2em;
  /* background-color: #333; */
  float: left;
  margin: .5em .5em 0 1.5em;
  transition: opacity .3s;
}

.logo-small:hover {
   opacity: .5;
}

.logo-small img {
  display: block;
}

.title {
  display: inline-block;
  font-weight: 400;
  padding:.5em 0;
  height:3em;
  padding-top: .80em;
}

.title a {
  color:#222;
}

.title a:hover {
  color:#ccc;
}


.header-details {
  display: inline-block;
}

.header-title {
  font-size: 1.375em;
  font-weight: 400;
  margin: 1em 0 0 0;
  display: inline-block;
} 

.header-address {
  margin:0;
  font-size: 0.875em;
}

.header-phone {
  float: right;
  display: inline-block;
  margin: 1em .75em 0 0;
  font-size: .938em;
}

.header-large-sub-menu{
  float: right;
  display: inline-block;
  margin: 1em .75em 0 0;
  font-size: .938em;
}

.header-large-sub-menu a{
margin-left: 1em;
}


.goog-te-gadget-simple {
  background-color: #fed!important;
}

@media only screen and (min-width: 1200px) {
  .header-large {
    display: block;
  }

  .header-small {
    display: none;
  }

/*  .content-phone-and-address {
    display: none;
  }*/

  main, main2 {
    padding-top: 7.5em;
  }
  

}
 




/* Nav Toggle 
---------------------------------------------- */

.nav-toggle, .nav-close  {
  display: none;
}

.nav-toggle { /* color svg inline */
  background-color: #fff;
  border: none;
  outline:none;
  display:inline-block;
  padding:0px 3px;
  position:fixed;
  right:20px;
  top:10px;
  height:30px;
  transition: opacity 0.3s ease;
}

.nav-toggle:hover {
  opacity: .4;
}

.nav-toggle[aria-hidden="true"] {
  display: none;
}

.nav-toggle svg {
  width: 30px;
}

.hidden-text {
  display: none;
}






/* Headroom
---------------------------------------------- */

.header--fixed {
  position: fixed;
  z-index: 100;
  right: 0;
  left: 0;
  top: 0;
}

.headroom {
  transition: transform .25s ease-in-out;
  will-change: transform;
}

.headroom--pinned {
  transform: translateY(0);
}

.headroom--unpinned {
  transform: translateY(-100%);
}

.animated {
  -webkit-animation-duration: .5s;
  -moz-animation-duration: .5s;
  -o-animation-duration: .5s;
  animation-duration: .5s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  will-change: transform, opacity;
}

@-webkit-keyframes slideDown {
  0% {-webkit-transform: translateY(-100%);}
  100% {-webkit-transform: translateY(0);}
}

@-moz-keyframes slideDown {
  0% {-moz-transform: translateY(-100%);}
  100% {-moz-transform: translateY(0);}
}

@-o-keyframes slideDown {
  0% {-o-transform: translateY(-100%);}
  100% {-o-transform: translateY(0);}
}

@keyframes slideDown {
  0% {transform: translateY(-100%);}
  100% {transform: translateY(0);}
}

.animated.slideDown {
  -webkit-animation-name: slideDown;
  -moz-animation-name: slideDown;
  -o-animation-name: slideDown;
  animation-name: slideDown;
}

@-webkit-keyframes slideUp {
  0% {-webkit-transform: translateY(0);}
  100% {-webkit-transform: translateY(-100%);}
}

@-moz-keyframes slideUp {
  0% {-moz-transform: translateY(0);}
  100% {-moz-transform: translateY(-100%);}
}

@-o-keyframes slideUp {
  0% {-o-transform: translateY(0);}
  100% {-o-transform: translateY(-100%);}
}

@keyframes slideUp {
  0% {transform: translateY(0);}
  100% {transform: translateY(-100%);}
}

.animated.slideUp {
  -webkit-animation-name: slideUp;
  -moz-animation-name: slideUp;
  -o-animation-name: slideUp;
  animation-name: slideUp;
}






/* Sidenav
---------------------------------------------- */

.overlay {
  width:100%;
  height:100%;
  position: fixed;
  background-color: rgba(0,0,0,.6);
  z-index: 222;
  opacity: 1;
  transition: z-index 0.5s step-start, opacity 0.3s linear;
}

.overlay[aria-hidden="true"] {
  z-index: -1;
  opacity: 0;
  transition: z-index 0.5s step-end, opacity 0.5s linear;
}

nav.side-nav {
  margin:0;
  padding:2em 0;
  top: 0;
  left: 0;
  width:260px;
  height:100%;
  background-color: #fff;
  position: fixed;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transition: 0.2s;
  transition-timing-function: ease;
  z-index: 333;
  -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,.15);
  box-shadow: 2px 2px 2px 0 rgba(0,0,0,.15);
}

.side-nav[aria-hidden="true"] {
  left:-265px; /*extra to hide drop-shadow*/
}

.side-nav ul {
  list-style: none;
  padding: 0;
  margin:0;
}

.side-nav-column {
  margin-left: 2em;
}

.side-nav-title {
  font-weight: 400;
  font-size: 1.25em;
}

.side-nav-address {
  font-weight: 400;
  font-size: 0.813em
}

a.side-nav-phone {
  font-weight: 400;
  font-size: 1em;
  font-weight: 300;
  margin: 1.5em 0 0 -2px;
  display: inline-block;
}

.side-nav ul.soc {
  padding-left: 1.8rem;
  padding-top: 1.25em;
}






/* Sidenav Accordion
---------------------------------------------- */

.side-nav .accordion {
  list-style: none;
  line-height: 2.3;
  clear: both;
  font-size: 1.063em;
}

.side-nav .accordion a {
  -webkit-transition: 0.8s ease-in-out;
  -moz-transition: 0.8s ease-in-out;
  transition: 0.8s ease-in-out;
  color:#333;
  padding:.5em;
  margin-left: 1.3em;
}

.side-nav .accordion a:hover {
  color:#eee;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

.side-nav .accordion li ul {
  max-height: 0;
  overflow: hidden;
  transition: 0.3s ease-in-out;
  opacity: 0;
  background-color: #f5f5f5;
  font-size: 1rem;
}

.side-nav .accordion li ul a {
  padding: 0 1.3rem;
  display:inline-block;  /*margin-left: 1.3rem;*/
  line-height: 1.5em;
}

.side-nav .accordion li ul.show {
  opacity: 1;
  max-height: 500px;
  padding: 1em 0;
  margin:.5em 0 0 0;
}

.side-nav .accordion-button.active {
  color:#ccc;
}

.side-nav .accordion-button:after {
  content: '+'; 
  margin-left: .75em;
  background-color: #f5f5f5;
  border-radius: .5em;
  width: 1em;
  height: 1em;
  text-align: center;
  margin:0 0 0 .75em;
  line-height: 1em;
  display: inline-block;
/*  transition: color .3s;*/
}

.side-nav .accordion-button.active:after {
  content: "-"; 
}






/* Dropdown (code.stephenmorley.org)
---------------------------------------------- */

.dropdown, .dropdown li, .dropdown ul {
  margin: 0;
  padding: 0
}

.dropdown ul {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1
}

[dir=rtl] .dropdown ul {
  left: auto;
  right: 0
}

.dropdown ul ul, [dir=rtl] .dropdown ul .dropdownLeftToRight ul {
  top: 0;
  left: 100%;
  right: auto
}

.dropdown ul .dropdownRightToLeft ul, [dir=rtl] .dropdown ul ul {
  left: auto;
  right: 100%
}

.dropdown li {
  position: relative;
  display: block;
  list-style-type: none
}

.dropdown>li {
  display: inline-block
}

.dropdown a, .dropdown span {
  display: block;
  text-decoration: none;
  white-space: pre;
  padding: .25em .5em;
  color: #333;
  transition: background .2s;
  background-color: #fff
}

.dropdown li:hover>ul {
  display: block
}
.dropdownVertical {
  display: inline-block
}
.dropdownVertical>li {
  display: block
}
.dropdownVertical ul {
  top: 0;
  left: 100%
}

[dir=rtl] .dropdownVertical ul {
  left: auto;
  right: 100%
}

.dropdownJavaScript li:hover>ul {
  display: none
}

.dropdownJavaScript li.dropdownOpen>ul {
  display: block
}

.dropdown {
  text-align: center
}

.dropdown>li {
  text-align: left
}

[dir=rtl] .dropdown>li {
  text-align: right
}






/* Custom Dropdown Styling
---------------------------------------------- */

.dropdown-nav {
  clear: both;
  float: right;
  /*margin-top: -.5em;*/
}

.dropdown {
  display: inline-block;
  float: right;
}

.dropdown ul {
  margin:0;
  line-height: 2em;
  -webkit-box-shadow: 2px 3px 6px 0 rgba(0,0,0,.15);
  box-shadow: 2px 3px 6px 0 rgba(0,0,0,.15);

}

.dropdown a {
 
  font-size: .938em;
 font-weight: 400;
  background-color: rgba(255,255,255,0);
  color:#333;
}

.dropdown li a {
  line-height: 2em;
  padding:.75em .8em;
  -webkit-transition:  color 0.18s ease-in-out;
  -moz-transition:  color 0.18s ease-in-out;
  transition:  color 0.18s ease-in-out;

}

.dropdown li ul {
  background-color: #fff;
  margin-top: -3px;
  padding:.5em 0;

}

.dropdown li ul li a {
  line-height: 1.5em;
  padding:.5em 1em;
  text-transform: none;
  background-color: #fff;
  border-top: 1px solid rgba(255,255,255,.1);

}

.dropdown li a:hover {
  color:#ddd;
}

.dropdown ul li a {
  width: 180px;
  padding: .8em;
  white-space: normal;
  font-size: 1em;

}

.dropdown li.active {
  border-bottom: -2px solid #fff;
  padding-bottom: -2px;
}






/* Modal
------------------------------------------------------- */

.modal-components[aria-hidden="true"] {
  opacity: 0;
  transition: opacity 0s;
  z-index: -1;
  width: 100vw;
}

.modal-components[aria-hidden="false"] {
  opacity: 1;
  transition: opacity .5s;
  width: 100%;
  z-index: 600;
}

.modal-toggle {
  font-size: .938em;
  line-height: 1.5em;
  display: block;
  border: none;
  outline:none;
  padding:.5em 2em .5em 1em;
  transition: color .3s;
}

.side-nav .modal-toggle {
  padding-left: 2em;
}

.modal-toggle:hover {
  color:#eee;
}


.modal-components {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width:100%;
  height:100%;
  text-align: center;
  position: fixed;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
} 

.modal-container {
  display: table;
  width:100%;
  height:100%;
}

.modal-position {
  width:300px;
  height: 100%;
  overflow: auto;
  margin: 0 auto;
  padding: 1em 0;
  display:table-cell;
  vertical-align: middle;
  z-index: 600;
}

.modal-window {
  width:90%;
  display:inline-block;
  max-width:500px;
  margin:0 auto 2em auto;
  z-index: 500;
  position: relative;
  background-color: #fff;
  border: 1px solid #ddd;
/*  border-radius: .5em;*/
  padding: 1em 2em;
  -webkit-box-shadow: 2px 2px 6px 0 rgba(0,0,0,.05);
  box-shadow: 2px 2px 6px 0 rgba(0,0,0,.05);
}

.modal-overlay {
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(244,244,244,.98);
  position: absolute;
  z-index: 400;
  display: block;
    cursor: pointer;
}

.modal-overlay-close {
  font-size: 2em;
  text-align: right;
  margin: 1em 2em 0 0;
  cursor: pointer;
  /*font-weight: 200;*/

}

select {
  font-size: 1em;
}









/* Interface Elements

//////////////////////////////////////////////////////////////////////////////// */


/* Flickity (see flickity.css included)
---------------------------------------------- */

/* Tweak main position */
.flickity-container + main {
  padding-top:1em;
}

.flickity-container {
  width:100%;
  margin:0 auto 0 auto;
  padding:0;
  display: block;
  padding-top: 3em;
  max-width: 1200px;
}

@media only screen and (min-width: 1200px) {
  .flickity-container {
    padding-top: 5em;
  }
}


@media only screen and (min-width: 1300px) {
  .flickity-container {
    padding-top: 7em;
  }
}

@media only screen and (min-width: 1800px) {
  .flickity-container {
    padding-top: 11em;
  }
}

.flickity-prev-next-button {
  -webkit-transition: opacity 0.44s ease-in-out;
  -moz-transition: opacity 0.44s ease-in-out;
  transition: opacity 0.44s ease-in-out;
}

/* Hide next / previous buttons on small screens */

.flickity-prev-next-button {
  opacity: 0;
}

.flickity-prev-next-button:hover {
    opacity: .85;
  }

@media screen and (min-width: 600px) {
  .flickity-prev-next-button {
    opacity: .4;
  }
}

picture {
  display: block;
  overflow:hidden;
  margin:0;
  padding:0;
  width:100%;
  height:auto;
}

picture img {
  margin:0;
  padding:0;
  display: block;
}







/* Login Panel
--------------------------------------------------*/

#login-panel {
  background-color: #fff;
  width: 90%;
  margin: 3em auto 2em auto;
  max-width: 300px;
  border: 1px solid #ccc;
  padding: 1em;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 2px 2px 10px 0 rgba(0,0,0,.1);
  box-shadow: 2px 2px 10px 0 rgba(0,0,0,.1);
  text-align: center;
}

.logo-login {
  width:6em;
  height:6em;
  /* background-color: #333; */
  margin: 1em auto -1em auto;
  transition: opacity .3s;
  border-radius: 50%;
  /* padding:1em; */
  display: block;
  transition: background-color .3s;
}

.logo-login:hover {
  background-color: #ccc;

}

legend {
  font-size: .9em;
}

input, select {
  float: left;
  display: block;
  /*width: 260px;*/
  width: 100%;
  margin: 1em 0;
  padding: 10px;
  border: 1px solid #ccc;
  font-size: 1em;
}

input[type="checkbox"] {
    width:20px;
    padding:5px;
    margin:5px;
    float:left;
    clear:both;
}


input[type="text"]:focus {
  transition: all .5s;
}


input[type="text"]:focus {
 
    background-color: #D4E6F1;
  border:1px solid #ddd;
  color:#333;
  outline:none;
  box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  border: 1px solid rgba(81, 203, 238, 1);


}



.form-container 
{
    text-align:left!important;
    font-weight:300;}
    
 
 .form-container label
{
  font-weight:300;
  }
      
    

.input-group input {
    width:20px;
    padding:5px;
    margin:5px;
    float:left;
    clear:both;
    }
    
    .input-group-set
    { display:block;
      margin: 1em 0;
        }
    
.input-group 
{
    display:block;
    
    text-align:left;}
    
fieldset {
  border: none;
  margin: 0 auto;
  /* max-width: 380px; */
}

button.login {
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: none;
  box-shadow: none;
  /*border: 3px solid #fff;*/
  border:none;
  color: #fff;
  font-weight: 400;
  padding: .4em 1em;
  margin-top: 1em;
}

.login-note {
  text-align: center;
  font-size: .9em;
}

.login-button{
  border : none;
  font-size : 1em;
  font-weight: 400;
  color : #333;
  background : #eee;
  padding:1em;
  cursor: pointer;
  transition: .3s;
}

.login-button:hover {
  color : #fff;
  background : #444;
}





/* Sections
---------------------------------------------- */

.grey-section {
  background-color: #f8f8f8;
  padding-bottom: 1em;
}

section {
  background-color: #f8f8f8;
  padding:2em 0;
}

section:nth-child(even) {
  background: #fff;
}


.panel {
  background-color: #fff;
  padding: 2em;
  -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,.05);
  box-shadow: 2px 2px 2px 0 rgba(0,0,0,.05);
  margin-bottom: 1em;
 /* max-width: 840px;*/
  margin: 1em auto;
  /* overflow-x:scroll; */
}

.panel-wide {
    background-color: #fff;
  padding: 2em;
  -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,.05);
  box-shadow: 2px 2px 2px 0 rgba(0,0,0,.05);
  margin-bottom: 1em;
  width: 100%;
  max-width:1400px;
  margin: 1em auto;
 /* overflow-x:scroll; */
}

.overflow 
{
    overflow-x:scroll;
     /* overflow-y:scroll; */
    -webkit-overflow-scrolling: touch; 
    }

@media only screen and (min-width: 1200px) {
  .facilities-list li{
    width: 90%;
  }

  .panel-left-column {
    float:left;
    width: 55%;
    display: inline-block;
  }

  .panel-right-column {
    /*float:right;*/
    width: 42%;
     display: inline-block;
     float: right;

  }



}




.standard-button {
  background-color: #eee;
  padding:.5em 1em;
  cursor: pointer;
  color:#333;
  font-weight: 400;
  transition: .3s;
  margin-top: 1em;
  display: inline-block;
}

.standard-button:hover {
  background-color: #467ebd;
  background-color: #333;
  color:#fff;
}

.panel > h2, .panel > h3  {
  margin-top: 0;
}

.details-list {
  list-style: none;
  line-height: 2em;
}

.documents-list {
  list-style: none;
  padding:0;
  line-height: 2;
}

.your-balance {
  font-size: 1.063em;
}





/* Standard Page Tables
-------------------------------------------------------------- */

table {
  width:100%;
  border-collapse: collapse;
  text-align: left;
  background-color: #fff;
}

table.blue-edge {
  border-left: 15px solid #D4E6F1;
}

td, tr th {
  border: 1px solid #ddd !important;
  padding: .5em;
  font-size: .938em;
}

td.date-params
{
    padding-top: 0px;
    padding-bottom: 0px;
    border: 0 none #fff;
}

td.date-params-text-center
{
    margin:auto;
    display:block;
}

table.date-params {
  border-left: 15px solid #D4E6F1;
  border-bottom:  1px solid #ddd;
  border-right: 1px solid #ddd;
  border-top: 1px solid #ddd;
}

th {
  font-weight: 400;
}

textarea {
  width: 100%;
  padding:.5em;
  font-size: 1em;
  border:1px solid #ddd;
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
  background-color: #f1f1f1;
  transition: all .5s;
  outline: none;
/*  background-color: #feffe9;*/
}

textarea:focus {
  background-color: #D4E6F1;
  border:1px solid #ddd;
  color:#333;

  box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  border: 1px solid rgba(81, 203, 238, 1);

}

textarea.read-only {
  background-color: #ffffcc;
  color:#555;
}

.checkbox-row {
  display: inline-block; margin-right: 10px;
}

.input-button {
  width:200px;
  background-color: #D4E6F1;
  background-color: #333;
  color:#fff;
  margin: 2em auto 1em auto;
  padding:1em;
  display: block;
  border:none;
  float: none;
  transition: background-color .5s;
}

.input-button:hover {
  background-color: #ccc;
  cursor: pointer;
}

.input-text-link {
  background-color: rgba(0,0,0,0);
  border:none;
  width: auto;
  font-size: .875em;
  transition: color .5s;
}

.input-text-link:hover {
  cursor: pointer;
  color:#ccc;
}

.calculate-button {
  background-color: #467ebd;
}

.alternate-colour-button {
  background-color: #467ebd;
}


select {
  width: 100%;
}



.next {
  float:right;
}


.details {
  margin-bottom: 1em;
  font-size: .875em;
  overflow: hidden;
}

/*.details span {
  margin: 0 1em;
}*/

.float-left {
  float: left;
}


.float-right {
  float: right;
}

.last-saved {
  margin-right: .75em;
  font-weight: 400;
}

.red {
  color:#ff0000;
}

.clear {
  clear: both;
  display: block;
}








/* Notices
---------------------------------------------- */

.notices {
  margin-top: 2em;
  text-align: center;
  padding: .5em 0 1em 0;
}

.notices h2 {
  margin-top:1em;
  text-align: center;
}

.notice-date {
  display: inline-block;
  width: 6em;
}

.notice-title {
  float: left;
  width: auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 95%;
}

.notices .toggle-hidden-content {
  height:2.5em;
  white-space: nowrap;
  overflow: hidden;
}

.notices .toggle-hidden-content, .notices .hidden-content {
  padding: 0 1em;
  line-height: 2.5em;
}

.notices .hidden-content {
  clear: both;
  font-size: .938em;
  line-height: 1.5em;
}

.hidden-content {
  max-height: 0;
  overflow: hidden;
  cursor: pointer;
  transition: 0.3s linear;
  opacity: 0;
  background-color: #fff;
}

.show {
  transition: 0.3s linear;
  max-height: 600px;
  opacity: 1;
  overflow-y: scroll;
}

.toggle-hidden-content {
  cursor: pointer;
  background-color: #eee;
  border-bottom:1px solid #fff;
  transition: background-color 1s;
}

.toggle-hidden-content:hover {
  background-color: #e5e5e5;
   transition: background-color .3s;
}

.toggle-hidden-content:after {
  content: '+'; 
  margin-left: .75em;
  background-color: #fff;
  border-radius: .5em;
  width: 1em;
  height: 1em;
  text-align: center;
  margin:0 0 0 .75em;
  line-height: 1em;
  display: inline-block;
}

.toggle-hidden-content:after {
  content: '+'; 
  background-color: #fff;
  border-radius: .5em;
  width: 1em;
  height: 1em;
  text-align: center;
  margin:.75em 0 0 .75em;
  line-height: 1em;
  display: inline-block;
}
.toggle-hidden-content.active:after {
  content: "-"; 
}

.more-info {
  text-align: center;
  display: block;
  margin: 0 auto;
}






/* Facilities
---------------------------------------------- */

.facilities-list {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow:hidden;
}

.facilities-list img{
  display: block;
  margin: 0 auto 1em auto;
}

.facilities-list li{
  margin-bottom: 1em;
  padding: 1.25em 0 1em 0;
  font-size: 0.938rem;
}

.facilities-content-block {
  background-color: #eee;
  overflow:hidden;
}

@media only screen and (min-width: 500px) {
  .facilities-list li{
    width: 46.8%;
    display: inline-block;
    margin: .5em 1%;
  }
}

@media only screen and (min-width: 800px) {
  .facilities-list li{
    width: 30%;
    margin: 1em 1%;
  }
}

@media only screen and (min-width: 1100px) {
  .facilities-list li{
    width: 22%;
  }
}

@media only screen and (min-width: 1600px) {
  .facilities-list li{
    width: 15%;
  }
}






/* Map
---------------------------------------------- */


.map-overlay {
  background:transparent;
  position:relative;
  width:100%; /* your iframe width */
  height:360px; /* your iframe height */
  top:360px; /* your iframe height */
  margin-top:-360px; /* your iframe height */
}

.map {
  width:100%;
  height:360px;
}

@media only screen and (min-width: 800px) {
  .map, .map-overlay {
    height:540px;
  }
  .map-overlay {
    margin-top:-540px;
    top:540px;
  }
}






/* Charts
---------------------------------------------- */

.chart-group {
  margin: 2em auto;
}

.chart-container {
  display: inline-block;
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
  padding:1em;
  margin: 0;
}

.chart-container-maint {
  display: inline-block;
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
  padding:0 0 1em 0;
  margin: 0;
}

@media only screen and (min-width: 1200px) {
  .chart-container {
    width: 30%;
    display: inline-block;
    margin: .5em 2%;
  }
}

.chart-container > h3, .chart-container-maint > h3 {
  margin-top: 0;
}

.text-align-left {
  text-align: left;
}





/* Footer
---------------------------------------------- */

.main-footer {
  padding: 3em 0;
  /*text-align: center;*/
  background-color: #f1f1f1;
  overflow: hidden;
  clear:both;
}

.text-small {
  font-size: .938em;
}

.text-smaller {
  font-size: .750em;
}

.social-list {
  list-style: none;
  padding:0;
}

.social-list li {
  display: inline-block;
}

.social-list a {
  padding: .5em;
}

.property-contact-details {
  list-style: none;
  margin:0 0 1em 0;
  padding:0;
}

.footer-column {
  width: 100%;
  float: left;
}

.footer-column p {
  max-width: 540px;
}

@media only screen and (min-width: 800px) {
  .footer-column{
    width: 46%;
    display: inline-block;
    margin: .5em 2%;
  }
}

ul.social-media-links  {
  list-style: none;
  padding:0;
}

.social-media-links li {
  display: inline-block;
  width: 30px;
  margin-right: 5px;

}

.social-media-links img{
  transition: opacity .3s;
}


.social-media-links img:hover {
  opacity: .5;
}

.side-nav .social-media-links li {
  width: 28px;
}

.side-nav .social-media-links {
  margin-top: 1em;
}





/* Other Layout Elements

//////////////////////////////////////////////////////////////////////////////// */



/* Masonry
--------------------------------------------------*/

#max-width-container {
  width: 90%;
  max-width: 1400px; /*for maximum 4 columns*/
  /*max-width: 960px;*/ /*for maximum 3 columns*/
  margin: 0 auto;
}

#masonry-container {
  margin: 2em auto;
  display: block;
}

.grid {
  display: block;
  width: 100%;
  overflow: hidden;

  margin: 1em auto 2em auto;
}

.grid-item { 
  width: 100%; 
  padding-bottom: .5em;
  float: left;
}

.grid-item a img{
  display: block;
  transition: opacity .3s;
  -webkit-backface-visibility: hidden;
}

.grid-item a img:hover {
  opacity: .7;

}

@media only screen and (min-width: 500px) {
  .grid-item { 
    width: 50%; 
    padding:.25em;
  }
}

@media only screen and (min-width: 1200px) {
  .grid-item { 
    width: 33.33%; 
    padding:.5em;
  }
}



/* Photoswipe Customisation
--------------------------------------------------*/

.pswp__bg {
 /* background-color: #f5f5f5;*/
 background-color: rgba(255, 255, 255, 0.97);
}

.pswp__ui--fit .pswp__top-bar {
/* background-color: rgba(250, 0, 0, 0.3); */
 background-color: #f5f5f5;
 background-color: rgba(255, 255, 255, 0);

}

.pswp__counter {
  color:#bbb;
}

.pswp__button {
  background-color: #bbb;
}


/* Financial Snapshot boxes */

  .custom-grid-container {
    background-color: #fff;
    overflow: hidden;
    text-align: center;
  }
  
  .custom-grid-item {
    width:46%;
    background-color: #e0ffff;
    float: left;
    height:170px;
    border: 1px solid #ddd;
    margin:2%;
    display: table;
    padding:.5em;
  }  

  .custom-grid-item-content {
    display: table-cell;
    vertical-align: middle;
  }  

  @media screen and (min-width: 640px) {
    .custom-grid-item {
      width:29.3%;
    }
  }

 .form-label{
      width: 100%;
      text-align: left;
  }

  .error span{
      background-color: red;
      color:white;
      padding:5px;
      width:100%;
  } 

  .validationSummary li{
     list-style-type: none;
  }
  .validationSummary div{
      background-color: red;
      color:white;
      padding:5px;
  } 

  .successMsg span{
      background-color: green;
      color:white;
      padding:5px;

  }

  .informationMsg span{
      background-color: DodgerBlue;
      color:white;
      padding:5px;

  }

  .defaultIcons{
      font-size:40px;
  }


  .bookFacility td, tr th{
      border: 0;
  }

/*.rowwpan2 {
    rowspan: 2;
}*/

.formContainer{
    margin-top: 15px
}

.timepickerTextBox{
    max-width: 260px;
}

.requiremetsList{
   font-size:15px;
}

.requiremetsList li {
   font-size:15px;
   list-style-type: none;
}

**scheduller style
.container {
	background-color: rgba(255,255,255,1);
	font-family: 'Lato',sans-serif;
}

/* Header */
.header {
	padding: 50px 0;
	text-align: center;
}
.header .header-big {
	font-size: 50px;
	font-weight: bold;
	letter-spacing: 3px;
	text-transform: uppercase;
}
.header .header-small {
	font-size: 20px;
	letter-spacing: 3px;
	color: #666;
}
.header:after {
	border-bottom-color: #c594c5 !important;
	content: '';
    display: block;
    position: absolute;
    width: 100px;
    border-bottom: 3px solid;
    margin-top: 18px;
    margin-left: -50px;
    left: 50%;	
}

/* Content */
.content {
	text-align: center;
}
.content .section {
	width: 100%;
	float: left;
}
.content .section h2 {
	font-weight: bold;
	font-size: 35px;
}
.content .section > p {
	padding: 10px 25% 10px;
	line-height: 24px;
	font-size: 16px;
	color: #666;
}

/* Features */
.content .section .features-list {
	margin-top: 10px;
	width: 100%;
	float: left;
}
.content .section .features-list img {
	display: inline-block;	
}
.content .section .features-item {
	float: left;
	width: 100%;
	margin: 5px 0 8px 0;
}
.content .section .features-icon {
	float: left;
    width: 50px;
	height: 50px;
	background: #6699cc;
	border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    font-size: 25px;
	color: #fff;
}
.content .section .features-icon i {
	margin-top: 13px;
	margin-left: 2px;
}
.content .section .features-icon .fa-file-text {
	font-size: 20px;
	margin-left: 4px;
}
.content .section .features-content {
	margin-left: 50px;
	padding-left: 15px;
	text-align: left;
}
.content .section .features-content h3 {
	margin-top: -3px;
	font-size: 22px;
}
.content .section .features-content p {
	color: #666;
	font-size: 14px;
}

/* Usage */
.content .section#usage {
	margin: 20px 0;	
}
.content .section#usage > p {
	margin-bottom: 15px;	
}

/* Monthly View */
.content .section#monthly-view {
	margin-top: 20px;
}
.content .section#monthly-view > p {
	margin-bottom: 0;	
}

/* Weekly View */
.content .section#weekly-view {
	margin-top: 40px;
}
.content .section#weekly-view > p {
	margin-bottom: 0;	
}

/* Code quote */
.code-header {
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 10px;
}
.code {
	background-color: #f7f7f9;
    border: 1px solid #e1e1e8;
	padding: 10px;
	margin-bottom: 20px;
	color: #5AA4A3;
	text-align: left;
	letter-spacing: 0.5px;
	border-radius: 4px;
	-moz-border-radius: 4px;
    -webkit-border-radius: 4px;	
}
.code-title {
	color: #f0c674;
}
.code-attribute {
	color: #567BD2;
}
.code-value {
	color: #de935f;
}

/* Footer */
.footer {
	width: 100%;
	float: left;
	text-align: center;
	padding: 40px 0 60px 0;
	font-size: 15px;
}
.footer:before {
	border-bottom-color: #c594c5 !important;
	content: '';
    display: block;
    position: absolute;
    width: 100px;
    border-bottom: 3px solid;
    margin-left: -50px;
    left: 50%;	
}
.footer .product-name {
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 10px;
	margin-top: 20px;
}

/* Responsive */
@media (max-width: 767px) {
	.header .header-big {
		font-size: 40px;
	}
	.content .section p {
		padding: 10px 0;
		line-height: 24px;
		font-size: 16px;
		color: #666;
	}
	.content .section .features-content h3 {
		margin-bottom: 0;
	}
	.content .section#usage .usage-column {
		padding: 0;
	}
	.content .section .features-item {
		margin: 5px 0 2px 0;
	}
}


/** end scheduler style**/

.actionButton{
    width:100%;
    background-color:#9ACD32;
    float: left;
    display: block;
    margin: 1em 0;
    padding: 10px;
    border: 1px solid #ccc;
    font-size: 1em;
}

/*Js Grid**/
.jsgrid-header-row>.jsgrid-header-cell {
    background: #C5BDBB;
}