
Warning: Undefined variable $core in /home/ssaftcom/php8.ssaft.com/Blog/dotclear/plugins/partager2/_widget.php on line 18
﻿body {
  font-family: Lato,"Open Sans","Segoe UI",Frutiger,"Frutiger Linotype","Dejavu Sans","Helvetica Neue",Arial,sans-serif;
  background-color: #333;
  background-image: url("img/fond.png");
  background-position: 50% top;
  color: #333;
  -webkit-hyphens: auto;
     -moz-hyphens: auto;
      -ms-hyphens: auto;
          hyphens: auto;
}

/* symbol */

@font-face {
  font-family: 'Mono Social Icons Font';
  src: url('font/MonoSocialIconsFont-1.10.eot');
  src: url('font/MonoSocialIconsFont-1.10.eot?#iefix') format('embedded-opentype'),
       url('font/MonoSocialIconsFont-1.10.woff') format('woff'),
       url('font/MonoSocialIconsFont-1.10.ttf') format('truetype'),
       url('font/MonoSocialIconsFont-1.10.svg#MonoSocialIconsFont') format('svg');
  src: url('font/MonoSocialIconsFont-1.10.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}

.symbol, a.symbol.before:before {
  font-family: 'Mono Social Icons Font';
  -webkit-text-rendering: optimizeLegibility;
     -moz-text-rendering: optimizeLegibility;
      -ms-text-rendering: optimizeLegibility;
       -o-text-rendering: optimizeLegibility;
          text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
     -moz-font-smoothing: antialiased;
      -ms-font-smoothing: antialiased;
       -o-font-smoothing: antialiased;
          font-smoothing: antialiased;
  font-weight: bold;
  text-decoration: none;
  font-size: 2rem;
  line-height: 2rem;
}

a.symbol.before:before {
  content: attr(title);
  margin-right: 0.3em;
  font-size: 130%;
}

a.symbol.before span { display:none; }

/* page */

#page {
  position: relative;
  width: 100%;
  background: #CECECE;
  box-shadow: 0 0 10px #000;
  margin: 0;
  padding: 1px;
}

/* banner js */

#bannerjs {
    width: 960px;
    height: 360px;
    overflow: hidden;
    transform: scale(0.395);
    transform-origin: 0 0;
    max-width: 50000px !important;
    position: absolute;
    top: 9px;
    left: 50%;
    margin-left: -192px;
}
.banner {
    margin-top: 146px;
}

@media screen and (min-width: 30rem) {
#bannerjs {
    transform: scale(0.501);
    margin-left: -243px;
}
.banner {
    margin-top: 186px;
}
}

@media screen and (min-width: 40rem) {
#bannerjs {
    transform: scale(0.67);
    margin-left: -322px;
}
.banner {
    margin-top: 250px;
}
}

@media screen and (min-width: 50rem) {
#bannerjs {
    transform: scale(0.834);
    margin-left: -402px;
}
.banner {
    margin-top: 308px;
}
}

@media screen and (min-width: 60rem) {
#bannerjs {
    transform: scale(1);
    left: 0rem;
    margin-left: 0;
    top: 0rem;
}
.banner {
    margin-top: 369px;
}
}

@media screen and (min-width: 60.3rem) {
#bannerjs {
    left: 1rem;
    top: 1rem;
}
}

@media screen and (min-width: 80rem) {
#bannerjs {
    transform: scale(1.334);
    left: auto;
    margin-left: 16px;
}
.banner {
    margin-top: 479px;
}
}

