
html {
    scroll-behavior: smooth !important;
}

body {
    background-color: #000000;
	text-align: center;
    font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 300;
	font-kerning: normal;
    letter-spacing: 0.5px;
	color: #ffffff;
    height: 100vh;
    with: 100vw;
}

.add-flex {
	display: flex; 
	align-items: center; 
	justify-content: center; 
	flex-direction: column; 
	text-align: center; 
}

.add-flex2 {
	display: flex; 
	align-items: left; 
	justify-content: center; 
	flex-direction: column; 
	text-align: left; 
}

.add-flex3 {
	display: flex; 
	align-items: right; 
	justify-content: center; 
	flex-direction: column; 
	text-align: right; 
}

.add-flex-bottom {
	display: flex; 
	align-items: center; 
	justify-content: flex-end; 
	flex-direction: column; 
}

body.preloader-site {
    overflow: hidden;
}

.preloader-wrapper {
    height: 100vh;
    width: 100%;
    background: rgba(0, 0, 0, 1);
    position: fixed;
    z-index: 999999;
	outline: none;
	border: 0;
}


/* Navigation */

#menu {
    background: #ffffff;
    background-image: -webkit-linear-gradient(top, #c9d6db, #ffffff);
    background-image: -moz-linear-gradient(top, #c9d6db, #ffffff);
    background-image: -ms-linear-gradient(top, #c9d6db, #ffffff);
    background-image: -o-linear-gradient(top, #c9d6db, #ffffff);
    background-image: linear-gradient(top, #c9d6db, #ffffff);
	-webkit-box-shadow: 0 1px 8px 0px rgba(0, 0, 0, 0.075);
	-moz-box-shadow: 0 1px 8px 0px rgba(0, 0, 0, 0.075);
	-ms-box-shadow: 0 1px 8px 0px rgba(0, 0, 0, 0.075);
	-o-box-shadow: 0 1px 8px 0px rgba(0, 0, 0, 0.075);
	box-shadow: 0 1px 8px 0px rgba(0, 0, 0, 0.075);
    top: 0;
    height: 60px;
    width: 100%;
	position: fixed;
	margin: auto;
	text-align: center;
	z-index: 9999;
	display: block;
}

#navLogo {
    position: absolute;
    left: 50%;
    top: 5px;
    transform: translate(-50%, 0);
    height: 50px;
	display: inline-block;
}

#footerLogo {
    position: relative;
    height: 29px;
    top: -5px;
    width: auto;
    margin-right: 4px;
}

#navNbr {
    position: absolute;
    left: 2vw;
    top: 10px;
    transform: translate(0, 0);
	display: inline-block;
}

#navBtn {
    position: absolute;
    right: 80px;
    top: 8px;
    transform: translate(0, 0);
	display: inline-block;
}

#navIcons {
    margin-top: 15px;
}

#footerIcons {
    margin-top: 52px;
}

#container {
    position: fixed;
    right: 0;
    top: 0;
	width: 80px;
	height: 60px;
	z-index: 10001;
}


/* Sections */

#section1 {
	position: relative;
	background-color: #000000;
	width: 100%;
	padding: 0 10vw 150px 10vw;
	text-align: left;
	color: #cccccc;
	z-index: 90;
}

#section2 {
	position: relative;
	background-color: #ffffff;
	width: 100%;
	padding: 150px 10vw;
	text-align: left;
	color: #333333;
	z-index: 90;
}

#section3 {
	position: relative;
	background-color: #F4F4F4;
	width: 100%;
	padding: 100px 10vw;
	text-align: left;
	color: #333333;
	z-index: 90;
}

#section4 {
	position: relative;
	background-color: #F4F4F4;
	width: 100%;
	padding: 150px 10vw;
	text-align: left;
	color: #333333;
	z-index: 90;
}


/* Websites */
#websites {
	position: relative;
	background-color: #000000;
	width: 100%;
	text-align: left;
	color: #ffffff;
	z-index: 90;
}

