/*@import url(https://fonts.googleapis.com/css?family=Saira);*/

@font-face {
  font-family: 'Saira';
  font-style: normal;
  font-weight: 400;
  src: local('Saira Regular'), 
  		local('Saira-Regular'), 
  		url(../fonts/Saira-Regular.woff2) format('woff2'),
  		url(../fonts/saira-regular.woff) format('woff');
  /*unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;*/
}

@font-face {
    font-family: 'factor_bf_oblique_krbold';
    src: url(../fonts/factorbfobliquekr-bold-webfont.woff2) format('woff2'),
         url(../fonts/factorbfobliquekr-bold-webfont.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Josefin Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Josefin Sans Regular'),
    local('JosefinSans-Regular'),
    url(../fonts/JosefinSans-Regular.woff2) format('woff2'),
    url(../fonts/JosefinSans-Regular.woff) format('woff');
    /*unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;*/
}

@font-face {
    font-family: 'Josefin Sans Bold';
    font-style: normal;
    font-weight: 400;
    src: local('Josefin Sans Bold'),
    local('JosefinSans-Bold'),
    url(../fonts/JosefinSans-Bold.woff2) format('woff2'),
    url(../fonts/JosefinSans-Bold.woff) format('woff');
    /*unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;*/
}

html {
	scroll-behavior: smooth;
}

a:link {
    color: #0097b3;
    text-decoration: none;
}

/* visited link */
a:visited {
    color: #0097b3;
}

/* mouse over link */
a:hover {
    color: #0097b3;
    opacity: .8;
    text-decoration: none;
}

/* selected link */
a:active {
    color: #0097b3;
}

body {
	font-family: 'Saira', sans-serif;
}

.navbar-x {
	background-color: #FFFFFF;
	padding: 0;
}

.navbar-toggler-icon {
	font-size: .8rem;
}

.navbar-toggler {
	margin-right: 2rem;
}

/*********************************************** Navigation bar ************************************************/

/* The class that sets the look of the logo on the left side. It is sort of like a button in the navbar, too. */
#tt-nav .navbar-brand {
    position: relative;
    height: 45px;
    /*added for arrow dropdown*/
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}
#tt-nav .navbar-toggler-icon{
    font-size: 0.8em;
}

#tt-nav .navbar-gray-section {
    position: absolute;
    top: -1px;
    left: 0px;
    border-bottom: 46px solid #3a3a3c;
    border-left: 0px solid transparent;
    border-right: 40px solid transparent;
    height: 0;
    width: 100%;
}

#tt-nav .navbar-bottom-line {
    position: absolute;
    left: 100px;
    top: 45px;
    height: 5px;
    width: calc(100% - 100px);
    background-color: #0097b3;
}

#tt-nav .navbar-brand .navbar-behind-logo {
    position: absolute;
    left: 0px;
    top: 0px;
    height: 90px;
    width: 125px;
    background-image: url("../turingtumble/assets/behind-upper-story-logo-tt.png");
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    background-position: top left;
}

#tt-nav .nav-logo-product-arrow {
    position: relative;
    background-image: url("../turingtumble/assets/nav-product-arrow.svg");
    background-repeat: no-repeat;
    display: inline-block;
    background-position: center center;
    width: 15px;
    height: 100%;
    background-size: 8px;
    z-index: 2;
    vertical-align: middle;
    margin-top: 1px;
}

#dropProducts {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.dropdown-menu-header-link {
	height: 45px;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
}
#tt-nav .dropdown-toggle::after {
	display: none;
}

#tt-nav #dropArrow {
	padding: 0 5px;
}
#tt-nav #dropArrow .dropdown-menu {
	min-width: auto;
}

#tt-nav #dropArrow a {
	font-family: 'Josefin Sans Bold', 'Saira', sans-serif;
	color: #414042;
}

#tt-nav #dropArrow a:hover {
	opacity: 1;
	color: #0097b3;
}

#tt-nav .nav-logo-product {
    position: relative;
    display: inline-block;
    z-index: 2;
    height: 100%;
    vertical-align: middle;
    padding-top: 2px;
}

#tt-nav .nav-logo-product-img {
    position: relative;
    top: 0px;
    left: 0px;
    display: inline-block;
    background-image: url("../turingtumble/assets/tt-menu-item-white-edit.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transition: 0.3s;
    height: 33px;
    width: 100px;
}

#tt-nav .nav-logo-product-img-tt {
    position: relative;
    top: 0px;
    left: 0px;
    display: inline-block;
    background-image: url("../turingtumble/assets/nav-logo-turingtumble-hover.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transition: 0.3s;
    height: 33px;
    width: 100px;
}

#tt-nav .nav-logo-product-img-spin {
	background-image: url("../turingtumble/assets/nav-logo-spintronics-hover.png");
	position: relative;
    top: 0px;
    left: 0px;
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transition: 0.3s;
    height: 33px;
    width: 100px;
}

#tt-nav .dropdown-menu-container {
	/*width: auto;*/
	width: 159px;
	background-color: #3a3a3c;
    border-bottom: 5px solid #0097b3;
    border-top-right-radius: 4px;
    border-right: 5px solid #0097b3;
    border-top: none;
    border-left: none;
}
/*#tt-nav .nav-logo-product-img:hover {
    background-image: url("../turingtumble/assets/tt-color-logo-from-shopify.svg");
}*/
.dropdown-menu.show {
  max-height: 800px;
  visibility: visible;
}
  
.dropdown-menu {
  display: block;
  max-height: 0;
  visibility: hidden;
  transition: all 0.4s ease-in-out;
  overflow: hidden;
}

#tt-nav .nav-logo-product-hidden-image {
    position: relative;
    visibility: hidden;
    display: inline-block;
}

#tt-nav .nav-upper-story-logo {
    position: relative;
    display: inline-block;
    z-index: 2;
    height: 30px;
    vertical-align: top;
    margin-left: 4px;
}

