/*
	960 Grid System ~ Text CSS.
	Learn more ~ http://960.gs/

	Licensed under GPL and MIT.
*/

/* `Basic HTML
----------------------------------------------------------------------------------------------------*/

.sliderGallery {
            overflow: hidden;
            position: relative;
            padding: 10px;
            height: 200px;
            width: 890px;
            margin-left: 15px;
        }
        
        .sliderGallery UL {
            position: absolute;
            list-style: none;
            overflow: none;
            white-space: nowrap;
            padding: 0;
            left: 15px;
        }
        
        .sliderGallery UL LI {
            display: inline;
        }
        
        .slider {
            width: 910px;
            height: 14px;
            margin-top: 180px;
            margin-left: -10px;
            padding: 1px;
            position: relative;
            background: url(../image/productbrowser_scrollbar_20070622.png) no-repeat;
        }
        
        .handle {
            position: absolute;
            cursor: move;
            height: 14px;
            width: 181px;
            top: 0;
            background: url(../image/productbrowser_scroller_20080115.png) no-repeat;
            z-index: 100;
        }
        
        .slider span {
            color: #bbb;
            font-size: 80%;
            cursor: pointer;
            position: absolute;
            z-index: 110;
            top: 3px;
        }
        
        .slider .slider-lbl1 {
            left: 50px;
        }
        
        .slider .slider-lbl2 {
            left: 107px;
        }
        
        .slider .slider-lbl3 {
            left: 156px;
        }

        .slider .slider-lbl4 {
            left: 280px;
        }

        .slider .slider-lbl5 {
            left: 455px;
        }



#banner {
  background:url(../image/bg_banner.png) no-repeat center;
	width: 940px;
	height: 300px;
	margin-top: 10px;
}

#banner #navigation_dots {
  position: absolute;
	margin: -30px 0 0 -250px;
  width: 100%;
  z-index: 9999;
}

#banner #navigation_dots #dots {
  width: 60px;
  margin: 0 auto;
}

#banner #navigation_dots #dots a {
  display: block;
  float: left;
  background: url(../image/banner_dot.png) 0 0 no-repeat;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  text-indent: -9999px;
}

#banner #navigation_dots #dots a.selected {
  background-position: 0 -10px;
}

#banner #slideshow {
  margin: 0 0 0 0;
}

#banner #slideshow a img {
  width: 924px;
  height: 286px;
}

#banner #corners span {
  position: absolute;
  z-index: 9998;
  display: block;
  background-image: url(../image/banner_corners.png);
  background-repeat: none;
  width: 10px;
  height: 10px;
}

#banner #corners .top_left {
  top: 0;
  left: 0;
  background-position: top left;
}

#banner #corners .top_right {
  top: 0;
  right: 0;
  background-position: top right;
}

#banner #corners .bottom_right {
  bottom: 0;
  right: 0;
  background-position: bottom right;
}

#banner #corners .bottom_left {
  bottom: 0;
  left: 0;
  background-position: bottom left;
}

#banner .container_16 {
  position: relative;
}

.home #banner {
  overflow: hidden;
  position: relative;
  background: #426e64;
  width: 940px;
  height: 300px;
  border: 0;
}
#banner h2 {
  color: #304812;
  font-size: 30px;
}

#banner p {
  color: #304812;
}

#banner label {
  display: block;
  margin-bottom: 10px;
  font-weight: bold;
  color: #304812;
}

#banner input {
  background: #e2f1cf;
  width: 208px;
  border: 1px solid #649636;
}

#banner input:focus {
  background: #fff;
  border: 1px solid #649636;
}

#banner .buttons {
  margin-top: 10px;
  margin-bottom: 40px;
}

#banner .buttons button:hover, #banner .buttons a.button:hover, #banner .buttons a.button:active {
  border: 1px solid #304812;
}

.screencast #banner .buttons {
  clear: both;
  margin-bottom: 20px;
}
#list_testi {
	list-style: none;
}