/* swf 

#bannerswf {
  height: 200px;
  background-image: url("./img/1.png");
  background-position: 50% 50%;
  background-size: cover;
  position: relative;
}

#bannerswf.ban1  { background-image: url("./img/1.png" ); }
#bannerswf.ban2  { background-image: url("./img/2.png" ); }
#bannerswf.ban3  { background-image: url("./img/3.png" ); }
#bannerswf.ban4  { background-image: url("./img/4.png" ); }
#bannerswf.ban5  { background-image: url("./img/5.png" ); }
#bannerswf.ban6  { background-image: url("./img/6.png" ); }
#bannerswf.ban7  { background-image: url("./img/7.png" ); }
#bannerswf.ban8  { background-image: url("./img/8.png" ); }
#bannerswf.ban9  { background-image: url("./img/9.png" ); }
#bannerswf.ban10 { background-image: url("./img/10.png"); }
#bannerswf.ban11 { background-image: url("./img/11.png"); }
#bannerswf.ban12 { background-image: url("./img/12.png"); }
#bannerswf.ban13 { background-image: url("./img/13.png"); }
#bannerswf.ban14 { background-image: url("./img/14.png"); }

#bannerswf span.open {
  display: none;
}

#swfdel, #bannerswf span {
  display: none;
}*/

/* ruffle 

#container_ruffle {
    width: 468px;
    height: 176px;
    overflow: hidden;
    background-image: url("./img/banner.png");
    background-size: 100% 100%;
}

@media screen and (min-width: 30rem) {
    #container_ruffle {
        width: 959px;
        height: 361px;
    }
}

@media screen and (min-width: 40rem) {
    #container_ruffle {
        width: 1280px;
        height: 482px;
    }
}

@media screen and (min-width: 50rem) {
    #container_ruffle {
        width: 1280px;
        height: 482px;
    }
}

#container { 
   width: 100%;
}

ruffle-player { 
   width: 100%;
   height: 100%;
}*/



/* title */

.banner { background: #3c352b; }
.banner h1 {
    text-align: center;
    padding: 0.5rem;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    margin: 0px;
}

a.site-title__link,
a.site-title__link:link,
a.site-title__link:visited {
  background-color: transparent;
  border-color: transparent;
  text-decoration: none;
  text-transform: uppercase;
}

.site-title__text {
    color: #c8ce67;
}

/*prelude  */

#prelude {
  display: none;
  text-align: center;
  margin: 0px;
  background: #fff;
}
#prelude li {
  list-style: none;
  display: inline-block;
  padding: 0 .5em .5em;
  font-size: .55em;
}
#prelude a:link, #prelude a:visited {
  color: #474747;
  text-decoration: none;
  text-transform: uppercase;
}
#prelude a:hover,
#prelude a:focus { color: #e4ba04; }

/* menu */

.header__nav {
  margin: 0px;
  padding: 0px;
  border: 0px none;
  overflow: hidden;
  clear: left;
  text-align: right;
  background: #618789;
}
.header__nav li {
    list-style-type: none;
    margin: 0px;
    display: inline-block;
    min-width: 6rem;
    width: 50%;
    font-size: 0.8rem;
    height: 3rem;
    line-height: 1rem;
}
.header__nav li:nth-child(2),
.header__nav li:nth-child(3) {
    background-color: #5A7577;
}
.header__nav li a {
  padding: 1rem;
  text-align: center;
  vertical-align: middle;
  width: 100%;
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: bold;
  color: #fff;
}
.header__nav li.active {
  background: rgba(255, 255, 255, 0.15);
}

.header__nav li a:hover,
.header__nav li a:focus {
  background-color: rgba(0, 0, 0, 0.1);
}

/* wrapper */

#wrapper {
    position: relative;
}

/* all content */

.content-inner {
    background: #fff;
    padding: 1rem;
}

.content-inner h3 {
    font-size: 1.6rem;
    letter-spacing: 0.1em;
}

/* post content */


.dc-post #sidebar {
    display: none;
}

.dc-post #main {
    width: 100%;
}

.post.simple {
  width: 100%;
  float: none;
  background: #FFF;
  z-index: 1;
  position: relative;
  margin-right: 1rem;
  padding: 1rem;
}

.post-content {
  padding-right: 2rem;
}

.post.simple .post-content h3,
.post.simple .post-content h4 {
  background: transparent;
  font-weight: bold;
}

.post-cat a {
  text-decoration: none;
  color: #888;
}
.post-cat:before {
  content: "› ";
}

.post-title {
  font-size: 1.6rem;
  letter-spacing: 0.1em;
}

