/*	TEMP							*/
/*	------------------------------- */

.pink {
	background-color:pink;
}



/*	IMG SAFETY RULE					*/
/*	------------------------------- */

img {
  max-width: 100%;
  height: auto;
}


/*	SHOW AND HIDE					*/
/*	------------------------------- */

.hide_this {
	display:none;
}

.show_this {
	display:inline;
}



/*	CONTAINERS						*/
/*	------------------------------- */

#outer {
	width:100%;
}

#container {
	width:1100px;
	margin-left:auto;
	margin-right:auto;
}

#text_area {
	position:relative;
	top:-65px;		/* OFFSETS THE MARGIN LEFT BY THE FILM TITLE MOVING UP */
	width:1100px;
	font-family:lato;
}

#index_show_hide {
	font-weight:bold;
	font-size:20px;
	display:none;
	cursor:pointer;
	margin-bottom:5px;
}

#the_index{
	position:relative;
	float:left;
	width:257px;
	/* padding:12px; */
	padding-top:0px;
	margin-top:20px;
	font-size:12pt;
	border-right:3px dotted #038;
	border-bottom:3px dotted #038;
}

#index_inner {
	margin-top:0px;
	margin-right:20px;
	margin-bottom:20px;
	width:240px;
}

#the_article {
	position:relative;
	float:right;
	width:710px;
	padding:10px 50px;
	font-size:14pt;
}

#title_image {
	position:relative;
	margin-left:auto;
	margin-right:auto;
	/* width:1134px;
	width:100%; */
}

#copyright {
	width:100%;
	text-align:center;
	margin-top:20px;
	margin-bottom:20px;
	font-size:10px;
	color:#777;
}

/*	LEFT INDEX						*/
/*	------------------------------- */

.headline {
	font-family:"Dancing Script",cursive,arial;
	font-weight:bold;
	margin-bottom:5px;
	line-height:98%;
}

.small_headline {
	font-size:20pt;
	margin-top:9px;
}

#index_inner a {
	text-decoration:none;
	color:#60a0c0;
	font-weight:bold;
}

.index_note {
	font-size:10pt;
	font-size:14px;
	color:#555;
}



/*	IFRAME CONTAINTER				*/
/*	------------------------------- */

.iframe_container {
  overflow: hidden;
  width: 276px;   /* Final visible cropped width */
  height: 36px;   /* Final visible cropped height */
  position: relative;
  margin-bottom:12px;
  height:53px;
}

.iframe_container iframe {
  position: absolute;
  top: -360px;    /* Pulls content UP (crops 100px off the top) */
  left: -11px;      /* Shifts horizontally if needed */
  width: 266px;   /* Match container width (or 100%) */
  height: 500px;  /* MUST be tall enough to fit the target section */
  border: none;
}

#title_image img {
	position:relative;
	width:100%;
}
/*
*/



/*	ALIGNMENT						*/
/*	------------------------------- */

.right, .image_right {
	position:relative;
	float:right;
	margin-left:20px;
	margin-bottom:7px;
}

.left, .image_left {
	position:relative;
	float:left;
	margin-right:20px;
	margin-bottom:7px;
}

.center_this {
	width:100%;
	text-align:center;
	margin-left:auto;
	margin-right:auto;
}

.center_image {
	width:710px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.clearboth {
	clear:both;
}





/*	ELEMENTS						*/
/*	------------------------------- */



#site_links {
	position:relative;
	width:1100px;
	text-align:center;
	margin-top:3px;
	margin-bottom:5px;
	font-family:"Dancing Script",cursive,arial;
	font-size:18pt;
}

#site_links a {
	margin-left:20px;
	margin-right:20px;
	text-decoration:none;
	color:#369;
	font-weight:bold;
}

#site_title {
	position:absolute;
	/* color:#ccc; */
	color:#bef;
	font-size:48pt;
	font-family:"Dancing Script",cursive,arial;
	top:30px;		/* 	CORRECT FOR WHEN A ROW OF LINKS IS ON TOP	*/
	top:-9px;
	margin:20px;
	text-align:center;		/* 	WHY CENTERED?	*/
	margin-left:auto;
	margin-right:auto;
	margin-left:25px;
	cursor:pointer;
	/* background:rgba(40,40,40, 0.5); */ /* BACKGROUND IF NEEDED */
	

}

#film_title {
	position:relative;
	/* color:#ccc; */
	color:#bef;
	font-size:36pt;
	font-family:"Dancing Script",cursive,arial;
	top:-85px;
	/* margin:20px;
	margin-right:70px;
	text-align:center; */
	width:100%;
	/* padding:10px;
	margin-left:auto; */
	text-align:right;
	/* background:yellow;
	background:rgba(40,40,40, 0.5); */ /* BACKGROUND IF NEEDED */
}

.upper_title {
	/* text-shadow:2px 1px #aaa; */
	text-shadow:2px 1px #000;
}

.upper_title_light {
	/* text-shadow:2px 1px #aaa; */
	text-shadow:1px 1px #ccc;
}



/*	INFO BOX						*/
/*	------------------------------- */

#info_box_container {
	width:100%;
	margin-top:30px;
	margin-bottom:20px;
	clear:both;
}

.movie_poster {
	position:relative;
	width:140px;
	/* margin-right:20px; */
	float:left;
}

.movie_poster_mobile {
	display:none;
}

.info_box {
	position:relative;
	width:550px;
	float:right;
}

.movie_info {
	position:relative;
	width:550px;
	float:right;
	font-size:11pt;
	clear:both;
}

.movie_info_title_bar {
	width:550px;
	padding:5px;
	background-color:black;
	color:#bef;
	font-weight:bold;
	text-align:center;
	font-size:13pt;
	margin-bottom:10px;
}

