/*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
*/


/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/

/* Sticky Header

–––––––––––––––––––––––––––––––––––––––––––––––––– */

.sticky{
    position:fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
	background-color: #111111;  
}


/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
	position: relative;
	width: 100%;
	max-width: 1800px;
	box-sizing: border-box;
	text-align: left;
	height: auto;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
}
.container2 {
	position: relative;
	width: 100%;
	max-width: 1400px;
	box-sizing: border-box;
	text-align: left;
	height: auto;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
}
.container2b {
	position: relative;
	width: 100%;
	max-width: 3600px;
	box-sizing: border-box;
	text-align: left;
	height: auto;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
}
.container3 {
  position: relative;
  width: 100%;
  margin-bottom: 30px;
}
.container4 {
	position: relative;
	width: 100%;
	max-width: 1200px;
	box-sizing: border-box;
	text-align: left;
	height: auto;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
}
.container5 {
  position: relative;
  width: 100%;
  margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
}
.container6 {
	position: relative;
	width: 100%;
	max-width: 6400px;
	box-sizing: border-box;
	text-align: left;
	height: auto;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.column,
.columns {
	width: 100%;
	float: left;
	box-sizing: border-box;
	margin: 0px;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
}

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

/* For devices larger than 550px */
@media (min-width: 550px) {
  .container {
    width: 95%; }
  .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: 20px;
  line-height: 33px;
  font-weight: 400;
  font-family: "Barlow Semi Condensed", sans-serif;
  color: #666666; }


/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 2rem;
  font-weight: 400; }
h1 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 36px;
	line-height: 1.2;
	font-weight: 700;
	color: #008066;
	text-transform: uppercase;
}
h2 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 24px;
	line-height: 1.4;
	font-weight: 700;
	text-transform: uppercase;
}
h3 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 16px;
	line-height: 1.2;
	font-weight: 400;
}
h4 {
	font-size: 1.4rem;
	line-height: 1;
	color: #5B7A12;
	font-weight: 700;
}
h5 {
	font-size: 0.8rem;
	line-height: 1.4;
	color: #FFFFFF;
}
h6 { font-size: 1.5rem; line-height: 1.6;  letter-spacing: 0; }

/* Larger than phablet */
@media (min-width: 550px) {
  h1 { font-size: 5.0rem; }
  h2 { font-size: 4.2rem; }
  h3 { font-size: 3.6rem; }
  h4 { font-size: 3.0rem; }
  h5 { font-size: 2.4rem; }
  h6 { font-size: 1.5rem; }
}

p {
  margin-top: 0; }



/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
	text-decoration: none;
	color: #EA5F28;
	font-weight: 600;
}
a:hover {
	text-decoration: underline;

}

.linktext1 {
  font-weight: 600;
  color: #EA5F28;
  text-decoration: underline;
  }


/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  font-family: "Big Shoulders Display", sans-serif;
  display: inline-block;
  height: 46px;
  padding: 26px 19px;
  color: #555;
  text-align: center;
  font-size: 19px;
  font-weight: 900;
  line-height: 0px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border-radius: 3px;
  border: 3px solid #bbb;
  cursor: pointer;
  box-sizing: border-box; }
.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: #333;
  border-color: #888;
  outline: 0; }
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
  color: #ffffff;
  background-color: #EA5F28;
  border-color: #EA5F28; }
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
  color: #ffffff;
  background-color: #000000;
  border-color: #000000; }


