/* A simple Browser Reset */

*
{
    padding: 0;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
}
img
{
    border: 0;
}

/* General Layout
________________________________*/

body
{
    /*canh giữa cho layout*/
    margin: 0 auto;
    font-family: Times New Roman;
    font-size: 1.2em;
    background-image: url('images/bg-body.gif');
    background-repeat: repeat;
    width: 913px; /*SET WIDTH CHO TOÀN BỘ BODY*/
}
#header
{
    clear: both;
    position: relative;
    z-index: 2; /*không đổi*/
    /*margin-bottom: 5px;*/
    /*height: 285px;*/
}
#page
{
    /*div lớn của toàn bộ layout*/
    min-height: 100%;
    position: absolute;
    width: 913px; /*SET WIDTH CHO LAYOUT, = WIDTH BODY*/
    /*background-color: Red;*/
    background-image: url('images/bg-body-opacity.gif');
    background-repeat: repeat;
}
#footer
{
    position: absolute;
    bottom: 0;
    z-index: 2;
    width: 100%;
    clear: both; /*không đổi*/
    height: 100px;
    text-align: center;
    display: block;
    background-image: url('images/bg-footer.gif');
    background-repeat: repeat-x;
}
/* We have to set the z-index of the real content to 2 to bring it back on top of the columns. As the actual 
content is not positionned absolutelly, the footer still behave normally and is pushed down by it. */

#content
{
    /*center, do not change anything*/
    float: left;
    width: 100%;
    margin-right: -100%;
    position: relative;
    z-index: 2;
}
.column
{
    float: left;
    padding: 0 0 120px; /*SET PADDING BOTTOM = HEIGHT FOOTER + PADDING MONG MUỐN*/
}
/* -- compensating the padding on sidebars -- multiply the padding of columns by 2, and remove
it from the width of each sidebar. */

#left
{
    position: relative;
    z-index: 2;
    width: 205px; /*SET WIDTH CỦA LEFT = WIDTH(.LEFT) - [PADDING + MARGIN + (BORDER WIDTH x 2)] nếu có */
    margin: 0;
}
#right
{
    position: relative;
    z-index: 2;
    width: 703px; /* SET WIDTH CỦA RIGHT = WIDTH(.RIGHT) - [PADDING + MARGIN + (BORDER WIDTH x 2)] nếu có */
}

/* You can easily change the layout proportions by just changing the matching values. For example,
to have a 100px left sidebar, I just have to change all the 220 to 100 (and the -220 to -100).*/

#content-inner
{
    /* dành cho 3 cột */
    float: none;
    min-height: 100%;
    margin-left: 210px; /* SET LEFT Sidebar width, = WIDTH TRONG .LEFT + MARGIN (nếu có) 190 +5 */
    margin-right: 235px; /* SET RIGHT Sidebar width, = WIDTH TRONG .RIGHT + MARGIN (nếu có) 220 + 5 */ /*  	border:1px orange solid;*/
    padding-left: 5px;
    padding-right: 5px;
}
#content-inner1 /* dành cho 2 cột */
{
    float: none;
    min-height: 100%;
    margin-left: 210px; /* SET LEFT Sidebar width, = WIDTH TRONG .LEFT + MARGIN (nếu có) 190 +5 */
    margin-right: 0; /* SET RIGHT Sidebar width, = WIDTH TRONG .RIGHT + MARGIN (nếu có) 220 + 5 */ /*  	border:1px orange solid;     padding-left:5px;     padding-right:5px;*/
}
.left
{
    width: 205px; /* LEFT Sidebar width, CỘNG CẢ PADDING, MARGIN VÀ BORDER CỦA LEFT COL */
    margin-right: -205px; /* LEFT Sidebar width, = WIDTH .LEFT */
    font-family: Arial;
    font-size: 0.7em;
    color: White;
    font-weight: bold;
}
.right
{
    float: right;
    width: 220px; /* RIGHT Sidebar width, CỘNG CẢ PADDING, MARGIN VÀ BORDER CỦA RIGHT COL */
}

/* Equal Height Columns 
________________________________*/

/* The columns are created using empty DIV that have to be inside the main wrapper (#page) and should be 
positionned relative. Each DIV have the same width as its corresponding columns (done by using class), and by 
postionning them absolutelly (bottom) and giving them a height of 100%, the DIVs fill the entire space that the 
columns should fill.*/

