/*
* Underdog Design
* Base Grid + Styling
*
* Using Skeleton V2.0.4 (Copyright 2014, Dave Gamache)
*/


/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Preloader
- Misc
- Clearing
- DQUBE Solutions Custom
*/


/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box; }
.column,
.columns {
  width: 100%;
  float: left;
  box-sizing: border-box; }

/* For devices larger than 400px */
@media (min-width: 400px) {
  .container {
    width: 85%;
    padding: 0; }
}

/* For devices larger than 767px */
@media (min-width: 767px) {
  .container {
    width: 80%; }
  .column,
  .columns {
    margin-left: 4%; }
  .column:first-child,
  .columns:first-child {
    margin-left: 0; }

  .one.column,
  .one.columns                    { width: 4.66666666667%; }
  .two.columns                    { width: 13.3333333333%; }
  .three.columns                  { width: 22%;            }
  .four.columns                   { width: 30.6666666667%; }
  .five.columns                   { width: 39.3333333333%; }
  .six.columns                    { width: 48%;            }
  .seven.columns                  { width: 56.6666666667%; }
  .eight.columns                  { width: 65.3333333333%; }
  .nine.columns                   { width: 74.0%;          }
  .ten.columns                    { width: 82.6666666667%; }
  .eleven.columns                 { width: 91.3333333333%; }
  .twelve.columns                 { width: 100%; margin-left: 0; }

  .one-third.column               { width: 30.6666666667%; }
  .two-thirds.column              { width: 65.3333333333%; }

  .one-half.column                { width: 48%; }

  /* Offsets */
  .offset-by-one.column,
  .offset-by-one.columns          { margin-left: 8.66666666667%; }
  .offset-by-two.column,
  .offset-by-two.columns          { margin-left: 17.3333333333%; }
  .offset-by-three.column,
  .offset-by-three.columns        { margin-left: 26%;            }
  .offset-by-four.column,
  .offset-by-four.columns         { margin-left: 34.6666666667%; }
  .offset-by-five.column,
  .offset-by-five.columns         { margin-left: 43.3333333333%; }
  .offset-by-six.column,
  .offset-by-six.columns          { margin-left: 52%;            }
  .offset-by-seven.column,
  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
  .offset-by-eight.column,
  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
  .offset-by-nine.column,
  .offset-by-nine.columns         { margin-left: 78.0%;          }
  .offset-by-ten.column,
  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
  .offset-by-eleven.column,
  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }

  .offset-by-one-third.column,
  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,
  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }

  .offset-by-one-half.column,
  .offset-by-one-half.columns     { margin-left: 52%; }

}


/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
  font-size: 62.5%; }
body {
  font-size: 1.8em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.5;
  font-weight: 300;
  font-family: "Roboto", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #2c4758; }


/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 2rem;}
h1, h2 {
  font-family: "Museo Sans", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 500; }
h3 {
  font-family: "Roboto", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300; }
h4, h5, h6 {
  font-family: "Roboto", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700; }
h5, h6 {
  font-family: "Roboto", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400; }
h1 { font-size: 4.8rem; line-height: 1.05;  letter-spacing: -.05rem;}
h2 { font-size: 3.6rem; line-height: 1.2; letter-spacing: -.05rem; }
h3 { font-size: 2.2rem; line-height: 1.35; letter-spacing: 0; }
h4 { font-size: 1.8rem; line-height: 1.5;  letter-spacing: 0;}
h5 { font-size: 1.8rem; line-height: 1.5;  letter-spacing: 0; }
h6 { font-size: 1.8rem; line-height: 1.5;  letter-spacing: 0; }

/* Larger than phablet */
@media (min-width: 550px) {
  h1 { font-size: 5.5rem; }
  h2 { font-size: 4.2rem; }
  h3 { font-size: 2.6rem; }
  h4 { font-size: 1.8rem; }
  h5 { font-size: 1.8rem; }
  h6 { font-size: 1.8rem; }
}

p {
  margin-top: 0; }


/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
  color: #2c4758; }