#list_testi li a img {
	margin-bottom: 10px;
	padding: 5px;
	background-color: #e4e4e4;
	border: 1px solid #d1d1d1;
}

a.more {
    background: transparent url("../image/more_a.png") no-repeat scroll top right;
    color: #444;
    display: block;
    float: left;
    height: 30px;
    margin-right: 6px;
    padding-right: 18px;
	text-decoration: none;
}

a.more:hover {
	text-decoration: none;
	color: #444444;
}

a.more span {
    background: transparent url("../image/more_span.png") no-repeat;
    display: block;
    color: #888888;
    line-height: 14px;
    padding: 8px 0 8px 18px;
	font-weight: normal;
	font-style: normal;
} 

a.more:active {
    background-position: bottom right;
    color: #000;
    outline: none; /* hide dotted outline in Firefox */
}

a.more:active span {
    background-position: bottom left;
    padding: 8px 0 8px 18px; /* push text down 1px */
} 



a.button {
    background: transparent url("../image/bg_button_a.png") no-repeat scroll top right;
    color: #444;
    display: block;
    float: left;
    height: 30px;
    margin-right: 6px;
    padding-right: 18px;
	text-decoration: none;
}

a.button:hover {
	text-decoration: none;
	color: #444444;
}

a.button span {
    background: transparent url("../image/bg_button_span.png") no-repeat;
    display: block;
    color: #888888;
    line-height: 14px;
    padding: 8px 0 8px 18px;
	font-weight: normal;
	font-style: normal;
} 

a.button:active {
    background-position: bottom right;
    color: #000;
    outline: none; /* hide dotted outline in Firefox */
}

a.button:active span {
    background-position: bottom left;
    padding: 8px 0 8px 18px; /* push text down 1px */
} 


.pre_header {
	color: #444444;
	margin: 0px 0 15px 0;
	padding:15px 0 0px 0px;
	border-bottom: 1px solid #e2e2e2;
	line-height: 1.3em;
	text-transform: none;
}

.pre_header h1 {
	border: none;
	padding: 0;
	margin: 0;
}

.pre_header p {
	color: #a4a4a4;
	padding: 5px 0 0 0;
	font-size: 110%;
	line-height: 1.4em;
}


#boxes {
  background: #fff url("../image/bg_boxes.png") bottom center repeat-x;
  width: 938px;
  margin: 20px auto;
  border: 1px solid #d4d4d4;
}

#boxes { /* Safari */
  -webkit-border-radius: 10px;
}

#boxes, x:-moz-any-link, x:default { /* Firefox 3 */
  -moz-border-radius: 10px;
}

#boxes ul {
  overflow: hidden;
}

#boxes ul li {
  background-position: bottom center;
  background-repeat: no-repeat;
  height: 148px;
  margin: 0;
	text-align: center;
}

#boxes ul li.grid_5 {
  width: 289px;
}

#boxes ul li.grid_6 {
  width: 358px;
  border-right: 1px solid #d4d4d4;
  border-left: 1px solid #d4d4d4;
}

#boxes ul li#box_case_study {
  background-image: url(../image/bg_box_case_study.png);
}

#boxes ul li#box_trial {
  background-image: url("../image/bg_box_trial.png");
}

#boxes ul li#box_product_demo {
  background-image: url("../image/bg_box_product_demo.png");
}

#boxes ul li a {
  display: block;
  height: 150px;
  padding-top: 10px;
  font-weight: normal;
}

#boxes ul li a:hover {
  background: none;
}

#boxes ul li  h2 {
  margin: 0;
  line-height: 20px;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0;
  color: #444;
  border: none;
  padding: 10px 5px 5px 5px;
}

#boxes ul li  p {
  font-size: 13px;
  letter-spacing: 0;
  color: #666;
  padding: 0px 5px 5px 5px;
}