.post-excerpt {
  margin-left: 0;
  border: 1px solid #1B97D1;
  border-width: 0 0 0 2px;
  padding-left: 1rem;
}

.footnotes {
  border: 2px dashed #FF4848;
  background: #FFB7B7;
  padding: 1rem;
  margin-bottom: 1rem;
}
  
.post-meta {
  color: #BBB;
}

.post-tags-item {
  list-style: none;
  display: inline;
}

/* comment */

.post-feedback {
  color: #D8D8D8;
  background: #333;
}

#comments {
  position: relative;
}

#comments-feed { margin: 0; }

.comments-list { margin: 0; }

#comments-feed .feed {
  position: absolute;
  right: 0px;
  top: 0.5rem;
}

.comment, .ping { list-style: none; }
.comment-number { display: none; }
.comment-info {
  background: #5A5A5A;
  padding: 0 1rem;
 }
.comment-content {
  padding: 0 1rem;
  text-align: justify;
}
.comment-content ins,
.comment-content .ins {
  background-color: rgba(62, 62, 46, 0.5);
  text-decoration: none;
}

.post-feedback h3 {
  font-size: 1rem;
  letter-spacing: 0.2em;
  padding: 1rem;
  margin: 0px;
  background: #454545;
  line-height: 1rem;
  text-align: left;
}

#comment-form {
  clear: both;
}
#comment-form .field label {
  margin: 0px 0px 0px 1rem;
}
#c_name,
#c_mail,
#c_site,
#c_content {
  width: 100%;
  border: 0px none;
  border-radius: 0px;
  vertical-align: baseline;
}
#c_help,
#comment-form .remember {
  padding-right: 1rem;
}
#comment-form .buttons {
  margin: 0px;
}
#comment-form button {
  border: 0px none;
  border-radius: 0px;
  background: #FFF;
  width: 100%;
  text-align: right;
  padding: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.1rem;
  font-weight: bold;
  cursor: pointer;
  margin-top: 1px;
}
#comment-form button.submit {
  background: #FF2502;
  color: #fff;
}

#comment-form .comment-preview {
    padding: 1rem 1rem 0 1rem;
    border-bottom: 1px solid #444;
    margin-bottom: 1rem;
}
.post-feedback .message {
    background: #a07063;
    text-align: center;
    padding: 1rem;
}

/* contact */

#comment-form .field label {
    margin: 0px 0px 0px 1rem;
    display: inline-block;
    width: 10em;
}

#comment-form .field input, #comment-form .field textarea {
    width: 27em;
}

/* rétrolien */

.send-ping { position: relative; }
#ping-url {
  margin: 0px;
}

/* home content */

.dc-home #wrapper {
    padding-top: 13rem;
}

.dc-home #content .post {
    position: relative;
    box-shadow: inset 0px -4px 4px -4px #000;
    background: #fff;
}

.dc-home .post-header {
  padding: 0.5rem 1rem;
  z-index: 10;
  position: relative;
  background: #FFF;
}
    
.dc-home .post .post-title {
    background: #FFF;
    letter-spacing: 0.15em;
    font-size: 1.1em;
    line-height: 1.2em;
    margin: 0px 0px 1rem;
}
    
.dc-home .post-title a {
  text-decoration: none;
}

.dc-home .post-day-date {
    color: #ADBCBC;
    border-left: 1px solid #ADBCBC;
    font-size: 0.8em;
    padding-left: 0.5rem;
    line-height: 1em;
    margin: 0px 0px 0.5rem;
}

.dc-home .post-read-it a {
    color: #ADBCBC;
    font-size: 0.8em;
    line-height: 2em;
    margin: 0px 0px 0.5rem;
    text-decoration:none;
}

.dc-home .post-firstimg img {
    background: rgb(255, 255, 255) none repeat scroll 0% 0%;
    object-fit: cover;
    -webkit-object-fit: cover;
    -o-object-fit: cover;
    width: 100%;
    height: 100%;
}

