@font-face {
  font-family: 'Open Sans';
  src: url("/assets/fonts/OpenSans/Light/OpenSans-Light.eot?v=1.1.0");
  src: url("/assets/fonts/OpenSans/Light/OpenSans-Light.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/assets/fonts/OpenSans/Light/OpenSans-Light.woff2?v=1.1.0") format("woff2"), url("/assets/fonts/OpenSans/Light/OpenSans-Light.woff?v=1.1.0") format("woff"), url("/assets/fonts/OpenSans/Light/OpenSans-Light.ttf?v=1.1.0") format("truetype"), url("/assets/fonts/OpenSans/Light/OpenSans-Light.svg?v=1.1.0#Light") format("svg");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url("/assets/fonts/OpenSans/LightItalic/OpenSans-LightItalic.eot?v=1.1.0");
  src: url("/assets/fonts/OpenSans/LightItalic/OpenSans-LightItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/assets/fonts/OpenSans/LightItalic/OpenSans-LightItalic.woff2?v=1.1.0") format("woff2"), url("/assets/fonts/OpenSans/LightItalic/OpenSans-LightItalic.woff?v=1.1.0") format("woff"), url("/assets/fonts/OpenSans/LightItalic/OpenSans-LightItalic.ttf?v=1.1.0") format("truetype"), url("/assets/fonts/OpenSans/LightItalic/OpenSans-LightItalic.svg?v=1.1.0#LightItalic") format("svg");
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: 'Open Sans';
  src: url("/assets/fonts/OpenSans/Regular/OpenSans-Regular.eot?v=1.1.0");
  src: url("/assets/fonts/OpenSans/Regular/OpenSans-Regular.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/assets/fonts/OpenSans/Regular/OpenSans-Regular.woff2?v=1.1.0") format("woff2"), url("/assets/fonts/OpenSans/Regular/OpenSans-Regular.woff?v=1.1.0") format("woff"), url("/assets/fonts/OpenSans/Regular/OpenSans-Regular.ttf?v=1.1.0") format("truetype"), url("/assets/fonts/OpenSans/Regular/OpenSans-Regular.svg?v=1.1.0#Regular") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url("/assets/fonts/OpenSans/Italic/OpenSans-Italic.eot?v=1.1.0");
  src: url("/assets/fonts/OpenSans/Italic/OpenSans-Italic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/assets/fonts/OpenSans/Italic/OpenSans-Italic.woff2?v=1.1.0") format("woff2"), url("/assets/fonts/OpenSans/Italic/OpenSans-Italic.woff?v=1.1.0") format("woff"), url("/assets/fonts/OpenSans/Italic/OpenSans-Italic.ttf?v=1.1.0") format("truetype"), url("/assets/fonts/OpenSans/Italic/OpenSans-Italic.svg?v=1.1.0#Italic") format("svg");
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Open Sans';
  src: url("/assets/fonts/OpenSans/Semibold/OpenSans-Semibold.eot?v=1.1.0");
  src: url("/assets/fonts/OpenSans/Semibold/OpenSans-Semibold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/assets/fonts/OpenSans/Semibold/OpenSans-Semibold.woff2?v=1.1.0") format("woff2"), url("/assets/fonts/OpenSans/Semibold/OpenSans-Semibold.woff?v=1.1.0") format("woff"), url("/assets/fonts/OpenSans/Semibold/OpenSans-Semibold.ttf?v=1.1.0") format("truetype"), url("/assets/fonts/OpenSans/Semibold/OpenSans-Semibold.svg?v=1.1.0#Semibold") format("svg");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url("/assets/fonts/OpenSans/SemiboldItalic/OpenSans-SemiboldItalic.eot?v=1.1.0");
  src: url("/assets/fonts/OpenSans/SemiboldItalic/OpenSans-SemiboldItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/assets/fonts/OpenSans/SemiboldItalic/OpenSans-SemiboldItalic.woff2?v=1.1.0") format("woff2"), url("/assets/fonts/OpenSans/SemiboldItalic/OpenSans-SemiboldItalic.woff?v=1.1.0") format("woff"), url("/assets/fonts/OpenSans/SemiboldItalic/OpenSans-SemiboldItalic.ttf?v=1.1.0") format("truetype"), url("/assets/fonts/OpenSans/SemiboldItalic/OpenSans-SemiboldItalic.svg?v=1.1.0#SemiboldItalic") format("svg");
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: 'Open Sans';
  src: url("/assets/fonts/OpenSans/Bold/OpenSans-Bold.eot?v=1.1.0");
  src: url("/assets/fonts/OpenSans/Bold/OpenSans-Bold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/assets/fonts/OpenSans/Bold/OpenSans-Bold.woff2?v=1.1.0") format("woff2"), url("/assets/fonts/OpenSans/Bold/OpenSans-Bold.woff?v=1.1.0") format("woff"), url("/assets/fonts/OpenSans/Bold/OpenSans-Bold.ttf?v=1.1.0") format("truetype"), url("/assets/fonts/OpenSans/Bold/OpenSans-Bold.svg?v=1.1.0#Bold") format("svg");
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url("/assets/fonts/OpenSans/BoldItalic/OpenSans-BoldItalic.eot?v=1.1.0");
  src: url("/assets/fonts/OpenSans/BoldItalic/OpenSans-BoldItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/assets/fonts/OpenSans/BoldItalic/OpenSans-BoldItalic.woff2?v=1.1.0") format("woff2"), url("/assets/fonts/OpenSans/BoldItalic/OpenSans-BoldItalic.woff?v=1.1.0") format("woff"), url("/assets/fonts/OpenSans/BoldItalic/OpenSans-BoldItalic.ttf?v=1.1.0") format("truetype"), url("/assets/fonts/OpenSans/BoldItalic/OpenSans-BoldItalic.svg?v=1.1.0#BoldItalic") format("svg");
  font-weight: bold;
  font-style: italic;
}