#websitesText {
    position: relative;
    z-index: 900;
    width: 100%;
	padding: 150px 10vw 100px 10vw;
}
	
#webdetails hr.style4 {
	border-top: 2px solid #ffffff;
    text-align: center;
    width: 80%;
    margin: 30px 10vw 40px 10vw!important;
}

#webdetails {
	position: relative;
    background: #5fadc7;
	width: 100%;
    height: auto;
	text-align: left;
	color: #ffffff;
	z-index: 90;
	overflow-x: hidden;
	padding-bottom: 100px;
}

#webdetails h6 {
	padding-top: 20px;
}

#webdetails p {
	padding: 0 10vw;
}

#integrations {
	background-color: #F4F4F4;
	color: #333333;
    width: 100%;
	padding: 100px 10vw;
}

#integrations h6 {
   color: #5dabc4;
}


/* Print */
#print {
	position: relative;
	background-color: #000000;
	width: 100%;
	text-align: left;
	color: #ffffff;
	z-index: 90;
}

#printText {
    position: relative;
    z-index: 900;
    width: 100%;
	padding: 150px 10vw 100px 10vw;
}

#print h6 {
   color: #5dabc4;
}
	
#print hr.style4 {
	border-top: 2px solid #5dabc4;
    text-align: center;
    width: 100%;
    margin: 30px 0 40px 0!important;
}

#printdetails {
	background-color: #F4F4F4;
	color: #333333;
    width: 100%;
	padding: 100px 10vw;
}
	
.printexample {
    margin-top: 50px;
}
	
.printexample img {
    width: 100%;
    height: auto;
}


/* Branding */
#branding {
	position: relative;
	background-color: #000000;
	width: 100%;
	text-align: left;
	color: #ffffff;
	z-index: 90;
}

#brandingText {
    position: relative;
    z-index: 900;
    width: 100%;
	padding: 150px 10vw 100px 10vw;
}

#rebrand {
	background-color: #F4F4F4;
	color: #333333;
    width: 100%;
	padding: 100px 10vw 50px 10%;
}

#guide {
	background-color: #F4F4F4;
	color: #333333;
    width: 100%;
	padding: 100px 10vw 35vw 10vw;
    background-image: url("../images/brand_guide.png");
    background-position: center bottom;
    background-size: 100% auto;
    background-repeat: no-repeat;
}

#branding h6 {
   color: #5dabc4;
}
	
#branding hr.style4 {
	border-top: 2px solid #5dabc4;
    text-align: center;
    width: 100%;
    margin: 30px 0 40px 0!important;
}


/* Promos */
#promos {
	position: relative;
	background-color: #000000;
	width: 100%;
	text-align: left;
	color: #ffffff;
	z-index: 90;
}

#promosText {
    position: relative;
    z-index: 900;
    width: 100%;
	padding: 150px 10vw 100px 10vw;
}

#promosdetails {
	position: relative;
    background: #5fadc7;
	width: 100%;
    height: auto;
	text-align: left;
	color: #ffffff;
	z-index: 90;
	overflow-x: hidden;
}

#promosdetails h6 {
	padding: 20px 10vw 0 10vw;
}
	
#promosdetails hr.style4 {
	border-top: 2px solid #ffffff;
    text-align: center;
    width: 80%;
    margin: 30px 10vw 40px 10vw!important;
}

#promosdetails p {
	padding: 0 10vw;
}

#promosslider {
	background-color: #F4F4F4;
	color: #333333;
    width: 100%;
	padding: 100px 10vw;
}

#promosslider h6 {
   color: #5dabc4;
}

.notepad {
   width: 100vw;
   height: auto;
   padding-top: 50px;
}


/* Apparel */
#apparel {
	position: relative;
	background-color: #000000;
	width: 100%;
	text-align: left;
	color: #ffffff;
	z-index: 90;
}

