/* ------------------------------------------------- */
/* ------------>>> #GLOBAL           <<<------------ */
/* ------------------------------------------------- */

body {
	background: #FFF url(../images/bg.jpg) repeat-x;
}

a {
	color: #339933;
	text-decoration: none;
}

a:hover {
	color: #006699;
	text-decoration: underline;
}

.gray {
	color: #999999;
}

.white {
	color: white;
}

/* ------------------------------------------------- */
/* ------------>>> #HEADER           <<<------------ */
/* ------------------------------------------------- */

#hd {
	position: relative;
	height: 140px;
}

#util-link {
	position: absolute;
	top: 5px;
	right: 0;
	color: #336600;
}

#util-link a {
	color: #72A545;
}

#util-link a:hover {
	color: #006699;
}

#logo a {
	position: absolute;
	font-size: 350%;
	color: #FFF;
	letter-spacing: -2px;
	text-decoration: none;
}

#slogan {
	position: absolute;
	font-size: 130%;
	font-style: italic;
	font-family: "Times New Roman", Times, serif;
	color: #CCCCCC;
	top: 45px;
	left: 150px;
}

#version {
	position: absolute;
	font-size: 90%;
	font-weight: bold;
	font-family: "Times New Roman", Times, serif;
	color: white;
	top: 10px;
	left: 210px;
}

/* ------------------------------------------------- */
/* ------------>>> #FOOTER           <<<------------ */
/* ------------------------------------------------- */

#ft {
	margin-top: 20px;
	text-align: center;
}

/* ------------------------------------------------- */
/* ------------>>> #NAVIGATION       <<<------------ */
/* ------------------------------------------------- */

#main-tab {
	background-color: #333333;
	position: absolute;
	width: 620px;
	top: 40px;
	right: 0;
}

#main-tab ul {
	margin: 0 10px;
}

#main-tab li {
	list-style: none;
	float: left;
}

#main-tab a {
	color: #72A545;
	display: block;
	font-size: 150%;
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: lowercase;
	padding: 10px;
	text-decoration: none;
}

#main-tab a:hover,#main-tab .selected a {
	color: #FFFFFF;
}

/* BOX */

.box-header {
	background-color: #DDDDDD;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #444444;
	padding: 5px;
	margin: 10px 0 0 0;
}

.box-header ul {
	margin: 0;
}

.box-header li {
	display: inline;
	margin-right: 10px;
}

.box-header li.selected a {
	color: #444444;
}

.box-content {
	border: 1px solid #DDDDDD;
}

.box-content ul {
	margin: 0;
}

.box-content li {
	list-style: none;
}

/* SEARCH */

.search-header .right-part {
	float: right;
	font-weight: normal;
}

/* SIDEBAR */

#sidebar .box-content li {
	padding-left: 50px;
}

#sidebar h2 {
	text-align: center;
}

#sidebar li.selected a {
	color: #444444;
	font-weight: bold;
}

/* MAIN 1 */

#main1 h2.box-header {
	padding-left: 20px;
}

#main1 .box-content {
	padding: 20px 10px;
}
	
#main1 .horizon-tab {
	margin: 0;
	text-align: right;
}

#main1 .horizon-tab li {
	display: inline;
	margin-right: 10px;
}

#main1 .horizon-tab a {
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: lowercase;
}

#main1 .horizon-tab .selected a {
	color: #000000;
	font-weight: bold;
}

#main1 .top-level {
	font-size: 130%;
	margin-top: 10px;
}

#main1 .second-level {
	margin-top: 10px;
}

#main1 li {
	list-style: none;
}

/* MAIN 2 */
#main2 {
	margin: 0;
}

#main2 h2 {
	text-align: center;
}

#main2 .box-content li {
	padding-left: 5px;
}

#main2 .infor {
	padding: 10px;
}

#main2 .infor li {
	list-style: inside;
}

/* MOVIE */
.movie-overview {
	padding: 5px;
	border-bottom: 1px solid #DDDDDD;
	position: relative;
}

.movie-overview .movie-cover {
/*	border: 1px groove gray;
	background-color: #339933;*/
	float: left;
	width: 120px;
	height: 150px;
	text-align: center;
}

.movie-overview .text-infor {
	margin-left: 127px;
	padding: 0 10px;
}

.movie-overview .text-infor h3 {
	margin: 0;
	text-align: center;
}