@media only screen and (max-width: 400px) {
    #tt-nav .nav-logo-product-img {
        width: 90px;
    }
    #tt-nav .nav-logo-product-arrow {
        background-size: 6px;
        width: 10px;
    }
}
@media only screen and (max-width: 380px) {
    #tt-nav .nav-logo-product-img {
        width: 70px;
    }
    #tt-nav .nav-logo-product-arrow {
        background-size: 5px;
        width: 8px;
    }
}
/* Don't draw the product name if the client space is too narrow */
@media only screen and (max-width: 350px) {
    #tt-nav .nav-logo-product-arrow {
        display: none;
    }

    #tt-nav .nav-logo-product {
        display: none;
    }

    #tt-nav .nav-upper-story-logo {
        margin-right: 10px;
    }
}


#tt-nav .nav-upper-story-img {
    position: relative;
    left: 0px;
    top: 0px;
    background-image: url("../turingtumble/assets/upper-story-logo-white.svg");
    background-repeat: no-repeat;
    background-size: contain;
    transition: 0.3s;
}

#tt-nav .nav-upper-story-img:hover {
    background-image: url("../turingtumble/assets/upper-story-logo-hover-tt.svg");
}


#tt-nav .nav-logo-spacer {
    position: relative;
    top: 0px;
    display: inline-block;
    z-index: 2;
    width: 40px;
}

#tt-nav .nav-link {
	margin: 0;
	padding: 20px 20px 10px 0;
	font-size: 13pt;
    color: #414042;
    font-family: 'Josefin Sans Bold', 'Josefin Sans', 'Saira', sans-serif;
    text-align: right;
    text-transform: uppercase;
}

#tt-nav .nav-link.active {
	/*color:  rgba(0,0,0,.9);*/
	color: #0097b3;
}

#tt-nav a.nav-link:hover {
	color: #0097b3;
	opacity: 1;
}

.top-navlink {
	border-top: solid 1px;
	border-color: #d1d3d4;
}

#tt-nav .navbar-order-btn {
	float: right;
	text-align: center;
	margin: 0;
}

#tt-nav .order-button, #tt-nav .order-button:link, #tt-nav .order-button:visited {
    background: #0097b3;
    color: #FFFFFF;
	font-size: 14pt;
	font-weight: normal;
	padding: 8px 12px 4px 12px;
    text-align: center;
    text-decoration: none;
    border-radius: 100px;
    font-family: 'Josefin Sans Bold', 'Josefin Sans', sans-serif;
    text-transform: uppercase;
}

#tt-nav .order-button:hover {
	background: #00a6bc;
	opacity: 1;
}

@media only screen and (min-width: 768px) {
	#tt-nav .order-button, #tt-nav .order-button:link, #tt-nav .order-button:visited {		
		font-size: 0.9rem;
	}
}

@media only screen and (min-width: 992px) {
	#tt-nav .order-button, #tt-nav .order-button:link, #tt-nav .order-button:visited {
		padding-left: 2rem;
		padding-right: 2rem;
	}
}

/*@media only screen and (max-width: 1080px) {
	#tt-nav .navbar-order-btn {
		display: none;
	}
}*/

#buy-bottom {
	/*display: inline-block;*/
	display: none;
	background-color: transparent;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	text-align: center;
	margin-bottom: 0rem;
	margin-left: 0rem;
	margin-right: 0rem;
	color: white;
	font-family: 'Josefin Sans', 'Saira', Helvetica, Arial, sans-serif;
	font-size: 1.25rem;
	z-index: 98!important;
}

#ttHome .order-button3, #ttHome .order-button3:link, #ttHome .order-button3:visited {
	background: #0097b3;
	border: none;
	color: #FFFFFF;
	font-size: 1.3rem;
	font-weight: 600;
	padding: 0.7rem 4rem;
    text-align: center;
    text-decoration: none;
    border-radius: 100px;
    cursor: pointer;
    opacity: 1;
    width: 70%;
    margin-bottom: 10px;
}

#nav-buy-button {
	display: none;
}

@media only screen and (min-width: 768px) {
	#buy-bottom, #buy-bottom .order-button3 {
		display: none;
	}
	#nav-buy-button {
		display: inline-block;
	}
}


@media only screen and (min-width: 768px) {
	.nav-link {
		background-color: transparent;
		font-size: 0.9rem;
		padding-left: 0.5rem !important;
		padding-top: 0.5rem !important;
		padding-bottom: 0.5rem !important;
		margin-right: 0px;
	}

	.top-navlink {
		border: none;
	}
}

@media only screen and (min-width: 992px) {
	.nav-link {
		background-color: transparent;
		font-size: 1rem;
		margin-left: 1rem;
		padding: 4px 10px 0 20px;
	}

}

.cookieNotice {
	position: fixed;
	bottom: 0;
	width: 100%;
	height: auto;
	text-align: center;
	background-color: rgba(000, 000, 000, 0.65);
	color: #FFF;
	padding: 1rem;
	z-index: 99;
	border-top: 2px solid white;
	font-family: 'Saira', sans-serif;
	font-size: .875rem;
}

.cookieNotice .notice {
	display: inline-block;
}

.cookieNotice a {
	color: #FFF;
}

.cookieNotice a:hover {
	text-decoration: underline;
}

.cookieNotice .notice-button {
	margin-left: 1rem;
	margin-top: 5px;
	background-color: #0097b3;
	border-radius: 100px;
	padding: 5px 10px;
	width: 100px;
	color: #fff;
}

.cookieNotice .notice-button:hover {
	background-color: #00a6bc;
	cursor: pointer;
}

@media only screen and (min-width: 768px) {
	.cookieNotice {
		width: 100%;
		margin: 0 auto;
		font-size: 1rem;
		height: auto;

	}
}

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

.page-content {
	padding: 0;
	font-size: 1rem;
	overflow: hidden;
}

