@charset "UTF-8";
div.main_content_container {width:900px !important;padding: 0;text-shadow: none !important;}
div.centered {/*overflow: hidden;*/}

.ls3_nav {width:900px;height:42px;background:#000000;font-size:12px;font-weight: lighter;line-height: 3.5em;}
.ls3_nav img {margin-left:20px;margin-top:12px;}
.ls3_nav .nav_links {float:right;/*width:537px;*/}
.nav_links .link {padding-left:20px;padding-right:20px;float:left;}
.nav_links .link a:link {color:#bfbfbf!important;text-decoration:none;}
.nav_links .link:hover {/*background:url(/images/support/ls3/link-on.gif) repeat-x;*/color:#ccc;}
.nav_links .link_active {color:#f0f0f0 !important;padding-left:20px !important;padding-right:20px !important;float:left;}
.nav_links .link:last-child, .nav_links .link_active:last-child {padding-right:23px !important;}
.topnav ul li:last-child {padding-right:19px !important;}

.title_org_top {font-size:18px;color:#ff9933;margin-bottom:20px;text-align: center;display:block;}
.ls3_content {width:820px;margin:30px 40px 0px;overflow: hidden;}
.ls3_content h3 {color:#415257;font-size: 15px;font-weight: normal;line-height: 21px;margin-bottom: 30px}

.ls3_content .left_col {width:340px;margin-right:52px;float:left;}
.left_col .title_org {font-size:18px;color:#ff9933;margin-bottom:18px;display:block;}
.left_col .divider {height:2px;background:#ededed;margin: 23px 0px 23px;width:340px;}

.ls3_content .right_col {width:425px;float:right;}
.right_col .video {width:420px;height:332px;border-radius:8px;border:thin solid #ccc;overflow:hidden;}
.right_col .videoblock {width:188px;height:98px;border-radius:8px;border:thin solid #ccc;overflow:hidden;float:left;margin-right: 20px;margin-bottom: 20px;}
.right_col .footer {margin-top:45px;height:38px;width:420px;border-left: thin solid #e0e0e0 !important;}
.right_col .imgblock {width:420px;height:150px;border-radius:8px;border:thin solid #ccc;overflow:hidden;margin-top: 5px;}

.ls3_content .fullwidth {width:820px;height:auto;overflow:hidden;}
.fullwidth .title_org {font-size:18px;color:#ff9933;margin-bottom:18px;display:block;}
.fullwidth .divider {height: 1px;background: #ddd;margin: 35px 0px;width: 820px;}
.fullwidth .row {width:820px;height:auto;overflow:hidden;margin-left: 0!important;}
.row .ls-icon {float: left;margin-right: 20px;width:18%;}
.row .img-box {width:420px;height:250px;border-radius:8px;border:thin solid #ccc;float:right;margin-left: 20px;margin-bottom: 20px;overflow: hidden;}
.fullwidth .img-box {width:420px;height:150px;border-radius:8px;border:thin solid #ccc;float:right;margin-left: 20px;margin-bottom: 20px;overflow: hidden;margin-top:3px;}

.ls3_content .footer {padding-top: 10px;margin-top: 45px;width: 815px;border-top: thin solid #ddd;}
.footer .left {float:left;width: 50%;}
.left .techguide {  background: url(/images/support/ls3/download-icon.gif) no-repeat left -6px;padding-left: 45px;line-height: 18px;}
.more_info .left .techguide { background:none; line-height: 4px; text-align: center;  padding: 0; margin-bottom: 0!important; }
.footer .right {float:right;width: 50%;}
.right .support  {background:url(/images/support/ls3/support-icon.gif) no-repeat left top;padding-left:45px;line-height:18px;}

ul.faq_section {width:auto !important;}
ul.faq_section li {margin-bottom: 30px !important;}
.answer1, .answer2, .answer3, .answer4, .answer5, .answer6, .answer7 {background-image:none!important;padding-bottom: 10px;overflow:hidden;}

#ls3, #sky, #echo {width:263px;height:360px;float:left;margin-top:20px;margin-bottom:45px;margin-left: 20px;margin-right: 16px;position: relative;}
#ls3 a.link, #sky a.link, #echo a.link {position: inherit;margin-top: 345px;display: block;margin-left: 95px;}
a.link:hover {text-decoration:none;background:none;color:#ccc;}

#ls3 img, #sky img, #echo img {
  position:absolute;
  left:0;
  -webkit-transition: opacity 0.5s ease-in-out;
  -moz-transition: opacity 0.5s ease-in-out;
  -ms-transition: opacity 0.5s ease-in-out; /* MSIE */
  -o-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
}
#ls3 img.top:hover {opacity:0;filter:alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}
#sky img.top:hover {opacity:0;filter:alpha(opacity=0)-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";;}
#echo img.top:hover {opacity:0;filter:alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}
.supportbox {width: 46%;float:left;padding-left:25px;position:relative;margin-top:25px;}
.supportbox .title_org {font-size:18px;color:#ff9933;margin-bottom:15px;display:block;margin-top: 15px;font-weight: 100;}
.supportbox img {float: left;margin-right: 10px;display: none;}
.supportbox:last-child {margin-right:0px;}

.box-step {margin-top: 10px;width: 230px;float: left;margin-right: 30px;margin-left: 10px;margin-bottom: 25px;/*border-radius: 8px;border: thin solid #ccc;*/height: auto;text-align: left;}
.box-step p {width:230px;padding:4px;}
.box-step img {display: block;margin-left: auto;margin-right: auto; }
.box-left {width: 35%;text-align: center;float:left;}
.box-right {float:right;margin-top:85px;}

ul.faq_section li.show .faq_title {font-size: 15px;color: #415257;background: top left no-repeat url(/images/support/ls3/open_btn.gif) !important;}
ul.faq_section li .faq_title {font-size: 15px;color: #415257;background: top left no-repeat url(/images/support/ls3/close_btn.gif) !important;font-weight:normal;}
h1 { margin-top:0;font-weight: 100; }
h2 {font-size: 16px;line-height: 23px;font-weight: 100;}
.top_container {margin-bottom: 25px;padding-bottom: 40px;border-bottom: 1px solid #ddd;}
.top_container img { float: right;padding:0 40px;}
.top_container .txt_box { float: left;width:60%; }


.pen-box {width: 750px;height: auto;overflow: hidden;}
.pen-box .left {float:left;}
.pen-box .right {float:left;margin-left: 80px;margin-top: 10px;}
#pen-container {width:137px;height:250px;}

.color-box1, .color-box2, .color-box3, .color-box4, .color-box5 {width:30px;height:60px;border: thin solid #ddd;margin:0 20px;float: left;border-radius:8px;overflow:hidden;}

.color-box1 {background-color: #1dd154;}
.color-box2 {background-color: blue;}
.color-box3 {background-color: yellow;}
.color-box4 {background-color: red;}
.color-box5 {background-color: yellow;}

#pen-txt {margin-top: 30px;width:auto;margin-left: 20px;}

.left-box {float:left;width:275px;height:auto;margin-right:150px;}
.right-box {float:left;width:275px;height:auto;}
.left-box img, .right-box img {border-radius:8px;overflow:hidden;width:auto;height:auto;border: thin solid #ddd;margin-top: 10px;}

.txt-box div a img {
  height: 37px;
}

.txt_box div a img {
  height: 37px;
  margin-right: 3px;
}

/*Getting Started Page*/
.intro .video { float: right;width: 23%;padding: 15px 2% 5px;text-align: center;margin-top: -15px;margin: -15px 0 0; border-left: 1px solid #ddd; }
.intro .video img { width: 45px; }
.intro .video p { width: 165px;margin: 6px auto; }
.intro h2 { float: left;width: 70%; }
.step2 .txt-box { width: 30%; margin: 20px 5% 0 0;}
.row h3 { margin: 0; }

/* Responsive CSS */

@media (max-width: 900px) {
	#support_ls3 #bg, ul.faq_section { 
		width: 100%!important; 
	}

	ul.faq_section { 
		padding: 0 5%;
		margin: 0;
	}

  div.main_content_container.topLevelWidth {
		width: 100%!important;
    padding: 0!important;
    }

  .ls3_content .fullwidth {
    width: 90%!important;
    margin: 0 auto;
    padding: 0!important;
    }

  h2 {
    font-size: 12px;
    line-height: 18px;
    }

	ul.pagenav {
    	max-width: 550px;
    	padding: 0;
    	width: 95%;
    	display: block;
	}

  .ls3_content {
    margin: 30px 0 0!important;
    }

  .round_corner {
    border: 0;
    }

  .txt-box img {padding: 0!important;}
	.ls3_content { width: auto;}
	.faq .row { margin: 0; }
	.faq_answer .left-box, 
	.faq_answer .right-box,
	.faq_answer p { 
		margin: 0!important;
    	float: none!important;
    	width: 90%!important; 
    }
	.ls3_content .footer { 
		width: 90%;
    	margin: 0 auto;
    	padding-top: 25px;
	}
	ul.faq_section li.show .faq_answer, ul.faq_section li.show .faq_vid { margin-left: 0!important; }
	.top_container .txt_box {
		width: 100%!important;
    	float: none;
	}
	ul.faq_section { 
		width: 100%!important;
	}
	.pen-box { width: 100%!important; }
	.pen-box .right {
		max-width: 300px;
    	margin-left: 0;
	}
	
	.color-box1, .color-box2, .color-box3, .color-box4, .color-box5 { margin: 0 10px; }
	.faq_answer.answer1 p { text-indent: 0!important; }
	#pen-txt { margin-left: 15px; }
	#ls3 img, #sky img, #echo img { width: 95%!important; }
	.topnav {
		height: auto;
    	background-color: #092a3d;
    	background-image: none;
    	padding: 0!important;
	}
	div.inner_container { margin: 0!important; }
	.row .img-box {
		margin-left: 0!important;
    	width: auto!important;
    	float: none!important;
    	height: auto!important;
    	border: none;
    	text-align: left!important;
    	margin-top: 10px!important;
	}
	.row .img-box img { 
		width: auto!important;
   		max-width: 90%; 
   	}
	ul.faq_section li .faq_title { width: 90%; }
	.top_container { padding-bottom: 0; }
	.top_container img { display: none; }
	
	.intro .video p { width: auto; }
	.intro .video { border-left: none; }
	.fullwidth .row {
		float: none!important;
    	width: 100%!important;
	}
	.fullwidth .row.step2 { margin-top: 45px!important; }
	.fullwidth .row.step2 .tips_box { 
		    width: 100%!important;
		    margin-left: 0!important; 
	}
	ul.pagenav {
		float: left;
    	margin-left: 10px;
	}
	
	.more_info .txt-box { margin-top: 25px!important; }
	
	.more_info .txt-box div.left { 
		width: 40%!important;
    	min-height: 100px;
    	margin: 0 5%;
	}
	.footer .left, .footer .right { 
		float: none;
		width: 100%; 
	}
	
	.row.step2 .mini-box {
		float: none!important;
    text-align: center;
    margin-bottom: 10px;
	}
	
	.row.step2 p {
		width: 100%!important;
		float: none;
		margin: 0;
	}
}


@media (max-width: 499px) {
	.fullwidth .answer5 .img-box { width: 274px!important; }
	.tipandtricks .fullwidth .img-box { width: 100%; }
	.tipandtricks .fullwidth .img-box img {
		margin-left: 0;
    	width: 100%!important;
	}
	
}