.dc-home .post-content {
  padding: 1rem;
  background: #fff;
}
.dc-home .post-content a {
  text-decoration:none;
}

.dc-home #content .post-info-co,
.dc-home #content .post-meta {
  display: none;
}

.votes td {
    padding: 8px;
    color: #A07063;
}

.votes .hasVote {
    text-align : center;
}

.votes .no, .votes .yes {
    background: rgb(147, 31, 31);
    color: rgb(255, 255, 255);
    font-weight: bold;
    padding: 0.2em 0.5em;
    border: 0px none;
}
.votes .yes {
    background: rgb(64, 182, 52);
}

/* pagination */

.navlinks,
.pagination {
  background: #a07063;
  margin: 0;
  text-align: center;
  position: relative;
}

.navlinks-part,
.pagination-part {
  display: inline-block;
  text-align: center;
  color: #FFF;
  text-transform: uppercase;
  font-size: 0.6rem;
  padding: 0.5rem;
}

.navlinks-part a,
.pagination-part a {
  text-decoration: none;
}

/* intro */

#blogextra {
  position: absolute;
  top: 0px;
  background: rgb(102, 102, 102);
  height: 13rem;
}

#blogextra .blogextra__title {
  display: none;
}

#blogextra .widget h3 {
  position: absolute;
  background: #FFF;
  margin: 0px;
  width: 100%;
  letter-spacing: 0.15em;
  font-size: 1.1em;
  line-height: 1.2em;
  padding: 0.5rem 1rem 0.5rem;
  bottom: 0;
  color: #000;
  position: relative;
  height: auto;
  font-size: 1em;
  top: 0;
  padding: 1rem;
}

#blogextra .widget p {
  padding: 1rem;
  color: #fff;
  margin: 0;
}


/* sidebar */

#sidebar {
  background: #373737;
  color: #FFF;
  width: 100%;
}
#sidebar .blognav__title {
  display: none;
}
#sidebar #blognav h4 {
  padding: 0 1rem;
  height: auto;
}

#sidebar #blognav>ul {
  margin: 0;
}
#sidebar #blognav ul {
  list-style: outside none none;
  padding: 1rem;
}
#sidebar #blognav ul a {
  text-decoration: none;
}

#sidebar h3,
#sidebar h4 {
  font-size: 1rem;
  letter-spacing: 0.2em;
  padding: 1rem;
  margin: 0px;
  background: #454545;
  line-height: 1rem;
  text-align: left;
}


#search form {
  font-size: 1px;
    background: transparent linear-gradient(90deg, rgb(255, 255, 255) 79%, rgb(204, 204, 204) 79%) repeat scroll 0% 0%;
}
#q {
  border: 0px none;
  width: 79%;
  height: 2rem;
  border-radius: 0;
background:transparent;
}
#search .submit {
  border: 0;
  width: 20%;
  margin: 0;
  padding: 0;
  height: 2rem;
  text-transform: uppercase;
  font-weight: bold;
background:transparent;
  border-radius: 0;
}

.sharefollow {
  font-size: 0px;
}
.sharefollow a {
  width: 25%;
  display: inline-block;
  background: #FFF none repeat scroll 0% 0%;
  text-align: center;
  height: 2rem;
  overflow: hidden;
}

.friend {
  text-align: left;
}

.friend a {
    display: inline-block;
    width: 6rem;
}

/* footer */

#gotop {
    display: block;
    position: fixed;
    background: #f00;
    margin: 0;
    width: 3rem;
    height: 3rem;
    line-height: 3rem;
    text-align: center;
    font-size: 2rem;
    border-radius: 0.5rem;
    opacity: 0.6;
    right: 1rem;
    bottom: 1rem;
    z-index: 1000;
}

#gotop a {
    text-decoration: none;
}

#footer {
  background: #1E1E1E;
  color: #fff;
  text-align: center;
  padding: 0.5rem;
}

#footer p { margin: 0; }

/* transition */
  
#wrapper, #blogextra {
  -webkit-transition: padding-top 0.5s ease-in 0.3s, height 0.5s ease-in 0.3s;
          transition: padding-top 0.5s ease-in 0.3s, height 0.5s ease-in 0.3s;
}
    