#heroVideo .embed-responsive {
	position: static;
}

/* The hero area */
#hero {
	position: relative;
	overflow: hidden;
	width: 100vw;
	height: calc(100vh - 180px);
	background-attachment: scroll;
	background-image: url(../turingtumble/assets/opening_image2.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	/*testing min dimensions*/
	/*min-width: 450px;*/
	min-height: 300px;
}

#hero .hero-video {
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 177.78vh;
	min-width: 100%;
	position: absolute;
}

#hero .hero-outer {
	position: absolute;
	background: rgba(0,0,0,0.35);
	width: 100%;
	height: 100%;
	padding: 0 10px;
	top: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
}

#hero .hero-inner {
	height: calc(100% - 75px);
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

#hero .hero-logo-container {
	background-image: url("../turingtumble/assets/logo_small_en.svg");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: bottom center;
	width: 94%;
	height: 37%;
	/*testing min*/
	min-height: 100px;
}

#hero .play-button {
	padding-top: 2rem;
}

#hero .btn-play {
	background-color: #0097b3;
	color: #fff;
	font-size: 1rem;
	padding: .55rem 1.5rem;
	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    border-radius: 40px;
}

#hero .btn-play:hover {
	background-color: #00a6bc;
	opacity: 1;
}

#hero .play-button-pic {
	width: 1.5rem;
	height: 1.5rem;
	display: inline-block;
	margin-right: 0.8rem;
}

#awardRow {
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	justify-content: center;
	align-items: flex-end;
	width: 100%;
	padding-bottom: .25rem;
}

.award-item {
	padding: 0 .5rem;
}

#awardRow .award-item img {
	width: 65px;
	height: auto;
}

@media screen and (orientation:landscape)
and (min-width: 319px) 
and (max-width: 649px) {
	#hero {
		height: calc(100vh - 55px);
	}
	#hero .hero-outer {
		padding: 0;
	}
	#hero .hero-inner {
		height: 100%;
	}
	#hero .hero-logo-container {
		height: 45%;
	}
	#hero .play-button {
		padding: 20px 0 0 0;
	}
	#hero .play-button a {
		font-size: 12px;
	}
	#hero .btn-play {
		padding: 7px 15px;
	}
	#hero .play-button-pic {
		height: 1.5rem;
		width: 1.5rem;
	}
	#awardRow .award-item {
		padding: 0 7px;
	}
	#awardRow .award-item img {
	}
}

@media screen and (orientation:landscape)
and (min-width: 650px) 
and (max-width: 768px) {
	#hero {
		height: calc(100vh - 60px);
	}
	#hero .hero-outer {
		padding: 0;
	}
	#hero .hero-inner {
		height: 100%;
	}
	#hero .hero-logo-container {
		height: 45%;
	}
	#hero .play-button {
		padding: 1rem 0 0 0;
	}
	#hero .play-button a {
		font-size: 12px;
	}
	#hero .btn-play {
		padding: 5px 20px;
	}
	#hero .play-button-pic {
		height: 1.5rem;
		width: 1.5rem;
	}
	#awardRow .award-item {
		padding: 0 7px;
	}
	#awardRow .award-item img {
		width: 57px;
	}
}

@media screen and (orientation:landscape)
and (min-width: 769px) 
and (max-width: 874px) {
	#hero {
		height: calc(100vh - 60px);
	}
	#hero .hero-outer {
		padding: 0;
	}
	#hero .hero-inner {
		height: 100%;
	}
	#hero .hero-logo-container {
		height: 40%;
	}
	#hero .play-button {
		padding: 1rem 0 0 0;
	}
	#hero .play-button a {
		font-size: 1.2rem;
	}
	#hero .btn-play {
		padding: 10px 20px;
	}
	#hero .play-button-pic {
		height: 1.5rem;
		width: 1.5rem;
	}
	#awardRow {
		padding-bottom: .25rem;
	}
	#awardRow .award-item {
		padding: 0 15px;
	}
	#awardRow .award-item img {
		width: 70px;
	}
}

@media screen and (orientation:landscape)
and (min-width: 875px) 
and (max-width: 1024px) {
	#hero {
		height: calc(100vh - 90px);
		min-height: 375px;
	}
	#hero .hero-outer {
		padding: 0;
	}
	#hero .hero-inner {
		height: 100%;
	}
	#hero .hero-logo-container {
		height: 40%;
	}
	#hero .play-button {
		padding: 2rem 0 0 0;
	}
	#hero .play-button a {
		font-size: 1.2rem;
	}
	#hero .btn-play {
		padding: 10px 20px;
	}
	#hero .play-button-pic {
		height: 1.8rem;
		width: 1.8rem;
	}
	#awardRow {
		padding-bottom: .6rem;
	}
	#awardRow .award-item {
		padding: 0 20px;
	}
	#awardRow .award-item img {
		width: 90px;
	}

}
@media screen and (orientation:portrait)
and (min-width: 601px) 
and (max-width: 768px) {
	#hero {
		height: calc(100vh - 120px);
	}
	#hero .play-button {
		padding: 2rem 0 0 0;
	}
	#hero .play-button a {
		font-size: 1.2rem;
	}
	#hero .btn-play {
		padding: 10px 20px;
	}
	#hero .play-button-pic {
		height: 1.8rem;
		width: 1.8rem;
	}
	#awardRow {
		padding-bottom: .6rem;
	}
	#awardRow .award-item {
		padding: 0 10px;
	}
	#awardRow .award-item img {
		width: 80px;
	}
}

@media screen and (orientation:portrait)
and (min-width: 769px) 
and (max-width: 1024px) {
	#hero {
		height: calc(100vh - 100px);
	}
	#hero .play-button {
		padding: 2rem 0 0 0;
	}
	#hero .play-button a {
		font-size: 1.2rem;
	}
	#hero .btn-play {
		padding: 10px 20px;
	}
	#hero .play-button-pic {
		height: 1.8rem;
		width: 1.8rem;
	}
	#awardRow {
		padding-bottom: .6rem;
	}
	#awardRow .award-item {
		padding: 0 20px;
	}
	#awardRow .award-item img {
		width: 100px;
	}

}