#boxes_index {
  background: #fff;
  width: 938px;
  margin: 20px auto;
  border: 1px solid #d4d4d4;
}

#boxes_index h2 {
	padding-left: 15px;
}

#boxes_index { /* Safari */
  -webkit-border-radius: 10px;
}

#boxes_index, x:-moz-any-link, x:default { /* Firefox 3 */
  -moz-border-radius: 10px;
}

#boxes_index ul {
  overflow: hidden;
}

#boxes_index ul li {
  background-position: bottom center;
  background-repeat: no-repeat;
  height: 148px;
  margin: 0;
	text-align: center;
}

#boxes_index ul li.grid_5 {
  width: 289px;
}

#boxes_index ul li.grid_6 {
  width: 358px;
  border-right: 1px solid #d4d4d4;
  border-left: 1px solid #d4d4d4;
}

#boxes_index ul li#box_case_study {
  background-image: url(../image/bg_box_case_study.png);
}

#boxes_index ul li#box_trial {
  background-image: url("../image/bg_box_trial.png");
}

#boxes_index ul li#box_product_demo {
  background-image: url("../image/bg_box_product_demo.png");
}

#boxes_index ul li a {
  display: block;
  height: 150px;
  padding-top: 10px;
  font-weight: normal;
}

#boxes_index ul li a:hover {
  background: none;
}

#boxes_index ul li  h2 {
  margin: 0;
  line-height: 20px;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0;
  color: #444;
  border: none;
  padding: 10px 5px 5px 5px;
}

#boxes_index ul li  p {
  font-size: 13px;
  letter-spacing: 0;
  color: #666;
  padding: 0px 5px 5px 5px;
}

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }



#slider {
	width: 470px;
	/*

important to be same as image width */
    height: 286px;
	

/* important to be same as image height */
    position: relative;
	

/* important */
	overflow: hidden;


/* important */
	margin: 15px 0 0 0px;
}

#sliderContent {
	width: 470px;
	/*

important to be same as image width or wider */
    position: absolute;
	top: 0;
	margin-left: 0;
}

.sliderImage {
	float: left;
	position: relative;
	display: none;
}

.nav ul li {
	display: block;
	float: left;
	list-style: none;
	margin: 0 0 0 0px;
}

span {
	color:#75a6f8;
	font-weight: bold;
}

a:link,a:visited {
	color: #216195;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}


#nav ul li {
	display: block;
	float: left;
	list-style: none;
	margin: 0 0 0 0px;
}

#nav ul li a {
	padding-top: 15px;
}


.list1 {
	list-style-image: url(../image/arrow.gif);
	margin-left: 20px;
	font-weight: bold;
}

.list1 li {
	padding: 10px 5px 10px 5px;
	margin-bottom: 10px;
	border-bottom: 1px solid #b6b6b6;
}

.nav ul a:hover {
	background-position: 0px -68px;
}

.bg_h_index a {
	display: block;
	height: 53px;
	width: 110px;
	border-left:1px solid #999;
	border-right:1px solid #999;
	text-align: center;
	background: transparent url(../image/bg_h.png) repeat-x;
	text-decoration: none;
}

.bg_h_index a:hover {
	background-position: 0px -68px;
}

.bg_h a {
	display: block;
	height: 53px;
	width: 110px;
	border-right:1px solid #999;
	text-align: center;
	background: transparent url(../image/bg_h.png) repeat-x;
}

.bg_h a:hover {
	background-position: 0px -68px;
}


.logo a {
	display: block;
	width: 390px;
	height: 68px;
	background: transparent url(../image/logo.png) no-repeat;
	text-indent: -99999px;
}

.logo2 a {
	display: block;
	width: 244px;
	height: 68px;
	background: transparent url(../image/logo2.png) no-repeat;
}

.logo a:hover {
	background-position: 0px -68px;
}

.tips a {
	display: block;
	width: 111px;
	height: 68px;
	background: transparent url(../image/nav_tips.png) no-repeat;
}

