/* GENERAL */
*         { padding: 0; margin: 0; }
body      { background: #fff url(../images/css/bg80.gif) repeat-x; font: 13px "Calibri MS", helvetica, sans-serif; }
a         { color: #ff6600; }
img       { border-style: none; }
p         { font-size: 12px; }
textarea  { font: 11px "lucida grande", tahoma, verdana, arial, sans-serif; }
input.btn            { color: white; background-color: gray; border: 1px solid; padding: 2px; border-color: white black black white }
input.inplace_cancel { color: white; background-color: gray; border: 1px solid; padding: 2px; border-color: white black black white }
input.inplace_save   { color: white; background-color: gray; border: 1px solid; padding: 2px; border-color: white black black white }
#wrapper  { margin: 0 auto; width: 956px; }
.center   { text-align: center; }
h4        { color: #ff6600; }

/* HEADER */
#header             { width: 956px; padding: 20px 0 0; height: 115px; margin: 0; }
#header .logo       { width: 300px; float: left; margin-top: 15px; }
#header .logintop   { float: left;  height: 40px;  margin-left: 100px; font-size: 11px; color: white;
                      border: solid 0px green; }
#header .logintop a       { color: yellow; text-decoration: none; }
#header .logintop a:hover { text-decoration: underline; }
#header .logintop #image { float: left; margin-top: 4px; }
#header .logintop #data { float: left; margin-left: 5px; }
#header .logintop #data span.nickname { color: yellow; font-size: 14px; }

#header .logout { border: solid black 0px; padding-left: 260px; padding-top: 8px; }
#top_stats { font-size: 12px; }
#top_stats .title { text-align: right; }
#top_stats .value { background-color: white; color: red; padding-left: 1px; padding-right: 1px; }

#login_error { color: #C01717; padding-left: 0px; }
#login_notice { padding-left: 107px; margin-bottom: 3px; }
.login_input { color: black; }
#register_notice { font-size: 12px; margin-top: 5px; }

#login_standard { float: left; }
#login_facebook { float: left; margin-left: 13px; }
#login_facebook span.title { padding-bottom: 5px; }

#header h1   { width: 257px; height: 26px; margin-bottom: 8px; }
#header h1 a { float: left; width: 259px; height: 26px; text-decoration: none; color: white; font-size: 30px; }
#header h2   { font-size: 13px; color: #fff; font-weight: normal; font-style: normal; adding-left: 1px; }

#header .tabs   { clear: both; margin-top: 30px; float: left; width: 956px; height: 27px; }
#header ul.ttab    { float: left;  }
#header ul.ttab li { padding-right: 10px; padding-left: 10px; height: 41px; margin-right: 2px; float: left; text-align: center;
                    font-size: 12px; list-style-type: none; border: solid 0 black; }
#header ul.ttab li .left { background: url(../images/css/tl.gif) 0 0 no-repeat; background-color: white; padding-bottom: 8px; }
#header ul.ttab li .right { background: url(../images/css/tr.gif) 100% 0 no-repeat; padding-top: 4px; }
#header ul.ttab li a      { color: white; font-weight: bold; text-decoration: none; }
#header ul.ttab li .right a { color: #66cd00; margin: 4px;  }
#header ul.ttab li .not_selected a {  margin: 4px; }
#header ul.ttab li .not_selected { padding-top: 4px;  }
#header ul.ttab li a:hover    { text-decoration: underline; }
#header ul.ttab li.selected a:hover { text-decoration: underline; }

#nav ul.topb { font-size: 12px; float: left; width: 850px; padding-bottom: 15px;  }
#nav ul.topb li { padding-right: 7px; padding-left: 7px; float: left; list-style-type: none; 
                  border-right: solid 1px gray;  }
#nav ul.topb li.empty { border-right: 0px; color: #f6f6f6; }                  
#nav ul.topb li.last { border-right: 0px; } 
#nav ul.topb li.first { padding-left: 0px; }             
#nav ul.topb li a { color: #333; text-decoration: none; }
#nav ul.topb li a:hover { color: #333; text-decoration: underline; }
#nav ul.topb li.selected { font-weight: bold; }
#nav ul.topb li.selected a { text-decoration: none; }
#nav ul.topb li.selected a:hover { text-decoration: underline; }


/* CONTENT*/
#content { overflow: hidden; padding: 0; width: 956px; margin-top: 15px; margin-bottom: 20px; }