/*@media screen and (orientation:portrait) and (min-width: 769px) {*/
@media screen and (min-width: 1025px) {
	#hero {
		height: calc(100vh - 100px);
		min-height: 400px;
	}
	#hero .hero-logo-container {
		background-image: url("../turingtumble/assets/logo_large_en.svg");
		height: 45%;
		max-width: 1200px;
		width: 90%;
	}
	#hero .btn-play {
		padding: .7rem 2rem;
		font-size: 1.2rem;
	}
	#awardRow {
		padding-bottom: .5rem;
	}
	#awardRow .award-item {
		padding: 0 2rem;
	}
	#awardRow .award-item img {
		width: 115px;
	}
}

/*****************Press logos************************/

#company-logos {
	border-top: solid .25rem;
	border-color: #0097b3;
	padding-top: 0.2rem;
	padding-bottom:0.2rem;
	padding-left:0rem !important;
	padding-right:0rem !important;
	text-align:center;
	margin-bottom: 0.5rem;
	margin-left: 0rem;
	margin-right:0rem;
}

#company-logos .row {
	margin:0rem;
}

#company-logos img {
	opacity: 0.5;
	max-height:1.7rem;
	margin: 0rem;
	padding-left:0rem;
	padding-right:0rem;
}

@media only screen and (min-width: 768px) {
	#company-logos {
		padding-top: 0.25rem;
		padding-bottom:0.25rem;
		padding-left:0rem;
		padding-right:0rem;
	}

	#company-logos img {
		max-height:2rem;
	}
}

@media only screen and (min-width: 992px) {
	#company-logos {
		padding-top: .5rem;
		padding-bottom:.5rem;
		padding-left:0rem;
		padding-right:0rem;
	}

	#company-logos img {
		max-height:2.3rem;
	}
}

@media only screen and (min-width: 1200px) {
	#company-logos {
		padding-top: 0.5rem;
		padding-bottom:0.5rem;
		padding-left:0rem;
		padding-right:0rem;
	}

	#company-logos img {
		max-height:2.5rem;
	}
}


/*************Section 1***************/

.gray-back {
	background-color: #e4e5e6;
}

.section-title {
	color: #414042;
	font-family: 'factor_bf_oblique_krbold', Arial Black, Arial, sans-serif;
	font-size: 28px;
	text-align:center;
	margin-bottom: 0.5em;
	margin-top:2rem;
	line-height:1.25em;
}

@media only screen and (min-width: 768px) {
	.section-title {
		font-size: 2.5rem;
	}
}

.section-subtitle {
	color: #6d6e71;
	font-family: 'Saira', Helvetica, Arial, sans-serif;
	font-size:1.25rem;
	text-align:center;
	margin-bottom:3rem;
}

.section-subtitle b {
	color: #414042;
}

.block-image {
	width: 100%;
}

.thisblock {
	position:relative;
}

.block-image-overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0%;
	top: 0%;
	display:inline-block;
}

.block-image-border-top {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0%;
	top: 0%;
	background-image: url('../turingtumble/assets/picture_top_border.svg');
	background-repeat: no-repeat;
	background-position: top;
	display:inline-block;
}

.block-image-border-bottom {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0%;
	bottom: 0%;
	background-image: url('../turingtumble/assets/picture_bottom_border.svg');
	background-repeat: no-repeat;
	background-position: bottom;
	display: inline-block;
}

.block-title {
	color: #414042;
	font-family: 'Saira', Helvetica, Arial, sans-serif;
	font-size: 1.25rem;
	font-weight: 700;
	margin-top:1rem;
}

.block-description {
	color: #6d6e71;
	font-family: 'Saira', Helvetica, Arial, sans-serif;
	font-size: 1rem;
}

.block-description b {
	color: #414042;
	font-family: 'Saira', Helvetica, Arial, sans-serif;
	font-size: 1rem;
}

.preorder-title {
	font-family: 'Saira', Helvetica, Arial, sans-serif;
	font-size: 1.5rem;
	text-align: left;
	width: 100%;
}

/***************************** Divider Border ************************************/

.left-side-border {
	position: absolute;
	display: inline-block;
	left: 0px;
	top: 0px;
	height: 30px;
	width: 60%;
}

.right-side-border {
	position: absolute;
	display: inline-block;
	left: 60%;
	top: 0px;
	height: 30px;
	width: 40%;
}

.diagonal-border {
	position: absolute;
	display: inline-block;
	left: 60%;
	top: 0px;
	height: 30px;
	width: 4rem;
}

.left-side-border-white-to-gray {
	position: absolute;
	display: inline-block;
	left: 0px;
	top: 0px;
	height: 30px;
	width: 30%;
}

.right-side-border-white-to-gray {
	position: absolute;
	display: inline-block;
	left: 30%;
	top: 0px;
	height: 30px;
	width: 70%;
}

.diagonal-border-white-to-gray {
	position: absolute;
	display: inline-block;
	left: 30%;
	top: 0px;
	height: 30px;
	width: 4rem;
}

.transition-box {
	width: 100%;
	height: 30px;
	position: relative;
}

.left-img-border {
	background-image: url('../turingtumble/assets/top_border.png');
	background-repeat: repeat-x;
	height: 30px;
	width: 30%;
	position: absolute;
	display: inline-block;
	left: 0px;
	top: 0px;
	-webkit-backface-visibility: hidden;
}
.right-img-border {
	background-image: url('../turingtumble/assets/bottom_border.png');
	background-repeat: repeat-x;
	height: 30px;
	width: 70%;
	position:absolute;
	display:block;
	left:30%;
	top:0px;
	-webkit-backface-visibility: hidden;
}
.diag-img-border {
	background-image: url('../turingtumble/assets/diagonal_border.png');
	background-repeat: no-repeat;
	height: 30px;
	width: 100px;
	position:absolute;
	display:block;
	left:30%;
	top:0px;
	-webkit-backface-visibility: hidden;
}