#apparelText {
    position: relative;
    z-index: 900;
    width: 100%;
	padding: 150px 10vw 100px 10vw;
}
	
#appareldetails hr.style4 {
	border-top: 2px solid #ffffff;
    text-align: center;
    width: 100%;
    margin: 30px 0 40px 0!important;
}

#appareldetails {
	position: relative;
    background: #5fadc7;
	width: 100%;
    height: auto;
	text-align: left;
	color: #ffffff;
	z-index: 90;
	overflow-x: hidden;
	padding: 0 10vw 100px 10vw;
}

#appareloptions {
	background-color: #F4F4F4;
	color: #333333;
    width: 100%;
	padding: 100px 10vw;
}

#appareloptions h6 {
   color: #5dabc4;
}

#appareloptions p {
	text-align: left;
}


/* Displays */
#displays {
	position: relative;
	background-color: #000000;
	width: 100%;
	text-align: left;
	color: #ffffff;
	z-index: 90;
}

#displaysText {
    position: relative;
    z-index: 900;
    width: 100%;
	padding: 70px 10vw 100px 10vw;
}

#displays h6 {
   color: #5dabc4;
}
	
#displays hr.style4 {
	border-top: 2px solid #5dabc4;
    text-align: center;
    width: 100%;
    margin: 30px 0 40px 0!important;
}

#displaysmodel {
	position: relative;
    background: #5fadc7;
	width: 100%;
    height: auto;
	text-align: left;
	color: #ffffff;
	z-index: 90;
	overflow-x: hidden;
	padding: 0 0 100px 0;
}

#displaysmodel h6 {
	color: #ffffff;
	padding: 0 10vw;
}
	
#displaysmodel hr.style4 {
	border-top: 2px solid #ffffff;
	width: 80%;
    text-align: center;
    left: 10vw;
    position: relative;
}
	
#displaysmodel p {
	padding: 0 10vw;
}

#displaysdetails {
	background-color: #F4F4F4;
	color: #333333;
    width: 100%;
	padding: 100px 25vw 33vw 25vw;
    background-image: url("../images/table_cover_min.png");
    background-position: center bottom;
    background-size: 100% auto;
    background-repeat: no-repeat;
}


/* Digital */
#digital {
	position: relative;
	background-color: #000000;
	width: 100%;
	text-align: left;
	color: #ffffff;
	z-index: 90;
}

#digitalText {
    position: relative;
    z-index: 900;
    width: 100%;
	padding: 70px 10vw 100px 10vw;
}

#digitaldetails h6 {
   color: #5dabc4;
}
	
#digitaldetails hr.style4 {
	border-top: 2px solid #5dabc4;
    text-align: center;
    width: 100%;
    margin: 30px 0 40px 0!important;
}
	
#digitaldiagram hr.style4 {
	border-top: 2px solid #ffffff;
    text-align: center;
    width: 100%;
    margin: 30px 0 40px 0!important;
}

#digitaldiagram {
	position: relative;
    background: #5fadc7;
	width: 100%;
    height: auto;
	text-align: left;
	color: #ffffff;
	z-index: 90;
	overflow-x: hidden;
	padding: 100px 10vw;
}

#digitaldetails {
	background-color: #F4F4F4;
	color: #333333;
    width: 100%;
	padding: 100px 10vw 10px 10vw;
}



/* Products */

#products {
	position: relative;
	background-color: #F4F4F4;
	width: 100%;
	padding: 100px 10vw 80px 10vw;
	text-align: left;
	color: #333333;
	z-index: 90;
}



/* Contact Page */

#contact {
	position: relative;
	background-color: #F4F4F4;
	color: #333333;
    width: 100vw;
	z-index: 90;
    overflow: hidden;
	text-align: left;
	padding: 150px 10vw 100px 10vw;
}

#contact h6 {
	padding: 75px 0 0 0;
}


/* Terms */