a:hover {
  color: #7ecbe9; }


/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button p,
button p,
input[type="submit"] p,
input[type="reset"] p,
input[type="button"] p {
 margin: 0;
 padding: 0;
}
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  display: inline-block;
  padding: 10px 25px;
  color: #ffffff;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  background-color: #2c4758;
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  cursor: pointer;
  box-sizing: border-box;
  border: none; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
  color: #2c4758;
  background-color: #ffffff; 
  outline: 0; 
  -webkit-transition:color .25s ease, border .25s ease, background-color .25s ease;
  -moz-transition:color .25s ease, border .25s ease, background-color .25s ease;
  transition:color .25s ease, border .25s ease, background-color .25s ease; }
.bg-white .button:hover,
.bg-white button:hover {
  color: #2c4758;
  background-color: #e0e0e0; 
  outline: 0; 
  -webkit-transition:color .25s ease, border .25s ease, background-color .25s ease;
  -moz-transition:color .25s ease, border .25s ease, background-color .25s ease;
  transition:color .25s ease, border .25s ease, background-color .25s ease; }
.button.reversed,
button.reversed,
input[type="submit"].reversed,
input[type="reset"].reversed,
input[type="button"].reversed {
  color: #2c4758;
  background-color: #ffffff; }
.button.reversed:hover,
button.reversed:hover,
input[type="submit"].reversed:hover,
input[type="reset"].reversed:hover,
input[type="button"].reversed:hover,
.button.reversed:focus,
button.reversed:focus,
input[type="submit"].reversed:focus,
input[type="reset"].reversed:focus,
input[type="button"].reversed:focus {
  color: #FFF;
  background-color: #2c4758;
  -webkit-transition:color .25s ease, border .25s ease, background-color .25s ease;
  -moz-transition:color .25s ease, border .25s ease, background-color .25s ease;
  transition:color .25s ease, border .25s ease, background-color .25s ease;}


/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
label,
select {
  height: 38px;
  padding: 6px 0px; /* The 6px vertically centers text on FF, ignored by Webkit */
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #ffffff;
  box-shadow: none;
  box-sizing: border-box;
  width: 100%;
  color: #ffffff;
  letter-spacing: .2rem;
  font-weight: 400;
  opacity: 1;
}
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
label,
textarea {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }
textarea {
  min-height: 65px;
  padding-top: 6px;
  padding-bottom: 6px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
label:focus,
select:focus {
  border: none;
  border-bottom: 1px solid #2c4758;
  outline: 0;
  transition: 0.25s; }
legend {
  display: block;
  text-transform: uppercase;
  color: #ffffff;
  letter-spacing: .05rem; }
fieldset {
  padding: 0;
  border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
  display: inline; }
label > .label-body {
  display: inline-block;
  margin-left: .5rem;
  font-weight: normal; }
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #ffffff;
  opacity: 1;
}
input::-moz-placeholder,
textarea::-moz-placeholder { /* Firefox 19+ */
  color: #ffffff;
  opacity: 1;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder { /* IE 10+ */
  color: #ffffff;
  opacity: 1;
}
input:-moz-placeholder,
textarea:-moz-placeholder { /* Firefox 18- */
  color: #ffffff;
  opacity: 1;
}

/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul {
  list-style: circle inside; }
ol {
  list-style: decimal inside; }
ol, ul {
  padding-left: 0;
  margin-top: 0; }
ul ul,
ul ol,
ol ol,
ol ul {
  margin: 1.5rem 0 1.5rem 3rem;
  font-size: 90%; }
li {
  margin-bottom: 1rem; }


/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
  padding: .2rem .5rem;
  margin: 0 .2rem;
  font-size: 90%;
  white-space: nowrap;
  background: #F1F1F1;
  border: 1px solid #E1E1E1;
  border-radius: 4px; }
pre > code {
  display: block;
  padding: 1rem 1.5rem;
  white-space: pre; }


/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
th,
td {
  padding: 12px 15px;
  text-align: left;
  border-bottom: 1px solid #E1E1E1; }
th:first-child,
td:first-child {
  padding-left: 0; }
th:last-child,
td:last-child {
  padding-right: 0; }


/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
  margin-bottom: 1rem; }
input,
textarea,
select,
fieldset {
  margin-bottom: 1.5rem; }
pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
  margin-bottom: 2.5rem; }


/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
  width: 100%;
  box-sizing: border-box; }
.u-max-full-width {
  max-width: 100%;
  box-sizing: border-box; }
.u-pull-right {
  float: right; }
.u-pull-left {
  float: left; }


/* Preloader
–––––––––––––––––––––––––––––––––––––––––––––––––– */
body.preloader-site {
    overflow: hidden;
}

