@charset "UTF-8";
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS framework
 * (en) central stylesheet
 */

/* ************************************************************************************************** */
/* import core styles | Basis-Stylesheets einbinden */
/* ************************************************************************************************** */
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 * (en) YAML core stylesheet
 *
 * Don't make any changes in this file!
 */

@media all
{
 /**
  * @section browser reset
  * @see     http://www.yaml.de/en/documentation/css-components/base-stylesheet.html
  */

  /* (en) Global reset of paddings and margins for all HTML elements */
  * { margin:0; padding:0; }

  /* (en) Correction:margin/padding reset caused too small select boxes. */
  option { padding-left:0.4em; } /* LTR */
  select { padding:1px; }

 /**
  * (en) Global fix of the Italics bugs in IE 5.x and IE 6
  */
  * html body * { overflow:visible; }
  * html iframe, * html frame { overflow:auto; }
  * html frameset { overflow:hidden; }

  body {
    /* (en) Fix for rounding errors when scaling font sizes in older versions of Opera browser */
    font-size:100.01%;

    /* (en) Standard values for colors and text alignment */
    background:#fff;
    color:#000;
    text-align:left; /* LTR */
  }

  /* (en) avoid visible outlines on DIV containers in Webkit browsers */
  div { outline:0 none; }

  /* (en) Clear borders for <fieldset> and <img> elements */
  fieldset, img { border:0 solid; }

  /* (en) new standard values for lists, blockquote and cite */
  ul, ol, dl { margin:0 0 1em 1em; } /* LTR */
  li {
    line-height:1.5em;
    margin-left:0.8em; /* LTR */
  }

  dt { font-weight:bold; }
  dd { margin:0 0 1em 0.8em; } /* LTR */

  blockquote { margin:0 0 1em 0.8em; } /* LTR */

  blockquote:before, blockquote:after,
  q:before, q:after { content:""; }

 /*------------------------------------------------------------------------------------------------------*/
 /**
  * @section clearing methods
  * @see     http://yaml.de/en/documentation/basics/general.html
  */

  /* (en) clearfix method for clearing floats */
  .clearfix:after {
    clear:both;
    content:".";
    display:block;
    font-size:0;
    height:0;
    visibility:hidden;
  }

  /* (en) essential for Safari browser !! */
  .clearfix { display:block; }

  /* (en) alternative solution to contain floats */
  .floatbox { overflow:hidden; }

  /* (en) IE-Clearing:Only used in Internet Explorer, switched on in iehacks.css */
  #ie_clearing { display:none; }

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

 /**
  * @section hidden elements | Versteckte Elemente
  * @see     http://www.yaml.de/en/documentation/basics/skip-links.html
  *
  * (en) skip links and hidden content
  */

  /* (en) classes for invisible elements in the base layout */
  .skip, .hideme, .print {
    position:absolute;
    top:-32768px;
    left:-32768px; /* LTR */
  }

  /* (en) make skip links visible when using tab navigation */
  .skip:focus, .skip:active {
    position:static;
    top:0;
    left:0;
  }

  /* skiplinks:technical setup */
  #skiplinks { 
    position:absolute;
    top:0px; 
    left:-32768px; 
    z-index:1000; 
    width:100%;
    margin:0; 
    padding:0; 
    list-style-type:none;   
  }
  
  #skiplinks a.skip:focus,
  #skiplinks a.skip:active {
    left:32768px; 
    outline:0 none;
    position:absolute; 
    width:100%;
  }  
}