.banner h1 {
  -webkit-transition: font-size 0.5s ease-in;
          transition: font-size 0.5s ease-in;
}


/* media query */

@media screen and (min-width: 30rem) {
  
  #gotop { background: #0f0; }

  #bannerswf, #bannerswf.ban1, #bannerswf.ban2,
  #bannerswf.ban3, #bannerswf.ban4, #bannerswf.ban5,
  #bannerswf.ban6, #bannerswf.ban7, #bannerswf.ban8,
  #bannerswf.ban9, #bannerswf.ban10, #bannerswf.ban11,
  #bannerswf.ban12, #bannerswf.ban13, #bannerswf.ban14 {
    height: 241px;
    background-image: url("./img/banner.png");
    background-position: 0 0;
    -webkit-transition: height 0.5s ease-in 0.3s;
            transition: height 0.5s ease-in 0.3s;
  }
  
  .banner h1 {
    letter-spacing: 0.2em;
    font-size: 1.1em;
  }

  .header__nav li {
    width: 25%
  }
  .header__nav li:nth-child(4) {
    background-color: #5A7577;
  }
  .header__nav li:nth-child(3) {
    background-color: #618789;
  }
  
  .dc-home #wrapper { padding-top: 10rem; }
  .dc-home #blogextra { height: 10rem; }

  .dc-post #sidebar { display: none; }
  .dc-post #main {width: 100%;}
  
}

@media screen and (min-width: 40rem) {
  
  #gotop { background: #00f; }
    
  .banner h1 {
    font-size: 1.5rem;
  }
  
  #main {
    width: 66.6%;
    float: left;
  }
  #sidebar {
    margin-left: 66.6%;
    width: auto;
  }
  #blognav ul { margin-left: 0; }
  #blognav li span { display: none; }
  #blognav .friend a { width: 31.6%; }

  .dc-post #sidebar { display: none; }
  .dc-post #main {width: 100%;}
  
}