.bonus a {
	display: block;
	width: 111px;
	height: 68px;
	background: transparent url(../image/nav_bonus.png) no-repeat;
}

.testi a {
	display: block;
	width: 111px;
	height: 68px;
	background: transparent url(../image/nav_testi.png) no-repeat;
}

.order a {
	display: block;
	width: 111px;
	height: 68px;
	background: transparent url(../image/nav_order.png) no-repeat;
}

.afiliasi a {
	display: block;
	width: 111px;
	height: 68px;
	background: transparent url(../image/nav_afiliasi.png) no-repeat;
}

.download a {
	display: block;
	width: 111px;
	height: 68px;
	background: transparent url(../image/download.png) no-repeat;
}

.setting a {
	display: block;
	width: 111px;
	height: 68px;
	background: transparent url(../image/profile.png) no-repeat;
}

.afiliasi2 a {
	display: block;
	width: 111px;
	height: 68px;
	background: transparent url(../image/afiliasi2.png) no-repeat;
}

.afiliasi3 a {
	display: block;
	width: 111px;
	height: 68px;
	background: transparent url(../image/afiliasi3.png) no-repeat;
}

.email a {
	display: block;
	width: 111px;
	height: 68px;
	background: transparent url(../image/email.png) no-repeat;
}

.logout a {
	display: block;
	width: 111px;
	height: 68px;
	background: transparent url(../image/logout.png) no-repeat;
}

.box {
	padding: 10px;
	border: 1px solid #CFDDEC;
	margin: 40px 0 0 40px;
}

body {
	font: 14px/2 "Lucida Grande", Lucida, Verdana, sans-serif;
	color: #666;
}

a:focus {
	outline: 1px dotted invert;
}

b {
	color: #444444;
}


.pullquote {
	background: url(../image/q-open.gif) no-repeat bottom right !important;
	background /**/:url(); /* removing quote graphic in IE5+ */
	padding:5px 25px 15px 0px;
	line-height: 1.3em;
	border-bottom: 1px solid #ff6600;
	border-top: 1px solid #ff6600;
	margin-bottom: 15px;
	font-style: italic;
	font-size: 130%;
}


.pullquote:first-letter {
	background: url(../image/q-close.gif) no-repeat left top !important;
	padding:5px 2px 10px 35px!important;
	padding /**/:0px; 	/* resetting padding in IE5+ */
	background /**/: url(); /* removing quote graphic in IE5+ */
}

.pullquote1 {
	background: url(../image/q-open.gif) no-repeat bottom right !important;
	background /**/:url(); /* removing quote graphic in IE5+ */
	padding:5px 25px 5px 0px;
	font-size: 110%;
	font-style: italic;
}

.pullquote1:first-letter {
	background: url(../image/q-close.gif) no-repeat left top !important;
	padding:5px 2px 10px 35px!important;
	padding /**/:0px; 	/* resetting padding in IE5+ */
	background /**/: url(); /* removing quote graphic in IE5+ */
}

.ruler {
	width: 100%;
	background: url(../image/ruler.png) repeat-x;
	height: 13px;
	margin: 0px 0 20px 0;
}

hr {
	border: 0 #ccc solid;
	border-top-width: 1px;
	clear: both;
	height: 0;
}

.header {
	min-height: 430px;
	background: url(../image/bg_header.png) repeat-x;
}

.teaser ul {
	list-style-type: disc;
	margin-left: 15px;
}

.teaser {
	color: #fff;
}

.header h1 {
	height: 68px;
	margin-bottom: 10px;
	color: #fff;
	padding: 0;
	border-bottom: 1px solid #fff;
}

.pos_img {
	padding: 10px 0 10px 0;
	border-bottom: 2px solid #0c3569;
	margin-bottom: 10px;
}

.place_img {
float: left;
padding: 5px;
margin: 0 10px 0 0;
	background-color: #dfdfdf;
}