@media screen, projection
{

 /**
  * @section base layout | Basis Layout
  * @see     http://www.yaml.de/en/documentation/css-components/base-stylesheet.html
  *
  * |-------------------------------|
  * | #header                       |
  * |-------------------------------|
  * | #col1   | #col3     | #col2   |
  * | 200 px  | flexible  | 200px   |
  * |-------------------------------|
  * | #footer                       |
  * |-------------------------------|
  */

  #header { position:relative; }

  /* (en) Text Alignment for #topnav content */
  #topnav { text-align:right; }  /* LTR */

  /* (en) Absolute positioning only within #header */
  #header #topnav {
    position:absolute;
    top:10px;
    right:10px; /* LTR */
  }

  /* (en) Backup for correct positioning */
  #header, #nav, #main, #footer { clear:both; }

  #col1 { float:left; width:200px; }
  #col2 { float:right; width:200px; }
  #col3 { width:auto; margin:0 200px; }

  /* (en) Preparation for absolute positioning within content columns */
  #col1_content, #col2_content, #col3_content { position:relative; }

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

 /**
  * @section subtemplates
  * @see     http://www.yaml.de/en/documentation/practice/subtemplates.html
  */
  .subcolumns { width:100%; overflow:hidden; }

  /* (en) alternative class for optional support of old Mozilla/Netscape browers */
  .subcolumns_oldgecko { width:100%; float:left; }

  .c20l, .c25l, .c33l, .c40l, .c38l, .c50l, .c60l, .c62l, .c66l, .c75l, .c80l { float:left; }
  .c20r, .c25r, .c33r, .c40r, .c38r, .c50r, .c60r, .c66r, .c62r, .c75r, .c80r { float:right; margin-left:-5px; }

  .c20l, .c20r { width:20%; }
  .c40l, .c40r { width:40%; }
  .c60l, .c60r { width:60%; }
  .c80l, .c80r { width:80%; }
  .c25l, .c25r { width:25%; }
  .c33l, .c33r { width:33.333%; }
  .c50l, .c50r { width:50%; }
  .c66l, .c66r { width:66.666%; }
  .c75l, .c75r { width:75%; }
  .c38l, .c38r { width:38.2%; }
  .c62l, .c62r { width:61.8%; }

  .subc  { padding:0 0.5em; }
  .subcl { padding:0 1em 0 0; }
  .subcr { padding:0 0 0 1em; }

  .equalize, .equalize .subcolumns { overflow:visible; display:table; table-layout:fixed; }

  .equalize > div {
    display:table-cell;
    float:none; 
    margin:0; 
    overflow:hidden;
    vertical-align:top;
  }
}

@media print
{
 /**
  * (en) float clearing for .floatbox and subtemplates. Uses display:table to avoid bugs in FF & IE
  */

  .subcolumns > div,
  .floatbox { 
    overflow:visible; 
    display:table;
  } 

  /* (en) make .print class visible */
  .print { 
    position:static; 
    left:0;
  }

  /* (en) generic class to hide elements for print */
  .noprint { display:none !important; }
}

/* ************************************************************************************************** */
/* import screen layout | Screen-Layout einbinden */
/* ************************************************************************************************** */
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 *
 * (en) Template for designing a screen layout
 */