@font-face {
  font-family: 'Open Sans';
  src: url("/assets/fonts/OpenSans/ExtraBold/OpenSans-ExtraBold.eot?v=1.1.0");
  src: url("/assets/fonts/OpenSans/ExtraBold/OpenSans-ExtraBold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/assets/fonts/OpenSans/ExtraBold/OpenSans-ExtraBold.woff2?v=1.1.0") format("woff2"), url("/assets/fonts/OpenSans/ExtraBold/OpenSans-ExtraBold.woff?v=1.1.0") format("woff"), url("/assets/fonts/OpenSans/ExtraBold/OpenSans-ExtraBold.ttf?v=1.1.0") format("truetype"), url("/assets/fonts/OpenSans/ExtraBold/OpenSans-ExtraBold.svg?v=1.1.0#ExtraBold") format("svg");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url("/assets/fonts/OpenSans/ExtraBoldItalic/OpenSans-ExtraBoldItalic.eot?v=1.1.0");
  src: url("/assets/fonts/OpenSans/ExtraBoldItalic/OpenSans-ExtraBoldItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/assets/fonts/OpenSans/ExtraBoldItalic/OpenSans-ExtraBoldItalic.woff2?v=1.1.0") format("woff2"), url("/assets/fonts/OpenSans/ExtraBoldItalic/OpenSans-ExtraBoldItalic.woff?v=1.1.0") format("woff"), url("/assets/fonts/OpenSans/ExtraBoldItalic/OpenSans-ExtraBoldItalic.ttf?v=1.1.0") format("truetype"), url("/assets/fonts/OpenSans/ExtraBoldItalic/OpenSans-ExtraBoldItalic.svg?v=1.1.0#ExtraBoldItalic") format("svg");
  font-weight: 800;
  font-style: italic;
}

/* GangOfThree */

@font-face {
  font-family: 'GangOfThree';
  src: url('/assets/fonts/GangOfThree/gang_of_three-webfont.eot');
  src: url('/assets/fonts/GangOfThree/gang_of_three-webfont.eot?#iefix') format('embedded-opentype'), url('/assets/fonts/GangOfThree/gang_of_three-webfont.woff') format('woff'), url('/assets/fonts/GangOfThree/gang_of_three-webfont.ttf') format('truetype'), url('/assets/fonts/GangOfThree/gang_of_three-webfont.svg#GangOfThree') format('svg');
  font-weight: normal;
  font-style: normal;
}


* {
  line-height: 1em;
  padding: 0;
  margin: 0;
  font-weight: normal;
  font-family: 'Open Sans';
}

body, html {
  height: 100%;
  min-height: 720px;
  min-width: 1200px;
  max-width: 2560px;
  color: white;
  font-family: 'Open Sans', sans-serif;
}

header {
  height: 70px;
  width: 100%;
  background-color: #cd0021;
  text-align: center;
  position: relative;
  z-index: 9;
}

.logo {
  position: absolute;
  z-index: 100;
  width: 413px;
  height: 157px;
  background-image: url("/assets/desktop/tc/logo.png");
  background-size: cover;
  left: 50%;
  margin-left: -207px;
}