.movie-overview .text-infor .aline {
	margin-top: 3px;
}

.movie-overview .text-infor a img {
	vertical-align: bottom;
	padding-left: 15px;
}

.movie-overview .trailer-wrapper .trailer-object {
	display: none;
}

.movie-overview .play-trailer {
	position: absolute;
	bottom: 5px;
	right: 0px;
}

#movie-action {
	border-bottom: 1px groove gray;
}

#movie-action li {
	display: inline;
	margin-right: 10px;
}


#main1 .box-content h2 {
	margin: 0;
}

/* LIST */ /*
#list_browse #browse, #list_create #create, #list_findByMovie #findByMovie {
	font-weight: bold;
}

#movie_detail #detail, #movie_request #request, #movie_save #save {
	font-weight: bold;
}
*/

.clear:after {
	content: ".";
	display: block;
	height: 0;
	font-size: 0;
	clear: both;
	visibility: hidden;
}

.clear {
	min-height: 1px;
}

* html .clear {
	height: 1px;
}

/* PAGER NAVIGATION */
.pager_navigation {
	margin: 0;
	text-align: center;
	font-size: 180%;
}

.pager_navigation * {
	vertical-align: middle;
}

.success_msg {
	color: blue;
}

.error_msg {
	color: red;
}

.link_vote {
	margin-bottom: 10px;
}
	
.link_vote .vote_option {
	float: right;
}

.link_vote .vote_wrapper {
	margin-right: 40px;
}

.link_vote .comment {
}

a.like {
	padding-right: 15px;
}

a.marked {
	background-image: url('/images/icons/green_tick.gif');
	background-repeat: no-repeat;
	background-position: center right;
}

body.rating #movies_to_rate {
	position: relative;
}

body.rating #movies_to_rate .loading {
	position: absolute;
	top: 50%;
	left: 50%;
	display: none;
}

body.rating .movie_to_rate {
	margin-bottom: 30px;
}

body.rating .movie_to_rate .movie-cover {
	position: absolute;
	z-index: 100;	
	display: none;	
	top: 0;
	right: 0;
}

body.rating .movie-cover img {
	width: 150px;
	hight: 180px;
}

#sidebar h1 {
	font-size: 1.1em;
	text-align: center;
}



#mycarousel.jcarousel-container-vertical {
    width: 415px;
	height: 195px;
	margin: 10px;
	background-color: white;
}

#mycarousel .jcarousel-clip-vertical {
    width: 415px;
    height: 195px;
}

#mycarousel .jcarousel-item,
#mycarousel .jcarousel-item-placeholder {
    width: 413px;
    height: 193px;
}

#mycarousel .jcarousel-item-vertical p {
    margin: 5px;
    text-align: center;
    clear: both;
    white-space: wrap;
}

#mycarousel .jcarousel-item-placeholder {
    background: transparent url(/images/loading.gif) 50% 50% no-repeat;
}

#mycarousel .jcarousel-prev {
    left: 210px;
    top: 5px;
}

#mycarousel .jcarousel-next {
    left: 210px;
    bottom: 5px;
}

#mycarousel form {
    margin-top: 10px;
}

#mycarousel form label,
#mycarousel form small {
    display: block;
}




/* ------------------------------------------------- */
/* ------------>>> #FORM             <<<------------ */
/* ------------------------------------------------- */

/* GENERAL */

/* -------------------------------------------------------------- 
   
   forms.css
   * Sets up some default styling for forms
   * Gives you classes to enhance your forms
   
   Usage:
   * For text fields, use class .title or .text
   
-------------------------------------------------------------- */

label       { font-weight: bold; }
fieldset    { padding:1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc; }
legend      { font-weight: bold; font-size:1.2em; }

.butt {
	width: 60px;
}

/* Form fields
-------------------------------------------------------------- */

label { font-size: 1.3em; }

input.text, input.title,
textarea, select {
  margin:0.5em 0;
  border:1px solid #bbb;
}

input.text:focus, input.title:focus,
textarea:focus, select:focus {
  border:1px solid #666;
}

input.text, 
input.title   { width: 300px; padding:5px; }
input.title   { font-size:1.5em; }
textarea      { width: 390px; height: 250px; padding:5px; }


/* Success, notice and error boxes
-------------------------------------------------------------- 
*/
.gerror,
.notice, 
.success    { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; }