.left-img-border-gray-to-white {
	background-image: url('../turingtumble/assets/top_border2.png');
	background-repeat: repeat-x;
	height: 30px;
	width: 60%;
	position:absolute;
	display:block;
	left:0px;
	top:0px;
	-webkit-backface-visibility: hidden;
}
.right-img-border-gray-to-white {
	background-image: url('../turingtumble/assets/bottom_border2.png');
	background-repeat: repeat-x;
	height: 30px;
	width: 40%;
	position:absolute;
	display:block;
	left:60%;
	top:0px;
	-webkit-backface-visibility: hidden;
}
.diag-img-border-gray-to-white {
	background-image: url('../turingtumble/assets/diagonal_border2.png');
	background-repeat: no-repeat;
	height: 30px;
	width: 100px;
	position:absolute;
	display:block;
	left:60%;
	top:0px;
	-webkit-backface-visibility: hidden;
}

/*************How it works***************/

.nohover:hover {
}

/* The actual image that goes on the previous/next step buttons */
.step-box-image {
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
	display: inline-block;
	height: 50px;
	width: 50px;
}

.image-right-arrow {
	background-image: url('../turingtumble//assets/right_play_button_2.svg');
}

.image-left-arrow {
	background-image: url('../turingtumble/assets/left_play_button_2.svg');
}

/* The buttons at medium size that overlay on the left and right sides */

.step-row {
	display: inline-flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	width: 100%;
	position: relative;
	right: -4%;
	position: relative;
}

.overlay-step-box {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	height: 100px;
	text-align: center;
  	cursor: pointer;
  	padding: 0 45px;
  	z-index: 2;
}

.how-to-video {
	width: 100%;
	height: auto;
	position: relative;
	background: transparent url('../turingtumble/assets/start_pic_video.jpg') no-repeat 0 0;
   	-webkit-background-size: cover;
   	-moz-background-size: cover;
   	-o-background-size: cover;
   	background-size: cover;
}

.overlay-container {
	display: block;
	position: absolute;
	top: 1rem;
	width: 100%;
	height: 100%;
}

.howitworks-overlay {
	width: 100%;
	height: 100%;
	position: absolute;
	background-repeat: no-repeat;
	-webkit-transition:opacity 1s ease-in-out; /* Safari, Chrome and Opera > 12.1 */
       -moz-transition:opacity 1s ease-in-out; /* Firefox < 16 */
        -ms-transition:opacity 1s ease-in-out; /* Internet Explorer */
         -o-transition:opacity 1s ease-in-out; /* Opera < 12.1 */
            transition:opacity 1s ease-in-out;
}

#overlay1 {
    background-image: url('../turingtumble/assets/new_overlay_1_small.svg');
}


#overlay2 {
    background-image: url('../turingtumble/assets/new_overlay_2_small.svg');
	opacity:0;
}

#overlay3 {
    background-image: url('../turingtumble/assets/new_overlay_3_small.svg');
	opacity:0;
}

#overlay4 {
    background-image: url('../turingtumble/assets/new_overlay_4_small.svg');
	opacity:0;
}

#overlay5 {
    background-image: url('../turingtumble/assets/new_overlay_5_small.svg');
	opacity:0;
}

#overlay6 {
	background-image: url('../turingtumble/assets/overlay_6_small.svg');
	opacity:0;
}

.how-to-video-container, .overlay-container {
	transform: scale(1.3, 1.3);
}
.video-row {
	margin: auto;
	width: 100%;
	position: relative;
	right: 4%;
}

@media only screen and (min-width: 578px) {

	.step-box-image {
		height: 80px;
		width: 80px;
	}
	.how-to-video-container, .overlay-container {
		transform: scale(1.1, 1.1);
	}
	.overlay-container {
		top: .5rem;
	}
}

@media only screen and (min-width: 768px) {

	.image-right-arrow {
		background-image: url('../turingtumble/assets/right_play_button_translucent_2.svg');
	}

	.next-step-box:hover .image-right-arrow {
		background-image: url('../turingtumble/assets/right_play_button_2.svg');
	}

	.image-left-arrow {
		background-image: url('../turingtumble/assets/left_play_button_translucent_2.svg');
	}

	.prev-step-box:hover .image-left-arrow {
		background-image: url('../turingtumble/assets/left_play_button_2.svg');
	}

}

@media only screen and (min-width: 992px) {

	.video-row {
		width: 75%;
	}

	.step-row {
		right: -3.5%;
	}

	.how-to-video-container, .overlay-container {
		transform: scale(1, 1);
	}

	#overlay1 {
        background-image: url('../turingtumble/assets/new_overlay_1.svg');
	}

	#overlay2 {
        background-image: url('../turingtumble/assets/new_overlay_2.svg');
	}

	#overlay3 {
        background-image: url('../turingtumble/assets/new_overlay_3.svg');
		/*transform:translate(-8%, -11%);*/
	}

	#overlay4 {
        background-image: url('../turingtumble/assets/new_overlay_4.svg');
	}

	#overlay5 {
        background-image: url('../turingtumble/assets/new_overlay_5.svg');
	}

	#overlay6 {
		background-image: url('../turingtumble/assets/overlay_6.svg');
	}

}

/**************Parts******************/

#part-frame-img {
	padding-top: 0;
	position: relative;
	width: 100%;
	max-width: 992px;
}

#part-frame {
	padding-top: 0;
	overflow: hidden;
	position: relative;
	width: 100%;
	max-width: 992px;
	padding-bottom: 27%;
}

#part-frame .part-video {
	width: 100%;
	min-width: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%)
}