.bg {
  margin: 0 auto;
  /* The image used */
  background-image: url("/assets/desktop/tc/bg.jpg");
  /* Full height */
  height: 100%;
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.content {
  margin-top: 70px;
  margin-left: 20px;
}

h1 {
  font-size: 90px;
  color: #cd0021;
  font-weight: 800;
  margin-top: 20px;
  margin-bottom: 30px;
}

h2 {
  font-size: 32px
}

h3 {
  font-size: 35px;
  color: #cd0021;
  margin-bottom: 40px;
}

h3 span {
  color: white
}

ul.bonuses li {
  font-size: 18px;
  font-weight: 600;
  background: url(/assets/desktop/tc/bullet.png) left center no-repeat;
  padding-left: 40px;
  list-style-type: none;
  line-height: 30px;
}

a.join-now {
  margin-top: 40px;
  display: inline-block;
  text-decoration: none;
  color: #121212;
  font-family: 'GangOfThree';
  font-size: 50px;
  border-radius: 40px;
  padding: 20px 40px;
  text-shadow: 1px 1px 4px #f7dd35;
  box-shadow: 0 4px 2px 0px #000;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#efe4a4+0,e4db9c+6,d9ca83+28,bea249+66,b39131+83,af8a25+96,b78f26+98,c7992a+100 */
  background: #efe4a4; /* Old browsers */
  background: -moz-linear-gradient(top, #efe4a4 0%, #e4db9c 6%, #d9ca83 28%, #bea249 66%, #b39131 83%, #af8a25 96%, #b78f26 98%, #c7992a 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #efe4a4 0%,#e4db9c 6%,#d9ca83 28%,#bea249 66%,#b39131 83%,#af8a25 96%,#b78f26 98%,#c7992a 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #efe4a4 0%,#e4db9c 6%,#d9ca83 28%,#bea249 66%,#b39131 83%,#af8a25 96%,#b78f26 98%,#c7992a 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efe4a4', endColorstr='#c7992a',GradientType=0 ); /* IE6-9 */
}

.no a.join-now {font-family: 'Open Sans';}

.se a.join-now {font-family: 'Open Sans';}

main {
  margin: 0 auto;
  max-width: 1200px;
  height: calc(100% - 150px);
}

ul.steps {
  width: 100%;
  margin-top: 120px
}

ul.steps li {
  display: inline-block;
  background-color: rgba(255,255,255,0.3);
  font-size: 21px;
  text-shadow: 2px 1px 3px #000;
  margin-right: 30px;
  position: relative;
}

ul.steps li:last-child {
  margin: 0px;
}

ul.steps li div span {
  display: block;
  font-size: 33px;
  font-weight: 800
}

ul.steps li div {
  position: relative;
  padding: 10px 5px 10px 130px
}
ul.steps li div:first-child {
  padding: 10px 5px 10px 100px
}

ul.steps li div:before {
  width: 110px;
  height: 110px;
  content: "";
  position: absolute;
  left: 10px;
  top: -20px;
}

ul.steps li div.step-1:before {
  background: url(/assets/desktop/tc/1.png) no-repeat;
  left: -20px;
}

ul.steps li:after {
  content: "";
  top: 0px;
  width: 0;
  height: 0;
  border-top: 40px solid transparent;
  border-bottom: 35px solid transparent;
  border-left: 20px solid rgba(255,255,255,0.3);
  position: absolute;
  right: -20px;
}

ul.steps li div.step-2:before {
  background: url(/assets/desktop/tc/2.png) no-repeat;
}

ul.steps li div.step-3:before {
  background: url(/assets/desktop/tc/3.png) no-repeat;
}

ul.steps li span.separator {
  position: absolute;
  left: 0;
  top: 0;
  width: 20px;
  height: 50px
}

ul.steps li span.separator:after {
  content: "";
  top: 0px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 23px 39px 0;
  border-color: transparent rgba(255,255,255,0.3) transparent transparent;
  position: absolute;
  left: -23px;
}

ul.steps li span.separator:before {
  content: "";
  top: 39px;
  width: 0;
  height: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 35px 20px;
  border-color: transparent transparent rgba(255,255,255,0.3) transparent;
  position: absolute;
  left: -20px;
}

footer {
  position: fixed;
  max-width: 2560px;
  bottom: 0px;
  width: 100%;
  height: 79px;
  text-align: center;
  border-top: 1px solid #7c0e1f;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#201d1d+0,201d1d+21,221f1f+23,221f1f+27,201d1d+28,201d1d+94,221f1f+100 */
  background: #201d1d; /* Old browsers */
  background: -moz-linear-gradient(top, #201d1d 0%, #201d1d 21%, #221f1f 23%, #221f1f 27%, #201d1d 28%, #201d1d 94%, #221f1f 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #201d1d 0%,#201d1d 21%,#221f1f 23%,#221f1f 27%,#201d1d 28%,#201d1d 94%,#221f1f 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #201d1d 0%,#201d1d 21%,#221f1f 23%,#221f1f 27%,#201d1d 28%,#201d1d 94%,#221f1f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#201d1d', endColorstr='#221f1f',GradientType=0 ); /* IE6-9 */
}

footer img {
  margin-top: 25px;
}

@media screen and (max-height: 965px ) {
  ul.steps {
    width: 100%;
    margin-top: 60px
  }
}

@media screen and (max-height: 900px ) {
  h1 {
    margin-top: 10px;
    margin-bottom: 20px;
  }

  h3 {
    margin-bottom: 20px;
  }

  ul.steps {
    width: 100%;
    margin-top: 40px
  }
}

@media screen and (max-height: 840px ) {
  header {
    height: 60px;
  }

  footer {
    height: 59px;
  }

  footer img {
    margin-top: 10px;
  }

  .logo {
    width: 316px;
    height: 120px;
    margin-left: -158px;
  }

  h1 {
    margin: 10px 0;
    font-size: 70px
  }

  h2 {
    font-size: 20px;
  }

  h3 {
    font-size: 25px;
  }

  a {
    font-size: 30px;
    margin-top: 20px;
  }
}

@media screen and (max-height: 720px ) {
  ul.steps {
    margin-bottom: 50px;
  }
  footer {
    position: relative;
  }
  h1 {
    font-size: 40px
  }
  h2 {
    font-size: 14px
  }
  h3 {
    font-size: 18px
  }
}