﻿
/*Customer Connection Home*/
@charset "utf-8";
/* CSS Document */

body{
	
	background-color: #fff !important;
	
} 



.wrapper,.mainContent, .sideBar { 
	//change the box model for simplicity
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.wrapper {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	width: 100%;
	position: relative;
	z-index: 2;
}

.wrapper p {
	margin-bottom: 0.5em;
	margin-right: 0.5em;
}
		
.wrapper a:link{
	text-decoration: underline;
	color: #4C4B4C;
}

.wrapper a:visited {
	text-decoration: underline;
	color: #4C4B4C;
}

.wrapper a:hover {
	text-decoration: underline;
	color: #4C4B4C;
}

.wrapper a:active {
	text-decoration: underline;
	color: #4C4B4C;
}	
				
.wrapper .social{
	display: inline-block;
	}	

.wrapper .socialicons{
	display: inline-block;
	margin: 0px;
	padding: 0px;
	}
	
.wrapper .share img{
	height: auto;
	width: 75%;
	}	
				
.wrapper .nav ul {
	list-style: none;
	background-color: #4c4b4c;
	text-align: center;
	padding: 0;
	margin: 0;
}
.wrapper .nav li {
  font-family: 'Oswald', sans-serif;
  font-size: 1em;
  line-height: 30px;
  height: 30px;
  border-bottom: 1px solid #888;
}
 
.wrapper .nav a {
  text-decoration: none;
  color: #fff;
  display: block;
  transition: .3s background-color;
}
 
.wrapper .nav a:hover {
	background-color: #FFFFFF;
	color: #000;
}
 
.wrapper .nav a.active {
  background-color: #fff;
  color: #444;
  cursor: default;
}
 

  .wrapper .nav li {
    width: 250px;
    border-bottom: none;
    height: 30px;
    line-height: 30px;
    font-size: 1em;
  }
 
  .wrapper .nav li {
    display: inline-block;
    margin-right: -4px;
  }
}


.wrapper h4 {
	font-size: 1.5em;	 
}
	 
.wrapper h2 {
	font-size: 1.1em;
}

.wrapper h5 {
	color: #2751a5;
	font-size: 1em;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
	margin: 0px;
}


.wrapper .header img {
	height: auto;
	width: 100%;			
}
		
.wrapper .header img2 {
	height: auto;
	width: 100%;
	text-align: center;
}
		
		
		
.wrapper .mainContent{
	display: inline-block;
	vertical-align: top;
	/*width: 100%;*/
	margin: 0px;
	color: #4C4B4C;
}
	
.wrapper .mainContent img {
	height: auto;
	width: 100%;
}
		
		
.wrapper .mainContent h1{
	font-size: 1.125em;
	padding: 0px;
	margin: 0px;
	color: #000;
}
		
		
.wrapper .mainContent2{
	display: inline-block;
	vertical-align: top;
	/*width: 80%;*/
	margin: 0px;
	color: #4C4B4C;
}
	
.wrapper .mainContent2 img {
	height: auto;
	width: 60%;
}
		
		
.wrapper .mainContent3{
	display: inline-block;
	vertical-align: top;
	/*width: 80%;*/
	margin: 0px;
	color: #4C4B4C;
}
	
.wrapper .mainContent3 img {
	height: auto;
	width: 100%;
}

.wrapper .mainContent3 h1{
	font-size: 1.125em;
	padding: 0px;
	margin: 0px;
	color: #000;
}


.wrapper .mainContent4{
	display: inline-block;
	vertical-align: top;
	/*width: 80%;*/
	margin: 0px;
	color: #4C4B4C;
}
	
.wrapper .mainContent4 img {
	height: auto;
	width: 90%;
}


.wrapper .mainContent5{
	display: inline-block;
	vertical-align: top;
	/*width: 80%;*/
	margin: 0px;
	color: #4C4B4C;
}
	
.wrapper .mainContent5 img {
	height: auto;
	width:50%;
}
	
	
.wrapper .mainContent6{
	display: inline-block;
	vertical-align: top;
	/*width: 80%;*/
	margin: 0px;
	color: #4C4B4C;
}
	
.wrapper .mainContent6 img {
	height: auto;
	width: 95%;
	margin-left: 25px;
}

