/**
 * Theme for AKANE, jewels creator
 */

/**
 * import core YACS reference style sheet -- this has to come before any other rule
 */
@import url("../_reference/yacs.css");


//**
* Fonts to declare
*
*/
@font-face {
  font-family: "loved by the king";
  font-style: normal;
  src: url('fonts/LovedbytheKing.ttf');
}


/**
 * standard tags - redefine behaviour of reference HTML and XHTML tags
 * to ensure that all browsers will be aligned
 */

a,
a code { /* basic link */
	text-decoration: none;
	cursor: pointer; /* help ie on folded boxes */
}

a:link,
a:link code { /* link displayed for the first time */
	color: #E8E5E5;
}

a:visited,
a:visited code { /* link that has been used at least once */
	color: #C5BCBC;
}

a:active,
a:active code { /* link at the moment it is clicked */
	color: #f00;
}

a:hover,
a:hover code { /* link below the mouse pointer */
	color: #B8160A;
}

body { /* most elements will inherit some of these attributes */
	color: #746457;
	background-color: #090708;
	font-family: "Trebuchet MS",Verdana, Helvetica, sans-serif;
	font-size: 1em;
}

@media screen { /* on large screen */

	body { /* limit the horizontal size of everything, and center it in the page */
		margin: auto;
		padding: 0;
                width: 800px; /* equals width of wrapper */
	}
}

h1 { /* appears only once, with the page title */
	color: #746457;
	font-size: 18px;
	margin: 20px 0 0 0;
	padding: 0;
	text-align : right;
	height : 50px;
}

#discover h1 {
        display : block;
        position : absolute;
        top : -10px;
        right : -140px;
        font-size : 13px;
        z-index : 2;
        margin : 0;
}

h2 { /* appears in the main content panel, to introduce sections of the page -- [title]...[/title], [question]...[/question] */
	clear: left;
	color: #DDD;
	font-weight: bold;
	font-size: small;
	font-style: normal;
	margin: 20px 10px 2px 0;
	border: none;
	padding: 0;
}

h3 { /* a second level of heading in the main panel -- [subtitle]...[/subtitle] */
	clear: left;
	color: #DDD;
	font-weight: bold;
	font-size: x-small;
	font-style: normal;
	margin: 20px 0 2px 0;
	padding: 0 0 2px 0;
}

hr {
	margin-right : 10px;
}


img { /* a standard image */
	margin: 0;
	padding: 0;
}

input[type="password"],
input[type="text"] { /* ensure form fields fit in the layout */
	color: black:
	background-color: white;
	max-width: 300px;
}

input:focus { /* help to locate the current field */
	color: black:
}

li { /* avoid justification alignment */
	text-align: left;
}


ol { /* a numbered list -- [list=1]...[/list], [list=a]...[/list], [list=A]...[/list], [list=i]...[/list], [list=I]...[/list] */
	margin: 0.5em 0 1em 1em;
	padding: 0 0 0 1em;
}

p { /* add a space after each paragraph */
	margin: 0 0 0.75em 0;
}

#footer_panel p {
	margin: 0 0 0.25em 0;
}

select {
	color: black:
	background-color: white;
}

select:focus { /* help to locate the current field */
	color: black:
	background-color: #dedede;
}

ul {
	list-style: square;
}

td {font-size: small;}

/**
 * layout elements - also add behaviour for related sub-elements where applicable
 */

#footer_panel { /* comes after everything */
	clear: both;
	margin: 60px 0 0 0;
	color: #036;
	font-weight: normal;
	font-size: x-small;
	text-align: center;
}


#header_panel { /* comes before everything */
	/*background-image: url("images/header_background.jpg");*/
	text-align: left;
	padding: 0;
	margin: 0 0 0px 0;
	height: 47px;
	overflow : visible;
}