.button.button-secondary,
button.button-secondary,
input[type="submit"].button-secondary,
input[type="reset"].button-secondary,
input[type="button"].button-secondary {
  color: #ffffff;
  background-color: ;
  border-color: #ffffff; }
.button.button-secondary:hover,
button.button-secondary:hover,
input[type="submit"].button-secondary:hover,
input[type="reset"].button-secondary:hover,
input[type="button"].button-secondary:hover,
.button.button-secondary:focus,
button.button-secondary:focus,
input[type="submit"].button-secondary:focus,
input[type="reset"].button-secondary:focus,
input[type="button"].button-secondary:focus {
  color: #ffffff;
  background-color: #EA5F28;
  border-color: #EA5F28; }


/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
font-family: "Big Shoulders Display", sans-serif;
  height: 38px;
  padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
  background-color: #fff;
  color: #002B55;
  border: 1px solid #D1D1D1;
  border-radius: 4px;
  box-shadow: none;
  box-sizing: border-box; }
/* 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"],
textarea {
  -webkit-appearance: none;
  color: #171695;
     -moz-appearance: none;
          appearance: none; }
textarea {
  min-height: 65px;
  padding-top: 6px;
  color: #171695;
  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,
select:focus {
  border: 1px solid #33C3F0;
  color: #7f7f7f;
  outline: 0; }
label,
legend {
font-family: "Big Shoulders Display", sans-serif;
font-size: 24px;
  display: block;
  color: #666;
  margin-bottom: .5rem;
  font-weight: 600; }
fieldset {
  padding: 0;
  color: #222;
  border-width: 0; }
input[type="checkbox"],
input[type="radio"] { }
label > .label-body {
  display: inline-block;
  margin-left: .5rem;
  color: #222;
  font-weight: normal; }


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


/* 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 {
  padding: 5px 5px 5px 5px;
  text-align: left;
  font-size: 15px;
  border: 0px solid #caddea;
  background-color: #0676AC;
  color: #ffffff; }
td {
  padding: 5px 5px 5px 5px;
  text-align: left;
  font-size: 15px;
  border: 0px solid #caddea; }
th:first-child,
td:first-child {
  padding-left: 5px; }
th:last-child,
td:last-child {
  padding-right: 5px; }


/* 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: 1.0rem; }


/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
	width: 100%;
	box-sizing: border-box;
	color: #666666;
	font-weight: 300;
	font-size: 24px;
	line-height: 34px;
	text-decoration: none;
}
.u-full-width-footer {
	font-family: "Big Shoulders Display", sans-serif;
	color: #EA5F28;
	font-weight: 400;
	font-size: 22px;
	line-height: 32px;
}
.u-full-width-footer2 {
	font-family: "Big Shoulders Display", sans-serif;
	color: #EA5F28;
	font-weight: 600;
	font-size: 22px;
	line-height: 32px;
	text-transform: uppercase;
	letter-spacing: 0px;
}
.u-full-width-footer-sm {
	font-family: "Big Shoulders Display", sans-serif;
	color: #999999;
	font-weight: 300;
	font-size: 12px;
	line-height: 20px;
}
.u-full-width-footer-headline {
	font-family: "Big Shoulders Display", sans-serif;
	color: #FFFFFF;
	font-weight: 600;
	font-size: 22px;
	line-height: 32px;
	text-transform: none;
}
.u-full-width-footer3 {
	font-family: "Big Shoulders Display", sans-serif;
	color: #EA5F28;
	font-weight: 400;
	font-size: 36px;
	line-height: normal;
}
.u-full-width-footer4 {
	font-family: "Big Shoulders Display", sans-serif;
	color: #999999;
	font-weight: 300;
	font-size: 16px;
	line-height: 26px;
}
.u-full-widthForm {
	width: 100%;
	box-sizing: border-box;
	color: #999;
	font-weight: 300;
	font-size: 16px;
	line-height: 30px;
	text-decoration: none;
	background-color: #FFFFFF;
}
.u-max-full-width {
  max-width: 100%;
  box-sizing: border-box; }
.u-pull-right {
  float: right; }
.u-pull-left {
  float: left; }


/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
  margin-top: 3rem;
  margin-bottom: 3.5rem;
  border-width: 0;
  border-top: 1px solid #E1E1E1; }


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

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


/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/


/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}

#header {
	height: auto;
	width: 100%;
	position: absolute;
	background: rgba(0, 0, 0, 0.25);
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 20px;
	padding-left: 0px;
	margin: 0px;
    top: 0;
    z-index: 9999; 
}
@media only screen and (max-width: 600px) {
  #header {
    padding-top: 10px;
	padding-bottom: 10px;
  }
}
#header2 {
	height: auto;
	width: 100%;
	position: absolute;
	background-color: #000000;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	margin: 0px;
    top: 0;
    z-index: 9999; 
}
#Hero1 {
	height: auto;
	width: 100%;
	text-align: left;
	margin: 0px;
	padding-top: 260px;
	padding-right: 0px;
	padding-bottom: 160px;
	padding-left: 0px;
	background-color: #000000;
	background-size: cover;
	background-attachment: scroll;
	background-image: url(../images/hero1.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#Hero2 {
	height: auto;
	width: 100%;
	text-align: left;
	margin: 0px;
	padding-top: 260px;
	padding-right: 0px;
	padding-bottom: 260px;
	padding-left: 0px;
	background-color: #000000;
	background-size: cover;
	background-attachment: scroll;
	background-image: url(../images/hero2.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#Hero3 {
	height: auto;
	width: 100%;
	text-align: left;
	margin: 0px;
	padding-top: 260px;
	padding-right: 0px;
	padding-bottom: 260px;
	padding-left: 0px;
	background-color: #000000;
	background-size: cover;
	background-attachment: scroll;
	background-image: url(../images/hero3.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#Hero4 {
	height: auto;
	width: 100%;
	text-align: left;
	margin: 0px;
	padding-top: 260px;
	padding-right: 0px;
	padding-bottom: 260px;
	padding-left: 0px;
	background-color: #000000;
	background-size: cover;
	background-attachment: scroll;
	background-image: url(../images/hero4.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#Hero5 {
	height: auto;
	width: 100%;
	text-align: left;
	margin: 0px;
	padding-top: 260px;
	padding-right: 0px;
	padding-bottom: 260px;
	padding-left: 0px;
	background-color: #000000;
	background-size: cover;
	background-attachment: scroll;
	background-image: url(../images/hero5.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#Hero6 {
	height: auto;
	width: 100%;
	text-align: left;
	margin: 0px;
	padding-top: 260px;
	padding-right: 0px;
	padding-bottom: 260px;
	padding-left: 0px;
	background-color: #000000;
	background-size: cover;
	background-attachment: scroll;
	background-image: url(../images/hero6.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#menu {
	height: auto;
	width: auto;
	background-color: rgba(0, 0, 0, 0.00);
	margin: 0px;
	padding-top: 30px;
}
@media only screen and (max-width: 800px) {
  #menu {
    padding-top: 0px;
  }
}
#menu2 {
	height: auto;
	width: auto;
	background-color: rgba(0, 0, 0, 0.00);
	margin: 0px;
	padding-top: 50px;
}
@media only screen and (max-width: 800px) {
  #menu2 {
    padding-top: 0px;
  }
}
#footer {
	width: 100%;
	text-align: center;
	overflow: auto;
	margin: 0px;
	padding-top: 100px;
	padding-right: 0px;
	padding-bottom: 100px;
	padding-left: 0px;
	background-color: #000000;
}
#footer2 {
	width: 100%;
	text-align: center;
	overflow: auto;
	margin: 0px;
	padding-top: 50px;
	padding-right: 0px;
	padding-bottom: 50px;
	padding-left: 0px;
	background-color: #111111;
}
#About {
	height: auto;
	width: 100%;
	text-align: center;
	background-color: #FFFFFF;
	padding-top: 100px;
	padding-right: 0px;
	padding-bottom: 90px;
	padding-left: 0px;
	position: relative;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
#About2 {
	height: auto;
	width: 100%;
	text-align: center;
	margin: 0px;
	background: rgb(255,255,255);
background: linear-gradient(180deg, rgba(255,255,255,1) 50%, rgba(234,95,40,1) 100%);
	padding-top: 90px;
	padding-right: 0px;
	padding-bottom: 90px;
	padding-left: 0px;
}
#About3 {
	position: absolute;
	height: auto;
	width: 100%;
	text-align: center;
	margin: 0px;
	padding-top: 200px;
	padding-bottom: 100px;
	padding-right: 0px;
	padding-left: 0px;
	z-index: 9998;
	left: 0;
	top: 0;
}
@media only screen and (max-width: 600px) {
  #About3 {
    padding-top: 300px;
	padding-bottom: 50px;
  }
}
#About4 {
	height: auto;
	width: 100%;
	text-align: center;
	background-color: #FFFFFF;
	padding-top: 200px;
	padding-right: 0px;
	padding-bottom: 100px;
	padding-left: 0px;
	position: relative;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
#Products {
	height: auto;
	width: 100%;
	text-align: center;
	margin: 0px;
	padding-top: 200px;
	padding-right: 0px;
	padding-bottom: 200px;
	padding-left: 0px;
	background-color: #F3F3F3;
}
#Find {
	height: auto;
	width: auto;
	text-align: left;
	margin: 0px;
	padding-top: 100px;
	padding-right: 0px;
	padding-bottom: 90px;
	padding-left: 0px;
	background-color: #F0F0F0;
	background-image: linear-gradient(#F0F0F0, #FFFFFF);
}
#Timeline {
	height: auto;
	width: auto;
	text-align: left;
	margin: 0px;
	padding-top: 100px;
	padding-right: 0px;
	padding-bottom: 90px;
	padding-left: 0px;
	background-color: #F0F0F0;
}
#Portfolio {
	height: auto;
	width: auto;
	text-align: left;
	margin: 0px;
	padding-top: 100px;
	padding-right: 0px;
	padding-bottom: 90px;
	padding-left: 0px;
	background-color: #000000;
	background: rgb(223,12,5);
background: linear-gradient(180deg, rgba(223,12,5,1) 0%, rgba(0,0,0,1) 89%);
}
#Team {
	height: auto;
	width: 100%;
	margin: 0px;
	padding-top: 175px;
	padding-right: 0px;
	padding-bottom: 175px;
	padding-left: 0px;
	background-color: #000000;
	background-attachment: scroll;
	background-image: url(../images/expert-team.jpg);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: cover;
}
#Fifa {
	height: auto;
	width: 100%;
	margin: 0px;
	padding-top: 15px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
	background-color: #000000;
	background-attachment: scroll;
	background-image: url(../images/fifa.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
#Sustainable {
	height: auto;
	width: 100%;
	margin: 0px;
	padding-top: 175px;
	padding-right: 0px;
	padding-bottom: 175px;
	padding-left: 0px;
	background-color: #000000;
	background-attachment: fixed;
	background-image: url(../images/sustainable.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
#Sustainable2 {
	height: auto;
	width: 100%;
	margin: 0px;
	padding-top: 90px;
	padding-right: 0px;
	padding-bottom: 90px;
	padding-left: 0px;
	background-color: #000000;
	background-attachment: scroll;
	background-image: url(../images/sustainable-commitment.jpg);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: cover;
}
img {
	max-width:100%;
	margin: 0px;
	padding: 0px;
}
.telephone1 {
	font-family: "Big Shoulders Display", sans-serif;
	color: #EA5F28;
	text-decoration: none;
	font-weight: 600;
	font-size: 18px;
	line-height: 28px;
	letter-spacing: 0px;
}
.telephone2 {
	font-family: "Big Shoulders Display", sans-serif;
	color: #FFFFFF;
	text-decoration: none;
	font-weight: 600;
	font-size: 17px;
	line-height: 26px;
	letter-spacing: 0px;
}
#MainBody {
	height: auto;
	width: 100%;
	text-align: center;
	margin: 0px;
	background-color: #F0F0F0;
	background-repeat: repeat-x;
	background-position: left top;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 20px;
	padding-left: 0px;
}
.Banner1Text {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 120px;
	line-height: 120px;
	color: #ffffff;
	font-weight: 900;
	text-transform: uppercase;
}
@media only screen and (max-width: 1400px) {
  .Banner1Text {
    font-size: 100px;
	line-height: 100px;
  }
}
@media only screen and (max-width: 800px) {
  .Banner1Text {
    font-size: 80px;
	line-height: 80px;
  }
}
.Banner2Text {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 50px;
	line-height: 70px;
	color: #ffffff;
	font-weight: 700;
	text-transform: uppercase;
}
@media only screen and (max-width: 1200px) {
  .Banner2Text {
    font-size: 40px;
	line-height: 60px;
  }
}
@media only screen and (max-width: 600px) {
  .Banner2Text {
    font-size: 30px;
	line-height: 50px;
  }
}
.H1Text {
	font-family: "Big Shoulders Inline Text", sans-serif;
	font-size: 90px;
	line-height: 90px;
	color: #EA5F28;
	font-weight: 900;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 0px;
}
@media(max-width: 1400px) {
    .H1Text {
    font-size: 60px;
	line-height: 70px;
    }
}
@media(max-width: 800px) {
    .H1Text {
    font-size: 50px;
	line-height: 60px;
    }
}
.H2Text {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 46px;
	line-height: 56px;
	color: #EA5F28;
	font-weight: 400;
	text-transform: uppercase;
}
.H3Text {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 50px;
	line-height: 60px;
	color: #EA5F28;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0px;
}
.H4Text {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 70px;
	line-height: 80px;
	color: #EA5F28;
	font-weight: 400;
	text-transform: uppercase;
}
.H4bText {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 75px;
	line-height: 75px;
	color: #FFFFFF;
	font-weight: 900;
	text-transform: uppercase;
}
@media(max-width: 800px) {
    .H4bText {
    font-size: 50px;
	line-height: 50px;
	text-align: center;
    }
}
.H4cText {
	font-family: "Big Shoulders Inline Text", sans-serif;
	font-size: 90px;
	line-height: 90px;
	color: #FFFFFF;
	font-weight: 900;
	text-transform: uppercase;
}
@media(max-width: 800px) {
    .H4cText {
    font-size: 50px;
	line-height: 60px;
    }
}
.H5Text {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 30px;
	line-height: 40px;
	color: #EA5F28;
	font-weight: 400;
	text-transform: uppercase;
}
.H5bText {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 36px;
	line-height: 56px;
	color: #EA5F28;
	font-weight: 400;
	text-transform: uppercase;
}
.H6Text {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 80px;
	line-height: 80px;
	color: #ffffff;
	font-weight: 400;
	text-transform: uppercase;
}
.LinkText {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 17px;
	line-height: normal;
	color: #1BA29C;
	font-weight: 600;
	text-transform: none;
	text-decoration: none;
}
.LinkText2 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 22px;
	line-height: 32px;
	color: #EA5F28;
	font-weight: 600;
	text-transform: none;
	text-decoration: none;
}
#iefix {
	position:relative;
	z-index:1000;
	width: 100%;
	text-align: center;
	background-color: #14A5DC;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
 }

/* Multi Menu
--------------------------------------------- */


.toggle, [id^=drop] {
 display: none;
 color: #ffffff;
}


nav {
	padding: 0;
	background-color: rgba(0, 0, 0, 0.00);
	align: left;
    text-align: center;
    display: inline-block;
}

#logo {
  display: block;
  padding: 0 18px;
  float: center;
  font-size: 22px;
  line-height: 30px;
}

