@charset "UTF-8";
/* CSS Document */

/* 

CSS Contents

SLT blue hex code: #138dcd
SLT secondary blue hex code: #0d2e45

1.navigation

*/



h1  {
    font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
    font-size:10px;
    color:#0e2d90;
	display:inline;
	font-weight: normal;
	padding:0px;
	margin:0px;
	}

img{
max-width:100%;
display: block;
height:auto;
}

/* the css links below are to make sure that the browser dosn't attach any of its own formats, underline,  visted link, hover, 
etc and sets it to none. Allowing me to display the links exactly as I want with my own css class */
a:link {
    	text-decoration: none;
	    display: block;

}

a:visited {
    	text-decoration: none;
	    display: block;

}

a:hover {
    	text-decoration: none;
	    display: block;

}

a:active {
    	text-decoration: none;
	    display: block;

}


hr {
    border: 0;
    height: 1px;
	background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
	margin-top: 50px;
	margin-bottom: 50px;
	
}

hr.what-we-do-logo {
    border: 0;
    height: 1px;
	background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
	margin-top: 0px;
	margin-bottom: 20px;	
}

hr.ad-specs {
    border: 0;
    height: 1px;
    height: 1px;
	background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
	margin-top: 20px;
	margin-bottom: 20px;
	
	/*bellow css makes hr work in a flex box */
	width: 100%;

	
}

.spacer{
	width:100%;
	height:109px;
}

.border-div{
border: solid #ffffff 5px;	
}
/* navigation starts */

.navigation-grid {
    display: none;
}

@media screen and (min-width:1280px){
.navigation-grid{
    display: grid;
    grid-template-columns: repeat(15, 1fr);
    grid-column-gap: 0%;
    border-bottom:solid 1px #ffffff;
	height: 45px;
}
}

.mobile-navigation-grid{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    border-bottom:solid 1px #ffffff;
	height: auto;
		    display: none;
}

.mobile-navigation{
    grid-column: span 12;
	margin-top: 0px;
	margin-bottom: 20px;
	text-align: center;
}


.logo-grid {
    display: grid;
    grid-template-columns: repeat(15, 1fr);
    grid-column-gap: 20px;
	margin-top: 25px;
	margin-right: 25px;
	margin-left: 25px;
	margin-bottom: 25px;
}


.logo{
    grid-column: 1/15;
	margin-top: 0px;
	margin-bottom: 10px;
}


@media screen and (min-width:1280px){
.logo{
    grid-column: 1/6;
	margin-top: 10px;
	margin-bottom: 0px;
}
}

.logo-2{
    grid-column: 1/15;
	margin-top: 0px;
	margin-bottom: 10px;
}


@media screen and (min-width:1280px){
.logo-2{
    grid-column: 5/9;
	margin-top: 10px;
	margin-bottom: 0px;
}
}

.logo-3{
    grid-column: 1/15;
	margin-top: 0px;
	margin-bottom: 10px;
}


@media screen and (min-width:1280px){
.logo-3{
    grid-column: 1/5;
	margin-top: 10px;
	margin-bottom: 0px;
}
}


.social-linkedin{
	display:grid;
	    grid-column: 15/16;
		font-weight:normal;
	font-size: 40px;
	color: #ffffff;
	text-align: right;
	margin-left:10px;
	margin-right:10px;
}

.social-twitter{
	    grid-column: 14/15;
		font-weight:normal;
	font-size: 40px;
	color: #ffffff;
	text-align: right;
	margin-left:10px;
	margin-right:10px;
}

.social-facebook{
	    grid-column: 15/16;
		font-weight:normal;
	font-size: 40px;
	color: #ffffff;
	text-align: right;
	margin-left:10px;
	margin-right:10px;
}


.hamburger-nav-bar{
	    grid-column: 15/16;
	display: inline;
		font-weight:normal;
	font-size: 40px;
	color: #ffffff;
	text-align: center;
	margin-top: auto;
	margin-bottom: auto;
	  cursor: pointer;
}

@media screen and (min-width:1280px){
.hamburger-nav-bar{
	display: none;	
  cursor: pointer;
}
}

.hamburger-nav-bar-text{
		font-weight:normal;
	font-size: 40px;
	color: #ffffff;
}


/* info box starts*/

.span-15{
    grid-column: span 12;
}

.info-box-grid {
    display: grid;
    grid-template-columns: repeat(15, 1fr);
    grid-column-gap: 0%;
	margin-top: 10px;
	margin-left:25px;
	margin-right:25px;
}


.info-box{
    grid-column: 1/9;
	margin-top: auto;
		margin-bottom: auto;
}

.info-box2{
    grid-column: 1/16;
	margin-top: auto;
		margin-bottom: auto;
}


.info-box-about-us{
    grid-column: 1/16;
	margin-top: auto;
		margin-bottom: auto;
}

.info-box-text{
		font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:normal;
	font-size: 40px;
	color: #ffffff;
}

.devices-box{
    grid-column: 9/16;
}