.parts-grid {
	display: flex; 
	flex-direction: column-reverse; 
	justify-content: center;
	padding: 1rem 1rem 0 1rem;
}
.parts-grid-video, .parts-grid-text {
	width: 100%; 
}
@media only screen and (min-width: 992px) {
	.parts-grid {
		flex-direction: row;
		padding: 2rem 1rem 0 1rem; 
	}
	.parts-grid-video {
		width: 60%; 
		max-width: 992px;
	}
	.parts-grid-text {
		width: 40%;
		max-width: 500px;
		padding-left: 2rem;
	}
}

/**************How to play************/

.how-to-number {
	width: 100%;
	max-width: 100px;
}

.how-to-number2 {
	width: 100%;
	max-width: 100px;
	opacity: 0;
}

.trImgPuzzle {
	display: inline-block;
	width: 95%;
	max-width: 600px;
	text-align: center;
	margin: 0 auto;
}

.trImgPages {
	width: 95%;
	max-width: 1000px;
}

.hidden-img {
	display: none;
}

/**************What else can it do?*********/
.what-else-video-border {
	border: solid 4px #0097b3;
}

.sorts-row {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	padding: 0; 
	margin: 10px 5px 0;
	justify-content: center;
	width: 100%;
	opacity: .7;
}

.sort-item {
	width: 100px;
	list-style-type: none;
	text-align: center;
	padding: 10px 20px;
}

.sort-item .sort-title {
	color: #414042;
	font-size: 1.1rem;
	padding-top: 8px;
}

.sort-item img {
	width: 30px;
}

@media only screen and (min-width: 763px) {

	.sorts-row {
		text-align: center;
		width: 100%;
		height: auto;
		padding: 20px 0 0 0;
		margin: 0 auto 30px auto;
		justify-content: center;
		align-items: flex-start;
	}

	.sort-item {
		width: auto;
		font-size: 1.2rem;
		padding: 0 30px;
	}

	.sort-item img {
		width: 60px;
	}
}

/*************Education***************/
.education-image {
	display:inline-block;
	width: 100%;
	max-width:30rem;
	max-height:15rem;
	padding-bottom:50%;
	background-image:url('../turingtumble/assets/classroom.jpg');
	background-repeat: no-repeat;
	background-position: top right;
	background-size: contain;
}

.edu-signup-container {
	width: 95%;
	margin: 0 auto;
}

.edu-email {
	width: 300px;
	border: 1px solid lightgray;
}

.btn-signup {
	margin: 10px 10px 0; 
	letter-spacing: 2px; 
	min-width: 200px;
	border-radius: 100px!important; 
	text-transform: uppercase; 
	/*width: 90%;*/
}

/*******************************About*************************************/
/*-----------------------------------------------------------------------*/

#about {
	font-family: 'Saira', sans-serif;
	color: #575859;
}

.hero-background-pic {
	background-image: url('../turingtumble/assets/banner-2.jpg');
	overflow: hidden;
	position: relative;
	height: 300px;
	width: 100%;
	background-color: #E4E5E6;
	object-fit: cover;
	background-repeat: no-repeat;
	background-position: 50% 78%;
}

.about-container {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 30px 15px;
	margin: 0 auto;
}

.about-container-col-reverse {
	flex-direction: column-reverse;
}

.gray-frame-with-caption {
	background-color: #E4E5E6;
	padding: 1.5rem;
	text-align: center;
	box-shadow: 0 2px 4px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);
	border-radius: 10px;
	margin: 0 auto;
}
.gray-frame-with-caption-logo {
	width: 75%;
	margin: 0 auto 1rem auto;
}
.gray-frame-with-caption-image {
	height: 250px;
	width: 100%;
	object-fit: cover;
	object-position: center;
}
.gray-frame-with-caption .cap {
	font-style: italic;
	text-align: center;
	padding-top: 5px;
	line-height: 1.1rem;
}
.giving-description {
	width: 100%;
	margin: 3rem auto 0 auto;
}
.giving-logo {
	width: 70%;
	height: auto;
	display: block;
	margin: 0 0 1rem 0;
}

@media only screen and (min-width: 768px) {

	.about-container {
		flex-direction: row;
		padding: 0;
		margin: 0 auto;
	}
	.about-container-col-reverse {
		flex-direction: row;
	}
	.gray-frame-with-caption-logo {
		max-height: 105px;
	}
	.giving-logo {
		height: 140px;
		width: auto;
		padding-bottom: 1rem;
	}
	.giving-description {
		margin: 0 0 0 1.5rem;
	}
	.giving-quote {
/*		margin: 2rem auto;
		display: block;*/
	}

}

.staff-header {
	display: flex;
	flex-direction: row;
	padding: 1rem;
}

.staff-name-job {
	text-align: left;
	padding: 0 0 0 1rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.title-name {
  padding-top: 10px;
}

.title-job {
  line-height: 1.2rem;
}

.subtitle-description {
  line-height: 1.1rem;
  font-size: .9rem;
  padding: 0 1rem;
}

@media only screen and (min-width: 768px) {

	.staff-header {
		flex-direction: column;
		padding: 0;
	}
	.staff-name-job {
		padding: 0;
	}
	.subtitle-description {
		padding: 0;
		line-height: 1.3rem;
		font-size: 1rem;
	}

}

.block-div-about {
  position: relative;
}

.block-image-overlay-about {
  	position: absolute;
	width: 100%;
	left: 0%;
	top: 0%;
	display: inline-block;
}

.p-indent {
	text-indent: 0;
}

.flip-card {
  background-color: transparent;
  width: 200px;
  height: 200px;
  perspective: 1000px;
}

.flip-icon {
	position: relative;
	bottom: 190px;
	right: 80px;
	width: 25px!important;
	height: 25px!important;
	opacity: .8;
	display: inline-block;
}

.flip-icon-back {
	right: 0;
	left: 80px;
	transform: rotateY(180deg);
	display: inline-block;
}

.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s;
  transform-origin: center right; 
  transform-style: preserve-3d;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  cursor: pointer;
}