#terms {
	position: relative;
	background-color: #F4F4F4;
	width: 100%;
	padding: 150px 10vw 100px 10vw;
	text-align: left;
	color: #333333;
	z-index: 90;
}

#terms h1 {
    margin: auto;
	text-align: center;
	font-size: 400%;
    letter-spacing: 0.5px;
	text-transform: uppercase;
	font-weight: 200;
	color: #e06721;
    padding-bottom: 30px;
}

#terms h6 {
	color: #5fadc7;
    padding: 50px 0 0 0;
}

#termsnote {
	position: relative;
    background: #5fadc7;
	width: 100%;
    height: auto;
	text-align: left;
	color: #ffffff;
	z-index: 90;
	overflow-x: hidden;
	padding: 100px 10vw;
}


/* Case Studies */

#case-studies {
	position: relative;
	background-color: #F4F4F4;
	width: 100%;
	text-align: left;
	color: #333333;
	z-index: 90;
}

#case-studies1 {
    display: block;
}


#case-studies2 {
    display: none;
}

.accordionText {
	padding: 100px 10vw;
}


/* Services */

#serviceWeb {
	position: fixed;
    top: 0;
    left: 0;
	background-color: #000000;
	width: 100vw;
    height: 100vh;
}

#servicePrint {
	position: fixed;
    top: 0;
    left: 0;
	background-color: #000000;
	width: 100vw;
    height: 100vh;
}

#serviceBranding {
	position: fixed;
    top: 0;
    left: 0;
	background-color: #000000;
	width: 100vw;
    height: 100vh;
}

#servicePromo {
	position: fixed;
    top: 0;
    left: 0;
	background-color: #000000;
	width: 100vw;
    height: 100vh;
}

#serviceApparel {
	position: fixed;
    top: 0;
    left: 0;
	background-color: #000000;
	width: 100%;
    height: 100vh;
}

#serviceDisplay {
	position: fixed;
    top: 0;
    left: 0;
	background-color: #000000;
	width: 100%;
    height: 100vh;
}


/* CTA */

#cta {
	position: relative;
    width: 100vw;
    height: 110vh;
	z-index: 90;
    overflow: hidden;
}

#ctaText {
   position: absolute;
   padding: 100px 10vw;
   transform: translateY(var(--translateY));
}

#ctaText p {
   text-align: left;
}

#hills1 {
   position: absolute;
   background-image: url("../images/hills_001-min.png");
   background-position: center bottom;
   background-size: 100% auto;
   background-repeat: no-repeat;
   width: 100vw;
   height: 100%;
   margin: auto;
   pointer-events: none;
   transform: translateY(var(--translateY));
}

#hills2 {
   position: absolute;
   background-image: url("../images/hills_002-min.png");
   background-position: center bottom;
   background-size: 100% auto;
   background-repeat: no-repeat;
   width: 100vw;
   height: 100%;
   margin: auto;
   pointer-events: none;
   transform: translateY(var(--translateY));
}

#hills3 {
   position: absolute;
   background-image: url("../images/hills_003-min.png");
   background-position: center bottom;
   background-size: 100% auto;
   background-repeat: no-repeat;
   width: 100vw;
   height: 100%;
   margin: auto;
   pointer-events: none;
   transform: translateY(var(--translateY));
}

#hillsbg {
   position: absolute;
   background-image: url("../images/lines_bg.jpg");
   background-position: center;
   background-size: cover;
   width: 100vw;
   height: 100%;
   margin-top: -50vh;
   pointer-events: none;
   transform: translateY(var(--translateY));
}

#ctaText h2 {
	margin: auto;
	text-align: center;
	font-size: 500%;
    letter-spacing: 0.5px;
	text-transform: uppercase;
	font-weight: 700;
	color: #ffffff;
}

#ctaText h3 {
	margin: auto;
	text-align: center;
	font-size: 400%;
    letter-spacing: 0.5px;
	text-transform: uppercase;
	font-weight: 200;
	color: #ffffff;
    padding-bottom: 30px;
}
	
