@charset "UTF-8";
/* CSS Document */
body{
width:1024px;
    background-color: #474847;
background-attachment:fixed;
background-position:center center;
    background:url(img/home_fill.png);
margin:auto;
}
.picture {
background-image:url(img/alain.jpg);
    background-position: center;
background-repeat:no-repeat;
    background-color: black;
display:block;
border: 16px solid #000000;
border-top-left-radius: 20px;

float:left;
width:477px;
height:150px;

}
/*
.imgabout
{
    width: 100px;
    height: 100px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    padding: 20px 20px 20px 20px;
    margin-top: 100px;
    margin-left: 160px;
    text-align: center;
    line-height: 50px;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
}
.imgabout:hover
{
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
}
*/
.imgimg
{
    padding-left: 150px;
}
.imgabout {
    width: 200px;
    height: 200px;
    position: relative;
    overflow: hidden;

    background: #ddd;
}


svg {
    position: absolute;
    top: 0;
    left: 0;
}

svg line {
    stroke-width: 10;
    stroke: #000;
    fill: none;
    stroke-dasharray: 200;
    -webkit-transition: -webkit-transform .6s ease-out;
    transition: transform .6s ease-out;
}

.imgabout:hover svg line {
    -webkit-transform: translateX(-400px);
    transform: translateX(-400px);
}

.imgabout:hover svg line.top {
    -webkit-transform: translateX(-400px);
    transform: translateX(-400px);
}

.imgabout:hover svg line.bottom {
    -webkit-transform: translateX(400px);
    transform: translateX(400px);
}

.imgabout:hover svg line.left {
    -webkit-transform: translateY(400px);
    transform: translateY(400px);
}

.imgabout:hover svg line.right {
    -webkit-transform: translateY(-400px);
    transform: translateY(-400px);
}

















h1 {  /*gros titre*/
 font-size: 250%;
 text-decoration: underline;
    font-family: 'Dancing Script', cursive;
 color: white;
 text-align: center;

 }
h2 {  /*theme*/
 font-size: 200%; 
color:white;
 text-align: center;
 }
 h3 {   /*sous thème*/
 font-size: 150%; 
 text-align: center;
 color:white;
 }
 h4 {  /*questions*/
 font-size:120%;
 padding-left:25px;
 }
 h5 {  /*lien mail+navigation*/
 padding-bottom:15px;
 font-size:25px;
 text-align:center;
 text-decoration:bold;
 }
p {
 padding-left:150px;
 padding-bottom:2px;
 }
 h6 {   /*juste pour le footer excepté mail*/
 text-align:left;
 font-size:75%;
 padding-left:25px;
 }
.header {
font:helvetica;
color:white;
font-size: 90%;
background: #000000;
border-radius:0 20px 0 0;
width:510px;
height:182px;
float:left;
}
.textnavone
{
    width: 430px;
    padding-left: 15px;
    text-align: left;
}
.interligne1
{
    background-color: #474847;
    float: left;
    width: 0px;
    height: 182px;
    border-right-style: dotted;
    border-width: 5px;
}

.interligne2
{
    background-color: #474847;
    float: left;
    width: 1024px;
    height: 0px;
    border-bottom-style: dotted;
    border-width: 5px;
}
.interligne3
{
    background-color: #474847;
    float: left;
    width: 0px;
    height:500px;
    border-right-style: dotted;
    border-width: 5px;
}
.interligne4
{
    background-color: #474847;
    float: left;
    width: 0px;
    height: 700px;
    border-right-style: dotted;
    border-width: 5px;
}
.skills
{
    width:470px;
    padding-right: 20px;
}
.skills p
{
    text-align: right;
}

.header  p,h1,h2,h3{
    color: white;
}
.navone {
float:left;
width:509px;
height:500px;
margin:auto;
    color: white;
background-color: #000000;
}
.texte1 {
margin:O;   
padding:0;

font:helvetica;
color: white;
background-color: #000000;
width:510px;
height:500px;
float:right;
}

.nav2 {
    float:left;
    width:509px;
    height:700px;
    margin:auto;
    color: white;
    background-color: #000000;
}
.texte2 {
    margin:O;
    padding:0;

    font:helvetica;
    color: white;
    background-color: #000000;
    width:510px;
    height:700px;
    float:right;
}

.footer {
margin:O;   
padding:0;
font:helvetica;
font-size:16px;
color:#636463;
    text-align: left;
background: #000000;
border-radius:0 0 20px 20px;
width:1024px;
height:50px;
float:left;
}
.footer p {

    padding-left: 100px;
}