nav:after {
  content: "";
  display: table;
  clear: both;
}

@media(min-width: 961px) {
nav ul {
  padding: 0;
  margin: 0;
  list-style: none;
  position: relative;
  text-align: left;
}

nav ul li {
	margin: 0px;
	display: inline-block;
	float: left;
	background-color: rgba(0, 0, 0, 0.00);
	z-index:1000;
}

nav a {
	font-family: "Big Shoulders Display", sans-serif;
	display: block;
	padding: 0 18px;
	color: #ffffff;
	font-size: 22px;
	line-height: 30px;
	text-decoration: none;
	font-weight: 800;
	letter-spacing: 0px;
	text-transform: uppercase;
}

}

@media(max-width: 1200px) {
    nav a {
     font-size: 22px;
	padding: 0 10px;
    }
}

nav ul li ul li:hover { background: rgba(0, 0, 0, 0.00); }

nav a:hover { background-color: rgba(0, 0, 0, 0.00); }

@media(min-width: 961px) {
  nav ul ul {
    display: none;
    position: absolute;
    top: 30px;
  }
}

nav ul li:hover > ul { display: inherit; }

nav ul ul li {
  width: 260px;
  float: none;
  display: list-item;
  position: relative;
}

nav ul ul ul li {
  position: relative;
  top: -60px;
  left: 170px;
}