#ctaText hr.style1 {
	border-top: 2px solid rgba(250,250,250,0.4);
    text-align: center;
    width: 20%;
    margin: 0 40%;
}
	
#ctaText hr.style2 {
	border-top: 2px solid #ffffff;
    text-align: center;
    width: 100%;
    margin: 6px 0;
}
	
#ctaText hr.style3 {
	border-top: 2px solid rgba(250,250,250,0.4);
    text-align: center;
    width: 20%;
    margin: 0 40% 40px 40%;
}


/* Footer */

#footer {
    background-color: #000000;
	position: relative;
	width: 100%;
	height: auto;
	padding: 100px 0;
	z-index: 90;
	overflow-x: hidden;
}

.footerContent {
    display: inline-flex;
    text-align: center;
}

.footerLeft {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0 75px 0 0;
	text-align: left;
	color: #CAD6DB;
	z-index: 90;
}

.footerCenter {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0 0 0 75px;
	text-align: left;
	color: #CAD6DB;
	z-index: 90;
    border-left: 2px solid #e06721;
}

.footerRight {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0 0 0 75px;
	text-align: left;
	color: #CAD6DB;
	z-index: 90;
}

.footerLeft p, .footerCenter p, .footerRight p {
    text-transform: uppercase;
	font-size: 80%;
}



/* Headings and Rules */

h1 {
   pointer-events: none;
   color: #ffffff;
   text-transform: uppercase;
   font-size: 120%;
   font-weight: 400;
   letter-spacing: 2px;
}

h2 {
	margin: auto;
	text-align: center;
	font-size: 500%;
    letter-spacing: 0.5px;
	text-transform: uppercase;
	font-weight: 700;
	color: #e06721;
}

h3 {
	margin: auto;
	text-align: center;
	font-size: 400%;
    letter-spacing: 0.5px;
	text-transform: uppercase;
	font-weight: 200;
	color: #e06721;
    padding-bottom: 30px;
}

h4 {
	margin: auto;
	text-align: center;
	font-size: 400%;
    letter-spacing: 0.5px;
	text-transform: uppercase;
	font-weight: 200;
	color: #ffffff;
}

h5 {
	margin: auto;
	text-align: center;
	font-size: 500%;
    letter-spacing: 0.5px;
	text-transform: uppercase;
	font-weight: 700;
	color: #ffffff;
    padding-bottom: 30px;
}

h6 {
	margin: auto;
	text-align: center;
	font-size: 200%;
    letter-spacing: 0.5px;
	text-transform: uppercase;
	font-weight: 200;
	color: #ffffff;
    padding-bottom: 10px;
}

h7 {
	font-size: 120%;
	font-weight: 400;
	text-align: left;
	color: #ffffff;
    letter-spacing: 0.5px;
	text-transform: uppercase;
    margin-bottom: 5px;
    display: block;
}

h8 {
	margin: 0;
	text-align: left;
	font-size: 130%;
    letter-spacing: 0.5px;
	font-weight: 300;
	color: #5fadc7;
}

h9 {
    margin: 0;
    text-align: center;
    font-size: 300%;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-weight: 200;
    color: #ffffff;
}

#websites h4, #websites h5, #print h4, #print h5, #branding h4, #branding h5, #apparel h4, #apparel h5, #promos h4, #promos h5, #displays h4, #displays h5, #digital h4, #digital h5, #products h4, #products h5, #contact h4, #contact h5 {
   color: #e06721;
}

#contact h6 {
   color: #5dabc4;
}
	
hr.style1 {
	border-top: 2px solid rgba(224,103,33,0.4);
    text-align: center;
    width: 20%;
    margin: 0 40%;
}
	
hr.style2 {
	border-top: 2px solid #e06721;
    text-align: center;
    width: 100%;
    margin: 6px 0;
}
	
hr.style3 {
	border-top: 2px solid rgba(224,103,33,0.4);
    text-align: center;
    width: 20%;
    margin: 0 40% 40px 40%;
}
	