/* MAIN BLOCK */
#mainc { float: left; color: #333; margin: 0 16px 0 0; padding: 0; width: 640px; display: inline;
         position: relative; }
#mainc h2 { color: #ff6600; margin-top: 13px; margin-bottom: 13px; font-size: 16px;}
#mainc h2 span { color: #66cd00 }

/* large block */
#mainc h3.large { background: url(../images/css/btop.gif) no-repeat; font-weight: bold; color: black;
	                width: 630px; padding-top: 5px; padding-bottom: 5px; padding-left: 10px;
	                font-size: 12px; }
#mainc .habox { border: 1px solid #eaeaea; border-top: 0px; width: 618px; padding: 5px 10px;
                margin-bottom: 15px; font-size: 12px; }

/* small block */
#mainc .bblock { width: 640px; margin-bottom: 15px; overflow: hidden; }
#mainc .bblock .bout { float: left; background: url(../images/css/hmid.gif) repeat-y; width: 310px;
                       margin-bottom: 15px; }
#mainc .bblock .boutr { float: right; background: url(../images/css/hmid.gif) repeat-y; width: 310px; 
                        margin-bottom: 15px;}
#mainc .bblock .tit { background: url(../images/css/htop.gif) no-repeat; width: 290px; height: 23px;
                      padding-top: 4px; padding-left: 10px; padding-right: 10px;  }
#mainc .bblock .tit2 { background: url(../images/css/htop2.gif) no-repeat;  }                      
#mainc .bblock .tit h3 { color: #333; font-size: 12px; font-weight: bold; float: left; margin-top: 2px; }
#mainc .bblock .conn { width: 290px; padding: 5px 10px 0; font-size: 12px;  }
#mainc .bblock ul.cc { width: 290px; }
#mainc .bblock ul.cc li { background: url(../images/css/arrow.gif) no-repeat 0 3px; list-style-type: none;
	                        padding-left: 12px; margin-bottom: 5px; }
#mainc .bblock ul.cc li a { color: #333; font-size: 11px; text-decoration: none; }
#mainc .bblock ul.cc li a:hover { text-decoration: underline; }
#mainc .bblock .bfot { background: url(../images/css/hbut.gif) no-repeat; width: 310px; height: 14px; }
#mainc span.hmore { text-indent: -3000px; width: 50px; height: 16px; float: right; }
#mainc span.hmore a { width: 50px; height: 16px; float: right; }


/* SIDE BAR */
#sidebar    { display: inline; margin: 0; padding: 0; width: 300px; float: right; 
              margin-top: 43px; }
/* small box */
#sidebar h3 { background: url(../images/css/usertitle.gif) no-repeat; width: 290px; height: 20px; color: #fff;
	            font-size: 12px; padding-left: 10px; padding-top: 5px; font-weight: normal; font-style: normal; }	            
#sidebar ul.smallcol { width: 300px; font-size: 11px; margin-bottom: 15px; 
                       background: #edecec url(../images/css/libo.gif) no-repeat 0 bottom; }
#sidebar ul.smallcol li { list-style-type: none; width: 280px; padding: 7px 10px; border-bottom: 1px solid #fff; }
#sidebar ul.smallcol li.fflinks { text-align: right; }
#sidebar ul.smallcol li p { margin-top: 3px; }
#sidebar ul.smallcol li a { text-decoration: underline; color: #ff7f09; }
#sidebar ul.smallcol li span.date { color: #66cd00;  }
#sidebar ul.smallcol li span.title { color: #ff6600; font-size: 12px; }

/* serach bar */
#sidebar .search { width: 300px; margin-top: 5px; margin-bottom: 10px; height: 30px; padding: 0; }
#sidebar .sin { float: left; }
#sidebar .bbs { float: right; }
.searchinput { border-top: 1px solid #c7c7c7; border-left: 1px solid #c7c7c7; border-bottom: 1px solid #e4e4e4;
	             border-right: 1px solid #e4e4e4; background-color: #fff; padding: 5px 2px 6px 5px; width: 243px;
	             color: #a3a3a3; margin: 0; }

/* FOOTER */
#footer { clear: both; color: #333; margin: 0; padding: 0; background: url(../images/css/footerbg3.gif) repeat-x top;
	        background-color:#edecec; width: 100%; height: 195px;  }
#footer .copyrights { width: 956px; text-align: right; font-size: 10px; color: #666666; margin-left: auto;
	                    margin-right: auto; padding-top: 6px; padding-bottom: 6px; }