.bg
{
    /*do not change anything*/
    position: absolute;
    bottom: 0;
    height: 100%;
}
#bgleft
{
    left: 0; /*SET BG COLOR CHO LEFT COLUMN*/
}
#bgright
{
    right: 0; /*SET BG COLOR CHO RIGHT COLUMN*/
}
#bgcenter
{
    right: 0;
    width: 100%; /*    background-color:#969; SET BG COLOR CHO CENTER*/
}
/*-----------menu--------------*/
.menu-top
{
	padding-left:50px;
	height:30px;
	margin-top:0;
	background-color:#4179f1;
}
.menu-top ul
{
	display:block;
	list-style:none;
}
.menu-top li
{
	display:inline-block;
	*display:inline;
	zoom:1;
	list-style-type:none;
	padding-top:5px;
}
.menu-top li a
{
    color:White;
	text-transform:uppercase;
	text-decoration:none;
	font-family:Times New Roman;
	font-size:14px;
    font-weight:bold;
	padding:5px 26px 5px 12px;
}
.menu-top li a:hover
{
	text-decoration:none;
	color:Red;
}
/***************************************
.top-menu ul{
	margin:0;
	padding:0;
	list-style:none;
	float:left;
	
	height:32px;
	background-repeat:repeat-x;
}
.top-menu li{
	padding:0;	
	margin:0;
	display:inline;
	display:-moz-inline-stack;
    display:inline-block;
    zoom:1;
    *display:inline;   
     
    font-size:14px;
    font-weight:bold;	
    text-align:center;
}

/**************************contact & about us***************************/
.contact-tbox
{
    width: 250px;
    margin-left: 10px;
}
.required
{
    background-color: #e3ecff;
}
.aboutus
{
    padding: 10px 20px 10px 20px;
    line-height: 1.6em;
    text-align: justify;
    margin-left: 5px;
    margin-top: 5px;
    color: #056389;
    font-size: 0.8em;
}


/**************************header-flash***************************/
.flash
{
    width:913px;
   height:200px;
    display: block;
}

/**************************footer***************************/
h4
{
    font-size: 0.8em;
    color: #056389;
    font-weight: bold;
}


/**************************menu***************************/
.menu
{
    width: 205px;
}

.menu ul
{
    width: 205px;
    margin-bottom: 5px;
}

.menu li
{
    background-image: url('images/bg-list-menu.gif');
    background-repeat: no-repeat;
    width: 205px;
    height: 27px;
    line-height: 27px;
    list-style: none;
    margin-bottom: 1px;
}

.menu li a
{
    font-size: 1em;
    color: White;
    font-weight: bold;
    text-decoration: none;
}

.menu li a:hover
{
    color: red;
}

.bullet-list
{
    width: 13px;
    height: 13px;
    display: block;
    margin-left: 20px;
    margin-right: 10px;
    float: left;
    margin-top: 7px;
}

/**************************search***************************/
.search
{
    background-image: url('images/bg-search.gif');
    background-repeat: no-repeat;
    width: 193px;
    height: 123px;
    margin-bottom: 5px;
    padding-top: 40px;
    padding-left: 12px;
}

.textbox
{
    width: 181px;
    height: 19px;
    line-height: 19px;
    background-image: url('images/textbox.gif');
    background-repeat: no-repeat;
    color: Black;
    font-weight: normal;
    margin-bottom: 9px;
    border: none;
    font-family: Times New Roman;
}

.textbox2
{
    width: 87px;
    height: 19px;
    margin-bottom: 9px;
    color: #056389;
    font-weight: bold;
    font-size: 0.75em;
    background-image: url('images/textbox.gif');
    background-repeat: no-repeat;
    border: none;
    text-align: center;
}

.button-search
{
    width: 55px;
    height: 19px;
    margin-left: 115px;
}

/**************************carlendar***************************/
.calendar
{
    margin-bottom: 5px;
}
.title-calendar
{
    background-image: url('images/bg-calendar.gif');
    background-repeat: no-repeat;
    width: 203px;
    height: 31px;
    line-height: 31px;
    border: 1px solid #37ced7;
    text-align: center;
    display: block;
}
.inner-calendar
{
     border: 1px solid #37ced7;
    background-color: #c4d6fb;
    color: #056389;
    padding-bottom:10px;
    padding-top:5px;
}


/**************************hours***************************/
.hours
{
    background-image: url('images/bg-calendar.gif');
    background-repeat: repeat;
    text-align: center;
    height: 31px;
    border: 1px solid #37ced7;
    margin-bottom: 5px;
    
}
.img-hours
{
    margin: 0 auto;
    display: block;
    width: 133px;
    height: 31px;
}
/**************************link-websites***************************/

.inner-link-websites
{
    border: 1px solid #37ced7;
    background-color: #c4d6fb;
    padding-top:5px;
    padding-bottom:10px;
}

.dropdownlist
{
    width: 160px;
    height: 22px;
    line-height: 22px;
    color: #056389;
    border: none;
    font-family: Times New Roman;
    margin: 0 auto;
    display: block;
    margin-bottom:5px;
    margin-top:5px;
}
/**************************main-content***************************/
.main-content
{
    width: 703px;
    margin-bottom: 5px;
    border: 1px solid #d5e3ff;
    border-top: none;
}

.main-content-left
{
    float: left;
    width: 498px;
    display: block;
}

.main-content-right
{
    float: left;
    width: 205px;
    display: block;
}

.content-left-title
{
    background-image: url('images/bg-content-left-title.gif');
    background-repeat: no-repeat;
    width: 498px;
    height: 40px;
    line-height: 40px;
    color: Red;
    font-size: 1em;
    font-weight: bold;
}