/*@media (min-width: 768px) {
    .wrapper .mainContent7 {
        display: inline-block;
        vertical-align: top;
        width: 66.66667%;
        margin: 0px;
        color: #4C4B4C;
    }
}*/
.wrapper .mainContent7 img {
	height: auto;
	width: 80%;
	margin-left: 5px;
}
	
.wrapper .mainContent8{
	display: inline-block;
	vertical-align: top;
	width: 80%;
	margin: 0px;
	color: #4C4B4C;
}
	
.wrapper .mainContent8 img {
	height: auto;
	width: 75%;
	margin-left: 5px;
}
	
	
.wrapper .mainContent9{
	display: inline-block;
	vertical-align: top;
	width: 80%;
	margin: 0px;
	color: #4C4B4C;
}
	
.wrapper .mainContent9 img {
	height: auto;
	width: 25%;
	margin-left: 5px;
	}
	
.wrapper .text img{
	height: auto;
	width: 65%;
}
	
	
	
.wrapper .recommend img{
	height: auto;
	width: 100%;
}
	
	
.wrapper .sideBar {
	display: inline-block;
	/*width: 20%;
	position: absolute;*/
	border-width: 2px;
	border-style: solid;
	border-color: #bebebe;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	font-family: Arial, Helvetica, sans-serif;
	color: #4c4b4c;
	/*margin-right: 10px;*/
	text-align: center;
	float: left;
	vertical-align: top;
	font-size: 0.925em;
	margin-bottom: 25px;
}
        	
		
.wrapper .sideBar h1 {
	font-size: 1em;
	color: #000;
	text-align: center;
	font-weight: bold;
	} 
		
		
.wrapper .sideBar ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    background-color: #fff;
}

.wrapper .sideBar ul li {
    margin: 0;
}

.wrapper .sideBar li a {
	display: block;
    color: #000;
    text-decoration: none;
    padding-top: 10px;
    padding-right: 8px;
    padding-bottom: 10px;
    padding-left: 8px;

}

.wrapper .sideBar li a.active {
	background-color: #999999;
	color: white;
}

.wrapper .sideBar li a:hover:not(.active) {
     background-color: #2751a5;
    color: white;
}
		
		
.wrapper .sideBar img {
	width: 35%;
	height: auto;
}
		

.wrapper .box-right img{
	float: right;
	width: 300px;	
	}
	
	
.wrapper .box-right2 img{
	float: right;
	width: 300px;	
	}
	
.wrapper .box-left img{
	float: left;
	width: 300px;
	padding-right: 20px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	}
	
.wrapper .box-left2 img{
	float: left;
	width: 350px;
	padding-right: 20px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	}
	
	
	
.wrapper .video{
	text-align: center;		
	}

.wrapper hr{
	margin: 0px;
	padding: 0px;	
	border-right: medium none; 
	border-top: #cccccc 1px solid; 
	border-left: medium none; 
	border-bottom: medium none; 
	height: 1px;
	clear: both;
	display: block;
}	

.wrapper p2{
     text-indent: 50px;
} 
	

.wrapper ul{
	margin-left: 25px;	
	margin-bottom: 15px;
}
.wrapper ul li{
	margin-left: 25px;		
}


 .wrapper .mainContent10{
  display: inline-block;
  vertical-align: top;
  width: 80%;
  margin: 0px;
  color: #4C4B4C;
}
               
.wrapper .mainContent10 img {
  height: auto;
  width: 100%;
  margin-left: 5px;
   }




.wrapper div.img {
     margin: 5px 0px;
   	 border: 1px solid #ccc;
     float: left;
}

.wrapper p {
     clear: both;
} 


.wrapper div.img:hover {
     border: 1px solid #777;
}

.wrapper div.img img {
    width: 100%;
    height: auto;
}

.wrapper div.desc {
    padding: 15px;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: .865em;
}

<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,300italic,400italic,600italic,700italic,300,600,700,800" rel="stylesheet" />

<link href="/sitecore/shell/themes/standard/default/Default.css" rel="stylesheet" />

<link href="/sitecore/shell/controls/Lib/Flexie/flex.css" rel="stylesheet" />