li > a:after { 
    font-family: "Font Awesome 5 Free";
    font-size: 9px;
    font-weight: 600 !important;
    content: '  \f078'; 
}

li > a:only-child:after { content: ''; }


/* Media Queries
--------------------------------------------- */

@media all and (max-width : 960px) {

#logo {
  display: block;
  padding: 0;
  width: 100%;
  text-align: center;
  float: none;
}

nav { margin: 0;}

.toggle + a,
 .menu { display: none; }

.toggle {
font-family: "Big Shoulders Display", sans-serif;
  display: block;
  background-color: rgba(0, 0, 0, 0.00);
  padding: 0 18px;
  color: #ffffff;
  font-size: 22px;
  font-weight: 800;
  line-height: 30px;
  text-decoration: none;
  border: none;
  letter-spacing: 0px;
  text-transform: none;
  text-shadow: 2px 3px 5px rgba(0,0,0,0.95);
}

.toggle:hover { background-color: rgba(0, 0, 0, 0.00); }

[id^=drop]:checked + ul { display: block; }

nav ul li {
  display: block;
  width: 100%;
}

nav ul ul .toggle,
 nav ul ul a { padding: 0 18px; }

nav ul ul ul a { padding: 0 36px; }

nav a:hover,
 nav ul ul ul a { background-color: rgba(0, 0, 0, 0.00); }