.preloader-wrapper {
    width: 100%;
	height: 100%;
    position: fixed;
	background: #ffffff;
	top: 0;
    left: 0;
    z-index: 9999999;
}

.preloader-wrapper .preloader {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 60px;
}

/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
  margin-top: 3rem;
  margin-bottom: 3.5rem;
  border-width: 0;
  border-top: 1px solid #E1E1E1; }
.centre {text-align:center;}
.right {text-align:right;}
.light {font-weight:300;}
.regular {font-weight:400;}
.bold {font-weight:700;}
.no-margin {margin:0;}
.no-margin-top {margin-top:0;}
.no-margin-bottom {margin-bottom:0;}
.no-padding {margin:0;}
.no-padding-top {padding:0;}
.no-padding-bottom {padding:0;}
.add-padding {padding: 2rem;}
.add-padding-top {padding-top: 2rem;}
.add-padding-bottom {padding-bottom: 2rem;}
.add-margin {margin: 2rem;}
.add-margin-top {margin-top: 2rem;}
.add-margin-bottom {margin-bottom: 2rem;}
.add-section-margin {margin-top: 8rem; margin-bottom: 8rem;}
.add-section-padding {padding-top: 8rem; padding-bottom: 8rem;}
.hide-link {text-decoration:none;}
.hide-link:hover {background-color:transparent;}
.full-width-image {max-width: 100%;}
.bg-image {background-position: center; background-repeat: no-repeat; background-size: cover;}
.v-align-container {
	position:relative;
}
.v-align-content {
	position:absolute;
	top:50%;
	left:0;
	transform:translateY(-50%);
	width:100%;
}

/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Self Clearing Goodness */
.container:after,
.row:after,
.u-cf {
  content: "";
  display: table;
  clear: both; }