@media screen { /* only on a wide screen */

	#main_panel { /* where the actual content is */
		width: 632px;

		margin: 25px 0 0 0;
		padding: 0 0 0 0px;
		position : relative;
	}

	div.description {overflow: hidden;}

	#home #main_panel {
           position : relative;
           overflow : visible;
           width: 700px;
          }

	#main_panel a code { /* next rule do not impact links (eg, <code> in [toc]) */
		background-color: transparent;
	}

	#main_panel code { /* make code more visual */
		background-color: #f7f7f7;
	}

	#main_panel pre code { /* use block attributes instead of in-line attributes */
		background-color: transparent;
		margin: 0;
		padding: 0;
	}

}

#nametitle {
  position : absolute;
  bottom : -35px;
  left : -173px;
}

#worktitle {
  position : absolute;
  left : -88px;
  top : 10px;

}

#voile_01 {
  width : 698px;
  height : 373px;
  position : absolute;
  left: 0;
  bottom : -6px;
  background : url(images/voile_01.png) top left no-repeat;
}

#voile_02 {

  width : 700px;
  height : 522px;
  position : absolute;
  left: 0;
  top : 0;
  background : url(images/voile_02.png) top left no-repeat;
}

#voile_03 {
  width : 657px;
  height : 441px;
  position : absolute;
  left: 45px;
  top : 0;
  background : url(images/voile_03.png) top left no-repeat;
}

#voile_04 {
  width : 474px;
  height : 294px;
  position : absolute;
  left: 226px;
  top : 0;
  background : url(images/voile_04.png) top left no-repeat;
}

#home_map {
  width : 700px;
  height : 522px;
  position : absolute;
  left: 0;
  top : 0;
  z-index : 1;
}

#home_map img {
 width : 700px;
 height : 522px;
 border : none;
}

#home .home_link {
 position : absolute;
 width : 72px;
 height : 72px;
 z-index : 10;
}

#home .home_link:hover {
 background : url(images/rect3283.png) center center no-repeat;
}

#home .home_link:hover a {
 visibility : visible;
}

#home .home_link a {
  display : block;
  height : 44px;
  padding-left : 56px;
  padding-top : 45px;
  text-align : left;
  visibility : hidden;
  color : #FFD2D2;
}

#link_parures {
 top : 211px;
 left : 230px;
}

#link_boucles {
 top : 128px;
 left : 195px;
 width : 100px;
}

#link_bagues {
 top : 348px;
 left : 455px;
}

#link_brace {
 top : 341px;
 left : 359px;
}

#link_billot {
 top : 70px;
 left : 26px;
}

#link_chat {
 top : 172px;
 left : 345px;
}

#link_the {
 top : 103px;
 left : 506px;
}

#link_mirroir {
 top : 65px;
 left : 599px;
}

#link_discov {
 top : 364px;
 left : 39px;
}


#side_panel { /* complementary information related to this page */
	float: right;
	width: 185px;
	overflow: hidden;
	font-family: sans-serif;
	font-size: 8pt;
	margin-top : 37px;
}

#side_panel dl { /* actually, a box on the side panel */
	margin: 0;
	padding: 0;
}

#side_panel dl dd { /* body of one side box */
	color: #666666;
	font-weight: normal;
	font-size: 8pt;
	line-height: 1.2em;
	margin: 0 0 5px 0;
	padding: 6px;
	border: 1px solid #866C52;
}

#side_panel dl dd ul { /* a list in a side box */
	margin: 0 0 0 0.5em;
	padding: 0 0 0 1em; /* ok under IE, too much under firefox... */
	list-style-type: disc;
}

#side_panel dl dd ul li { /* space between links in a side box */
	margin: 0 0 3px 0;
	padding: 0;
}

#side_panel dl dt { /* used for titles of various boxes */
	color: #fff;
	font-weight: bold;
	font-size: 8pt;
	text-align: left;
	margin: 5px 0 0 0;
	padding: 2px 0px 2px 4px;
	borde: 1px solid #866C52;
	border-bottom: none;
}

#side_panel #main_menu dd {
  border : 1px solid #090708;
}

#main_menu dt {
 display : none;
}

