@charset "UTF-8";
/*
Theme Name: Portfolio Raphaëlo Fiorentino 
Theme URI: http://www.raphaelo-fiorentino.fr/
Description: Présentation de mes services et de mes différentes réalisations. 
Version: 0.1
Author: Raphaëlo Fiorentino
*/
*					{margin:0;padding:0;}
body				{font-family:'Trebuchet MS',Arial,sans-serif;font-size:70%;}
a img 				{border:none;}
a					{outline:none;color:#858181;}
a:hover{cursor:pointer;}

/*----------------------------------------- Conteneur général--------------------------------------------*/
#conteneur_home{width:100%;min-width: 970px;background :transparent url(images/degrader_carroussel2.gif) repeat-x scroll 0 100px;}
#conteneur_global{width:100%;min-width: 970px;background :transparent url(images/degrader_conteneur_global.gif) repeat-x scroll 0 100px;}
/*-----------------------------------------Global---------------------------------------------------------*/
#global {position: relative;width: 1000px; height :auto;margin-left:auto;margin-right:auto;padding-left: 20px;}

/*-----------------------------------------Header---------------------------------------------------------*/
/*logo*/
#header h1 a {text-indent: -9000px;width: 300px;height: 39px;background: url(images/raphaelo-fiorentino.jpg) no-repeat 0 0;display: block;overflow: hidden;margin-top:40px;margin-bottom: 20px; }

/*--border-bottom:3px solid #323130;---------------------------------------Menu---------------------------------------------------------*/
#header #menu {width: 285px;margin-left: auto; margin-right:auto;height:20px;background: url(images/barre_menu.gif) no-repeat 0px 15px; }
#header #menu li {float:left;font-size:1.1em; height:18px;list-style: none;}
#header #menu li h2{font-size: 1em; font-weight: 400;color:#646361;}
#header #menu li a {text-decoration: none; display:block; height: 15px; color:#646361; width:95px; text-transform: uppercase;}
#header #menu li a:hover{color:#a8c46f;border-bottom: 3px solid #abdc4d;height: 15px;}
#header #menu li.current_page_item a,  li a.current_page, li.current-cat a {color:#a8c46f !important;border-bottom: 3px solid #abdc4d !important;padding: 0;margin: 0;}


/*-----------------------------------------------------------------------------------------------------
												HOME
----------------------------------------------------------------------------------------------------*/
/*----caroussell--*/
#carrousel{margin-top: 41px;width:100%; min-height: 281px;}
/*bouton de navigation du carrousel*/
.prev {float:left;height: 242px; width:70px;background : url(images/bouton_carrousel_gauche.png) no-repeat 0 7px;margin-right: 30px;}
.car{height: 247px;min-height: 242px; max-width: 800px;background-color: #fff;border: 1px solid #9e9a9a; }
.next {float:right;height: 242px; width:70px;background : url(images/bouton_carrousel_droite.png)  no-repeat 0 0;}
/*Style pour la présentation des réalisations */
.realisation{width:770px;padding:8px 8px 10px 8px;height: 240px;margin-right: 10px;}
.realisation h3 {color:#abdc4d;font-size: 1.1em;width:auto;padding-bottom: 5px;}
.realisation h2 {color:#abdc4d;font-size: 1em;width: 200px;padding-bottom: 5px;}
.realisation .progression {color:#f6f6f6;font-size: 1em;width: 200px;padding-bottom: 5px;}
.realisation dl {min-height: 217px;}
.realisation dl dd {height: 180px;}
.realisation img {width:466px;height:232px;float: left;margin-right: 10px;}
.realisation  .vertical_image {width: 19px; height: 19px;}
.realisation a {float: right;width:100px;height:21px;background: url(images/degrader_bouton.jpg) repeat-x 0 0;text-align: center;text-decoration: none;color:white; color:white;}
.realisation a:hover {background: url(images/degrader_bouton_hover.jpg) repeat-x 0 0;}
/*global pour les blocs en dessous du caroussel */
.titrevert{color:#abdc4d;font-size: 1.2em;margin-bottom: 10px;margin-bottom: 10px;}
p{color:#858181;width:100%;}
/*==================================================contenu=====================================================*/
#contenu {margin-top: 22px;height: auto;width:950px;}
#contenu_home {width:100%;min-height: 340px;}
/*==================================================FIN contenu=====================================================*/
.presentation {height: auto;width: 303px;position: relative;float: left;margin-right: 39px;}
.presentation p.titre {background: url(images/degrader_vert.jpg) repeat-x 0 0;height: 22px;color:white; padding-left: 15px;padding-top: 3px;display: block;}
.presentation .triangle {position: absolute;top:21px;}
.last {margin-right: 0px;}
/* Ma Présentation */
#mapresentation {height: 240px;text-align: justify;padding-left: 25px;}
#mapresentation img{float:left;margin-right: 10px;height: 46px;}
#mapresentation p {color:#858181;margin-bottom: 20px;width:287px;display: block;}
#mapresentation a{display:block;width:287px;text-align: center;color:#959292;text-decoration: none; background: url(images/degrader_bouton.jpg) repeat-x 5px 0;height: 22px;margin-bottom: 10px;color:white;}
#mapresentation a:hover{text-decoration: none; background: url(images/degrader_bouton_hover.jpg) repeat-x 0 0;}
#mapresentation a img{height: 18px;padding-left: 20px;}
#mapresentation ul.messervices {margin-left:30px;}
#mapresentation ul.messervices li{color:#858181;list-style-position: inside;}
/* Mes informations */
/*#mapresentation .telephone{height:35px;width: 303px; background: url(images/home/telephone.jpg) no-repeat 0 0;text-align: right;padding-top: 12px;margin-top: 10px;}
#mapresentation .email{height:35px;width: 303px; background: url(images/home/email.jpg) no-repeat 0 0;text-align: right;padding-top: 12px;margin-top: 10px;}
#mapresentation .email a {background: none;text-align: inherit;}*/
/*------------Formulaire Home------------------------------------------------------------------------------*/
#formulaire_home {max-width: 303px;}
#formulaire_home .titre_contact{ height: 21px; width: 258px; background: url(images/home/fond_contact.jpg) no-repeat 0 0;padding-left: 30px;padding-top: 4px;color:white;margin-bottom: 0;display: block;}
#formulaire_home .info{ text-align: center;}
#formulaire_home #cforms2form {max-width: 303px;}
#formulaire_home #cforms2form ol.cf-ol { max-width:303px; }
#formulaire_home #cforms2form ol.cf-ol li label {display: none;}
#formulaire_home #cforms2form ol.cf-ol li input {width: 280px;}
#formulaire_home #cforms2form ol.cf-ol li textarea {width: 280px;height: 50px;font-size: 1.0em;}
#formulaire_home p.linklove {display: none;}
#formulaire_home #cforms2form input, #cforms2form textarea, #cforms2form select{ border:1px solid #ddd7d7; color:#737373;}
#formulaire_home #cforms2form input.backbutton, #cforms2form  input.resetbutton, #cforms2form  input.sendbutton {background:transparent url(images/envoyer.jpg) repeat-x scroll 0 0;font-size:0.8em;margin:10px 0 0 5px;padding:5px;width:100px; border: none !important;cursor: pointer;}
/* Gestion des erreurs pour le formulaire */
#formulaire_home div.failure {width: 258px;}
#formulaire_home #cforms2form ol.cf-ol li.cf_li_err {width: 287px;}
#formulaire_home div.cf_info {width: 259px;}
/*-----------------------------------------------------------------------------------------------------
												Page
----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------Contenu-----------*/
#moncontenu, #moncontenu_projet {width: 670px;min-height:500px;float: left;clear:none; margin-bottom: 50px;}
/*----------------------------------------------------------------------------------CV-----------*/
/*-------------------------------------------------------------------------Dernier Projet-----------*/


#dernierprojet { height: 130px;margin-bottom: 30px;}
#dernierprojet p {color: #4B4B4C;font-weight: 800; font-size: 1em;width: 150px;/*background-color:white;*/height: 17px;padding-top: 2px;}
#dernierprojet .lastproject {width: 150px;float: left;text-align: center;/*background-color: #fafafa;*/margin-right: 10px;padding-top: 2px;padding-bottom: 5px;}
/*#dernierprojet .lastproject img {border :1px solid white; }*/
#dernierprojet .lastproject a { color:white;font-size: 0.9em;font-weight: bold;text-decoration: none;}
#dernierprojet .lastproject a:hover {text-decoration: underline;} 

#cv .user {float: left;margin-right: 20px;margin-bottom: 20px;}
#cv #information {width: 300px; margin-left: 50px;margin-bottom: 20px;}
#cv a {background: url(images/degrader_bouton.jpg) repeat-x 0 0; display :block; height:20px;width:190px;text-align: center;color:white; font-weight: bold;text-decoration: none;margin-left: 13px; }
#cv a:hover {background: url(images/degrader_bouton_hover.jpg) repeat-x 0 0;}
#cv p.titre {float:none;color:#4c4a4b;font-size: 1.1em;}
#cv .vert {color:#9ec356;margin-top: 10px;margin-bottom: 5px;}
#cv .decaler{margin-left: 20px;margin-top: 10px;margin-bottom: 20px;}
#cv .decaler .image {float: left;height:50px;width: 150px;}
#cv .decaler p{ vertical-align: top;}
#cv .decaler .image img {margin-bottom : 0px!important;}
#cv .nofloat {float:none;clear:none;margin-top: 10px;margin-bottom: 5px;}
#cv .bureau p, .competence p, .competence2 p { height: 15px;line-height: 10px;}
#cv .competence {margin-right: 20px;float: left;width:315px;}
#cv .competence .titre, .competence2 .titre, .bureau .titre {float: left;clear: left;}
#cv .competence img, .competence2 img, .bureau img {float:right !important;}
#cv .competence2 {float: left;width:315px;margin-bottom:20px;}
#cv .bureau {width: 315px;}
#cv .diplome {color:#252425;}
#cv .information {color:#676667;}
#cv .formation a { background: none; color:#a3a3a3;text-align: left;margin: 0;text-decoration: underline;width:auto;}
#cv .formation a:hover {text-decoration: none;}
/*----------------------------------------------------------------------------------Portfolio-----------*/
/*----------------------------------------------------------------------------------Trier-----------*/
#trier {width: 100%;height: 130px;margin-bottom: 30px;}
#trier .indication {color: #4B4B4C;font-weight: 800; font-size: 1em;/*background-color:white;*/height: 17px;margin-bottom: 6px;padding-top: 2px;}
#trier #menu_trier li.cat-item {list-style: none;background-color:#f5f3f5;width: 80px;height:20px;text-align: center;margin-top: 10px; }
#trier #menu_trier li.cat-item a {color:#1a1a1a!important;text-decoration: none;font-weight: bold;}
#contenu #trier #menu_trier li.current_page_item a, li a.current_page, li.current-cat a{ border: none;}
#contenu #trier #menu_trier {margin-top:5px;width: 500px;}
#contenu #trier #menu_trier li {width:143px;float:left;list-style: none;margin-right:10px;}
#contenu #trier #menu_trier li a {display:block;height: 81px;width: 143px;background: url(images/portfolio/degrader_bouton.jpg) repeat-x 0 0;padding-top: 15px;padding-left: 2px;padding-right: 2px;}
#contenu #trier #menu_trier li a:hover {background: url(images/portfolio/degrader_bouton_hover.jpg) repeat-x 0 0;}
#contenu #trier #menu_trier li .current {background: url(images/portfolio/degrader_bouton_hover.jpg) repeat-x 0 0;}
#contenu #trier h2 {margin-top: 2px;font-size: 1em;}
#contenu #trier a {background-color: #f5f3f5;display: block;width: 100px;text-decoration: none;text-align: center;color:#1a1a1a;font-weight: bold;font-size: 0.9em;}
#contenu #trier a .icone {height: 10px;margin-bottom: 10px;}
#contenu #trier a .icone .hetic, .raphaelo{text-indent: -9999px;font-size: 0.8em;}
#contenu #trier a .icone .hetic { background: url(images/portfolio/hetic.jpg) no-repeat 25px 0;height: 25px; }
#contenu #trier a .icone .raphaelo { background: url(images/portfolio/logo.png) no-repeat 5px 5px;height: 25px; }

/*----------------------------------------------------------------------------------projet-----------*/ 
#contenu .breadcrumb{margin-bottom: 10px;}
#contenu .projet {width: 646px; height: 180px;margin-bottom: 40px;}
#contenu .projet a {background: none;}
#contenu .projet .information {color :#4c4b4c;}
#contenu .projet .information p {float:left;width: auto;margin-right: 10px;}
#contenu .projet .information a {text-decoration: none;}
#contenu .projet .information .more {float: right;background: url(images/degrader_bouton.jpg) repeat-x 0 0; width: 100px; height: 15px;text-align: center; text-decoration: none; color:white;}
#contenu .projet .information a.more:hover{background: url(images/degrader_bouton_hover.jpg) repeat-x 0 0;}
/*#contenu .projet .information a {float:right; display:block; background: url(images/degrader_bouton.jpg) repeat-x 0 0; width: 100px; height: 15px;text-align: center; text-decoration: none; color:white;}
#contenu .projet .information a:hover{background: url(images/degrader_bouton_hover.jpg) repeat-x 0 0;}*/
/*----------------------------------------------------------------------------------similar post-----------*/
.autresprojets {margin-top: 50px;}
.autresprojets p {margin-bottom: 15px;font-weight: bold;color:#4c4b4c;}
.autresprojets {margin-left: 0px !important;}
.autresprojets li {float:left; margin-right:20px;width: 150px;text-align: center;list-style: none;}
.autresprojets li a {text-decoration: none;}
/*----------------------------------------------------------------------------------contenu projet-----------*/

#moncontenu_projet ul {}
#moncontenu_projet ul li,p {color :#4c4b4c;}
#moncontenu_projet p {text-align: justify;}
#moncontenu_projet img {float: none;}
#moncontenu_projet .image_projet {margin-bottom: 8px;}
#moncontenu_projet .lien_site {display:block;background: url(images/degrader_bouton.jpg) repeat-x 0 0;width: 647px; height: 15px;margin-bottom: 20px;color:white;text-align: center;text-decoration: none;}
#moncontenu_projet a.lien_site:hover {background: url(images/degrader_bouton_hover.jpg) repeat-x 0 0;}
#moncontenu_projet ul.resumer {margin-left: 20px;margin-bottom: 5px;}
#moncontenu_projet .resumer li {width: auto;}
.piclenselink a { color:#d8d8d8;}

.vertical_image {vertical-align: middle;margin-right: 10px;}
.bouton {display:block;background: url(images/portfolio/degrader_bouton_publicis.jpg) repeat-x 0 0; width: 100%;height: 20px; margin-bottom:  5px; margin-top: 5px;color:white;padding-top: 2px;text-align: center!important;}
.titre_projet {color:#a0ce48;}
/*-----------------------------------------------------------------------------------------------------
												sidebar
----------------------------------------------------------------------------------------------------*/
#sidebar {float: right;}
#sidebar .side{width:250px;position: relative;margin-bottom: 20px;}
#sidebar .side p {display:block;background: url(images/degrader_vert.jpg) repeat-x 0 0;height: 22px;color:white;padding-left: 15px;padding-top: 3px;margin-bottom: 5px;}
#sidebar .side .triangle {position: absolute;top:21px;}
#sidebar .contenu_side {width: 240px;margin-left: 23px;}
#sidebar .contenu_side ul.project {width: 235px;}
#sidebar .contenu_side ul.project  li {height:auto;background-color: #fbfafb;border: 1px solid #eceaea;padding-left:5px;color:#a3d14a;list-style: none;margin-bottom: 5px;padding-top: 3px; padding-right: 5px}
#sidebar .contenu_side ul.project  li p {background: none;margin: 0; padding: 0;vertical-align: middle;color: #a3d14a;}
#sidebar .contenu_side h4 {color:#3e3c3c;margin-bottom: 2px;}
#sidebar .contenu_side .progression {background-color:#d6cece;width: 175px;height: 3px;margin-top:5px;float:left;margin-right: 20px;}
/* Etat*/
#sidebar .contenu_side .progression #etat {width: 175px;height: inherit;background-color:#a5d34b;}
#sidebar .contenu_side .progression #etat2 {width: 85px;height: inherit;background-color:#a5d34b;}
#sidebar .contenu_side .progression #etat3 {width: 165px;height: inherit;background-color:#a5d34b;}


#cforms2form {max-width: 240px;}
#cforms2form ol.cf-ol { max-width:240px; }
#cforms2form ol.cf-ol li label {display: none;}
#cforms2form ol.cf-ol li input {width: 225px;}
#cforms2form ol.cf-ol li textarea {width: 225px;height: 50px;font-size: 1.0em;}
#sidebar .contenu_side p.cf-sb{ background: none;width: 232px;}
#sidebar .contenu_side p.linklove {display: none;}
#cforms2form input, #cforms2form textarea, #cforms2form select{ border:1px solid #ddd7d7; color:#737373;font-size:1em;}
#cforms2form input.backbutton, #cforms2form  input.resetbutton, #cforms2form  input.sendbutton {background:transparent url(images/envoyer.jpg) repeat-x scroll 0 0;font-size:0.8em;margin:10px 0 0 5px;padding:5px;width:100px; border: none !important;cursor: pointer;}
/* Gestion des erreurs pour le formulaire */
#sidebar .contenu_side div.failure {width: 200px;}
#cforms2form ol.cf-ol li.cf_li_err {width: 232px;}
#sidebar .contenu_side div.cf_info {width: 200px;}
/*-----------------------------------------------------------------------------------------------------
												Footer
----------------------------------------------------------------------------------------------------*/
#footer {clear:both;float:none;position:relative;background-color: #1B1718;margin-top: 150px;height: 157px;padding-top: 20px;color:#a7a1a1;padding-left: 20px;}
#footer #contenufooter {margin-left: auto;width:1000px;margin-right:auto;max-height: 200px;}
#footer #contenufooter .copyright {margin-top:-100px;}
#footer #contenufooter .titre {float: left;height:150px;margin-right: 87px;list-style:none;padding-bottom: 5px;}
#footer #contenufooter .titrelast {float: left;height:150px;list-style:none;padding-bottom: 5px;}
#footer #contenufooter li ul {list-style: none;}
#footer #contenufooter li ul li {display: list-item;}
#footer #contenufooter p {color:#a7a1a1;padding-bottom: 8px;display: block;}
#footer .telephone{height:35px;width: 260px; background: url(images/footer/telephone.jpg) no-repeat 0 0;text-align: right;padding-top:7px;margin-bottom: 10px;color:#858181;}
#footer .email{height:35px;width: 262px; background: url(images/footer/email.jpg) no-repeat -2px 0;padding-top:7px;text-align: right;margin-bottom: 5px;color:#858181; }
/*media*/
#media {width: 148px;}
#media li {display: inline-table;width: 32px ;margin: 0px;}
#media li a {display:block;height: 33px;width: 32px;}
#gmail,#viadeo,#linkedin,#twitter {float: left;padding-right: 5px;}
#gmail a{background: url(images/footer/google.jpg) no-repeat center 1px;}
#viadeo a{background: url(images/footer/viadeo.jpg) no-repeat center 1px;}
#linkedin a{background: url(images/footer/linkedin.jpg) no-repeat center 1px;}
#twitter a{background: url(images/footer/twitter.jpg) no-repeat center 1px;}
#gmail a:hover, #viadeo a:hover, #linkedin a:hover, #twitter a:hover {background-position: center bottom;}