hr.style4 {
	border-top: 2px solid #5dabc4;
    text-align: center;
    width: 100%;
    margin: 30px 0 40px 0!important;
}
	
hr.style5 {
	border-top: 2px solid #ffffff;
    text-align: center;
    width: 70%;
    margin: 15px 0;
}
	
hr.style6 {
	border-top: 2px solid #e06721;
    text-align: center;
    width: 100%;
    margin: 30px 0!important;
}
	
hr.style7 {
	border-top: 2px solid rgba(255,255,255,0.25);
    text-align: center;
    width: 100%;
    margin: 15px 0 25px 0;
}



/* Service Slides */

.slide-title {
    font-size: 500%;
	font-weight: 700;
	color: #ffffff;
    letter-spacing: 0.5px;
	text-transform: uppercase;
    margin-bottom: 10px;
}

.slide-text {
	color: #ffffff;
    text-align: left;
    width: 80%;
    margin-bottom: 40px;
}



/* Buttons and Links */

.btn, .btn:focus, .btn:active:focus, .btn.active:focus {
    border: #f38343 solid 2px;
    background-color: #e06721;
    box-shadow: 0 1px 3px 1px rgb(0 0 0 / 10%);
    -moz-box-shadow: inset 0 0 0 1px rgba(93,171,196,0.5);
    border-radius: 0;
    color: #ffffff;
    font-size: 90%;
    font-weight: 400;
    padding: 10px 12px 10px 12px;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
    transition: 0.35s;
}

.btnWhite, .btnWhite:focus, .btnWhite:active:focus, .btnWhite.active:focus {
    border: #ffffff solid 2px;
	border-radius: 0;
	color: #ffffff;
    font-size: 90%;
    font-weight: 400;
    padding: 10px 12px 10px 12px;
    text-decoration: none;
	text-transform: uppercase;
    cursor: pointer;
    transition: 0.35s;
}

.btn:hover, .btnWhite:hover {
    border: #e06721 solid 2px;
    background-color: #000000;
    color: #F3834A;
    text-decoration: none;
    transition: 0.35s;
}

.hero-slide .btn {
    margin-top: 40px;
}

.numeral {
	color: #f38343;
    font-size: 80%;
}

.link1 {
	margin: auto;
	padding: 0;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 80%;
	font-weight: 400;
	color: #ff8e5c;
    transition: 0.5s;
}

.link1:focus {
	color: #ff8e5c;
	text-decoration: none;
}

.link1:hover {
	color: #ff8e5c;
	text-decoration: none;
    transition: 0.5s;
}

.link2:link, .link2:visited {
	color: #CAD6DB;
	text-decoration: none;
    transition: 0.3s;
	outline: none;
}

.link2:hover {
	color: #e06721;
    transition: 0.3s;
}

.link3:link, .link3:visited {
	color: #5dabc4;
	text-decoration: none;
    transition: 0.3s;
	outline: none;
}

.link3:hover {
	color: #e06721;
    transition: 0.3s;
}

.link4 {
	margin: auto;
	padding: 0 0 25px 0;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 200%;
	font-weight: 300;
	color: #5dabc4;
    transition: 0.5s;
}

.link4:focus {
	color: #5dabc4;
	text-decoration: none;
}

.link4:hover {
	color: #e06721;
	text-decoration: none;
    transition: 0.5s;
}

.link5 {
	margin: auto;
	text-decoration: none;
	color: #ffffff;
    transition: 0.5s;
}

.link5:focus {
	color: #ffffff;
	text-decoration: none;
}

.link5:hover {
	color: #e06721;
	text-decoration: none;
    transition: 0.5s;
}
	
.socialIcon {
    width: 40px;
	height: 40px;
	color: #ffffff;
	fill: currentColor;
	margin: 0px;
    transition: all .3s ease;
}
	