.movie_info_col_1 {
	position:relative;
	float:left;
	width:310px;
	margin-right:20px;
}

.movie_info_col_2 {
	position:relative;
	float:right;
	width:220px;
}

.star_rating {
	/* width:550px; */
	text-align:center;
	font-weight:bold;
	margin-bottom:3px;
}

.stars {
	font-family: "Noto Sans Symbols 2";
	color:#cc3300;
	font-size:24px;
}

.box_subhead {
	/* width:220px; */
	width:100%;
	background-color:#ddd;
	font-weight:bold;
	text-align:center;
	margin-bottom:2px;
	padding:1px;
}

.container_mobile {
	display:none;
}

#info_box_container_mobile {
	display:none;
}


/*
.share_buttons {
	font-size:12px;
	font-weight:bold;
}
*/

/*
.margintop {
	margin-top:0px;
}
*/


/*	TEXT LEVEL STYLES				*/
/*	------------------------------- */

h2 {
	font-family:"Dancing Script",Leto,arial;
	font-size:36pt;
	font-weight:bold;
	/* font-style:italic; */
	color:#b00;
	margin-bottom:0px;
}

h3 {
	font-family:"Dancing Script",Leto,arial;
	font-weight:bold;
	font-size:26pt;
	width:270px;
	border-bottom:3px solid #6af;
	padding-top:5px;
	padding-bottom:5px;
}

.description {
	font-size:15pt;
	font-style:italic;
	color:#555;
	/* margin-top:-15px; */
	margin-top:12px;
	margin-left:45px;
	margin-right:20px;
	margin-bottom:10px;
}

#the_article p {
	line-height:150%;
	text-indent:25px;
}

.spoiler_note {
	color:#777;
	font-size:11pt;
	font-style:italic;
	margin-top:12px;
}

blockquote p, #notes p, #conversation p {
	text-indent:0px;		/* 	DON'T INDENT THE SECOND AND THIRD SECTIONS */
}

#the_article a {
	text-decoration:none;
	color:#0088dd;
	font-weight:bold;
}

#the_article a:hover {
	color:#44ccff;
	text-decoration:underline;
}

/*
#the_article .info_box a {
	text-decoration:none;
	color:#000;
}

#the_article .info_box a:hover {
	color:#00aaff;
}
*/

.byline {
	text-align:right;
	font-weight:bold;
}

.byline_name {
	text-transform:uppercase;
}

.pub_date {
	text-align:right;
	color:#666;
	font-size:11pt;
}

.social {
	margin-top:5px;
	text-align:right;
}

blockquote {
	/* width:85%; */
	margin-left:14px;
	padding-left:20px;
	border-left:4px solid #ea0;
	/* font-size:13pt; */
	line-height:135%;
	text-indent:0px;
}

blockquote p {
	text-indent:0px;
	margin-bottom:-10px;
}

.notes_blockquote, .conversation_blockquote {
	padding-left:20px;
	border-left:4px solid #bef;
	font-size:13pt;
	line-height:120%;
	text-indent:0px;
	color:#444;
	margin-left:4px;
	margin-bottom:0px;
}

.quote_attribution, .quote_credit {
	text-align:right;
	font-size:11pt;
	color:#666;
}

.note_number {
	/* font-family:"Dancing Script",Leto,arial; */
	font-size:15pt;
	color:#08d;
	font-weight:bold;
	padding-right:5px;
}

.short_url {
	color:#666;
	font-size:10pt;
}

.short_url a {
	font-weight:bold;
}











/* MOBILE OVERRIDE										 */
/* ===================================================== */

@media (max-width: 768px) {
	
	#container {
		width: 100% !important;
	}
	
	#text_area {
		width: 100% !important;
	}

	#the_index{
		float:none;
		/* background-color:#0fe; */
		border:none;
	}

	#the_article {
		float:none;
		width:100% !important;
		font-size:17px;
		padding:0px;
		/* background-color:#bbb; */
	}

	#title_img img {
		width:100% !important;
		height:auto !important;
	}


	#site_title {
		color:white;
		font-size:20pt;
		top:-10px;
		left:-3px;
	}
	
	#film_title {
		color:white;
		font-size:20pt;
		top:-60px;
	}

	#index_show_hide {
		display:inline;
		margin-bottom:5px;
		/* background-color:yellow; */
	}
	
	#index_inner {
		display:none;
	}
	
	.image_right, .image_left {
		float:none;
		margin-right:0px;
		margin-bottom:0px;
		width:100% !important;
	}
	
	.movie_poster_desktop {
		display:none;
	}
	
	.movie_poster_mobile {
		display: flex;
		justify-content: center;
		position:relative;
		float:none;
		width:100% !important;
		margin-bottom:10px;
	}
	
	.movie_poster_mobile img {
		text-align:center;
	}	
	
	.star_rating_mobile {
		position:relative;
		display:inline;
		float:right;
		margin-right:40px;
		width:100% !important;
	}
	
	.clearboth_mobile {
		clear:both;	
	}
	
	.container_mobile {
		display:inline;
	}

	#info_box_container_desktop {
		display:none;
	}
	
	#info_box_container_mobile, #info_box_container {
		display: flex;
		justify-content: center;
		margin-top:0px;
		margin-bottom:0px;
		width:100% !important;
	}
	
	.info_box, .movie_info, .movie_info_col_1, .movie_info_col_2, .movie_info_title_bar {
		position:relative;
		width:100% !important;
		float:none;
		margin-bottom:12px;
		margin-right:0px;
		font-size:15px;
	}	
	
	.box_subhead {
		width:100% !important;
	}
	
}