#main_menu dd a {
 display : block;
 margin-bottom : 11px;
}

#main_menu .menutext {
 visibility : hidden;
 color: #AA1409;
 font-size : 1.3em;
}

#main_menu dd a:hover .menutext {
 visibility : visible;
}


#wrapper { /* contains everything */
	text-align: left;
}

#home #wrapper {
 position : absolute;
 top : 50%;
 left : 50%;
 width : 744px;
 height : 522px;
 margin : -258px 0 0 -335px;
}

@media screen { /* on large screen */

	#wrapper { /* limit the horizontal size of everything, and center it in the page */
		margin: 0 auto;
		padding: 0;
		width : 800px;

	}

}

/**
 * unique elements - may appear in one or several pages
 */

#featured { /* the navigation box for statically featured pages -- index.php, sections/view.php */
}


#header_slogan { /* appears towards the top of the page -- see template script */
	float: left;
	clear: left;
	margin: 0 0 0 9px;
	padding: 0;
	font-size: 8pt; /* we don't care to be not resized by IE */
	text-align: left;
}

#header_title { /* appears towards the top of the page -- see template script */
	color: #800;
	font-size: 12pt; /* we don't care to be not resized by IE */
	font-weight: bold;
	margin: 20px 0 4px -173px;
	padding: 0;
}

#header_title a { /* adapt the color to the backdrop image */
	color: #800;
}

#sections a.section { /* a link to a section, in some site map -- index.php, sections/index.php, sections/view.php */
	font-weight: bold;
}

#tools img { /* towards bottom of the page -- see articles/view.php */
	margin-right: 4px; /* space between icons and labels */
}

dl#user_menu dd ul { /* commands that apply to this user -- see template script */
	margin: 0;
	padding: 0;
	list-style: none;
}



#discover_detail {
  position : absolute;
  top: 55px;
  left : 99px;
  width : 250px;
  height : 250px;
  overflow : hidden;
}


#discover_manipulate {
  position : absolute;
  top : 340px;
  left : 51px;
  height : 300px;
  width : 300px;
  overflow : hidden;
}

#discover_model {
  position : absolute;
  right : -140px;
  top : 87px;
  height : 508px;
  width : 508px;
  overflow : hidden;
}

.mask {
 position : absolute;
 top : 0;
 left: 0;
 height : 100%;
 width : 100%;
}

.mask img {
 height:100%;
 width : 100%;
}

#discover .description {
 height : 650px;
}

#discover_navigate_next {
 top : 168px;
 left : 417px;
 height : 170px;
 width : 91px;
  z-index : 1;
}

#discover_navigate_prev {
 top : 163px;
 left : 0px;
 height : 183px;
 width : 92px;
 z-index : 1;
}

#discover_navigate_next div {
 position : absolute;
 top : 40%;
 height : 35px;
 left : 20px;
 border: 1px dotted transparent;
 /* visibility : hidden; */
}

#discover_navigate_prev div {
 position : absolute;
 top : 40%;
 height : 35px;
 right : 20px;
 border: 1px dotted transparent;
 /* visibility : hidden; */
}

#discover_navigate_prev:hover div, #discover_navigate_next:hover div{
 /* visibility : visible; */
 border: 1px dotted #555;
}

/**
 * styles by classes
 */

.boxTitle {
 color : #555;
}

.menu_bar { /* an horizontal menu of commands, below a section title */
	clear: left;
}

.thumbnail_image { /* float thumbnails to align them */
	height: 170px;	/* to align with actual thumbnail height set in configuration panel for skins */
	width: 160px;	/* to align with actual thumbnail width set in configuration panel for skins */
}

.hole {
   display : block;
   float : left;
   height : 170px;
   width : 160px;
   margin-right: 8px;
   color : #090708;
}

p.menu_bar a,
p.menu_bar a span,
p.menu_bar a:hover
 {background:none;}

#main_panel a.article {
    background: none;
    padding-right: 0;
}

.hide {visibility:hidden;}

#sections #share {display:none;}