@media screen and (min-width: 50rem) {
  
  #gotop { background: #ff0; }
  
  #bannerswf, #bannerswf.ban1, #bannerswf.ban2,
  #bannerswf.ban3, #bannerswf.ban4, #bannerswf.ban5,
  #bannerswf.ban6, #bannerswf.ban7, #bannerswf.ban8,
  #bannerswf.ban9, #bannerswf.ban10, #bannerswf.ban11,
  #bannerswf.ban12, #bannerswf.ban13, #bannerswf.ban14 {
    height: 301px;
    text-align: center;
  }
  #swfdel {
  	width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
  }
  #bannerswf span { display: block; }
  #bannerswf span.open {
    color: #FFF;
    font-size: 4rem;
    font-weight: bold;
    line-height: 4rem;
    padding-top: 83px;
    text-shadow: 0 0 2px #000;
    opacity: 0;
    -webkit-transition: opacity 0.5s ease-in 0.1s;
            transition: opacity 0.5s ease-in 0.1s;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 10;
    cursor: pointer;
    position: absolute;
  }
  #bannerswf:hover span.open { opacity: 1; }
  #bannerswf span.close {
    right: 0.1rem;
    top: 0.1rem;
    display: block;
    z-index: 10;
    cursor: pointer;
    position: absolute;
  }
  #bannerswf span.close span { display: none; }
  #bannerswf span.close::before {
    content: "X";
    font-family: "Mono Social Icons Font";
    font-weight: bold;
    background: rgba(255, 255, 255, 0.37);
    border-radius: 0.1rem;
    height: 2rem;
    width: 2rem;
    display: block;
    padding: 0.5rem;
    line-height: 1rem;
    font-weight: 1rem;
  }
  #bannerswf span.close:hover::before {
    background: rgba(255, 255, 255, 0.60);
  }
    
  .dc-home #wrapper { padding-top: 0; }
  .dc-home #blogextra {
    position: relative;
    height: auto;
  }

  .dc-post #sidebar { display: none; }
  .dc-post #main {width: 100%;}
  
}
@media screen and (min-width: 60rem) {
  
  #gotop { background: #0ff; }

  #page {
    max-width: 62rem;
    margin: auto;
    padding: 1px;
  }
  .header {
    max-width: 60rem;
    margin: auto;
  }
  .banner h1 {
    font-size: 2.3rem;
  }
  
  #bannerswf, #bannerswf.ban1, #bannerswf.ban2,
  #bannerswf.ban3, #bannerswf.ban4, #bannerswf.ban5,
  #bannerswf.ban6, #bannerswf.ban7, #bannerswf.ban8,
  #bannerswf.ban9, #bannerswf.ban10, #bannerswf.ban11,
  #bannerswf.ban12, #bannerswf.ban13, #bannerswf.ban14 {
    height: 361px;
  }
  #bannerswf span.open {
    font-size: 5rem;
    padding-top: 144px;
  }
    
  #wrapper {
    max-width: 60rem;
    margin: 1rem auto;
  }
  #main { width: 39.6rem; }
  #sidebar {
    margin-left: 40.7rem;
    width: 19.3rem;
  }
  
  .dc-home #content .post {
    width: 19.3rem;
    max-width: 19.3rem;
    height: 23rem;
    float: left;
    box-shadow: none;
    overflow: hidden;
    margin: 0px 0px 1rem 1rem;
  }
  
  .dc-home #content .post:nth-child(2n-1) {
    margin: 0 0 1rem;
  }

  .dc-home .post-firstimg {
    position: absolute;
    top: 0;
    -webkit-transition: top 0.5s ease-in;
            transition: top 0.5s ease-in;
  }

  .dc-home #content .post:hover .post-firstimg {
    top: 20rem;
  }


  .dc-home .post-firstimg a {
    display: block;
    width: 19.3rem;
    height: 23rem;
    padding-top: 4rem;
  }

  .dc-post #sidebar { display: none; }
  .dc-post #main {width: 100%;}

  #ping-url {
    margin: 0px;
    position: absolute;
    margin-top: -2.2rem;
    right: 1rem;
  }
  
}

@media screen and (min-width: 60.3rem) {
#page { padding: 1rem 0 0; }
}

@media screen and (min-width: 62.3rem) {
#page { margin: 1rem auto; }
}

@media screen and (min-width: 80rem) {
  
  #gotop { background: #000; }

  #page {
    max-width: 82rem;
    padding: 1px;
    margin: auto;
  }
  .header, #wrapper { max-width: 80rem; }

  #bannerswf, #bannerswf.ban1, #bannerswf.ban2,
  #bannerswf.ban3, #bannerswf.ban4, #bannerswf.ban5,
  #bannerswf.ban6, #bannerswf.ban7, #bannerswf.ban8,
  #bannerswf.ban9, #bannerswf.ban10, #bannerswf.ban11,
  #bannerswf.ban12, #bannerswf.ban13, #bannerswf.ban14 {
    height: 482px;
  }
  #bannerswf span.open {
    font-size: 7rem;
    padding-top: 201px;
  }

  #main { width: 59.8rem; }
  #sidebar {
    margin-left: 60.7rem;
    width: 19.25rem;
    position: relative;
  }

  .dc-home #content .post {
    width: 19.25rem;
    max-width: 19.25rem;
  }

  .dc-home #content .post:nth-child(2n-1) {
    margin: 0px 0px 1rem 1rem;
  }

  .dc-home #content .post:nth-child(3n-2) {
    margin: 0 0 1rem;
  }

  /* rétrolien */
  
  .send-ping { position: relative; }
  #ping-url {
    margin: 0px;
    position: absolute;
    margin-top: -2.2rem;
    right: 1rem;
  }

  .dc-post #sidebar { display: none; }
  .dc-post #main {width: 100%;}
  
}

@media screen and (min-width: 80.3rem) {
#page { padding: 1rem 0 0; }
}

@media screen and (min-width: 82.3rem) {
#page { margin: 1rem auto; }
}