.pos_img h1 {
	background-color: transparent;
	border: none;
	color: #0c3569;
}

.pos_kontak {
	padding: 10px 0 10px 0;
}

.list {
	list-style: none;
}

.list li {
	border: 1px solid #333333;
}

.bonus_c {
	margin: 10px 0 0px 0;
	padding: 10px;
	background-color: #f7f7f7;
	border: 1px solid #e5e5e5;
}

.bonus_c img {
	margin: 5px 10px 10px 5px;
	float: left;
	border: 1px solid #cfddec;
}

/* `Headings
----------------------------------------------------------------------------------------------------*/

.spacer {
	border-bottom: 2px solid #333333;
	margin: 15px 0 15px 0;
}

.spacer1 {
	border-bottom: 1px solid #eaeaea;
	margin: 15px 0 15px 0;
}

h1,h2,h3,h4,h5,h6 {
	color: #444444;
	margin: 0px 0 15px 0;
	padding:15px 0 15px 0px;
	border-bottom: 1px solid #e2e2e2;
	line-height: 1.3em;
	text-transform: uppercase;
}

h1 b {
	color:#ff6600;
	text-decoration: underline;
}

.image_pos {
	border: 1px solid #909090;
	padding: 3px;
}

.header_content {
	color: #626262;
	padding: 0 0 10px 0;
	margin: 5px 0 15px 0;
}

.header_content h1 {
	border: none;
	padding: 0;
	margin: 0;
	color: #0c3569;
	background-color:transparent;
}

.header_content p {
	padding: 10px 0 10px 0;
	text-align: justify;
}


.sidebar li a img {
	border: 1px solid #333333;
}

h1 {
	font-size: 150%;
}

h2 {
	font-size: 120%;
}

h3 {
	font-size: 110%;
}

h4 {
	font-size: 100%;
}

h5 {
	font-size: 80%;
}

h6 {
	font-size: 60%;
}

/* `Spacing
----------------------------------------------------------------------------------------------------*/

ol {
	list-style: decimal;
}

ul {
	list-style: square;
}

p,
dl,
hr,
ol,
pre,
table,
address,
fieldset {
	margin-bottom: 20px;
}

#NewsTicker {
	border: solid 1px #fff;
	background: #cbcbcb;
	width: 100%;
	height: 340px;
	margin: 0 auto;
}

#NewsTicker h1 {
	padding: 6px;
	margin: 0;
	border: 0;
	background: #ff6600;
	color: #000000;
	font-weight: bold;
}

#NewsVertical {
	width: 98%;
	height: 300px;
	display: block;
	overflow: hidden;
	position: relative;
}

#controller {
	padding: 6px;
	color: #666;
}

#play_scroll_cont {
	display: none;
}

/* --------------- */

/* Ticker Vertical */

#TickerVertical {
	width: 100%;
	height: 330px;
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}

#TickerVertical li {
	display: block;
	width: 288px;
	color: #333333;
	text-align: left;
	font-size: 11px;
	margin: 0;
	padding: 6px;
	float: left;
}

#TickerVertical li .NewsTitle {
	display: block;
	color: #000000;
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 6px;
}

#TickerVertical li .NewsTitle a:link,
		#TickerVertical li .NewsTitle a:Visited {
	display: block;
	color: #000000;
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 6px;
	text-decoration: none;
}

#TickerVertical li .NewsTitle a:hover {
	text-decoration: underline;
}

#TickerVertical li .NewsImg {
	float: left;
	margin-right: 10px;
}

#TickerVertical li .NewsFooter {
	display: block;
	color: #000000;
	font-size: 10px;
	margin: 6px 0 14px 0;
}

#box-table-a {
	width: 100%;
	text-align: left;
	border-collapse: collapse;
}