.content-right-title
{
    background-image: url('images/bg-content-right-title.gif');
    background-repeat: no-repeat;
    width: 205px;
    height: 45px;
    line-height: 45px;
    color: Red;
    font-size: 0.8em;
    font-weight: bold;
}


.content-left-title2
{
    background-image: url('images/bg-content-left-title.gif');
    background-repeat: no-repeat;
    width: 498px;/*498*/
    height: 40px;
    line-height: 40px;
    color: Red;
    font-size: 1em;
    font-weight: bold;
    float: left;
    display: block;
}

.content-right-title2
{
    background-image: url('images/bg-content-right-title.gif');
    background-repeat: no-repeat;
    width: 205px;/*205*/
    height: 45px;
    line-height: 45px;
    color: Red;
    font-size: 0.8em;
    font-weight: bold;
    float: left;
    display: block;
}


.bullet-list2
{
    width: 20px;
    height: 20px;
    display: block;
    margin-left: 20px;
    margin-right: 10px;
    float: left;
    margin-top: 8px;
}

.ember
{
    width: 16px;
    height: 16px;
    float: left;
    display: block;
    margin-top: 15px;
    margin-right: 5px;
    margin-left: 20px;
}




p
{
    font-size: 0.8em;
    line-height: 1.5em;
    color: #056389;
    font-weight: bold;
    margin-left: 180px;
    margin-right: 40px;
    margin-top: 10px;
    margin-bottom: 10px;
}

h1
{
    font-size: 0.8em;
    color: red;
    font-weight: bold;
    margin-left: 180px;
    margin-right: 40px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.main-content-right ul
{
    width: 205px;
    list-style: none;
    margin-top: 10px;
    font-weight: normal;
    font-size: 0.8em;
}

.main-content-right ul li
{
    line-height: 1.5em;
}

.main-content-right ul li a
{
    color: #056389;
    text-decoration: none;
}
.main-content-right ul li a:hover
{
    color: Red;
}

strong
{
    color: #a3a3a3;
    font-weight: normal;
}

.star
{
    width: 20px;
    height: 20px;
    float: left;
    margin-right: 5px;
    display: block;
}

#myspan
{
    color: #8d0000;
    float: right;
    margin-right: 40px;
    display: block;
    font-size: 0.7em;
    text-decoration: none;
    font-weight: bold;
    margin-bottom: 10px;
}

#myspan a
{
    color: #8d0000;
    float: right;
    margin-right: 40px;
    display: block;
    font-size: 0.8em;
    text-decoration: none;
    font-weight: bold;
    margin-bottom: 10px;
}

#myspan a:hover
{
    font-weight: normal;
    text-decoration: underline;
}


/**************************primary***************************/
/**************************gallery***************************/
.primary
{
    width: 703px;
    border: 1px solid #d5e3ff;
    border-top: none;
    padding-bottom: 20px;
}
.title-primary
{
    background-image: url('images/bg-title-primary.gif');
    background-repeat: no-repeat;
    width: 703px;
    height: 40px;
    line-height: 40px;
    color: Red;
    font-size: 1em;
    font-weight: bold;
}

.title-primary2
{
    width: 703px;
    height: 40px;
    line-height: 40px;
    color: Red;
    font-size: 1em;
    font-weight: bold;
}

.content-right-title2 ul
{
    width: 150px;
    float: left;
    display: inline;
    height: 20px;
    margin-top: 10px;
    margin-right:10px;
   
}

.content-right-title2 li
{
    list-style: none;
    float: right;
    line-height: 25px;
    width: 40px;
    
}

.content-right-title2 ul li a
{
    color: #00750e;
    font-size: 0.8em;
}

.content-right-title2 ul li a:hover
{
    text-decoration: none;
}

.icon-print
{
    width: 30px;
    height: 30px;
    display: block;
    float: left;
}

.icon_email
{
    width: 30px;
    height: 30px;
    display: block;
    float: left;
}
.inner-primary
{
}

.continue
{
    margin-left: 40px;
    margin-top: 100px;
}


.continue-title
{
    width: 500px;
    line-height: 45px;
    color: Red;
    font-size: 0.8em;
    font-weight: bold;
}

.continue ul
{
    width: 600px;
    list-style: none;
    font-weight: normal;
    font-size: 0.8em;
}

.continue ul li
{
    line-height: 1.5em;
}

.continue ul li a
{
    color: #056389;
    text-decoration: none;
}
.continue ul li a:hover
{
    color: Red;
}





h5
{
    color: Red;
    font-weight: bold;
    font-size: 1.2em;
}
.popupControl
{
    background-color: #AAD4FF;
    position: absolute;
    visibility: hidden;
    border-style: solid;
    border-color: Black;
    border-width: 2px;
}

.modalBackground
{
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
}

.modalPopup
{
    background-color: #EEEEEE;
    border-width: 3px;
    border-style: solid;
    border-color: Gray;
    font-family: Verdana;
    font-size: medium;
    padding: 3px;
}