nav ul li ul li .toggle,
 nav ul ul a { background-color: rgba(0, 0, 0, 0.00); color: #ffffff; font-weight: 400; }

nav ul ul {
  float: none;
  position: static;
  color: #ffffff;
}

nav ul ul li:hover > ul,
nav ul li:hover > ul { display: none; }

nav ul ul li {
  display: block;
  width: 100%;
}

nav ul ul ul li { position: static;

}
}

@media all and (max-width : 330px) {

nav ul li {
  display: block;
  width: 94%;
}

}

#PageSlider {
	height: auto;
	width: 100%;
	text-align: center;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
	background-color: #FFFFFF;
}
@media(max-width: 800px) {
    #PageSlider {
        padding-top: 0px;
    }
}
.video-container {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
	margin-bottom: 20px;
}

.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
/* Back-to-top-button
--------------------------------------------- */
#myBtn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 20px; /* Place the button at the bottom of the page */
    right: 20px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    background-color: #EA5F28; /* Set a background color */
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 10px; /* Some padding */
    border-radius: 1px; /* Rounded corners */
	font-size: 16px;
}

#myBtn:hover {
    background-color: #999; /* Add a dark-grey background on hover */
}
#SpaceBox1 {
	height: auto;
	width: auto;
	text-align: left;
	margin: 0px;
	padding-top: 300px;
	padding-right: 0px;
	padding-bottom: 25px;
	padding-left: 0px;
}
.WhiteParaText1 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 24px;
	line-height: 34px;
	color: #FFFFFF;
	font-weight: 400;
	text-transform: none;
}
.WhiteParaText2 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 24px;
	line-height: 34px;
	color: #FFFFFF;
	font-weight: 400;
	text-transform: none;
	text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.99);
}
.WhiteParaText3 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 36px;
	line-height: 46px;
	color: #FFFFFF;
	font-weight: 600;
	text-transform: none;
}
@media(max-width: 800px) {
    .WhiteParaText3 {
    font-size: 26px;
	line-height: 36px;
    }
}
.WhiteParaText4 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 46px;
	line-height: 56px;
	color: #FFFFFF;
	font-weight: 900;
	text-transform: none;
}
@media(max-width: 800px) {
    .WhiteParaText4 {
    font-size: 32px;
	line-height: 42px;
    }
}
.LgParaText1 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 36px;
	line-height: 46px;
	color: #EA5F28;
	font-weight: 600;
	text-transform: none;
}
.LgParaText1b {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 24px;
	line-height: 34px;
	color: #ffffff;
	font-weight: 400;
	text-transform: none;
}
.LgParaText2 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 46px;
	line-height: 56px;
	color: #EA5F28;
	font-weight: 900;
	text-transform: uppercase;
}
.LgParaText3 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 22px;
	line-height: 44px;
	color: #EA5F28;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 3px;
}
.LgParaText4 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 25px;
	line-height: 35px;
	color: #444444;
	font-weight: 500;
	text-transform: none;
}
.LgParaText5 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 18px;
	line-height: 26px;
	color: #ffffff;
	font-weight: 400;
	text-transform: none;
}
.LgParaText6 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 29px;
	line-height: 39px;
	color: #666666;
	font-weight: 400;
	text-transform: none;
}
.LgParaText7 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 25px;
	line-height: 35px;
	color: #666666;
	font-weight: 400;
	text-transform: none;
}