#box-table-a th {
	font-size: 16px;
	font-weight: normal;
	padding: 8px;
	background: #e8e8e8;
	border-top: 4px solid #333333;
	border-bottom: 1px solid #fff;
	color: #333333;
}

#box-table-a td {
	padding: 8px;
	background: #e8e8e8;
	border-bottom: 1px solid #fff;
	color: #333333;
	border-top: 1px solid transparent;
}

#box-table-a tr:hover td {
	background: #dfdfdf;
	color: #333333;
}

.penting{display:block}
.penting *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#1c4383}
.penting1{
  margin-left:3px;
  margin-right:3px;
  padding-left:1px;
  padding-right:1px;
  border-left:1px solid #96a7c2;
  border-right:1px solid #96a7c2;
  background:#516f9f}
.penting2{
  margin-left:1px;
  margin-right:1px;
  padding-right:1px;
  padding-left:1px;
  border-left:1px solid #dde1e7;
  border-right:1px solid #dde1e7;
  background:#446498}
.penting3{
  margin-left:1px;
  margin-right:1px;
  border-left:1px solid #446498;
  border-right:1px solid #446498;}
.penting4{
  border-left:1px solid #96a7c2;
  border-right:1px solid #96a7c2}
.penting5{
  border-left:1px solid #516f9f;
  border-right:1px solid #516f9f}
.pentingfg{
  background:#1c4383;
  color: #fff;
  padding: 10px;
  }
.pentingfg b{
  color: #75a6f8;
  }
  
.pentingfg h3 {
	color: #fff;
}
.pentingfgf{
  background:#1c4383;
  color: #fff;
  padding: 10px;
  }
.pentingfgf b{
  color: #75a6f8;
  }

form * {margin:0;padding:0;} /* Standard margin and padding reset, normally done on the body */

legend {
	font-weight: bold;
}

.text {
	background-color: #ececec;
	color: #0C3569;
	width:250px ;
	padding: 5px;
	font-size: 120%;
	border: 1px solid #e0e0e0;
}

.text:hover {
	border: 1px solid #444444;
	background-color: #d2d2d2;
}

.text1:hover {
	border: 1px solid #444444;
	background-color: #d2d2d2;
}

.text_up {
	background-color: #ececec;
	color: #0C3569;
	width:250px ;
	height:30px;
	padding: 5px;
	font-size: 120%;
	border: 1px solid #e0e0e0;
}

.text1 {
	background-color: #ececec;
	color: #0C3569;
	width:500px ;
	height:150px;
	padding: 5px;
	font-size: 120%;
	border: 1px solid #e0e0e0;
}

fieldset {
	padding: 15px;
	border:1px solid #dedede;
	background-color: #fff;
	 /* Default fieldset borders vary cross browser, so make them the same */
}
fieldset div {
	overflow:hidden; /* Contain the floating elements */
	display:inline-block; /* Give layout in ie to contain float */
}
fieldset div {display:block;} /* Reset element back to block leaving layout in ie */
label {
	float:left; /* Take out of flow so the input starts at the same height */
	width:5em; /* Set a width so the inputs line up */
}

.radio {
	position:relative; /* Position so children are relative to this container */
	border:0; /* Remove the border */
}
.radio span {
	position:absolute; /* Take the content of the legend out of flow */
	top:0;left:0; /* and position it to the top left of the fieldset */
	width:5em; /* Same width as labels */
}
.radio ul {
	margin-left:5em; /* Since the legend is out of flow. set margin, so inputs are inline */
	list-style:none; /* Dont want bullets */
}
.radio li {
	position:relative; /* Fix a bug in IE zoom functionality */
	display:inline; /* Display the inputs in a line */
	white-space:nowrap; /* We dont want a label to wrap between the input and label */
}
.radio label, .radio input {
	width:auto; /* Reset the width on the label from the 5em, set earlier */
	float:none; /* Reset the float from left on the label, set earlier */
	vertical-align:middle; /* Align the radio buttons with the inputs */
}