/* ---------------------------------------------------------------------- */ /* Icon Font Import /* ---------------------------------------------------------------------- */ /* ---------Définition des polices utilisées ------------*/ @font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 400; src: local('Playfair Display'), local('PlayfairDisplay-Regular'), url(http://fonts.gstatic.com/s/playfairdisplay/v10/2NBgzUtEeyB-Xtpr9bm1CcNrJpg6AaJyP6Je_ycicWc.woff) format('woff'); } @font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 700; src: local('Playfair Display Bold'), local('PlayfairDisplay-Bold'), url(http://fonts.gstatic.com/s/playfairdisplay/v10/UC3ZEjagJi85gF9qFaBgIMt7VdvTyqNcZpjraknz5WE.woff) format('woff'); } @font-face { font-family: 'Playfair Display'; font-style: italic; font-weight: 400; src: local('Playfair Display Italic'), local('PlayfairDisplay-Italic'), url(http://fonts.gstatic.com/s/playfairdisplay/v10/9MkijrV-dEJ0-_NWV7E6N0jkdXy5UNqU9EkYFZX4vIU.woff) format('woff'); } @font-face { font-family: 'Playfair Display'; font-style: italic; font-weight: 700; src: local('Playfair Display Bold Italic'), local('PlayfairDisplay-BoldItalic'), url(http://fonts.gstatic.com/s/playfairdisplay/v10/n7G4PqJvFP2Kubl0VBLDEOupD9FCADMmu1K_5xLiQB6glnMp3_3A8V8Ai8YosRtX.woff) format('woff'); } @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src: local('Lato Regular'), local('Lato-Regular'), url(http://fonts.gstatic.com/s/lato/v11/2V_mouV5odI0UgtVODTOwvesZW2xOQ-xsNqO47m55DA.woff) format('woff'); } @font-face { font-family: 'Lato'; font-style: normal; font-weight: 700; src: local('Lato Bold'), local('Lato-Bold'), url(http://fonts.gstatic.com/s/lato/v11/sccV8o9st-AMv7Su44YKKQLUuEpTyoUstqEm5AMlJo4.woff) format('woff'); } @font-face { font-family: 'Lato'; font-style: italic; font-weight: 400; src: local('Lato Italic'), local('Lato-Italic'), url(http://fonts.gstatic.com/s/lato/v11/NdyT62s2uoMQ_OHiZ3MeDevvDin1pK8aKteLpeZ5c0A.woff) format('woff'); } @font-face { font-family: 'Lato'; font-style: italic; font-weight: 700; src: local('Lato Bold Italic'), local('Lato-BoldItalic'), url(http://fonts.gstatic.com/s/lato/v11/AcvTq8Q0lyKKNxRlL28Rn7O3LdcAZYWl9Si6vvxL-qU.woff) format('woff'); } @font-face { font-family: 'OpenSansSemibold'; src: url('font/OpenSans-Semibold-webfont.eot'); src: url('font/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'), url('font/OpenSans-Semibold-webfont.woff') format('woff'), url('font/OpenSans-Semibold-webfont.ttf') format('truetype'), url('font/OpenSans-Semibold-webfont.svg#OpenSansSemibold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'BallparkWeiner'; src: url('polices/ballpark.eot'); src: url('polices/ballpark.eot?#iefix') format('embedded-opentype'), url('polices/ballpark.woff') format('woff'), url('polices/ballpark.ttf') format('truetype'), url('polices/ballpark.svg#BallparkWeiner') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Dayrom'; src: url('polices/dayrom.eot'); src: url('polices/dayrom.eot?#iefix') format('embedded-opentype'), url('polices/dayrom.woff') format('woff'), url('polices/dayrom.ttf') format('truetype'), url('polices/dayrom.svg#Dayrom') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Yanone Kaffeesatz'; font-style: normal; font-weight: 300; src: local('Yanone Kaffeesatz Light'), local('YanoneKaffeesatz-Light'), url(http://fonts.gstatic.com/s/yanonekaffeesatz/v7/We_iSDqttE3etzfdfhuPRQ91NDJQ8xmnNnfLhE67IyP3rGVtsTkPsbDajuO5ueQw.ttf) format('truetype'); } @font-face { font-family: 'modern_pictogramsnormal'; src: url('fonts/modernpics-webfont.eot'); src: url('fonts/modernpics-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/modernpics-webfont.woff') format('woff'), url('fonts/modernpics-webfont.ttf') format('truetype'), url('fonts/modernpics-webfont.svg#modern_pictogramsnormal') format('svg'); font-weight: normal; font-style: normal; } /* ---------Eléments principaux de la page----------- */ body { width:1440px; margin:0 auto; margin-top: 40px; min-width:600px; max-width:2000px; background: #080808 url(images/fond-coeur.jpg) 0 0 repeat; box-shadow: 0 0 10px rgba(150,150,150,150.8), 0 0 100px rgba(255,255,255,0.3); } body { font-size: 14px; font-family: Arial, Verdana, Tahoma; background-color: #a6ecee } #bloc_page { /* background-image: url("images/fond-blog-recette.jpg");*/ background:white; width: 1440px; height: auto; margin: 0px auto; padding: 0; } #header { /* background-color: black; */ width: 1440px; height: 170px; margin: 0; } .container_header { width: 1440px; height:auto; margin: 0 auto; background-color: black; } #blog { width: 1440px; height:auto; margin: 0 auto; background-image: url("images/fond_header.png"); } /* ----------- LOGO -----------*/ #logo{ float: left; width: 270px; /* height: 250px; */ margin-top: -110px; margin-left: 10px; } #coin-page{ float: left; width: 350px; height: auto; margin-top: 0px; margin-left: 0px; } #signature{ float: left; width: 1400px; height: 261px; margin-top: -155px; margin-left: 10px; margin-bottom: -290px; } /* ----------- facebook -----------*/ #fb { margin-top: 0px; margin-left: 320px; text-decoration:none; } #fb p { font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-weight: normal; font-size: 15px; line-height: 1.6; margin-bottom: 17px; display: inline-block; width: 100%; color: white; } .fb-like { float: left; width: 225px; height: 35px; margin-top: 10px; margin-left: 1030px; } #logo-facebook { margin-left: 1270px; margin-top: 140px } #div-social { top: 48%; padding: 0; position: fixed; right: 0; z-index: 4; } #div-social .a { background: none repeat scroll 0 0 silver; display: block; height: 64px; margin-bottom: 5px; position: relative; text-indent: -9999px; width: 60px; z-index: 5; } #div-social .liens { overflow: hidden; } #div-social .liens a { background: none repeat scroll 0 0 silver; display: block; height: 64px; margin-bottom: 5px; position: relative; text-indent: -9999px; width: 60px; z-index: 5; } #div-social #facebook { background-position: -0px 0px; } #div-social #facebook, #div-social #linkedin, #div-social #google { background: url("images/sprite-social.5.5.png") no-repeat scroll top left transparent; } a, a:visited { color: #4285f4; text-decoration: none } a:focus, a:hover, a:active { color: #4285f4; text-decoration: underline } color: #4285f4; text-decoration: none} background: #cde5fa; color: #000 } a #facebook { right: -30px; } ::-moz-selection { background: #cde5fa; color: #000 } ::-webkit-selection { background: #cde5fa; color: #000 } #div-social #linkedin { background-position: -60px 0px; } a #linkedin { right: -30px; } /* ----------- carbonneheader -----------*/ #carbonneheader{ /* background-color: black; */ width: 1440px; height: 320px; margin-top: 0px; margin-left: 0px; padding-bottom: 0px; /* float:left; */ /* line-height:0px; */ } #mail { margin-left: 1035px; margin-top: 35px; float: left; } .mail { text-decoration:none; font-family: OpenSansSemibold; font-size: 19px; color: white; } /* ----------- barre de recherche-----------*/ #text { width:180px; height: 20px; padding-left: 15px; margin-left: 1120px; margin-top: -6px; float: left; border-top-left-radius:9px ; border-top-right-radius:9px ; border-bottom-left-radius:9px ; font-family: verdana; } #recherche { background: url("images/boutonRecherche.png"); background-color: white; width:28px; height: 27px; margin-top: -6px; margin-left: 3px; float: left; } /*-------- menu déroulé------*/ #carbonneedito { width: 1440px; height: 100px; margin-top: -40px; margin-left: 0px; padding: 0px; float:left; margin-bottom: 40px; } #menu-edito{ width: 1440px; margin: 0; padding: 15px 0 5px 0; /* margin-top: 15px; */ margin-left: 0px; list-style: none; border-bottom: 2px solid #eee; border-top: 2px solid #eee; } #menu-edito li{ float: left; padding: 0 0 10px 0; position: relative; width: 240px; margin-left: 190px; margin-right: -120px; } #menu-edito a{ float: left; height: 25px; padding: 0 25px; color: #666; text-transform: uppercase; font: bold 12px/25px Arial, Helvetica; text-decoration: none; } #menu-edito li:hover > a{ color: #666; } *html #menu-edito li a:hover{ /* IE6 */ color: #666; } #menu-edito li:hover > ul{ display: block; } /* Sous-menu */ #menu-edito ul{ list-style: none; margin: 0; padding: 0; display: none; position: absolute; top: 35px; left: 30px; z-index: 99999; background: #fbfbfc; background: -moz-linear-gradient(#ffffff, #ffffff); background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #ffffff),color-stop(1, #ffffff)); background: -webkit-linear-gradient(#ffffff, #ffffff); background: -o-linear-gradient(#ffffff, #ffffff); background: -ms-linear-gradient(#ffffff, #ffffff); background: linear-gradient(#ffffff, #ffffff); -moz-border-radius: 5px; border-radius: 5px; } #menu-edito ul li{ float: none; margin: 0; padding: 0; display: block; -moz-box-shadow: 0 1px 0 #111111, 0 2px 0 #777777; -webkit-box-shadow: 0 1px 0 #111111, 0 2px 0 #777777; box-shadow: 0 1px 0 #111111, 0 2px 0 #777777; } #menu-edito ul li:last-child{ -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } #menu-edito ul ul li:first-child a::after{ left: -8px; top: 12px; width: 0; height: 0; border-left: 0; border-bottom: 5px solid transparent; border-top: 5px solid transparent; border-right: 8px solid #444; } #menu-edito ul ul { top: 0; left: 150px; } #menu-edito ul a{ padding: 10px; height: auto; line-height: 1; display: block; white-space: nowrap; float: none; text-transform: none; } *html #menu-edito ul a{ /* IE6 */ height: 10px; width: 150px; } *:first-child+html #menu ul a{ /* IE7 */ height: 10px; width: 150px; } #menu-edito ul a:hover{ background: #d47bb4; background: -moz-linear-gradient(#d47bb4, #d47bb4); background: -webkit-gradient(linear, left top, left bottom, from(#d47bb4), to(#d47bb4)); background: -webkit-linear-gradient(#d47bb4, #d47bb4); background: -o-linear-gradient(#d47bb4, #d47bb4); background: -ms-linear-gradient(#d47bb4, #d47bb4); background: linear-gradient(#d47bb4, #d47bb4); } #menu-edito ul li:first-child a{ -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; } #menu-edito ul li:first-child a:after{ content: ''; position: absolute; left: 30px; top: -8px; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 8px solid #444; } #menu-edito ul li:first-child a:hover:after{ border-bottom-color: #d47bb4; } #menu-edito ul li:last-child a{ -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; } /* Rétablissement du flottement */ #menu-edito:after{ visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } * html #menu-edito { zoom: 1; } /* IE6 */ *:first-child+html #menu-edito { zoom: 1; } /* IE7 */ #menu-edito ul li:first-child a:after{ content: ''; position: absolute; left: 30px; top: -8px; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 8px solid #444; } #menu-edito ul li:first-child a:hover:after{ border-bottom-color: #d47bb4; } * html #menu { zoom: 1; } /* IE6 */ *:first-child+html #menu { zoom: 1; } /* IE7 */ /* ----------- Aside -----------*/ #contenu { width: 1440px; height:auto; position: relative; margin: 0 auto; margin-top: 0px; padding: 0 0 100px; } /* ----------- barre de recherche-----------*/ #text { width:180px; height: 20px; padding-left: 15px; margin-left: 1121px; margin-top: -5px; float: left; border-top-left-radius:9px ; border-top-right-radius:9px ; border-bottom-left-radius:9px ; font-family: verdana; } #recherche { background: url("images/boutonRecherche.png"); background-color: white; width:28px; height: 27px; margin-top: -5px; margin-left: 3px; float: left; } #logo-facebook { margin-left: 1200px; margin-top: 15px } /* ----------- placement de présentation-----------*/ #visuelle { width: 540px; height: auto; margin-top: 0px; margin-left: 50px; } section { width: 1440px; height: auto; } aside { width: 360px; height: 6200px; float: left; margin-left: -770px; margin-top: 450px; } .archive-box {text-align: center; background: #fbf4f8; margin-top: 230px; padding: 20px 0; margin-bottom: -150px; } .fa {display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; transform: translate(0, 0)} .post-meta {margin-top: 35px; overflow: hidden; border-bottom: 1px solid #e5e5e5; padding-bottom: 10px; font-style: italic; clear: both;} .post-header { margin-bottom: 25px; text-align: center;} .pagination {margin-top: 60px; overflow: hidden; margin-bottom: 40px;} .pagination .older {float: right; } .pagination a {display: inline-block; letter-spacing: 2px; text-transform: uppercase; font-size: 11px; border-bottom: 1px solid #e5e5e5; padding-bottom: 5px; font-weight: 700; -o-transition: .3s; -ms-transition: .3s; -moz-transition: .3s; -webkit-transition: .3s;} #complementary { width: 380px; height: 500px; float: left; margin-left: 880px; margin-top: -300px; margin-bottom: 420px; } #complementary { width: 380px; height: 500px; float: left; margin-left: 880px; margin-top: -300px; margin-bottom: 420px; } #complementary-zodio { width: 350px; height: 500px; float: left; margin-left: 880px; } #article-left { width: 772px; height: auto; float: left; margin-top: 150px; margin-left: 30px; } #une { position:relative; width: 702px; height: 720px; margin-top: 380px; margin-left: 30px; border:10px solid #e3adcf; box-shadow: 1px 1px 12px #999; margin-bottom: 70px; padding: 0 30px 0 ; } #teste { width: 210px; height: 180px; margin-top: -280px; margin-left: 350px; margin-bottom:160px; /* float: left; */ /* z-index:0; */ } #teste-cannele { width: 210px; height: 180px; margin-top: -280px; margin-left: 290px; margin-bottom:90px; /* float: left; */ /* z-index:0; */ } #teste-crepe { width: 210px; height: 180px; margin-top: -240px; margin-left: 210px; margin-bottom:60px; /* float: left; */ /* z-index:0; */ } #img-shadow { height: 26px; width: 832px; margin-top: 20px; margin-left: -40px; } #photo-defile { width: 772px; height: auto; } #photo-petit { width: 450px; height: auto; } #photo-aside { margin-left: 80px; } #photo-blog { width: 380px; height: auto; } #maincontent { width: 734px; height: auto; float: left; margin-top: 0px; margin-left: 40px; } #trait-design-dessus { float: left; width: 420px; height: 740px; margin-top: -310px; margin-left: 428px; } #titre { width: 500px; /* height: 455px;*/ float: left; margin-top: -350px; margin-left: 921px; } #trombinocope { float: left; width: 485px; height: 387px; margin-top: -300px; margin-left: 418px; /* border: 10px solid white; */ } #presentation { width: 330px; /* height: 455px;*/ float: left; margin-top: -290px; margin-left: 905px; margin-bottom:320px; } #face-blog { width: 500px; /* height: 455px;*/ /*float: left;*/ margin-top: -265px; margin-left: 441px; } /* ----------- fonts/polices -----------*/ #titre h1 { font-family: 'Open Sans', arial, serif; text-rendering: optimizeLegibility; font-weight: normal; line-height: 1.1; font-size: 26px; color:#666; } #une p{ font-family:Open Sans, arial, "Times New Roman", Times, serif; text-align: justify; font-size:auto; font-size:16px; line-height:22px; color: #666; } #une h3 { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; font-size:32px; color: #d47bb4; text-align: center; text-transform: uppercase; } #une a { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; font-size:14px; color: #CC0099; cursor: auto; text-decoration: none; } .post-header .mini a { text-align: center; font-size: 15px; text-transform: uppercase; letter-spacing: 2px; border-bottom: 1px solid; border-color: #CC0099; padding-bottom: 2px; display: inline-block; margin: 30px 0px 0px 0px; } #une h1{ font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; line-height: 0.2em; font-size:16px; color:#bbb; margin-top: -20px; } .post-header h2 a { color: #000; font-size: 26px; -o-transition: .2s; -ms-transition: .2s; -moz-transition: .2s; -webkit-transition: .2s;} #complementary p{ font-family:Open Sans, arial, "Times New Roman", Times, serif; text-align: justify; font-size:auto; font-size:13px; line-height:20px; color: #CC0099; } #complementary h3 { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; font-size:20px; color: #666; text-align: center; } #complementary h2 { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; font-size:18px; color: #666; text-align: center; } #complementary a { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; font-size:14px; color: #666; cursor: auto; text-decoration: none; } #complementary p a { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: light; font-size:15px; color: #CC0099; cursor: auto; } #complementary-zodio p{ font-family:Open Sans, arial, "Times New Roman", Times, serif; text-align: justify; font-size:auto; font-size:13px; line-height:20px; color: #CC0099; } #complementary-zodio h3 { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; font-size:20px; color: #666; text-align: center; } #complementary-zodio a { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; font-size:14px; color: #666; cursor: auto; text-decoration: none; } #article-left p{ font-family:Open Sans, arial, "Times New Roman", Times, serif; text-align: justify; font-size:auto; font-size:16px; line-height:22px; color: #666; } #article-left h2{ font-family: 'Open Sans', arial, serif; text-rendering: optimizeLegibility; font-weight: normal; line-height: 1.6em; font-size: 16px; color:#d47bb4; } #article-left h3 { font-family: 'Open Sans', arial, serif; font-weight: normal; font-size:28px; color: #d47bb4; text-align: center; text-transform: uppercase; } #article-left h5 { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; font-size:22px; color: #d47bb4; } #article-left h5 a { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; font-size:22px; color: #d47bb4; } #article-left h1{ font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; line-height: 0.2em; font-size:16px; color:#bbb; margin-top: -20px; } #article-left h4 { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; font-size:14px; color: #d47bb4; } #article-left a { font-family:Open Sans, arial, "Times New Roman", Times, serif; font-weight: normal; font-size:14px; color: #d47bb4; cursor: auto; text-decoration: none; } hr { border: none; border-width: 0px 0 0; clear: both; margin: 50px 0 21px; height: 0; } #presentation p { font-family:Open Sans, arial, "Times New Roman", Times, serif; text-align: justify; font-size:auto; line-height:18px; color: #CC0099; } #presentation h1 { font-family: 'Open Sans', arial, serif; text-rendering: optimizeLegibility; font-weight: normal; line-height: 1.1; font-size: 22px; color:#d47bb4; } .archive-box span {font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: #999; display: inline-block; border-bottom: 1px solid #d8d8d8; padding-bottom: 3px; margin-bottom: 5px;} .archive-box h1 {font-family: "Playfair Display"; font-size: 30px; color: #999; text-transform: uppercase; } /* ----------- FOOTER -----------*/ #footer-blog { width: auto; height:auto; /* margin: 0 auto; */ margin-top: -90px; } /* ----------- hauts les mains !! police ! elle était trop facile je sais... -----------*/ #haut h4 { font-family:Georgia, "Times New Roman", Times, serif; font-size: 16px; color: white; } #tete h4 { font-family:Georgia, "Times New Roman", Times, serif; font-size: 15px; color:#d47bb4; } #haut p { font-family: Georgia, "Times New Roman", Times, serif; font-weight: normal; line-height: 21px; text-align: left; text-align: justify; font-size: 12px; color:#666; } #finale { width:1440px; height:20px; color:#d47bb4; margin-top:0px; } #bas h4 { color:#d47bb4; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-weight: normal; font-size: 12px; text-align: center; } #bas a {text-decoration:none; } /* ----------- çà me gratte les puces !!! -----------*/ #reseaux .icone{ /* width:50px; */ border:none; float: left; margin-left: 95px; } /* ----------- c'est triste c'est fini ! -----------*/