/* Parallax Effect
--------------------------------------------- */

#Banner2 {
	height: 70vh;
	position: relative;
	/*width: auto;*/
	/*text-align: left;*/
	/*background-color: #000000;*/
	/*padding-top: 400px;*/
	/*padding-right: 0px;*/
	/*padding-bottom: 0px;*/
	/*padding-left: 0px;*/
	/*background-attachment: local;*/
	/*background-image: url(../images/banner2.jpg);*/
	/*background-repeat: no-repeat;*/
	/*background-position: center center;*/
	/*background-size: cover;*/
}

.parallax-bg {
	position: fixed;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
z-index: -1;
overflow: scroll;
width: 100vw;
height: 100vh;
background-image: url("../images/parallax1.jpg");
background-position: 50% 0px;
background-size: cover;
background-repeat: no-repeat;
}

@media(min-width: 1025px) {
    .parallax-bg {
        background-attachment: fixed;
    }
}
#Boxes {
	height: auto;
	width: auto;
	text-align: center;
	background-color: #ffffff;
	padding: 0px;
	margin-top: 30px;
	margin-right: 0px;
	margin-bottom: 30px;
	margin-left: 0px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
}
#Box1 {
	height: auto;
	width: auto;
	text-align: center;
	margin: 0px;
	background-color: #ffffff;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}

/* Pan Slider ken Burns
--------------------------------------------- */

* {
  margin: 0;
  padding: 0;
}

.pic-wrapper {
  position: relative;
  width: 100%;
  height: 80vh;
  overflow: hidden;
}

figure {
  position: absolute;
  top: 0;
  left: 0;
  width: 110%;
  height: 110%;
  opacity: 0;
  /*animation*/
  
  animation: slideShow 24s linear infinite 0s;
  -o-animation: slideShow 24s linear infinite 0s;
  -moz-animation: slideShow 24s linear infinite 0s;
  -webkit-animation: slideShow 24s linear infinite 0s;
}

figurecaption {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #fff;
}

