﻿fbody
{
    /* background bitmap 바깥 부분 색상 */
    background-color: white;
}

.container {
    /* background bitmap의 위치 및 크기 */
    background: url("background.png");
    width: 800px;
    height: 563px;
}

.container_top {
	/* background bitmap의 위치 및 크기 */
	background: url("background_top.png");
	width: 800px;
	height: 91px;
}

.container_ext {
	/* background bitmap의 위치 및 크기 */
	background: url("background_ext.png");
	width: 800px;
	height: 125px;
}

.container_bottom {
	/* background bitmap의 위치 및 크기 */
	background: url("background_bottom.png");
	width: 800px;
	height: 347px;
}

/* 각 control 들의 위치 및 크기: 대부분 위치(left,top)만 수정하면 됨 */
#inputModel {
    position: absolute;
    left: 143px;
    top: 60px;
    width: 160px;
    height: 22px;
}

#inputVideoCodec {
    position: absolute;
    left: 320px;
    top: 60px;
    width: 160px;
    height: 22px;
}

#inputVideoFormat_D1 {
    position: absolute;
    left: 124px;
	top: 43px;
    width: 88px;
    height: 22px;
}

#inputVideoFormat_HD {
	position: absolute;
	left: 124px;
	top: 43px;
	width: 88px;
	height: 22px;
}

#inputVideoFormat_IP {
	position: absolute;
	left: 124px;
	top: 43px;
	width: 88px;
	height: 22px;
}

#inputNumCamera_D1 {
    position: absolute;
    left: 398px;
	top: 43px;
    width: 86px;
    height: 22px;
}

#inputNumCamera_HD {
	position: absolute;
	left: 398px;
	top: 43px;
	width: 86px;
	height: 22px;
}

#inputNumCamera_IP {
	position: absolute;
	left: 398px;
	top: 43px;
	width: 86px;
	height: 22px;
}

#inputNumAudio_D1 {
    position: absolute;
    left: 671px;
	top: 43px;
    width: 86px;
    height: 22px;
}

#inputNumAudio_HD {
	position: absolute;
	left: 671px;
	top: 43px;
	width: 86px;
	height: 22px;
}

#inputNumAudio_IP {
	position: absolute;
	left: 671px;
	top: 43px;
	width: 86px;
	height: 22px;
}

#inputVideoQuality_D1 {
    position: absolute;
    left: 124px;
	top: 75px;
    width: 88px;
    height: 22px;
}

#inputVideoQuality_HD {
	position: absolute;
	left: 124px;
	top: 75px;
	width: 88px;
	height: 22px;
}

#inputVideoQuality_IP {
	position: absolute;
	left: 124px;
	top: 75px;
	width: 88px;
	height: 22px;
}

#inputVideoResolution_D1 {
    position: absolute;
    left: 374px;
	top: 75px;
    width: 111px;
    height: 22px;
}

#inputVideoResolution_HD {
	position: absolute;
	left: 374px;
	top: 75px;
	width: 111px;
	height: 22px;
}

#inputVideoResolution_IP {
	position: absolute;
	left: 374px;
	top: 75px;
	width: 111px;
	height: 22px;
}

#inputFrameRate_D1 {
    position: absolute;
    left: 671px;
	top: 75px;
    width: 86px;
    height: 22px;
}

#inputFrameRate_HD {
	position: absolute;
	left: 671px;
	top: 75px;
	width: 86px;
	height: 22px;
}

#inputFrameRate_IP {
	position: absolute;
	left: 671px;
	top: 75px;
	width: 86px;
	height: 22px;
}

#allQuality {
    position: absolute;
    left: 40px;
	top: 16px;
}

#useCustomDays {
    position: absolute;
    left: 40px;
	top: 44px;
}

#customDays {
    position: absolute;
    left: 259px;
	top: 44px;
    width: 60px;
    height: 22px;
}

#selectCustomDayHour {
    position: absolute;
    left: 323px;
	top: 44px;
    width: 86px;
    height: 22px;
}

#useCustomSize {
    position: absolute;
    left: 40px;
	top: 71px;
}

#customSize {
    position: absolute;
    left: 259px;
	top: 71px;
    width: 60px;
    height: 22px;
}

#selectUnit {
    position: absolute;
    left: 621px;
	top: 44px;
    width: 86px;
    height: 22px;
}

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

/* 아래 출력 table의 위 아래 띠 부분 색상 */
#diskCapacityTable_header,
#diskCapacityTable_footer,
#recordDurationTable_header,
#recordDurationTable_footer,
#bandwidthTable_header,
#bandwidthTable_footer {
    background-color: #ddd;
}

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

/* 출력 영역의 시작 위치 */
.tabberlive {
    position: absolute;
    left: 4px;
	top: 124px;
}

/* tab control 영역 색상 */
/* border-color는 대부분 바꿀 필요가 없다. */

/* tab control의 body(table을 감싸고 있는 외곽) */
.tabberlive .tabbertab {
    background-color: #fff;
    border-color: #777;
}

/* tab buttons */
ul.tabbernav
{
    border-color: #777;
}

/* active tab button */
/* 현재 선택된 tab의 색상 */
ul.tabbernav li.tabberactive a,
ul.tabbernav li.tabberactive a:hover
{
    color: #2779AA;    /* 문자 색 */
    background-color: #fff; /* 바탕 색 */
    border-color: #777;
    border-bottom-color: #fff;
}

/* inactive tab buttons */
/* 선택되지 않은 tab의 색상 */
ul.tabbernav li a
{
    color: #FFF;    /* 문자 색 */
    background-color: #AED0EA; /* 바탕 색 */
    border-color: #777;
}

/* 선택되지 않았으나 mouse가 hover된 tab의 색상 */
ul.tabbernav li a:hover
{
    color: #2779AA;    /* 문자 색 */
    background: #AED0EA;   /* 바탕 색 */
}
