@charset "utf-8";
.body {
	margin: 0 auto;
	width: 980px;}
.top-pic{
	background-image: url(Images/UTC542-SmilingCurve-LightBG@2x.jpg);
	background-repeat: no-repeat;
	
}
#intro{
	width: 90%;
	}/* CSS Document */
div.article{
	margin: 0 auto;
	width:90%;
	}
i{
	text-align: center;}
.link{
	color: #4398ef;
	text-decoration: underline;}
p.author{
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 14px;
	color: #666666;
	margin-top: 10px;
	margin-bottom: 20px;
	line-height: 18px;
	font-style:italic;
}
.img{
	padding: 5px;}
.img1{
	padding: 15px;}
p.caption{
	text-align: center;
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 14px;
	color: #666666;
	margin-top: 10px;
	margin-bottom: 20px;
	}
#ethernet {
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 32px;
	color: #5D4041;
	margin-top: 0px;
	padding: 50px 0px 0px 50px;
	margin-bottom: 0;
	}
.h2{font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 18px;
	font-weight: 400;
	margin-top: 5px;
	margin-bottom: 0;
	padding: 0px 0px 90px 50px;
	margin-right: 520px;
	color: #666666;
	line-height: 30px;
}

.header-text {
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 15px;
	color: #666666;
	line-heigth: 1.5em;
	margin-bottom: 20px;
	}
ul#insidenav{
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 14px;
	color: #666666;
	line-heigth: 26px;
	list-style-type: none;
	margin-bottom: 20px;
	margin-left: 40px;
	}
li.submenu{
	padding-bottom: 8px;
	color: #1E8BC3;
	}
li.submenu>a{
	color: #1E8BC3;
	text-decoration: none;
}
li.submenu>a:hover{
	color: #1c76a5;
	text-decoration: underline;
	}
	
h3.subtitle{
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 20px;
	color: #666666;
	font-weight:600;
	}
p.content {
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 15px;
	color: #515151;
	line-height: 23px;
	margin-top: 0;
	margin-bottom: 10px;
	 }
ul.features>li{
		font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 13.5px;
	color: #515151;
	line-height: 23px;
	margin-top: 0;
	list-style-type: disc;
	 }
	 .features{
		 margin-bottom: 10px;
		 padding-left: 15px;}

.list{
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 14px;
	color: #515151;
	line-height: 23px;
	margin-top: 0;
	margin-bottom: 10px;
	padding-left: 50px;}
p.end {
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 15px;
	color: #666666;
	line-height: 23px;
	margin-top: 10px;
	margin-bottom: 10px;
	font-style:italic;
	 }
#ethernet{
	margin-bottom: 10px;
	}
table#comparison{
	width: 720px;
	border: 1px solid #c0c0c0;
	margin: 10px auto 30px auto;
	}
td.switch{
	border: 1px solid #e2e2e2;
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 13px;
	color: #666666;
	padding-top: 5px;
	padding-bottom: 5px;
	}
tr.charachteristics{
	background-color: #ececec;
	}
tr.managed {
	background-color: #e4f1fe;
	}
tr.unmanaged {
	background-color: #dff7de;
	}
img.control{
	padding-left: 30px;
	margin-top: 10px;
	margin-bottom: 20px;
	}
table#features {
	margin: 0 auto;}
p.img-description {
	font-style:italic;
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-color: #333333;
	font-size: 14px;
	}
a.text{
	color: #1E8BC3;
	text-decoration: none;
	}
a.text:hover{
	color: #1c76a5;
	text-decoration: underline;
	}
a.button {
	padding: 10px;
	background-color: #1E8BC3;
	border: 2px solid #1E8BC3;
	color: #ffffff;
	text-decoration: none;
	border-radius: 5px;
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 14px;
	}
div#action{
	margin: 30px auto;
	}
a.button2{
	padding: 10px 20px;
	border: 2px solid #1E8BC3;
	color: #1E8BC3;
	text-decoration: none;
	border-radius: 5px;
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 14px;
	margin-bottom: 30px;
	margin-right: 20px;
	}
a.button2:hover{
	background-color: #1E8BC3;
	color: #ffffff;}
a.button:hover{
	background-color: #1c76a5;
	border: 2px solid #1E8BC3;
}
a.chapter{
	text-decoration: none;
	color: #666666;
	}
a.chapter:hover{
	text-decoration: none;
	}
	
.sharing{
	padding-left: 0px;
	padding-top: 40px;
	margin-bottom: 50px;
	margin-top: 20px;
	}
ul.materials>li, ul.share-buttons>li {
	display: inline;
	}
div.sharing{
	clear: both;
	}
ul.share-buttons{
	text-align: left;
	padding-left: 0px;
	}
.kit{
		color: #1E8BC3;
		text-decoration: none;
		font-weight: 600;
		}
.kit:hover{
	text-decoration: underline;
	}
h3.subtitle{
	margin-top: 30px;
	margin-bottom: 0px;
	border: none;}
.right{
	float: right;
	padding: 20px;
	border-radius: 15px;
    padding: 5px;
    border: solid 1px #EFEFEF;
}
img.center{
	text-align:center;
	border-radius: 15px;
    padding: 5px;
    border: solid 1px #EFEFEF;
				}
.center{
	text-align:center;
	padding-top: 20px;
	}
	
	/*images*/
.apps{
	padding-top: 10px; 
	margin-bottom: 50px;
	overflow: hidden;}	
.pic {
  position: relative;
  width: 24%;
  float: left;
  margin-right: 1%;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .8s ease;
  background-color: #957f7a;
}

.pic:hover .overlay {
  opacity: 0.9;
}

.text {
	font-family: 'Open Sans', Tahoma, sans-serif;
  color: white;
  font-size: 20px;
  font-weight: bold;
  text-transform: uppercase;
  text-align:center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
/*end of images*/
	
	
@media screen and (max-width: 980px) {
	.body{width: 90%;
	}
	.h2{
		margin-right: 300px;}
}
@media screen and (max-width: 767px) {
	.body{width: 90%;
	}
	.img{text-align: center;}
	.h2{
		margin-right: 200px;}
	.pic{
		width: 45%;
		margin-left: 2%;
		margin-right: 2%;
		margin-bottom: 20px;}
	#ethernet{
		margin-right: 20px;}
}
@media screen and (max-width: 480px) {
	.body{width: 90%;
	}
.img{text-align: center;}
.pic{
		width: 90%;
		margin-left: 5%;
		margin-bottom: 30px;}
.h2{
	
	width: 90%;
	padding-left: 0;
	padding-bottom: 20px;
	}
	#ethernet{
		margin-right: 5%;
		width: 90%;
		padding-top: 30px;
		padding-left: 0;}
.top-pic{
	background-image:none;}
div.article{
	width: 100%;}
}