.flip-card .turn-card {
  -webkit-transform: translateX(-100%) rotateY(-180deg);
  -moz-transform: translateX(-100%) rotateY(-180deg);
  -o-transform: translateX(-100%) rotateY(-180deg);
  transform: translateX(-100%) rotateY(-180deg);
}

.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-card-front {
  background-color: #bbb;
  color: black;
}

.flip-card-back {
  background-color: #FFFFFF;
  color: white;
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.flip-card-front img, .flip-card-back img {
  width: 100%;
}

@media only screen and (min-width: 768px) {

	.p-indent {
		text-indent: 2rem;
	}
	.flip-card {
		width: 255px;
		height: 255px;
	}
	.flip-icon {
		/*bottom: 245px;
		right: 105px;*/
		display: none;
	}
	.flip-icon-back {
		/*left: 100px;*/
		display: none;
	}
	.block-div-about {
		padding: 20px 0 0 0;
	}

}

/* Company Timeline */
.vertical-red-line-mobile {
	display: block;
	height: 40px;
    width: 2px;
    background-color: #e10a0a;
    margin: 0 auto 24px;
}

.vertical-red-line-desktop {
	display: none;
}

.rich-text-header {
	text-align: center;
	margin: 2rem auto;
}

.responsive-image {
	display: block;
	height: auto;
	max-width: 100%;
	width: 424px;
	margin: 0 auto;
}

.responsive-image-container {
    height: auto;
    max-width: 100%;
    width: 375px;
}

.text-image-pair-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
}
.text-image-pair-wrapper-col-reverse {
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
}
.text-image-pair-wrapper-col {
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}
.rich-text-wrapper {
    font-family: 'Saira', sans-serif;
    font-size: 18px;
    line-height: 1.56;
    color: #1d1d1d;
    margin: 30px 16px 0 16px;
}

@media only screen and (min-width: 768px) {
	.rich-text-wrapper {
	    max-width: 538px;
	    font-size: 20px;
	    line-height: 1.6;
	    margin: 0 auto 24px;
	}
}

@media only screen and (min-width: 1024px) {

	.text-image-pair-block-wrapper {
		position: relative;
	}
	.text-image-pair-wrapper {
	    -webkit-box-pack: space-around;
	    -webkit-justify-content: space-around;
	    -ms-flex-pack: space-around;
	    justify-content: space-around;
	    -webkit-align-items: center;
	    align-items: center;
	    padding: 64px 0;
	}
	.text-image-pair-wrapper-col-reverse, .text-image-pair-wrapper-col {
	    -webkit-flex-direction: row;
	    -ms-flex-direction: row;
	    flex-direction: row;
	}
	.rich-text-wrapper {
    	width: 424px;
    	min-height: 424px;
    	margin: 0;
	}
	.image-wrapper {
    	width: 424px;
    	margin: auto 0;
	}
	.vertical-red-line-mobile {
		display: none;
	}
	.vertical-red-line-desktop {
		display: block;
	    height: 100%;
	    width: 2px;
	    background-color: #e10a0a;
	    position: absolute;
	    left: 50%;
	}
}

/************Footer*******************/

.site-footer-container {
	border-top: 3px solid #0097b3;
  	padding: 30px 30px 60px 30px;
  	display: flex;
  	flex-direction: column-reverse; 
  	background-color: #3A3A3C; 
  	color: #FFF;
  	font-family: 'Josefin Sans', 'Saira', sans-serif;
}

@media only screen and (min-width: 801px) {
	.site-footer-container {
		flex-direction: row;
	    height: 300px;
	    align-items: flex-start;
	  	justify-content: space-evenly;
	  	padding: 30px;
	}
}
.footer-col {
  width: 100%;
  display: flex;
  text-align: center;
  margin-bottom: 20px;
  flex-direction: column;
}

.footer-col .footer-heading {
	/*font-family: "Saira", sans-serif;*/
	font-size: 18px;
	font-weight: 600;
}

/*.footer-col img#footerLogo {
	width: 100px;
	margin-bottom: 10px;
}*/
.footer-col img {
	width: 100px;
	margin-bottom: 10px;
}

.footer-col a {
	font-size: 16px;
	color: #FFF;
	text-decoration: none;
}

.footer-col a:hover {
	color: #0097b3;
	text-decoration: none;
	opacity: 1;
}

.footer-col p {
	margin-top: 10px;
	font-size: 14px;
}

.footer-col .footer-heading .required-email {
	font-size: 12px;
}

.footer-inline {
  margin: 0;
  list-style-type: none;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
}

.footer-inline li {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-right: 5px;
}

.footer-inline li a {
	padding-right: 5px;
	font-size: 14px;
}

.footer-list {
	list-style-type: none;
	padding: 10px;
}

.footer-list li {
	padding: 3px 0;
}

.btn-lang {
	background-color: transparent;
	border: none;
	color: #FFF;
	font-size: 1.2rem;
	padding: 10px 10px 0 10px;
}

.btn-lang:hover {
	color: #0097b3;
	cursor: pointer;
}

.footer-col button.active {
	border-bottom: 2px solid #0097b3;
	cursor: default;
}

.footer-col button.active:hover {
	cursor: default;
	color: #FFF;
}

.btn-subscribe {
	padding: 5px 10px;
    margin-top: 10px;
  	width: 100%;
}

.site-footer__copyright {
  font-size: 9px;
  text-align: center;
}

.site-footer a:hover {
  	color: #0097b3;
}

.footer-col input[type="email"] {
	font-size: 12px;
	width: 95%;
	max-width: 400px;
	background-color: transparent;
	border: 0;
	border-bottom: 1px solid lightgray;
	padding: 8px 0;
	border-radius: 0;
}