.socialIcon:hover {
	color: #ff8e5c;
	fill: currentColor;
    transition: all .3s ease;
}
	
.socialIcon2 {
    width: 40px;
	height: 40px;
	color: #CAD6DB;
	fill: currentColor;
	margin: 0px;
    transition: all .3s ease;
}
	
.socialIcon2:hover {
	color: #e06721;
	fill: currentColor;
    transition: all .3s ease;
}
	
.contactIcon {
    width: 16px;
	height: 16px;
	color: #ffffff;
	fill: currentColor;
	margin: 0px;
	margin-bottom: -2px;
    transition: all .3s ease;
}

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px) {



/* Products */

#products {
	padding: 150px 10vw;
}

#navLogo {
    height: 85px;
    left: 10%;
}

#navNbr {
    display: none;
}

#section1 {
	margin-top: -10vh;
}

body {
    font-size: 25px;
}

h2 {
    font-size: 400%;
}

h3 {
    font-size: 230%;
}

h4 {
    font-size: 230%;
}

h5 {
    font-size: 400%;
}

h7 {
    font-size: 170%;
}

.slide-title {
    font-size: 275%;
    margin-bottom: 50px;
}

.slide-text {
    font-size: 25px;
    width: 90%;
    margin-bottom: 75px;
}

.overlay-text {
    width: 80%!important;
}

.pushy-link {
	font-size: 110%;
}

.pushy-link2 {
	font-size: 110%;
}

.pushy-link3 {
	font-size: 90%;
}

.btn, .btn:focus, .btn:active:focus, .btn.active:focus {
    border-width: 3px;
    font-size: 32px;
    padding: 16px 35px;
}

#menu {
    height: 100px;
}
	
.socialIcon {

}
	
.socialIcon2 {
    width: 120px;
    height: 95px;
}

#container {
	left: calc(100% - 120px);
}

.hamburger-box {
  width: 60px;
  height: 60px;
}
   
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 60px;
    height: 6px;
    border-radius: 8px;
}

.hamburger-inner {
  margin-top: 18px;
}

#footerLogo {
    width: 100px;
    height: auto;
    margin-bottom: 40px;
}

#case-studies1 {
	display: none;
}

#case-studies2 {
	display: block;
}
}
	
@media only screen and (max-device-width: 1200px) 
and (orientation: landscape) {
#navBtn {
    right: 160px;
}
}

	
@media only screen and (max-device-width: 1200px) 
and (orientation: portrait) {

#navBtn {
    display: none;
}

.footerLeft {
    padding: 0;
}

.footerLeft p {
    font-size: 100%;
    text-align: center;
}

.footerCenter {
    display: none;
}

.footerRight {
    display: none;
}

#footerIcons {
    margin-top: 70px;
}

.content {
    height: 100vh;
}

.grid {
    grid-template-columns: repeat(3, 1fr)!important;
    grid-template-rows: repeat(3, 1fr);
}

.grid .scaler {
    grid-area: 2 / 2!important;
}
}

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px)
and (orientation: portrait) {
	
.printexample {
    margin-top: 100px;
    margin-bottom: 50px;
}
	
.printexample img {
    width: 120%;
    height: auto;
}

#cta {
    height: 80vh;
}

#hillsbg {
    height: 120%;
}

#hills1 {
   background-size: 200% auto;
}

#hills2 {
   background-size: 200% auto;
}

#hills3 {
   background-size: 200% auto;
}

#digitalText {
    padding: 0 10vw 100px 10vw;
}

.graphcontainer {
    top: -2px;
}

#footer {
    top: -150px;
}

#guide {
    padding: 100px 10vw 40vw 10vw;
}

#displaysdetails {
	padding: 100px 10vw 48vw 10vw;
    background-size: 140% auto;
}
}

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px)
and (orientation: landscape) {
	
.printexample {
    margin-top: 100px;
}

#cta {
    height: 130vh;
}

#guide {
    padding: 100px 10vw 40vw 10vw;
}
}