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

1) HTML tags

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



body {color:#404040; background: #fff url("../../../public/design/bg.gif") 0 0 repeat-x ; font:0.8em/1.5 "arial", sans-serif;}



a {color:#404040;}

a:hover {color:#000;}



h1, h2, h3, h4, h5, h6, p, address, blockquote, table, dl, fieldset {margin:15px 0;}

h1 {font-size: 20px; color: #049B00;}

h2 {font-size: 16px;}



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

2) HTML styles

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



ul.ul-01 {margin:15px 0; list-style:none;}

ul.ul-01 li {padding:2px 0 2px 25px; background:url("../../../public/design/ul-01.gif") 0 50% no-repeat; font-size:85%;}



ul.ul-list {margin:15px 0; list-style:none;}

ul.ul-list li {padding:1px 0;}

ul.ul-list span.date {padding-right:10px;}



.articles ul li {list-style:none; padding-left: 20px; height: 20px; background: url("../../../frog/plugins/file_manager/images/page_16.png") top left no-repeat;}

.articles ul li a.active {text-decoration: none; color: #006ED0;}

#sidebar .title {margin-top: 15px; margin-bottom: 10px; color: #009900; background: url("../../../public/design/cols3-title.gif") no-repeat scroll 0px 40% transparent; padding-left: 25px; font-size: 16px;}



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

3) Layout

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

	



	#content {width: 690px; float: left;}

	#content p {text-align: justify;}

	#sidebar {width: 210px; float: right; border-left: 1px solid #cccccc; margin-top: 15px; min-height: 400px; padding: 0 15px;}

	#main {width:960px; margin:0 auto; overflow:hidden;}

        #header {position:relative; height:90px; padding:30px 20px 15px 20px;}



        #logo {margin:0;}

    

        #nav {position:absolute; top:80px; right:20px; margin:0;}

        #nav span {margin:0 8px; color:#DDD;}

        #nav #nav-active {font-weight:bold; text-decoration:none; color:#090;}

    

    #tray {background-color:#BFBFBF; position:relative; width:960px; height:45px; background:url("../../../public/design/tray.gif") 0 0 no-repeat; overflow:hidden; font:bold 90%/1 "tahoma",sans-serif;}

    #tray ul {margin:0 20px; list-style:none;}

    #tray li {display:inline;}

    #tray li a {color:#404040; display:block; float:left; padding:17px 20px 17px 18px; background:url("../../../public/design/tray-separator.gif") 100% 0 no-repeat; text-decoration:none;}

    #tray li a:hover {background-color:#9F9F9F; color:#FFF; background:url("../../../public/design/tray-hover.gif");}

    #tray a#tray-active {background-color:#090; color:#FFF; background:url("../../../public/design/tray-active.gif");}



        #search {position:absolute; top:8px; right:20px;}

        #search div {position:relative; width:185px;}

        

        #search #search-input {background-color:#FFF; position:absolute; top:0; left:0; width:150px; height:30px; background:url("../../../public/design/search-input.gif") 0 0 no-repeat; overflow:hidden;}

        #search #search-input input {color:#404040; width:136px; margin:8px; border:0; font:100%/1 "arial",sans-serif;}

        #search #search-submit {position:absolute; top:0; right:0; width:30px;}



    #footer {clear:both; padding:10px 20px 40px 20px; font-size:85%; color:#9f9f9f;}

    #footer p {margin:0;}

    

    #footer a {color:#9f9f9f;}

    #footer a:hover {color:#404040;}



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

4-1) Page: Homepage

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



#col-top, #col-bottom, #col {background-color:#F5F5F5;}



#cols3 .col h2 {background-color:#EEF8E4; color:#090;}

#cols3 .col-more {background:#F5F5F5;}



#cols2 #col-left .title h4, #cols2 #col-right h4 {color:#090;}

#cols2 #col-left .title h4, #cols2 #col-left .title span {background-color:#FFF;}

#cols2 #col-left .article {color:#090;}

#cols2 #col-left a:hover.article {color:#000;}



#cols2 #col-right {background-color:#EEF8E4;}

#cols2 #col-right h4 span {background-color:#EEF8E4;}



#col-top {width:960px; height:5px; margin-top:15px; background:url("../../../public/design/col-top.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}

#col-bottom {width:960px; height:5px; margin-bottom:15px; background:url("../../../public/design/col-bottom.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}

#col {position:relative; padding:10px 30px 10px 20px; background:url("../../../public/design/col.gif") 0 0 repeat-y;}



    #ribbon {position:absolute; top:-5px; left:0; width:100px; height:100px; background:url("../../../public/design/ribbon.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden; z-index:10;}



    #col-browser {position:relative; float:left; width:340px; height:245px; background:url("../../../public/tmp/interface.png") 0 0 no-repeat;}

    #col-browser img {position:absolute; top:28px; left:10px;}



    #col-text {float:right; width:550px; padding-top:15px; line-height:1.7;}



        #slogan {position:relative; width:289px; height:33px; overflow:hidden; margin:0; padding:0; font-size:180%;}

        #slogan span {display:block; position:absolute; top:0; left:0; z-index:1; width:100%; height:100%; margin:0; padding:0; background:url("../../../public/tmp/slogan.gif") 0 0 no-repeat;}

        #btns {margin-top:25px; margin-bottom:0;}



#cols2-top {width:960px; height:5px; margin-top:15px; background:url("../../../public/design/cols2-top.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}

#cols2-bottom {width:960px; height:5px; margin-bottom:15px; background:url("../../../public/design/cols2-bottom.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}

#cols2 {background:url("../../../public/design/cols2.gif") 0 0 repeat-y;}



    #cols2 #col-left {float:left; width:595px; padding:20px;}

    #cols2 #col-right {float:right; width:268px; margin-right:1px; padding:20px;}

    

        #cols2 #col-left h4, #cols2 #col-right h4 {margin:0; font-size:100%;}

        #cols2 #col-left .title {background:url("../../../public/design/dot.gif") 0 50% repeat-x;}

        #cols2 #col-left .title h4 {display:inline; padding-right:10px;}

        #cols2 #col-left .title span {padding-left:10px;}



        #cols2 .box {margin-top:15px;}

        #cols2 #col-right h4 {background:url("../../../public/design/dot-02.gif") 0 50% repeat-x;}

        #cols2 #col-right h4 span {padding-right:10px;}

        #cols2 .col-right-img {float:left; width:65px;}

        #cols2 .col-right-text {float:right; width:190px;}

        #cols2 .col-right-text p {margin:0;}



#cols3-top {width:960px; height:5px; margin-top:15px; background:url("../../../public/design/cols3-top.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}

#cols3-bottom {width:960px; height:5px; margin-bottom:15px; background:url("../../../public/design/cols3-bottom.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}

#cols3 {background:url("../../../public/design/cols3.gif") 0 0 repeat-y;}



    .col {float:left; width:308px; padding:0 1px; margin-right:15px;}

    .col.last {margin-right:0;}

    .col h2 {margin:0; padding:7px 15px 12px 50px; background:url("../../../public/design/cols3-title.gif") 20px 40% no-repeat; font-size:120%;}



        .col-text {padding:20px; border-top:1px solid #DFDFDF;}

        .col-text p {margin:0;}

        .col-text ul {margin-bottom:0;}

        .col-more {padding:10px 10px 1px 0; text-align:right;}



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

5) Others

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



.high {color:#090}

.ico-comment {padding-left:18px; background:url("../../../public/design/ico-comment.gif") 0 50% no-repeat;}

.ico-rss {padding-left:18px; background:url("../../../public/design/ico-rss.gif") 0 50% no-repeat;}

.highlight {color: red;}

.smaller {font-size:85%;}

p.comment-captcha-success {color: red; text-decoration: blink;}

#flags {float: right;}



.tbContactform .antispam {

	 display:  none;

	 visibility: hidden;

}



.tbContactform table td {

	vertical-align: top;

        padding: 2px 0;

}

.tbContactform label {

	 width:  95px;

	 display:  inline-block;

	 vertical-align: top;

	 clear: both;

}



.tbContactform input.text {

	width: 355px;

        padding: 2px;

}

.tbContactform textarea {

	 width:  355px;

	 padding: 2px;

}



.tbContactform textarea {

	 height:  155px;

}



.tbContactform input.submit

{

	display: block;

	width:  auto;

	height: 40px;

        width: 80px;

}

.tbContactform table td.submit {padding-left: 380px;}

.comment {

	border: 1px solid #cccccc;

	padding: 10px;

	margin-bottom: 10px;

	background-color: #fafafa;

}

/* ---------------------------- Newsletter -------------------------*/

.newsletter {margin-top: 10px;}

.newsletter fieldset {margin: 0;}

.simple_form {

	padding: 4px;

	border: 1px solid #c3c3c3;

	}

.simple_form label {

	display: inline-block;

	vertical-align: top;

	font-weight: bold;

	width: 40px;

	}

.simple_form input.text {

	padding: 2px;

	margin: 0 0 4px 8px;

	border: 1px solid #c3c3c3;

	}

.simple_form input.submit{

	display: block;

	float: right;

	width:  auto;

	margin-top: 10px;

}

div.simple_message{

	color: red;

	font: normal bold 12px/normal 'Arial', sans-serif;

	padding: 0 5px;

}