.gerror      { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }
.notice     { background: #FFF6BF; color: #514721; border-color: #FFD324; }
.success    { background: #E6EFC2; color: #264409; border-color: #C6D880; }
.gerror a    { color: #8a1f11; }
.notice a   { color: #514721; }
.success a  { color: #264409; }


label.error {
	display: block;
	color: #8a1f11;
	font-style: italic;
	font-weight: normal;
}

/* SEARCH */
#search-wrapper {
	position: absolute;
	width: 100%;
	top: 99px;
}

#search-form {
	text-align: center;
	background-color: #DDDDDD;
}

#search-form * {
	vertical-align: middle;
}

#search-form #q {
	width: 300px;
}

#search-form #f {
	font-weight: lighter;
	font-size: 1.4em;
}

#search-form #sb {
	font-size: 1.3em;
}

textarea.labelinside, input.labelinside {
	color: #999;
}


/* MOVIE FILTER */

.movie-filter-form {
	text-align: center;
	padding: 5px 5px 10px 5px;
}

.movie-filter-form .form-label {
	text-transform: capitalize;
	margin-top: 5px;
}

.movie-filter-form input, .movie-filter-form select {
	width: 150px;
}

.movie-filter-form .button {
	width: 50%;
	margin-top: 10px;
}

/* LIST EDIT FORM */

#form-list-edit { margin: 0 37px; }

#form-list-edit textarea {
	height: 100px;
}

#form-list-edit #save_butt { width: 60px; }

/* MOVIE SELECTOR */

#movie_selector_block {
	position: fixed;
	width: 242px;
}

#movie_selector {
	text-align: center;
	padding: 10px 20px 0px 8px;
	margin: 0;
}

#movie_selector input.text {
	width: 100%;
}

/* LIST MOVIE */

#list-movie li {
	padding: 5px;
	border-bottom: 1px solid #DDDDDD;
}

#list-movie .movie-cover {
	border: 1px groove gray;
	float: left;
	width: 120px;
	height: 150px;
	text-align: center;
}

#list-movie h3 {
	margin: 5px 20px 0 127px;
	width: 300px;	
}

#list-movie h3 {
	text-align: center;
}

#list-movie textarea {
	margin-top: 10px;
	margin-left: 5px;
	width: 300px;
	height: 108px;
}

#list-movie img.delete {
	vertical-align: center;
}

/* REVIEW EDIT FORM */

#form-review-edit {
	margin: 0 37px;
}

#form-review-edit textarea {
	height: 150px;
}
	
/* MOVIELINK EDIT FORM */

#form-movielink-edit {
	margin: 0 37px;
}

/* REQUEST EDIT FORM */

#form-request-edit {
	margin: 0 37px;
}

#form-request-edit textarea {
	height: 100px;
}

/* SIGN IN*/

#form-sign-in {
	margin: 0 78px;
}

/* QUICK SIGN IN*/

#form-quick-login {
	margin: 10px 9px 0px 25px;
}
	
#form-quick-login .text {
	width: 180px;
}

/* SIGN UP */

#form-sign-up {
	margin: 0 78px;
}

/* PASSWORD RESET*/

#form-password-reset {
	margin: 0 78px;
}

/* MOVIE REQUEST */

#form-movie-request label {
	width: 150px;
}

#form-movie-request .input-container {
	margin-left: 160px;
	vertical-align: bottom;
}

#form-movie-request textarea {
	width: 250px;
	height: 120px;
}

#form-movie-request .form-note {
	left: 140px;
}

/* MOVIE LINK */

#form-movie-link .form-row input[type=text] {
	width: 60%;
}

#form-movie-link .form-row select {
	width: 25%;
}

/* QUICK LOGIN */

#form-quick-login label {
	margin-left: 15px;	
	width: 55px;
}
#form-quick-login .form-note {
	left: 60px;
}

#form-quick-login .form-row input[type=text],  #form-quick-login .form-row input[type=password] {
	width: 55%;
}

/* LINK COMMENT */

.link_comment {
	height: 100px;
	width: 400px;
}

/* LIST COMMENT */

#form-list-comment {
	margin: 0 37px;
}

#form-list-comment textarea {
	height: 100px;
}

#opaque {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 99;
    display: none;
    background-color: black;
    filter: alpha(opacity=40);
    opacity: 0.5;
}


