/* fonts */

@font-face {
    font-family: 'OmnesRegular';
    src: url('../fonts/omnes-webfont.eot');
    src: url('../fonts/omnes-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/omnes-webfont.woff') format('woff'),
        url('../fonts/omnes-webfont.ttf') format('truetype'),
        url('../fonts/omnes-webfont.svg#OmnesRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OmnesMedium';
    src: url('../fonts/omnes_medium-webfont.eot');
    src: url('../fonts/omnes_medium-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/omnes_medium-webfont.woff') format('woff'),
        url('../fonts/omnes_medium-webfont.ttf') format('truetype'),
        url('../fonts/omnes_medium-webfont.svg#OmnesMedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OmnesLight';
    src: url('../fonts/omnes_light-webfont.eot');
    src: url('../fonts/omnes_light-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/omnes_light-webfont.woff') format('woff'),
        url('../fonts/omnes_light-webfont.ttf') format('truetype'),
        url('../fonts/omnes_light-webfont.svg#OmnesLight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OmnesBold';
    src: url('../fonts/omnes_bold-webfont.eot');
    src: url('../fonts/omnes_bold-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/omnes_bold-webfont.woff') format('woff'),
        url('../fonts/omnes_bold-webfont.ttf') format('truetype'),
        url('../fonts/omnes_bold-webfont.svg#OmnesBold') format('svg');
    font-weight: normal;
    font-style: normal;
}

header ul.nav li a, header a.brand {
    font: normal 1.4em OmnesMedium,Arial,sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    font-family: OmnesMedium,Arial,sans-serif;
}

#top {
    position: absolute;
    top: 0;
}

/* Footer
-------------------------------------------------- */

.footer {
    padding: 70px 0;
    border-top: 1px solid #e5e5e5;
    background-color: #f5f5f5;
}
@media (max-width: 767px) {
    .footer {
        padding: 10px 10px;
        margin-right: -20px;
        margin-left: -20px;
    }  
}
.footer p {
    margin-bottom: 0;
    color: #777;
}
.footer-links {
    margin: 10px 0;
}
.footer-links li {
    display: inline;
    margin-right: 10px;
}



/* List thumb
-------------------------------------------------- */
.thumbnail {
    position: relative;
}

.thumbnail .fb-like{
    float: right;
}
.thumbnail .rating-wrapper{
    float: left;
}

.thumbnail .vote-box {
    padding: 0;
}

.thumbnail .like-box {
    position: absolute;
    top: 2px;
    left: 0;
    z-index: 100;
    margin-right: auto;
    margin-left: auto;
    vertical-align: middle;
    width: 100%;
    background-color: rgba( 255, 255, 255, .7 );
    border-radius: 12px;
}

.thumbnail .inner-like-box {
    padding: 2px;
}

.list .thumbnail .stats {
    position: absolute;
    right: 2px;
    bottom: 0;
    z-index: 100;
    margin-right: auto;
    margin-left: auto;
    vertical-align: middle;
    width: 98%;
    text-align: right;
}

.thumbnail h1.seo, .thumbnail h1.seo small {
    font-size: 17px;
    line-height: 19px;
    word-wrap: break-word; 
    text-align: justify;
}

.list .thumbnail .download {
    font-size: 17px;
    font-weight: bold;
}

.list .thumbnail.male {
    border-color: #3A87AD;
}
.list .thumbnail.female {
    border-color: #ff358b;
}
.list .thumbnail.female .badge.badge-info {
    background-color: #ff358b;
}
.thumbnail > audio {
    display: block;
    margin-right: auto;
    margin-left: auto;
    vertical-align: middle;
    width: 100%;
    max-width: 100%;
    /*height: auto;*/
}

.thumbnail > object {
    display: block;
    margin-right: auto;
    margin-left: auto;
    vertical-align: middle;
}

object.lecteur-mp3 {
    width: 200px;
    height: 20px;
}

div.video {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    z-index: 0;
}

div.video iframe, div.video object, div.video embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.entry-content img, .entry-content iframe, .entry-content object, .entry-content embed {
    max-width: 100%;
}

/* Large desktop */
@media (min-width: 1200px) {

}

/* netbook */
@media (min-width: 980px) and (max-width: 1199px) {

}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {

}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {

}

/* Landscape phones and down */
@media (max-width: 480px) {
    
}

.thumbnail img {
    max-width: 100%;
    height: auto;
    width: auto;
    box-sizing: border-box;
}

/*.list .thumbnail img {
    max-height: 145px;
    min-height: 145px;
}

.detail .thumbnail img {
    max-height: 400px;
    min-height: 400px;
}*/

.carousel.homepage img {
    max-height: 400px;
    min-height: 400px;
    display: block;
    margin-right: auto;
    margin-left: auto;
    vertical-align: middle;
    border: none;
}

#music-carousel {
    background-color: #EEE;
}

/* Loader
--------------------------------------------------- */
/* Start by setting display:none to make this hidden.
   Then we position it in relation to the viewport window
   with position:fixed. Width, height, top and left speak
   speak for themselves. Background we set to 80% white with
   our animation centered, and no-repeating */
.loader {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 100, 100, 100, .8 ) 
        url('/images/template/ajax-loader.gif') 
        50% 50% 
        no-repeat;
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading {
    overflow: hidden;   
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .loader {
    display: block;
}

/* Menu
--------------------------------------------------- */

.left-sidenav .icon-chevron-right {
    float: right;
    margin-top: 2px;
    margin-right: -6px;
    opacity: .25;
}

.left-sidenav {
    margin: 30px 0 0;
    padding: 0;
    background-color: white;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .065);
    -moz-box-shadow: 0 1px 4px rgba(0,0,0,.065);
    box-shadow: 0 1px 4px rgba(0, 0, 0, .065);
}
/* Social */
/*.fb-comments, .fb-comments iframe[style], .fb-comments span[style] {width: 100% !important;}
.fb-activity, .fb-activity iframe[style], .fb-activity span[style] {width: 100% !important;}*/

/* This element holds injected scripts inside iframes that in some cases may stretch layouts. So, we're just hiding it. */
#fb-root {
  display: none;
}

/* To fill the container and nothing else */
.responsive-fb .fb_iframe_widget, .responsive-fb .fb_iframe_widget span, .responsive-fb .fb_iframe_widget span iframe[style] {
  width: 100% !important;
}

#my-bddmusics-top {
    padding-top: 6px;
}

#my-bddmusics-btn {
    margin-top: 0;
}

#my-bddmusics-top .partager {
    float: right;
}

#my-bddmusics-top .partager .share {
    float: left;
    max-width: 110px;
    overflow: hidden;
    padding-left: 2px;
}

#my-bddmusics-top .partager .label {
    float: left;
}

#my-bddmusics-top .connect-fb {
    float: left;
}

#my-bddmusics-top .caption-text {
    float: left;
    padding-left: 2px;
    padding-top: 5px;
    font-weight: bold;
    color: #29447E;
}