.footer-col input[type="email"]::placeholder {
	color: #FFF;
}

.footer-col .footer-social li {
	margin-right: 3px;
	margin-top: 7px;
}

.footer-col .footer-social li a {
	display: block;
    border-radius: 100%;
    border: 1px solid #0097b3;
    padding: 6px;
    line-height: 1;
    background-color: #FFF;
    color: #0097b3;
}

.footer-col .footer-social li a:hover .icon path, .footer-col .footer-social li a:hover {
	background-color: #0097b3;
	color: #FFF;
	fill: #FFF;
}

.footer-col .icon {
	width: 24px;
    height: 24px;
}

.footer-col svg:hover {
	color: #FFF;
    /*stroke: inherit;*/
}

.btn-subscribe {
	text-transform: uppercase;
	letter-spacing: 2px;
	border-radius: 100px!important;
	width: 100%;
	max-width: 400px;
}

.btn-subscribe:hover {
	color: #FFFFFF;
	background-color: #00a6bc;
}

@media only screen and (min-width: 801px) {
	.footer-col {
	    width: 22%;
	    text-align: left;
	    height: 250px;
	}
	.footer-col img#footerLogo {
		width: 125px;
	}
	.site-footer__copyright {
		font-size: 11px;
    	text-align: left;
  	}
  	.footer-inline {
  		display: inline-flex;
  		flex-wrap: wrap;
  		justify-content: flex-start;
  		align-items: center;
  	}
  	.footer-inline li {
  		display: inline-flex;
  		flex-wrap: wrap;
  		margin-right: 3px;
  	}
}

/********************Press Kit********************/

.video-wrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}

.video-wrapper-2 {
	position: relative;
	padding-bottom: 65%;
	padding-top: 25px;
	height: 0;
}

.video-wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.video-wrapper-2 iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.hashtag::before { 
  display: block; 
  content: " "; 
  margin-top: -4rem; 
  height: 4rem; 
  visibility: hidden; 
  pointer-events: none;
}

/*********************About**************************/

.about-image {
	float: none;
	width: 100%;
	padding: 1rem;
}

@media only screen and (min-width: 768px) {
	
	.about-image {
		float: right;
		width: 50%;
	}
}

/**********************Education*****************/
.required-email input {

}

.button {
	background-color: #0097b3;
    border: none;
	color: #fff;
	font-size:1rem;
	font-family: 'Saira', Helvetica, Arial, sans-serif;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    border-radius: 4px;
    cursor: pointer;
}

/**********************Store*****************/
.preorder-button, .preorder-button:link, .preorder-button:visited {
	background-color: #0097b3;
    border: none;
	color: #fff;
	font-size:1.2rem;
	font-family: 'Saira', Helvetica, Arial, sans-serif;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	padding-top: 1.0rem;
	padding-bottom: 1.0rem;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    border-radius: 4px;
    cursor: pointer;
}

.preorder-button:hover {
	background-color: #00a6bc;
}

.tt-progress {
	font-size:1rem;
	font-family: 'Saira', Helvetica, Arial, sans-serif;
}

.button {
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}

.legal-pages {
	width: 85%;
	margin: 5rem auto;
}

.loc-list {
	list-style-type: none;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
	margin: 20px auto;
	justify-content: center;
	align-items: flex-start;
}

.loc-list-item {
	font-family: "factor_bf_oblique_krbold", Arial Black, Arial, sans-serif;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	width: 245px;
	margin: 10px;
	cursor: pointer;
	font-size: 22px;
	background-color: #FFF;
	text-transform: capitalize;
	color: #57585B;
}

.loc-list-item div:first-child {
	margin-top: 10px;
}

.loc-list-item div {
	font-size: 20px;
	margin: 0;
	padding: 5px 10px;
	font-family: "Saira", sans-serif;
	color: #57585B;
	font-weight: 700;
	width: 245px;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	text-transform: capitalize;
}

.loc-list-item div:hover {
	text-decoration: none;
	background-color: #e4e5e6;
}

.loc-list-item div img {
	margin-right: 10px;
}

@media only screen and (min-width: 768px) {
	.loc-list-item div {
		margin: 0;
	}
}

/*============for 404 page not found ================*/
.container-error {
	margin: 2rem auto;
	width: 90%;
	background-color: #FFF;
	border: 2px solid #28bfd7;
	padding-bottom: 3rem;
}
.column-error {
	display: block;
	text-align: center;
}
.column-error-one {
	display: block;
	width: 100%;
}
.image-error {
	width: 250px;
	height: auto;
	margin: 30px auto;
	text-align: center;
}
.column-error-two {
	width: 100%;
	display: block;
}
.error-heading {
	font-size: 36px;
	font-family: 'factor_bf_oblique_krbold', Arial Black, Arial, sans-serif; 
	padding: 0; 
	margin-bottom: 20px;
}
.error-punchline {
	font-size: 28px; 
	font-family: 'Saira', sans-serif; 
	padding: 0; 
	margin-bottom: 40px;
}
.error-text {
	font-size: 20px; 
	font-family: 'Saira', sans-serif;
	padding: 0 1rem;
}
.error-text a {
	color: #28bfd7;
}
@media only screen and (min-width: 768px) {
	.container-error {
	  margin: 4rem auto 0 auto; 
	  border: 4px solid #28bfd7;
	}
	.image-error {
		width: 450px;
	}
	.column-error {
	  display: inline-block;
	  height: 425px;
	}
	.column-error-one {
	  width: 45%;
	  float: left;
	  text-align: right;
	  margin-top: 30px;
	}
	.column-error-two {
	  margin: 6rem 0 0 3rem;
	  width: 40%;
	  text-align: left;
	}
	.error-heading {
		font-size: 4rem;
	}
	.error-punchline {
		font-size: 2rem;
	}
	.error-text {
		font-size: 1.5rem;
		padding: 0;
	}
}