.pic-1 {
  opacity: 1;
  background: url(../images/slide1.jpg) no-repeat center bottom;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.pic-2 {
  animation-delay: 6s;
  -o-animation-delay: 6s;
  -moz--animation-delay: 6s;
  -webkit-animation-delay: 6s;
  background: url(../images/slide2.jpg) no-repeat center bottom;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.pic-3 {
  animation-delay: 12s;
  -o-animation-delay: 12s;
  -moz--animation-delay: 12s;
  -webkit-animation-delay: 12s;
  background: url(../images/slide3.jpg) no-repeat center bottom;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.pic-4 {
  animation-delay: 18s;
  -o-animation-delay: 18s;
  -moz--animation-delay: 18s;
  -webkit-animation-delay: 18s;
  background: url(../images/slide4.jpg) no-repeat center bottom;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
/* keyframes*/

@keyframes 
slideShow {  0% {
 opacity: 0;
 transform:scale(1);
 -ms-transform:scale(1);
}
 5% {
 opacity: 1
}
 25% {
 opacity: 1;
}
 30% {
 opacity: 0;
 transform:scale(1.1);
 -ms-transform:scale(1.1);
}
 100% {
 opacity: 0;
 transform:scale(1);
 -ms-transformm:scale(1);
}
}
 @-o-keyframes 
slideShow {  0% {
 opacity: 0;
 -o-transform:scale(1);
}
 5% {
 opacity: 1
}
 25% {
 opacity: 1;
}
 30% {
 opacity: 0;
 -o-transform:scale(1.1);
}
 100% {
 opacity: 0;
 -o-transformm:scale(1);
}
}
 @-moz-keyframes 
slideShow {  0% {
 opacity: 0;
 -moz-transform:scale(1);
}
 5% {
 opacity: 1
}
 25% {
 opacity: 1;
}
 30% {
 opacity: 0;
 -moz-transform:scale(1.1);
}
 100% {
 opacity: 0;
 -moz-transformm:scale(1);
}
}
 @-webkit-keyframes 
slideShow {  0% {
 opacity: 0;
 -webkit-transform:scale(1);
}
 5% {
 opacity: 1
}
 25% {
 opacity: 1;
}
 30% {
 opacity: 0;
 -webkit-transform:scale(1.1);
}
 100% {
 opacity: 0;
 -webkit-transformm:scale(1);
}
}

/* Text animation*/
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.anicontainer {
  display: flex;
  justify-content: left;
  align-items: left;
}
.anicontainer p {
  font-family: "Big Shoulders Display", sans-serif;
  font-size: 50px;
	line-height: 60px;
	color: #000000;
	font-weight: 500;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 10px;
  padding: 0.5rem;
  text-align: left;
  overflow: hidden;
}

.anicontainer p span.typed-text {
  font-weight: normal;
  color: #000000;
  font-weight: 500;
}
.anicontainer p span.cursor {
  /*display: inline-block;*/
  display: none;
  background-color: #ccc;
  margin-left: 0.1rem;
  width: 3px;
  animation: blink 1s infinite;
}
.caniontainer p span.cursor.typing {
  animation: none;
}
@keyframes blink {
  0%  { background-color: #ccc; }
  49% { background-color: #ccc; }
  50% { background-color: transparent; }
  99% { background-color: transparent; }
  100%  { background-color: #ccc; }
}
/* Menu Dropdowns*/
.menu li ul {
   font-family: "Big Shoulders Display", sans-serif;
   background-color: #E92D37;
   font-size: 18px;
   padding: 15px 10px;
}

.menu li ul li a {
   font-size: 18px;
}
/* Product Page Sub Menus*/
.SubMenuText1 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 19px;
	line-height: 39px;
	color: #000000;
	font-weight: 500;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 1px;
}
.SubMenuText2 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 16px;
	line-height: 30px;
	color: #000000;
	font-weight: 400;
	text-transform: none;
	text-decoration: none;
	letter-spacing: 0px;
}
.SubMenuText3 {
	font-family: "Big Shoulders Display", sans-serif;
	font-size: 20px;
	line-height: 40px;
	color: #000000;
	font-weight: 500;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 1px;
}
/* Mobile Menu
--------------------------------------------- */

.hc-offcanvas-nav {
	z-index: 99999 !important;
}

@media(max-width: 960px) {
	.menu {
		display: none;
	}
}

@media(min-width: 961px) {
	#mob-menu-container {
		display: none;
	}
}

.hc-offcanvas-nav .nav-container, .hc-offcanvas-nav .nav-wrapper, .hc-offcanvas-nav ul,
.hc-offcanvas-nav a.nav-next,
.hc-offcanvas-nav .nav-back a {
	/* Mobile menu background colour */
	background-color: #000000;	
	background: #000000;
}

.hc-offcanvas-nav .nav-back a {
	border-top: none;
}

.hc-offcanvas-nav .nav-content>h2, .hc-offcanvas-nav .nav-content>h3, .hc-offcanvas-nav .nav-content>h4, .hc-offcanvas-nav .nav-content>h5, .hc-offcanvas-nav .nav-content>h6 {
	/* Top Level Title Text Colour */
	color: #ddd
}

.hc-offcanvas-nav .nav-wrapper>.nav-content>ul:first-of-type>li:first-child:not(.nav-back):not(.nav-close)>.nav-item-wrapper>.nav-item-link {	
	/* separation border between title and menu items */
	border-top: 1px solid rgba(255, 255, 255, 0.3);
}

.hc-offcanvas-nav .nav-item-link, .hc-offcanvas-nav li.nav-close a, .hc-offcanvas-nav .nav-back a,
.hc-offcanvas-nav a.nav-next {
	/* menu items separation border */
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
	border-left: none;
}

.hc-offcanvas-nav .nav-item-link {
	/* Menu Items Font Size */
	font-size: 19px;
	font-weight: 600;
	font-family: "Big Shoulders Display", sans-serif;
}

.hc-nav-trigger {
	/* Hamburger menu icon */
	right: 5%;
	font-size: 21px;
}

@media(min-width: 550px) and (max-width: 960px) {
	.full-mob {
		width: 52% !important;
	}

	.full-mob #menu {
		margin-top: 4px;
	}

	.menu-col {
		width: 30% !important;
		margin: auto;
	}

	.hc-nav-trigger {
		left: 50%;
		transform: translateX(-50%);
	}
}

/* Overlay
--------------------------------------------- */
.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: rgba(0, 0, 0, 0.5);
}

.container3:hover .overlay {
  opacity: 1;
}

.text {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 90%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
/* Video Background
--------------------------------------------- */
video {
  object-fit: cover;
  width: 100vw;
  height: 65vh;
  position: relative;
  top: 0;
  left: 0;
  margin-bottom: -10px;
}
/* Timeline
--------------------------------------------- */
* {
  box-sizing: border-box;
}

/* The actual timeline (the vertical ruler) */
.timeline {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
}

/* The actual timeline (the vertical ruler) */
.timeline::after {
  content: '';
  position: absolute;
  width: 6px;
  background-color: white;
  top: 0;
  bottom: 0;
  left: 50%;
  margin-left: -3px;
}

/* Container around content */
.timelinecontainer {
  padding: 10px 40px;
  position: relative;
  background-color: inherit;
  width: 50%;
}

/* The circles on the timeline */
.timelinecontainer::after {
  content: '';
  position: absolute;
  width: 25px;
  height: 25px;
  right: -17px;
  background-color: white;
  border: 6px solid #EA5F28;
  top: 15px;
  border-radius: 50%;
  z-index: 1;
}

/* Place the container to the left */
.left {
  left: 0;
}

/* Place the container to the right */
.right {
  left: 50%;
}

/* Add arrows to the left container (pointing right) */
.left::before {
  content: " ";
  height: 0;
  position: absolute;
  top: 22px;
  width: 0;
  z-index: 1;
  right: 30px;
  border: medium solid white;
  border-width: 10px 0 10px 10px;
  border-color: transparent transparent transparent white;
}

/* Add arrows to the right container (pointing left) */
.right::before {
  content: " ";
  height: 0;
  position: absolute;
  top: 22px;
  width: 0;
  z-index: 1;
  left: 30px;
  border: medium solid white;
  border-width: 10px 10px 10px 0;
  border-color: transparent white transparent transparent;
}

/* Fix the circle for containers on the right side */
.right::after {
  left: -16px;
}

/* The actual content */
.content {
  padding: 20px 30px;
  background-color: white;
  position: relative;
  border-radius: 6px;
}

/* Media queries - Responsive timeline on screens less than 600px wide */
@media screen and (max-width: 600px) {
  /* Place the timelime to the left */
  .timeline::after {
  left: 31px;
  }
  
  /* Full-width containers */
  .timelinecontainer {
  width: 100%;
  padding-left: 70px;
  padding-right: 25px;
  }
  
  /* Make sure that all arrows are pointing leftwards */
  .timelinecontainer::before {
  left: 60px;
  border: medium solid white;
  border-width: 10px 10px 10px 0;
  border-color: transparent white transparent transparent;
  }

  /* Make sure all circles are at the same spot */
  .left::after, .right::after {
  left: 15px;
  }
  
  /* Make all right containers behave like the left ones */
  .right {
  left: 0%;
  }
}