#footer .flinks { width: 956px; margin-left: auto; margin-right: auto; height: 125px; border-left: 1px solid #fff;
	                margin-top: 25px; }
#footer .fblock    { width: 281px; padding-left: 21px; padding-right: 15px; float: left; height: 121px;
	                   border-right: 1px solid #fff; padding-top: 4px; }
#footer .fblock h2 { text-transform: uppercase; color: #666; font-size: 10px; margin-bottom: 13px;
	                   font-weight: bold; }
#footer .fblock ul.ff    { width: 281px; margin-bottom: 10px; }
#footer .fblock ul.ff li { color: #666; text-decoration: none; font-size: 11px; margin-bottom: 3px;
	                         list-style-type: none; }
#footer .fblock ul.ff li a { font-size: 11px; text-decoration: none; }

/* FORM */
.form { margin-top: 5px; }
.form_error  { color: #C01717; margin-left: 200px; }
.form ul, li { border:0; margin:0; padding:0; list-style:none;  }
.form li     { clear:both; list-style:none; border-top: solid 1px gray; color: #ff6600;}
.form input, select  { margin-bottom: 2px; margin-top: 2px; }
.form label  { width: 200px; float:left; margin-top: 4px; }
.form label.home { width: 120px; }
.form label.submit { color: #FFFFCC;  }

/* MESSAGE BOXES */
div.message_error { color: #C01717; background: url(../images/icon/false.png) 8px 5px no-repeat; background-color: #ffe4e1; 
                    padding: 5px; padding-left: 30px; border: 1px solid #C01717; margin-top: 5px; padding-top: 7px;}                 
div.message       { color: #458B00; background: url(../images/icon/true.png) 8px 5px no-repeat; background-color: #e4ffac; 
                    padding: 5px; padding-left: 30px; border: 1px solid #458B00; margin-top: 5px; padding-top: 7px; }
.info_small { font-style: italic; color: #66cd00;}
.info_error { color: #C01717; font-style: italic; }                    
             
/* my table */
.myTable { font-size: 12px; }
.myTable tr { height: 30px; }
.myTable .title { font-weight: bolder; }
.myTable .color { background-color: #edecec }


/* home */
table.control_panel tr td { width: 120px; text-align: center; } 
           

/* book */
#book_list td { padding: 10px;  }
#book_list td.cover { width: 100px; }
#book_list td.title { width: 150px;  }
#book_list td.cards { width: 90px; }
#book_list td.example { width: 90px; }
#book_list td.translated_title { width: 200px; }

#card_book_list td { padding: 10px;  }
#card_book_list td.title { width: 150px; }
#card_book_list td.title_in { text-align: center; }
#card_book_list td.cards { width: 420px; }
#card_book_list td .book_title { font-weight: bold; }
#card_book_list td .check_lesson { font-weight: bold; }
.card_type { font-weight: bold; }   
.book_language { font-weight: bold; margin-left: 12px; }  
#display_cards {  padding: 10px; margin-top: 10px; margin-left: 10px; } 

.indicator { height: 100px; margin-left: 270px; margin-top: 40px;
                background: url(/images/css/indicator.gif) no-repeat 0 0; }
                
.indicator_small { height: 20px; margin-left: 10px; margin-top: 10px;
                background: url(/images/css/indicator_comment.gif) no-repeat 0 0; }                
                
.lesson_column { float:left; width: 200px;  }

img.flag { width: 50px; padding-left: 30px; }
img.flag2 { width: 75px; padding-left: 30px; }
.language_name { width: 170px; height: 30px; padding-top: 14px; padding-left: 5px; 
                 border: solid 0px black; float:right;  }

.book_block { width: 100px; float: left; margin-right: 20px; text-align: center; }

table#stats { width: 250px; text-align: center; }
table#stats tr.total { font-weight: bold; }

/* vocabulary */

#user_vocabulary_list table tr.title { font-weight: bold; }
#user_vocabulary_list table td { padding: 10px; width: 140px; }

ul.pager {
	padding-top: 30px;
	text-align: center;
	margin: auto;
}

ul.pager li a {
	border: 1px solid #FF6600;
	color: #FF6600;
	display: block;
	font-size: 13px;
	padding: 5px 7px;
	float:left;
	width: auto;
	text-decoration: none;
	margin-right: 3px;
}

ul.pager li {
	color: #FF6600;
	display: block;
	margin-right: 3px;
}

ul.pager li a.select {
	color: #FFFFFF;
	background: #FF6600;
}

.clear {
	clear: both;
	height:0px;
}