.image-box{
    grid-column: 9/16;
	background-color: #ffffff;
	padding:5px;
	margin-left: 40px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.image-box-about-us{
    grid-column: 11/16;
	background-color: #ffffff;
	padding:20px;
	margin-left: 40px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.small-info-box-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 0%;
	margin-top: 20px;
	margin-left:25px;
	margin-right:25px;
	margin-bottom: 0px;
}


.small-info-box-full-image{
    grid-column: 1/4;
	border-top: #ffffff solid 1px;
	border-bottom: #ffffff solid 1px;
	margin-left:10px;
	margin-right:0px;	
}


.small-info-box-full{
    grid-column: 1/13;
	border-top: #ffffff solid 1px;
	border-bottom: #ffffff solid 1px;
	padding: 20px;
	margin-left:0px;
	margin-right:10px;
	height:auto;
 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.small-info-box-image{
	grid-column: span 3;
	border-top: #ffffff solid 1px;
	padding: 0px;
		margin-left:10px;
	margin-right:10px;
	 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.small-info-box{
    grid-column: span 3;
	border-top: #ffffff solid 1px;
	border-bottom: #ffffff solid 1px;
	padding: 20px;
	margin-left:10px;
	margin-right:10px;
	height:auto;
 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	/*
	  display: flex;
align-items: left; justify-content: center; flex-direction: column;
	*/
}

.small-info-box-text{
	font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:normal;
	font-size: 30px;
	color: #ffffff;
}

/* info box ends */

/* magazine pull out start */

.articles-grid{
    display: grid;
    grid-template-columns: repeat(15, 1fr);
    grid-column-gap: 20px;
	margin-top: 40px;
	margin-left: 40px;
	margin-right: 40px;
}

.magazine-pull-out-home{
    grid-column: span 12;
    padding-right:0px;
    padding-left:0px;
	border-right:solid 0px #0d2e45;
	border-left:solid 0px #0d2e45;
	padding-top:0px;
	padding-bottom:0px;
 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 	margin-top:10px;
	margin-bottom:10px;
}

@media screen and (min-width:1280px){
	
.magazine-pull-out-home{
    grid-column: 1/5;
    padding-right:0px;
    padding-left:0px;
	border-right:solid 0px #0d2e45;
	border-left:solid 0px #0d2e45;
	padding-top:0px;
	padding-bottom:0px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	margin-top:0px;
	margin-bottom:0px;
}	
	
}

.pull-out-image-container{
    background-color:#000000;
    position: relative;
    border-radius: 25px;
}

.article-magazine-home-page{
    grid-column: span 12;
    padding-left:0px;
    margin-top:20px;
    margin-bottom:20px;
	text-align: left;
}

@media screen and (min-width:1280px){
	
.article-magazine-home-page{
    grid-column: span 6;
    padding-left:20px;
	padding-right:20px;
    margin-top:auto;
    margin-bottom:auto;
	text-align: left;
}
}

.article-pull-out-box-ad-inner-to-add-padding{
padding-top: 20px;
	padding-left: 20px;
	padding-right: 20px;
hyphens: none;
}


.magazine-pull-out-text-one{
		font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:normal;
	font-size: 40px;
	color: #ffffff;
}

.magazine-pull-out-text-two{
    font-family: Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size: 18px;
	color: #ffffff;
}

.magazine-pull-out-text-two-bold-blue{
    font-family: Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size: 18px;
	color: #6B8FD6;
}

.magazine-pull-out-text-three{
		font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:bold;
	font-size: 40px;
	color: #ffffff;
	  line-height: 1;
}

.magazine-pull-out-text-four{
    font-family: Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size: 16px;
	color: #ffffff;
}

.magazine-pull-out-text-link2{
		font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:bold;
	font-size: 20px;
	color: #ffffff;
	text-decoration: underline;
}

.magazine-pull-out-text-link3{
		font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:bold;
	font-size: 15px;
	color: #ffffff;
	text-decoration: underline;
}

.keynote-speaker{
		font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:bold;
	font-size: 15px;
	color: #ffffff;
	text-align: center;
}

/* magazine pull out endes */

/* what we do starts */
.what-we-do-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 0%;
	margin-top: 10px;
	margin-left:40px;
	margin-right:40px;
}

.what-we-do {
    grid-column: span 12;
	font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:normal;
	font-size: 40px;
	color: #ffffff;
}

.what-we-do-image-logo {
    grid-column: span 4;
	padding: 20px;
}

/* what we do ends */

/* advertising starts */
.advertising-grid {
    display: grid;
    grid-template-columns: repeat(12, 5fr);
    grid-column-gap: 0%;
	margin-top: 10px;
	margin-left:40px;
	margin-right:40px;
}


.business-card-text-bold {
	font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:bold;
	font-size: 30px;
	color: #ffffff;
}

.business-card-text-normal {
	font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:normal;
	font-size: 20px;
	color: #ffffff;
}


.advertising-specs {
    grid-column: span 6/13;
	font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:normal;
	font-size: 40px;
	color: #ffffff;
}



/* advertising ends */


/* specs starts */
.spec-grid {
    display: grid;
    grid-template-columns: repeat(12, 5fr);
    grid-column-gap: 0%;
	margin-top: 10px;
	margin-bottom: 0px;
	margin-left:40px;
	margin-right:40px;
}

.single-coloumn {
    grid-column: 1/9;
}

.spec-coloumn-one {
    grid-column: 1/5;
}

.spec-coloumn-two {
    grid-column: 5/9;
	margin-left: 20px;
}

.spec-coloumn-three {
    grid-column: 9/13;
	margin-left: 20px;
}

.full-page {
    font-family: Arial, Helvetica, sans-serif;
	height: 602px;
	color: #ffffff;
	text-align: center;
	border: solid #ffffff 1px;
  display: flex;
align-items: center; justify-content: center; flex-direction: column;
 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	
}

.quarter-page {
    font-family: Arial, Helvetica, sans-serif;
	height: 200px;
	text-align: center;
	border: solid #ffffff 1px;
  display: flex;
align-items: center; justify-content: center; flex-direction: column;
	margin-bottom: 20px;
 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.half-page {
    font-family: Arial, Helvetica, sans-serif;
	height: 380px;
	text-align: center;
	border: solid #ffffff 1px;
  display: flex;
align-items: center; justify-content: center; flex-direction: column;
 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.poster {
    font-family: Arial, Helvetica, sans-serif;
	height: 582px;
	color: #ffffff;
	text-align: center;
	border: solid #ffffff 1px;
  display: flex;
align-items: center; justify-content: center; flex-direction: column;
	margin-bottom: 20px;
 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	
}

.leaderboard {
    font-family: Arial, Helvetica, sans-serif;
	height: 100px;
	text-align: center;
	border: solid #ffffff 1px;
  display: flex;
align-items: center; justify-content: center; flex-direction: column;
		margin-bottom: 20px;
 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.mpu-and-overlay {
    font-family: Arial, Helvetica, sans-serif;
	height: 280px;
	text-align: center;
	border: solid #ffffff 1px;
  display: flex;
align-items: center; justify-content: center; flex-direction: column;
		margin-bottom: 20px;
 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.spec-text-box {
    font-family: Arial, Helvetica, sans-serif;
	height: 600px;
  display: flex;
align-items: left; justify-content: center; flex-direction: column;
}

.spec-title {
	font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-size: 30px;
	color: #ffffff;
}

.spec-size {
    font-family: Arial, Helvetica, sans-serif;
	font-weight: thin;
	font-size: 20px;
	color: #ffffff;
}
/* specs ends */


/* footer starts */
.awards-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 25px;
	margin-top: 10px;
	margin-bottom: 20px;
	margin-right: 25px;
	margin-left:25px;
}

.awards {
    grid-column: span 6;
}


.awards-images-row-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 20px;
	margin-top: 20px;
	margin-bottom: 0px;
	margin-left:25px;
	margin-right:25px;
	grid-row-gap: 20px;
}


.images-row {
    grid-column: span 3;
	padding: 5px;
	margin-left:0px; 
	margin-right:0px; 
	background-color: #ffffff;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.keynote-images-row {
    grid-column: span 3;
	margin-left:0px; 
	margin-right:0px; 
}

.keynote-images-row-white-border{
border:#ffffff 5px solid;	
}

.keynote-name{
	margin-top:20px;
	text-align: center;
}


.awards-symposium-images-row-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 1%;
	margin-top: 20px;
	margin-bottom: 0px;
	margin-left:25px;
	margin-right:25px;
}

.images-row-symposium {
    grid-column: span 2;
	margin-top:15px;
	margin-left:0px; 
	margin-right:0px; 
    padding:0px;

}

.images-row-awards {
    grid-column: span 2;
	margin-left:0px; 
	margin-right:0px; 
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.full-length-headline-grid{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 1%;
	margin-left:25px;
	margin-right:25px;	
	margin-bottom: 40px;
}

.full-length-headline {
    grid-column: span 12;
	margin-left:0px; 
	margin-right:0px; 
	font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
	font-weight:normal;
	font-size: 40px;
	color: #ffffff;
	text-align:center;
}

/* footer ends */

/* footer starts */
.footer-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 0%;
	margin-top: 10px;
	margin-bottom: 50px;
	margin-left:40px;
	margin-right:40px;
}

.footer {
    grid-column: span 12;
    font-family: Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size: 12px;
	color: #ffffff;
	text-align: center;
}
/* footer ends */

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

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow_circle_up_icon:before {
  content: "\e900";
}
.icon-f057_icon:before {
  content: "\e901";
}
.icon-send_icon:before {
  content: "\e902";
}
.icon-arrow_circle_left_icon-1:before {
  content: "\e903";
}
.icon-arrow_circle_right_icon:before {
  content: "\e904";
}
.icon-arrow_circle_down_icon:before {
  content: "\e905";
}
.icon-times_icon:before {
  content: "\e906";
}
.icon-twitter_icon:before {
  content: "\e907";
}
.icon-facebook_icon:before {
  content: "\e908";
}
.icon-instagram_icon:before {
  content: "\e909";
}
.icon-f166_icon:before {
  content: "\e90a";
}
.icon-f0e1_icon:before {
  content: "\e90b";
}
.icon-reorder_icon:before {
  content: "\e90c";
}