/* reset.css */
html {margin:0;padding:0;border:0;}
body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr,
acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form,
label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog,
figure, footer, header, hgroup, nav, section {
	margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:Myriad, Segoe UI, Calibri, Trebuchet MS, sans-serif;vertical-align:baseline;}
article, aside, dialog, figure, footer, header, hgroup, nav, section {display:block;}
body {line-height:1.5;background:white;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;float:none !important;}
table, th, td {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:'';}
blockquote, q {quotes:"" "";}
a img {border:none;}
:focus {outline:0;}

/* GLOBAL */
.container {
	display:block;
	margin: 0 auto;
	width: 950px;
  font-size: 62.5%;	
}

h1{
  text-align: center;	
  color: #666666;
  margin: 0.5em 0;
  font-size:2em;
}


h2{
  text-align: center;	
  color: #666666;
  margin-bottom: 0.5em;
  font-size:1.6em;
}

.placeholderText {	
	color: #BBBBBB;
}

.validText {
	background-color: #DDDDDD;
}

.validInput {
	background-color: #FFFFFF;
}

.invalidText {
	background-color :#F75D59;
	color: #FFFFFF;		
}

.warningText {
	background-color: #FF8040;
	color: #FFFFFF;		
}

.noDisplay {
  display:none;	
}

/* UPPER PART -> ADS + CEC FRAME*/
#ads-and-frame {	
  float:left;
	width: 950px;
	margin: 10px 0 10px 0;
}

/* ADS */
#ads {
	width: 150px;
	margin-right: 40px;
  float: left;
  font-size: 1.1em;
	color:#BBBBBB;
}

#ads h1 {
  color: #666666;
	margin-bottom: 0.1em;
	text-align: right;	
  font-size: 1.1em;	
}

#ads img {
	margin-left: 5px;	
}

.ad {
	margin-bottom: 5px;
}

#ads h2 {
  color: #666666;
	margin: 0;
	text-align: right;	
  font-size: 1.2em;	
}

#ads p {
	text-align: right;	
}

#ads a {
	color:#8f2b85;
	text-decoration:none;
}

/* FRAME */
#frame-elt {
	width: 760px;
  float: left;
}

#cecomatic {
	margin: 0 100px;
}

#cec-frame {
	width: 760px;
  float: left;	
	background: #DDDDDD;
  text-align: center;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

#cec-frame a {
	text-decoration:none;
	color: #FFFFFF;
}

#cec-frame p {
  font-size: 1.3em;
}

#cec-frame span {
  /*text-transform:uppercase;*/
	text-decoration:underline;  
}

#cec-frame-div {
	float:left;
	width: 20px;
	height: 25px;
	border: 2px solid #666666;
	color: #8f2b85;
	background: #EEEEEE;	
  font-size: 1.2em;
  font-weight: bold;	
  margin: 0 0 5px 40px;	
  padding: 0;
  text-align: center;
}

#cec-frame-input {
	float:left;
	width: 510px;
	height: 25px;
	border: 2px solid #8f2b85;
	color: #8f2b85;
  font-size: 1.2em;
  font-weight: bold;	
  text-transform:uppercase;
  padding: 0 0 0 10px;
  margin: 0 0 5px 5px;
}
/*
#cec-frame-div {
	float:left;
	width: 15px;
	height: 25px;
	border: 2px solid #666666;
	color: #8f2b85;
	background: #EEEEEE;	
  font-size: 1.2em;
  font-weight: bold;	
  margin: 0 0 5px 100px;	
  padding: 0;
  text-align: center;
}

#cec-frame-input {
	float:left;
	width: 510px;
	height: 25px;
	border: 2px solid #8f2b85;
	color: #8f2b85;
  font-size: 1.2em;
  font-weight: bold;	
  text-transform:uppercase;
  padding: 0 0 0 10px;
  margin: 0 0 5px 5px;
}
*/

/*
#cec-frame input {
	float:left;
	width: 550px;
	height: 25px;
	border: 2px solid #8f2b85;
	color: #8f2b85;
  font-size: 1.2em;
  font-weight: bold;	
  text-transform:uppercase;
  padding: 0 0 0 10px;
  margin: 0 0 5px 100px;
}
*/

#decode-button {
	float:right;
	/*margin: 17px 20px 0 0;*/
  margin: 0px 30px 0 0;
}

