@charset "utf-8";


/*begin our styles*/
 
body { font-family: 'Calisto MT',Arial, Helvetica, sans-serif;	font-weight: normal; color: #1c1c1c;	background-color:#336699;}
 
p,ul { margin: 0 0 1.5rem;}
 
ul {list-style: disc; padding: 0 0 0 20px;}
 
a { color: #222222;}

article {  padding: 10px 20px 0 20px; margin: 10px 0;}
 
 footer {font-family: 'Calisto MT',Arial, Helvetica, sans-serif;font-style: italic;text-align: center;font-size: 1.0rem;color: #fff;min-height: 60px;width:100%;background-color: #000;	padding-top: 10px;line-height: 20px;padding: 2% 2%;display:inline-block; margin: 0 auto;}

h1 {}
 
h2 {font-family: 'Calisto MT',Arial, Helvetica, sans-serif;font-size: 1.8rem;text-align:center;	color:rgba(51,102,153,1);
	line-height: 4rem;background-color:#f1f2f3;font-weight: bold;}
 
 header {background: #000000;vertical-align: middle;}
        /*shorter clearfix https://nicolasgallagher.com/micro-clearfix-hack/*/
 header:before, header:after {content:"";display:table; }
 header:after {clear:both;}
        /* For IE 6/7 (trigger hasLayout) */
 header { zoom:1;}

 section,#Main {background-color:#fff;}
* { margin: 0; padding: 0; }

/*end main tags*/
 
.bannertext{height: 350px; line-height: 32rem;width:100%;background-image:url(../images/sklogo.png); background-repeat:no-repeat;background-position:top;font-family:'Calisto MT',Arial, Helvetica, sans-serif; position: absolute; margin: 10% auto;font-size: 1.8rem;text-align: center;font-weight:bold;text-transform:uppercase;text-shadow: 2px 1px 0px #000, 2px 1px 0px rgba(255,255,255,0.15);color:#fff;}
.b1 {color:#000;text-align: center;	font-size:1.2rem;background-position: top;background-repeat: no-repeat;background-color:none;background-color:none;}
.b2 {/*background: url(../images/illustration.png);*/color:#222;padding: 1% 10%;margin: 10% auto;text-align: center;
	font-size:1.2rem;background-position: center;background-repeat: no-repeat;background-color:#fff;}
.b2text{opacity: 2.0; color:#000;}
img.b2 {   opacity: 0.5;filter: alpha(opacity=50); /* For IE8 and earlier */}

a.c1, a.c2, a.c3, a.c4 {display:inline-block; width:150px; border: 2px solid #ccc; border-radius: 50%;text-align:center;line-height:18rem;margin:4% 2%;color:#222222;font-weight:bold;font-family: 'Calisto MT',Arial, Helvetica, sans-serif;font-size:1.2rem;}

a.c1{background-color:#fff;background-repeat:no-repeat;background-image:url(../images/htc-logo150.png);background-position:center; }

a.c2{background-color:#fff;background-repeat:no-repeat;background-image:url(../images/BMO-Harris-Bank150.png);background-position:center; }

a.c3{background-color:#fff;background-repeat:no-repeat;background-image:url(../images/sologo150.png);background-position:center; }
a.c4{background-color:#fff;background-repeat:no-repeat;background-image:url(../images/10279484-gfi-innovations-inc150.png);background-position:center; }
 h1.logo a {font-family: 'Calisto MT',Arial, Helvetica, sans-serif;  text-decoration: none; font-weight: normal;   text-transform: none;  font-size: 2.0rem; float: left;	padding: 8px 25px; background: -webkit-linear-gradient(rgba(255,255,255,1), rgba(51,102,153,1));  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;}
h2.s5Text {font-family: 'Calisto MT',Arial, Helvetica, sans-serif;font-size:1.8rem;}
.mobilebanner{width:100%;background-image:url(../images/skm.png);background-repeat:no-repeat;height:450px;display:inline-block;}

.panel{	display:none;}
#primary_nav ul {  list-style: none; background: red;}
 
#primary_nav li a {  display: none; padding: 0 20px; color: #fff; text-decoration: none; font-weight: bold;font-size:.8rem;    text-transform: uppercase;  letter-spacing: 0.1em; letter-spacing: 0.1em; line-height: 5em; height: 2em;    border-bottom: 1px solid #383838;}
 
#primary_nav li:last-child a {border-bottom: none;}
 
#primary_nav li a:hover,
#primary_nav li a:focus {color: #1c1c1c;background: red;display:block;}

 .sd1{display:none;}

.subpanel1{	display:none;}

a.to_nav { float: right; color: gray; background: #000; text-decoration: none; padding: 0 10px; font-size: 1.8rem;    font-weight: bold; line-height: 30px;  height: 30px;  text-transform: uppercase; letter-spacing: 0.1em;    -webkit-border-radius: 0px;  -moz-border-radius: 0px;  border-radius: 0px;
}
 
a.to_nav:hover,a.to_nav:focus {    color: #1c1c1c; background: #000;
}

/*navigation*/ 
 

.s1{display:none;}
.s3{ height: 100%; width:100%; display: inline-block;background-color:#f1f2f3;text-align:center;}
.s5{  width:100%; display: inline-block;background-color:#336699; padding-bottom:4%;}
.s5Text { background-color:#336699;color:#fff;padding:1% 6%;margin: 1% auto;text-align: center;	font-size:1.2rem;}

.sd1{background-image:url(../images/bannersky.jpg);background-position:bottom;display:inline-block;height:300px;width:100%;}

#showLeft{padding:15px 10px;}
.slideshow-container { display: none;}

.tile-frame1, .tile-frame2,.tile-frame3,.tile-frame4 { margin: 5%  auto; display: none;}

/*footer*/
 


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

	.b2{background-color:transparent;}
		.b1,.b2{width: 1200px; margin: 0 auto;  text-align: center;font-size:1.6rem;line-height: 40px;color:#000;text-shadow: 2px 1px 0px #CCC, 4px 3px 0px rgba(255,255,255,0.15);}
	a.c1, a.c2,a.c3,a.c4{width:100%;}

	  .bannertext{display:inline-block;margin-top:1%;}
	  footer { font-family: 'PT Serif', serif; font-style: italic;  text-align: center;  font-size: 1.0rem;	color: #fff;
	background-color: #000;	height: 50px;	padding-top: 10px;	line-height: 50px;	display:inline-block;}
	  h1.logo a {	font-family:'Calisto MT',Arial, Helvetica, sans-serif; text-decoration: none; font-weight: normal;    text-transform: none; font-size: 3.2rem; float: left;width: 500px;height: auto;margin-left: 20px;
  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;}
  .heading { ;background-color: #000;height:125px;padding-top:20px;margin:0px}
header{	height:100px;background-color:#000;}

	  .mobilebanner{display:none;}
	   .panel{;width:100%; text-align: center;background-color:#f1f2f3;margin:0 auto;padding:2% 0; vertical-align:top;display:block;}
	  .subpanel1{width:100%;background-color:#f1f2f3;display:block; }
.s2{background-color:#fff; }		
.s3{display:none;}
.s3title{display:none;}
section{float:none;}
.slideshow-container{display:block;}


a.to_nav {display: none;}
.tile-frame1, .tile-frame2,.tile-frame3,.tile-frame4 {display:inline-block;}
 .top {display:none;}
     
    .wrapper {position: relative; width: 100%; margin: auto; }
    
	
    #primary_nav { position: absolute;top: 5px; right: 10px; background: none;}   
    #primary_nav li { display: inline;vertical-align:middle;  }     
    #primary_nav li a { float: left;border: none; }

a.tileContent1, a.tileContent2, a.tileContent3, a.tileContent4, .tile-frame1, .tile-frame2, .tile-frame3, .tile-frame4{
                      font-family: Arial, Helvetica, sans-serif;
					  font-size: 1.4rem; 		
					  color:#000;			
					  padding:0;
					  height:200px;
					  width:200px;
                	  display:inline-block;
                      vertical-align: middle;
						border-radius: 200px;
						 text-align:center;
						 margin: 20px 5px;
						 line-height: 200px;
						 font-family: Arial, Helvetica, sans-serif;
					
						 }
a.tileContent1:hover {background: rgb(228,245,252); /* Old browsers */
background: -moz-linear-gradient(-45deg, rgba(228,245,252,1) 0%, rgba(191,232,249,1) 50%, rgba(159,216,239,1) 51%, rgba(42,176,237,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, rgba(228,245,252,1) 0%,rgba(191,232,249,1) 50%,rgba(159,216,239,1) 51%,rgba(42,176,237,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(228,245,252,1) 0%,rgba(191,232,249,1) 50%,rgba(159,216,239,1) 51%,rgba(42,176,237,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4f5fc', endColorstr='#2ab0ed',GradientType=1 ); color: #333;
						 }

a.tileContent2:hover {background: background: rgb(249,249,249); /* Old browsers */
background: -moz-linear-gradient(-45deg, rgba(249,249,249,1) 0%, rgba(248,252,169,1) 50%, rgba(248,249,137,1) 51%, rgba(250,252,123,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, rgba(249,249,249,1) 0%,rgba(248,252,169,1) 50%,rgba(248,249,137,1) 51%,rgba(250,252,123,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(249,249,249,1) 0%,rgba(248,252,169,1) 50%,rgba(248,249,137,1) 51%,rgba(250,252,123,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#fafc7b',GradientType=1 ); color: #333;
						 }
						 
						 a.tileContent3:hover {background: background: rgb(252,236,252); /* Old browsers */
background: -moz-linear-gradient(-45deg, rgba(252,236,252,1) 0%, rgba(251,166,225,1) 50%, rgba(253,137,215,1) 51%, rgba(255,124,216,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, rgba(252,236,252,1) 0%,rgba(251,166,225,1) 50%,rgba(253,137,215,1) 51%,rgba(255,124,216,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(252,236,252,1) 0%,rgba(251,166,225,1) 50%,rgba(253,137,215,1) 51%,rgba(255,124,216,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcecfc', endColorstr='#ff7cd8',GradientType=1 );  color: #333;
						 }
						 
						 a.tileContent4:hover {background: background: rgb(246,239,252); /* Old browsers */
background: -moz-linear-gradient(-45deg, rgba(246,239,252,1) 0%, rgba(179,171,252,1) 50%, rgba(158,141,252,1) 51%, rgba(170,123,252,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, rgba(246,239,252,1) 0%,rgba(179,171,252,1) 50%,rgba(158,141,252,1) 51%,rgba(170,123,252,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(246,239,252,1) 0%,rgba(179,171,252,1) 50%,rgba(158,141,252,1) 51%,rgba(170,123,252,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6effc', endColorstr='#aa7bfc',GradientType=1 ); color: #333;
						 }
						 
						 

 /*.subpanel1{margin:0 auto;}*/

 
 #primary_nav li.top { display: none;}


/* Slideshow */
* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {  max-width: 1920px;  position: relative;  margin: auto;}

.slider {    display: none;}

/* Next & previous buttons */
.prev, .next {  cursor: pointer;  position: absolute;  top: 50%;  width: auto;  margin-top: -22px;  padding: 16px;  color: white;  font-weight: bold;  font-size: 18px;  transition: 0.6s ease;  border-radius: 0 3px 3px 0;}

/* Position the "next button" to the right */
.next {  right: 0;  border-radius: 3px 0 0 3px;}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {  background-color: rgba(0,0,0,0.8);}

/* Caption text */
.text {  color: #f2f2f2;  font-size: 15px;  padding: 8px 12px;  position: absolute;  bottom: 8px;  width: 100%;  text-align: center;}

/* Number text (1/3 etc) */
.numbertext {  color: #f2f2f2;  font-size: 12px;  padding: 8px 12px;  position: absolute;  top: 0;}

/* The dots/bullets/indicators */
.dot {  cursor:pointer;  height: 13px;  width: 13px;  margin: 0 2px;  background-color: #bbb;  border-radius: 50%;  display: inline-block;  transition: background-color 0.6s ease;}

.active, .dot:hover {  background-color: #717171;}

/* Fading animation */
.fade {  -webkit-animation-name: fade;  -webkit-animation-duration: 5.0s;  animation-name: fade;  animation-duration: 4.0s;}

@-webkit-keyframes fade {  from {opacity: .2}  to {opacity: 1}


@keyframes fade {  from {opacity: .2}  to {opacity: 1}

}