@media screen, projection
{
  /** 
   * (en) Forcing vertical scrollbars in IE8, Firefox, Webkit & Opera 
   */

  body { overflow-y:scroll; }

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

 /**
  * Design of the Basic Layout | Gestaltung des YAML Basis-Layouts
  *
  * @section layout-basics
  */

  /* Page margins and background */
  body { text-align: center; background:#3F302B;}
  .page_margins { text-align:left; margin: 0 auto; }

  /* Layout:Width, Background, Border */
  .page_margins { 
    width: 960px;
    min-width:inherit;
    max-width:none	
  }
  /* plus de fili sur le courant (background-url/repeat/position + color = transparent) mais fili sur la une */
  .page{ 
  background-color: #FAFAFA;
}

  /* Design of the Main Layout Elements */
  #header {  }
  #topnav {  }

  #main { 
  width:100%; float:left; 
  background-color: transparent;
  background-image:  url(https://www.indierockmag.com/interface/back_rabat.png);
  background-repeat:repeat-y;
  background-position:left;
  }

  #footer { 
  background-color: transparent;
  background-image:  url(https://www.indierockmag.com/interface/back_rabat.png);
  background-repeat:repeat-y;
  background-position:left;  }

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

 /**
  * Formatting of the Content Area | Formatierung der Inhaltsbereichs
  *
  * @section layout-main
  */


/* #col1 becomes the middle column */
  #col1 { width: 640px; float:right; margin-left: -640px; margin-right: 0px;}
  #col1_content { padding-left: 10px; padding-right: 10px }

  /* #col2 becomes the right column */
  #col2 { width: 0px; float:right; margin-right: 0%;}
  #col2_content { padding-left: 10px; padding-right: 20px }

  /* #col3 becomes the left column */
  #col3 {  float:left; width: 320px; margin-left: 0; margin-right: -5px; }
  #col3_content { padding-left: 5px; padding-right: 10px; }

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

 /**
  * Design of Additional Layout Elements 
  *
  * @section layout-misc
  */
  .altertop {font-size: 11px; background-color : #EFEFEF; margin:5px; padding:2px;}
  .alteritw {line-height:1.5em; font-size: 12px; background-color : #F5F5F5; padding: 0px 25px 10px 25px;}
  .logoleft{float:left; padding: 10px 10px 10px 10px;}
  .logoright{float:right; padding: 10px 10px 10px 10px;}
  .spip_documents_left{float:left; padding: 0px 10px 10px 10px;}
  .spip_documents_right{float:left; padding: 0px 10px 10px 10px;}
  .spip_documents img{padding-bottom:1em;}
  .oembed object{padding:0.2em 0px 1em 0px}
  .article2 .spip_logos { margin: 0; padding: 1em; border: 0; }
  .spacer {clear: both;}
  .une {
  background-color: transparent;
  background-image: url(https://www.indierockmag.com/interface/fili3.jpg);
  background-repeat:repeat-y;
  background-position:left;
  }
  .pagination {background-color:#3A3A3A; color:#FFF; font-size:1.4em;}
  .pagination a, .pagination a:visited {color: #FFF;}
  .pagination a:hover {color: #E9E2DC;}
  .titleb {
	color: #444;
	border-bottom: 6px double Gray;
	font: bold 18px Verdana, Geneva, Arial, Helvetica, sans-serif;
	padding: 0px 15px 0px 5px;
	margin-bottom : 12px;
}
.article2 {
	font-size: 1.1em;
	line-height: 1.5em;
}

.auteurlf {
	float: right;
	border: 1px dotted #444;
	padding: 10px;	
	color: #444;
	margin: 10px;
	width: 250px;
	text-align: left;
	font-size: 11px;
}
  .playlist {
	float: right;
	background-color: #F4F4E8;
	border: 2px solid Gray;
	margin-left: 1em;
	padding: 8px;
	font-size: 10px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	width: 180px;
	text-align : left;
}

.justleft p {line-height: 1.8em}

  .playlist a, .playlist img, .playlist a:link IMG, .playlist a:visited IMG, .playlist a:hover IMG, .playlist a:active IMG {
	color: #444;
	text-decoration: none;
	border-width: 0;
	display:block; /*allows the element to take auto margins*/ 
	margin:1px auto; /*centers in compliant browsers*/ 
	text-align:center; /*centers in old versions of IE*/ 
}
  .poi { color: 000;
text-decoration: none;
font-size: 18px;
}
  .logocd{float:left;}
  a:hover span{text-decoration:none; padding-top:3px; border-top: 1px dotted; padding-bottom:3px; border-bottom:1px dotted}
  .lr_une {list-style: none outside none; margin-left: -0.3em; font-size: 1.3em; font-weight:bold;}  
  .lr_mire {font-size: 1.1em; font-weight:bold}
  .lr_meds {list-style: none outside none, font-size: 1.1em; font-weight:bold}  
  .rub {text-align:right;}
.img-desc {
	position: relative;
	float: left;
	margin-right: 10px;
}
.img-desc p {
	float: left;
	background: #222;
	-moz-opacity:.65;
	filter:alpha(opacity=65);
	opacity:.65;
	color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 10px 15px 0px 15px;
	margin: 0;
	border-top: 1px solid #999;
}
.img-desc p span {
	float: left;
	padding: 5px 10px;
	font-size:1.1em;
	font-weight:bold;
}

/* Text between <hr> tag */

hr.style-four {
padding: 0;
margin-bottom : 1em;
border-top: medium double #333;
border-bottom: medium double #333;
color: #333;
text-align: center;
}
hr.style-four:after {
content: "vous aimerez aussi ... ";
display: inline-block;
position: relative;
font-size: 1.2em;
padding: 0 0.25em;
background: white;
}

 /**
  * ------------------------------------------------------------------------------------------------- #
  *
  * Skiplinks 
  *
  * (en) Visual styling for skiplink navigation
  *
  * @section content-skiplinks
  */
  
  #skiplinks a.skip:focus,
  #skiplinks a.skip:active { 
	color:#fff; 
	background:#333; 
	border-bottom:1px #000 solid;
	padding:10px 0;
	text-decoration:none;
  }  
}


/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 *
 * (en) Uniform design of standard content elements
 */

@media all
{
 /**
  * Fonts
  *
  * (en) global settings of font-families and font-sizes
  *
  * @section content-global-settings
  */

  /* (en) reset font size for all elements to standard (16 Pixel) */
  html * { font-size:100.01%; }

 /**
  * (en) reset monospaced elements to font size 16px in all browsers
  * @see: http://webkit.org/blog/67/strange-medium/
  */

  textarea, pre, code, kbd, samp, var, tt {
    font-family:Consolas, "Lucida Console", "Andale Mono", "Bitstream Vera Sans Mono", "Courier New", Courier;
  }

  /* (en) base layout gets standard font size 12px */
  body {
    font-family:Arial, Helvetica, sans-serif;
    font-size:75.00%;
    color:#444;
  }

  /*--- Headings  ------------------------------------------------------------------------*/

  h1,h2,h3,h4,h5,h6 {
    font-family:"Times New Roman", Times, serif;
    font-weight:normal;
    color:#222;
    margin:0 0 0.25em 0;
  }

  h1 { font-size:250%; }                       /* 30px */
  h2 { font-size:150%; line-height:1.5em; }	   /* 18px */
  h3 { font-size:150%; clear:both;}            /* 18px */
  h4 { font-size:133.33%; }                    /* 16px */
  h5 { font-size:116.67%; }                    /* 14px */
  h6 { font-size:116.67%; }                    /* 14px */

  /* --- Lists -------------------------------------------------------------------------------- */

  ul, ol, dl { line-height:1.5em; margin:0 0 1em 1em; }
  ul { list-style-type:disc; }
  ul ul { list-style-type:circle; margin-bottom:0; }

  ol { list-style-type:decimal; }
  ol ol { list-style-type:lower-latin; margin-bottom:0; }

  li { margin-left:0.8em; line-height:1.5em; }

  dt { font-weight:bold; }
  dd { margin:0 0 1em 0.8em; }

  /* --- general text formatting ------------------------------------------ */

  p { line-height:1.5em; margin:0 0 1em 0; font-size: 1.1em}

  blockquote, cite, q {
    font-family:Georgia, "Times New Roman", Times, serif;
    font-style:italic;
  }
  blockquote { margin:0 0 1em 1.6em; color:#666; }

  strong,b { font-weight:bold; }
  em,i { font-style:italic; }

  big { font-size:116.667%; }
  small { font-size:91.667%; }
 
  pre { line-height:1.5em; margin:0 0 1em 0; }
  pre, code, kbd, tt, samp, var { font-size:100%; }
  pre, code { color:#800; }
  kbd, samp, var, tt { color:#666; font-weight:bold; }
  var, dfn { font-style:italic; }

  acronym, abbr {
    border-bottom:1px #aaa dotted;
    font-variant:small-caps;
    letter-spacing:.07em;
    cursor:help;
  }

  sub, sup { font-size:91.6667%; line-height:0; }

  hr {
    color:#fff;
    background:transparent;
    border:0;
    border-bottom:1px #eee solid;
    clear:both;
  }

  /*--- Links ----------------------------------------------------------------------------------------- */

  a { color:#4D87C7; background:transparent; text-decoration:none; }
  a:visited  { color:#036; }

  /* (en) maximum constrast for tab focus - change with great care */
  a:focus { text-decoration:underline; outline: 1px 444 dotted; }
  a:hover,
  a:active { color:#182E7A; text-decoration:underline; outline: 0 none; }

  /* --- images (with optional captions) ------------------ */

  p.icaption_left { float:left; display:inline; margin:0 1em 0.15em 0; }
  p.icaption_right { float:right; display:inline; margin:0 0 0.15em 1em; }

  p.icaption_left img,
  p.icaption_right img { padding:0; border:1px #888 solid; }

  p.icaption_left strong,
  p.icaption_right strong { display:block; overflow:hidden; margin-top:2px; padding:0.3em 0.5em; background:#eee; font-weight:normal; font-size:91.667%; }

 /**
  * ------------------------------------------------------------------------------------------------- #
  *
  * Generic Content Classes
  *
  * (en) standard classes for positioning and highlighting
  *
  * @section content-generic-classes
  */

  .highlight { color:#c30; }
  .dimmed { color:#888; }

  .info { background:#f8f8f8; color:#666; padding:10px; margin-bottom:0.5em; font-size:91.7%; }

  .note { background:#efe; color:#040; border:2px #484 solid; padding:10px; margin-bottom:1em; }
  .important { background:#ffe; color:#440; border:2px #884 solid; padding:10px; margin-bottom:1em; }
  .warning { background:#fee; color:#400; border:2px #844 solid; padding:10px; margin-bottom:1em; }

  .float_left { float:left; display:inline; margin-right:1em; margin-bottom:0.15em; }
  .float_right { float:right; display:inline; margin-left:1em; margin-bottom:0.15em; }
  .center { display:block; text-align:center; margin:0.5em auto; }

 /**
  * ------------------------------------------------------------------------------------------------- #
  *
  * Tables | Tabellen
  *
  * (en) Generic classes for table-width and design definition
  *
  * @section content-tables
  */

  table { width:auto; border-collapse:collapse; margin-bottom:0.5em; }
  table caption { font-variant:small-caps; }
  table.full { width:95%; }
  table.fixed { table-layout:fixed; }

  th,td { padding:0.5em; }
/**  thead th { color:#000; border-bottom:2px #800 solid; }
  tbody th { background:#e0e0e0; color:#333; }
  tbody th[scope="row"], tbody th.sub { background:#f0f0f0; }

  tbody th { border-bottom:1px solid #fff; text-align:left; }
  tbody td { border-bottom:0px solid #eee; }

  tbody tr:hover th[scope="row"],
  tbody tr:hover tbody th.sub { background:#f0e8e8; } */

 /**
  * ------------------------------------------------------------------------------------------------- #
  *
  * Miscellaneous 
  * @section content-misc
  */

 /**
  * (en) Emphasizing external Hyperlinks via CSS
  *
  * @section             content-external-links
  * @app-yaml-default    disabled
  */

  /*
  #main a[href^="http://www.my-domain.com"],
  #main a[href^="https://www.my-domain.com"]
  {
    padding-left:12px;
    background-image:url('your_image.gif');
    background-repeat:no-repeat;
    background-position:0 0.45em;
  }
  */
}







/* ************************************************************************************************** */
/* import print layout | Druck-Layout einbinden */
/* ************************************************************************************************** */
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 *
 * (en) print stylesheet
 */

@media print
{
 /**
  * @section basic layout preparation
  * @see     http://www.yaml.de/en/documentation/css-components/layout-for-print-media.html
  */

  /* (en) change font size unit to [pt] - avoiding problems with [px] unit in Gecko based browsers  */
  body { font-size:10pt; }

  /* (en) Hide unneeded container of the screenlayout in print layout */
  #topnav, #nav, #search { display:none; }

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

  /* (en) Avoid page breaks right after headings */
  h1,h2,h3,h4,h5,h6 { page-break-after:avoid; }

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

 /**
  * @section column selection
  * (en) individually switch on/off any content column for printing
  *
  * @see     http://www.yaml.de/en/documentation/css-components/layout-for-print-media.html
  */

  #col1, #col1_content { float:none; width:100%; margin:0; padding:0; border:0; }
  #col2 { display:none; }
  #col3 { display:none; }

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

  /* (en) optional output of acronyms and abbreviations*/

  /*
    abbr[title]:after, 
    acronym[title]:after { content:'(' attr(title) ')'; }
  */

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

  /* (en) optional URL output of hyperlinks in print layout */
  /*
  a[href]:after {
    content:" <URL:"attr(href)">";
    color:#444;
    background:inherit;
    font-style:italic;
  }
  */
}