/* DQUBE Solutions Custom
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Fonts */
@font-face {
	font-family: 'Museo Sans';
	src: url('../fonts/MuseoSans_500-webfont.woff2') format('woff2'),
		 url('../fonts/MuseoSans_500-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

/* Colours */
.cyan {color: #7ecbe9;}
.light-cyan {color: #d3e4e9;}
.navy {color: #2c4758;}
.light-grey {color: #e0e0e0;}
.white {color: #ffffff;}
.bg-cyan {background-color: #7ecbe9;}
.bg-light-cyan {background-color: #d3e4e9;}
.bg-navy {background-color: #2c4758;}
.bg-light-grey {background-color: #e0e0e0;}
.bg-white {background-color: #ffffff;}

/* Global Elements */
.logo {width: calc(100% - 75px); max-width: 285px;}
.full-width-panel {width: 100%; position: relative;}
.box-overlap-base {position: absolute; width: 100%; top: 0; left: 0; z-index: -1;}
.box-overlap-base {z-index: 2;}
.box-overlap-bottom {width: 100%; height: 20rem;}
.box-overlap-top {margin-top: -20rem; padding-bottom: 5rem;}
.section-break {margin-top: 10rem;}
.white-backing-box {min-height: 20rem; position: absolute; top: 0; left: 0; width: 100%; margin-top: 20rem; z-index:-1; height: 100%;}
h4.caps {text-transform: uppercase; letter-spacing: 1px; margin-bottom: 0;}

/* Menu */
#navigation-bar {position: fixed; top: 0; right: 0; transition: top 0.3s;}
.menu-icon {z-index: 2; cursor: pointer;}
#menu-close {position: fixed; top: 0; right: 0;}
#full-menu {width: 100%; height: 100%; position: fixed; top: 0; left: 0; background-color: rgba(44,71,88,0.9); display: none;}
.full-menu-inner .fas {margin-right: 8px;}

/* Footer */
.footer-logo {max-width: 250px;}
.footer-link {color: #ffffff; text-decoration: none;}
.footer-link:hover {color: #ffffff; cursor: text;}
.location-images {width: 125px; max-width: 100%;}
#twitter-feed a, #twitter-feed a:visited {color:#7ecbe9; margin-left: 8px; text-decoration: none;}
#twitter-feed a:hover {color:#ffffff;}
#twitter-feed ul {padding-left:0px; margin-bottom:8px;}
#twitter-feed ul li {list-style:none; overflow:hidden;}
#twitter-feed .tweet {color:#ffffff; font-size: 2.6rem; line-height:1.35; margin-bottom:0px;}
#twitter-feed .timePosted {display: none;}
#twitter-feed .interact {display:none;}
#twitter-feed .interact a {display:none;}
#twitter-feed .media img {max-width:250px; max-height:250px;}

/* Cards */
.card-description {padding: 30px; margin-bottom: 20px;}
.services-card {min-height: 120px !important; text-align: center; vertical-align: middle;}
.values-card {min-height: 190px !important; text-align: center; vertical-align: middle;}

/* Tabs */
.tab {width: auto; margin: auto; cursor: pointer;}
.tab:hover {text-decoration: none; color: #2c4758;}
.tab h5 {display: inline-block; padding: 15px; margin: 15px 15px 0;}
.tab.active h5 {border-bottom: 2px solid #7ecbe9;}
.tab h5:hover {border-bottom: 2px solid #7ecbe9;}

/* Lists */
.question-list {list-style: none;}
.question-list li {padding-left: 33px;}
.question-list li::before {font-family: 'Font Awesome 5 Free'; content: '\f059'; margin-left: -30px; margin-right: 10px;}
.checklist {list-style: none;}
.checklist li {padding-left: 25px;}
.checklist li::before {font-family: 'Font Awesome 5 Free'; content: '\f058'; margin-left: -27px; margin-right: 8px;}

/* Enquiry Form */
.enquiry-form {background-image: url(../images/dqube-enquiry-background.png); background-position: bottom center; background-size: contain; background-repeat: no-repeat; }
.enquiry-form h5 {letter-spacing: 0.2rem; margin-bottom: 10px;}
.form-comment {display: none;}
.dynamic-content {}
.expanding-text-box {height: 300px;}

/* Sliders */
.feature-slider {margin-top: 20px; margin-bottom: 10px;}

/* Homepage */
.partnership-logos img {display: inline-block;}
.partnership-logos h3 {display: inline-block; height: 52px; vertical-align: bottom; margin: 0px 10px;}
.other-partnerships img {margin-left: 10px; margin-right: 10px; margin-bottom: 20px;}
.partnership-1 {background-image: url(../images/articles/dqube-partnerships-friends-for-good.jpg); }
.partnership-card-1:hover > a .partnership-1 {background-image: url(../images/articles/dqube-partnerships-friends-for-good.jpg);}
.partnership-2 {background-image: url(../images/articles/dqube-partnerships-uni-melb.jpg);}
.partnership-card-2:hover > a .partnership-2 {background-image: url(../images/articles/dqube-partnerships-uni-melb.jpg);}
.partnership-3 {background-image: url(../images/articles/dqube-partnerships-stamford-capital.jpg); background-position: left;}
.partnership-card-3:hover > a .partnership-3 {background-image: url(../images/articles/dqube-partnerships-stamford-capital.jpg);}
.client-profile {padding: 15px;}
.client-profile img {width: 600px; max-width: 100%;}
.core-services-pill .row div {width: 300px; padding: 30px 10px; float: inherit; margin: 0 auto -120px; background: #ffffff; -moz-border-radius: 60px; -webkit-border-radius: 60px; border-radius: 60px;}
.projects-image {width: 400px; height: relative; max-width: 100%; margin: auto;}

/* Who We Are */
.list-line {border-top: 1px solid #7ecbe9; z-index: 1; margin-bottom: 30px; text-align: center;}
.list-number {width: 100%; margin: auto; z-index: 2;}
.list-number h3 {margin: 0 auto 0.5rem; width: 40px; background-color: #ffffff;}

/* Contact From 2.0 */
#contactform label {position: relative; cursor: pointer; border-bottom: none; margin: 5px;}
#contactform .button {padding: 12px 45px;}
.radio input {outline: none !important; display: none !important;}
#second-form-screen-option-1, #second-form-screen-option-2, #third-form-screen {display: none;}
#contactform #website {position: absolute; top: -100px; overflow: hidden; border-bottom: none !important; width: 1px !important;}

/* Map 2.0 *
@media (min-width: 767px) {.floating-location-box {position: absolute; top:0; right:200px; margin:50px;}}

/* Calendly *
.enquiry-addon {padding: 1.2rem; border: 4px solid #7ecbe9; box-sizing: border-box;}
.enquiry-addon h3 {padding: 1rem;}
.enquiry-addon a {margin-top: 4px;}