/*
#help {
	clear:left;
	float: left;
	margin: 0 10px 0 30px;
}
*/


#help-button {
	float:left;
	margin: 0 0 0 30px;
}


#frame-info {
	margin : 0 10px 10px 100px;
	clear:both;
	width: 550px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	color: #FFFFFF;		
}

/* LOWER PART -> CEC MESSAGE*/
#messages {
  float:left;
	margin: 10px 0 10px 0;	
  width: 936px;
	padding: 5px;
	border:2px solid #8f2b85;
	-moz-border-radius: 10px;
	border-radius: 10px;	
}

#source {
	float: left;
	width: 460px;
	margin: 0 15px 15px 0;
}

#destination {
	float: left;
	width: 460px;
	margin: 0 0 15px 0;	
}

/* features */
#features {
	clear:both;
}

#fcomment {
	float: right;
	margin: 5px 30px 0 0;
	color: #FFFFFF;
}

#encode-button {
	float:right;
	/*margin: 10px 23px 0 0;*/
}

.feature-descr {
	margin-bottom: 10px;
  font-style:italic;	
}

.msg-list {
  float:left;	
	clear:left;
	margin-bottom: 15px;
}

/* message details */

.msg-details {
  display:none;	
	float:left;
	clear: left;	
	margin-left: 30px;
	width: 800px;
}


.msg-descr {
	float:left;
	width: 800px;	
	margin-bottom: 5px;
}

.params {
	float:left;
	clear:left;
	width: 800px;	
}

.params label {
	font-weight: bold;
	float: left;
	margin-left: 5px;
  width: 200px;
}

.composed label{
	margin-left: 0px;
  width: 700px;	
}

.params input, .params select {
  margin:0;
  width:400px;
}
/*
.params input{
  border:2px solid #F0F0F0;
}
*/

.params ul {
  list-style-type:none;
  margin: 10px;
}

.params li {
	margin-bottom: 5px;	
}

.msg-titles {
	font-weight: bold;
	margin-bottom: 5px;	
}

/* info */
.info h2 {
  text-align: left;
  margin: 10px 0 0 0;
}

.info ul li {
  list-style:circle;
  margin-left: 10px;
}

.info ul li ul li{
  list-style:disc;
  margin-left: 30px;
}

/* HDMI & Contact*/
#hdmi {
	margin-top: 10px;
	color:#CCCCCC;
	text-align: center;		
	font-size: 1.2em;
}

#hdmi a {
	color:#CCCCCC;
	text-decoration:none;
}

#contact {
	margin-top: 10px;
	color:#CCCCCC;
	text-align: center;		
	font-size: 1.2em;
}

#contact a {
	color:#8f2b85;
	text-decoration:none;
}


/* SELECT */
#feedback { font-size: 1em; }
#sourceList .ui-selecting,
#destList .ui-selecting { background: #8f2b85; }
#sourceList .ui-selected,
#destList .ui-selected { background: #8f2b85; color: white; }
#sourceList, #destList { list-style-type: none; margin: 0; padding: 0; }
#sourceList li, #destList li { margin: 1px; padding: 1px; float: left; width: 108px; height: 16px; font-size: 1em; text-align: center; -moz-border-radius: 5px; border-radius: 5px;}

.m .ui-selecting { background: #8f2b85; }
.m .ui-selected { background: #8f2b85; color: white; }
.m { list-style-type: none; margin: 0; padding: 0;}
.m li { margin: 3px; padding: 1px; float: left; width: 155px; height: 20px; font-size: 1em; text-align: center; }

/*
#featureList .ui-selecting { background: #8f2b85; }
#featureList .ui-selected { background: #8f2b85; color: white; }
#featureList { list-style-type: none; margin: 0; padding: 0;}
#featureList li { margin: 2px; padding: 1px 5px; float: left; width: 80px; height: 38px; font-size: 1em; text-align: center; -moz-border-radius: 5px; border-radius: 5px;}

#messageList .ui-selecting { background: #8f2b85; }
#messageList .ui-selected { background: #8f2b85; color: white; }
#messageList { list-style-type: none; margin: 0; padding: 0; }
#messageList li { margin: 3px; padding: 1px; float: left; width: 180px; height: 20px; font-size: 1em; text-align: center;  -moz-border-radius: 5px; border-radius: 5px;}
*/