/* 
    Document   : iphone-vision
    Created on : 9 mars 2009, 22:38:55
    Author     : vinh
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/
*{
    margin:0;
    padding:0;
}
.gris{
    color:#6E6E6E;
}
.jaune{
    color:#D09621;
}
.orange{
    color:#CA9000;
}


body{
    font-family:Helvetica,Verdana,Arial,sans-serif;
    background-color:#000000;
    font-size:12px;
}

/* Header */
.header{
    height:130px;
    width:902px;
    margin-left:auto;
    margin-right:auto;
    color:#ffffff;
}
.header .logo{
    height:99px;
    width:374px;
    float:left;
}
.header .logo .extension{
    font-size:24px;
}
.header .logo img{
    border:0;
}
.header .compte{
    padding:0;
    height:88px;
    width:293px;
    float:right;
    text-align:right;
	font-size:10px;
}
.btn-distributeur{
	height:24px;
	width:144px;
	background:no-repeat url(/images/btn-distributeur.jpg);
	display:block;
	float:left;
}
.btn-client{
	height:24px;
	width:117px;
	background:no-repeat url(/images/btn-client.jpg);
	display:block;
	float:left;
}
.header .compte img{
    margin-right:8px;
    border:0;
}
.header .espace-client{
    padding-top:25px;
    float:right;
    height:31px;
}
.header .espace-client p{
    float:left;
}
.header .espace-client .particulier{
    text-align:left;
    padding:3px 13px 0 0;
}
.header .espace-client .particulier a{
    color:#ffffff;
    text-decoration:none;
}
.header .espace-client .particulier a:hover{
    color:#ffffff;
    text-decoration:underline;
}
.header .espace-client .distributeur{
    text-align:left;
    padding:3px 0 0 0;
}
.header .espace-client .distributeur a{
    color:#D09621;
    text-decoration:none;
}
.header .espace-client .distributeur a:hover{
    color:#D09621;
    text-decoration:underline;
}
.header .menu{
    height:32px;
    width:902px;
    clear:both;
}

/* Menu */
.menu{
    background:repeat-x url(/images/menu-fond.jpg);
}
.menu .smenu-haut{
    width:157px;
    height:4px;
    font-size:2px;
    background:no-repeat url(/images/smenu-fond-haut.jpg);
}
.menu .smenu-bas{
    width:157px;
    height:4px;
    font-size:2px;
    background:no-repeat url(/images/smenu-fond-bas.jpg);
}
.menu ul li{
    list-style:none;
    padding:5px 10px 5px 24px;
    color:#ffffff;
}
.menu ul li a{
    color:#ffffff;
    text-decoration:none;
}
.menu ul li a:hover{
    color:#D09621;
    text-decoration:none;
}






.menu ul{
    background:repeat-y url(/images/smenu-fond.jpg);
    width:127px;
}
.menu .menu-droite{
    background:no-repeat url(/images/menu-droite.jpg);
    float:right;
    height:30px;
    width:4px;
}
.menu .menu-gauche{
    background:no-repeat url(/images/menu-gauche.jpg);
    float:right;
    height:30px;
    width:10px;
}
.menu dl{
    float:left;

}
#menu-home a {
    background:no-repeat url(/images/menu-home.jpg);
    color:#FFFFFF;
    display:block;
    height:30px;
    width:51px;
    line-height:30px;
}
#menu-centre a{
    padding:0 23px 0 23px;
    background:no-repeat url(/images/menu-sep.jpg);
    color:#FFFFFF;
    display:block;
    height:30px;
    line-height:30px;
    text-decoration:none;
}
#menu-centre a:hover{
    padding:0 23px 0 23px;
    background:repeat-x url(/images/menu-fond-over.jpg);
    color:#FFFFFF;
    display:block;
    height:30px;
    line-height:30px;
    text-decoration:none;
}
#menu-espace-droite a{
    padding:0 23px 0 23px;
    /*background:no-repeat url(/images/menu-sep.jpg);*/
    color:#FFFFFF;
    display:block;
    height:30px;
    line-height:30px;
    text-decoration:none;
	float:right;
}
#menu-espace-droite a:hover{
    padding:0 23px 0 23px;
    background:repeat-x url(/images/menu-fond-over.jpg);
    color:#FFFFFF;
    display:block;
    height:30px;
    line-height:30px;
    text-decoration:none;
}
#smenu1{
    position:absolute;
    display:none;
    /*width:127px;*/
}
#smenu2{
    position:absolute;
    display:none;
    width:127px;
}
#smenu3{
    position:absolute;
    display:none;
    width:127px;
}
#smenu4{
    position:absolute;
    display:none;
    width:127px;
}
#smenu5{
    position:absolute;
    display:none;
    width:127px;
}
#smenu6{
    position:absolute;
    display:none;
    width:127px;
}
#smenu7{
    position:absolute;
    display:none;
    width:127px;
}
#smenu8{
    position:absolute;
    display:none;
    width:127px;
}


/**/
.ariane{
    clear:both;
    height:16px;
    width:878px;
    font-size:10px;
    color:#ffffff;
    padding:24px 0 0 24px;
}
.ariane-current{
    color:#CA9000;
}

/* Contenu */
.contenu{
    width:902px;
    margin-right:auto;
    margin-left:auto;
    background:no-repeat url(/images/contenu-fond.jpg);
}
.iphone-home{
    background:no-repeat url(/images/iphone-home.jpg);
    width:902px;
    height:491px;
}
.vignette-video{
    float:left;
    width:180px;
    margin-top:330px;
    text-align:center;
    color:#CA9000;
}
.home-desc{
    color:#ffffff;
    font-size:22px;
    width:350px;
    float:left;
    margin-top:350px;
}
.inter-contenu{
    padding:0 0 0 24px;
    color:#ffffff;
}
.inter-contenu h1{
    font-weight:normal;
    font-size:29px;
    padding:35px 0 22px 0;
}
.inter-contenu h2{
    color:#CA9000;
    font-size:16px;
    font-weight:normal;
    padding:22px 0 10px 0;
}
.description-page{
    color:#CA9000;
    padding-bottom:22px;
    font-size:16px;
}
.sep{
    font-size:1px;
    border-top:2px solid #ffffff;
}
.part-materiel{
    float:left;
    width:152px;
    padding:0 57px 0 0;
}
.part-telephonie{
    float:left;
    width:152px;
    padding:0 57px 0 0;
}

.part-financier{
    float:left;
    width:172px;
    padding:0 37px 0 0;
}
.part-internet{
    float:left;
    width:235px;
}
.part-materiel p, .part-telephonie p, .part-financier p, .part-internet p{
    display:block;
    clear:both;
    padding:0 0 20px 0;
}
.part-materiel img, .part-telephonie img, .part-financier img, .part-internet img{
    display:block;
    clear:both;
    padding:0 0 5px 0;
}
.concept-iPhone{
    background:no-repeat url(/images/concept-iphone.gif) 37px 67px;
    padding:50px 0 0 0;
}
.concept-iPhone h2{
    color:#CA9000;
    font-size:20px;
}
.concept-iPhone p{
    width:230px;
}
.zone-qr{
    float:right;
    height:138px;
    width:308px;
    background:no-repeat url(/images/zone-qr.jpg);
    margin:75px 45px 45px 0;
    padding:10px;
}
.un-logiciel{
    width:208px;
    margin:0 15px 0 0;
    float:left;
}
.un-logiciel-der{
    width:208px;
    float:left;
}



/* Footer */
.footer{
    width:902px;
    height:285px;
    margin-right:auto;
    margin-left:auto;
    margin-bottom:10px;
}
.boite-titre{
    color:#ffffff;
    font-size:13px;
    font-weight:bold;
}
.boite{
    padding:12px 0 0 15px;
    color:#303030;
    font-size:12px;
}
.demo-live{
    height:107px;
    width:176px;
    background:no-repeat url(/images/footer-demo.jpg);
    margin-right:5px;
    float:left;
}
.footer-distributeur{
    height:107px;
    width:176px;
    background:no-repeat url(/images/footer-distributeur.jpg);
    margin-right:5px;
    float:left;
}
.footer-offert{
    height:107px;
    width:176px;
    background:no-repeat url(/images/footer-offert.jpg);
    margin-right:5px;
    float:left;
}
.footer-teste{
    height:107px;
    width:176px;
    background:no-repeat url(/images/footer-teste.jpg);
    margin-right:5px;
    float:left;
}
.footer-facebook{
    height:107px;
    width:176px;
    background:no-repeat url(/images/footer-facebook.jpg);
    float:left;
}
.footer-lien{
    height:146px;
    width:886px;
    background:no-repeat url(/images/fond-footer-lien.jpg);
    clear:both;
    padding:12px 0 15px 15px;
    color:#303030;
    font-size:11px;
}
.footer-lien .col{
    width:110px;
    margin-right:15px;
    float:left;
}
.footer-lien .col a{
    color:#3D3D3D;
    text-decoration:none;
}
.footer-lien .col a:hover{
    color:#3D3D3D;
    text-decoration:underline;
}
.copyright{
    padding:20px 0 0 0;
    clear:both;
    text-align:center;
    font-size:10px;
    vertical-align:bottom;
}
.copyright a{
    color:#3D3D3D;
    text-decoration:none;
}
.copyright a:hover{
    color:#3D3D3D;
    text-decoration:underline;
}
.col .section{
    color:#3D3D3D;
    font-weight:bold;
    font-size:12px;
}
.offre-text{
    padding-top:20px;
}
.pack-text{
    padding-top:20px;
}
.pack-text .titre{
    font-size:36px;
    color:#fff;
}
.pack-text .desc{
    font-size:24px;
    color:#fff;
    font-weight:bold;
}
.offre-text .titre{
    font-size:48px;
    color:#fff;
    font-weight:lighter;
}
.offre-text .desc{
    font-size:24px;
    color:#D09621;
}
.part-1{
    margin:0 24px;
    float:left;
    width:145px;
    height:137px;
    background:no-repeat url(/images/fond-part-1.jpg) bottom;
    padding:275px 17px 0 8px;
}
.un-part-1{
    float:left;
    width:145px;
    height:137px;
    background:no-repeat url(/images/fond-part-1.jpg) bottom;
    padding:275px 17px 0 8px;
}
.part-2{
    margin:0 24px;
    float:left;
    width:145px;
    height:157px;
    background:no-repeat url(/images/fond-part-2.jpg) bottom;
    padding:255px 17px 0 8px;
}
.un-part-2{
    float:left;
    width:145px;
    height:157px;
    background:no-repeat url(/images/fond-part-2.jpg) bottom;
    padding:255px 17px 0 8px;
}
.part-3{
    margin:0 24px;
    float:left;
    width:145px;
    height:177px;
    background:no-repeat url(/images/fond-part-3.jpg) bottom;
    padding:235px 17px 0 8px;
}
.un-part-3{
    float:left;
    width:145px;
    height:177px;
    background:no-repeat url(/images/fond-part-3.jpg) bottom;
    padding:235px 17px 0 8px;
}
.part-4{
    margin:0 24px;
    float:left;
    width:145px;
    height:197px;
    background:no-repeat url(/images/fond-part-4.jpg) bottom;
    padding:215px 17px 0 8px;
}
.un-part-4{
    float:left;
    width:145px;
    height:197px;
    background:no-repeat url(/images/fond-part-4.jpg) bottom;
    padding:215px 17px 0 8px;
}
.sous-pack{
    padding-top:10px;
    margin-left:24px;
    height:70px;
    width:194px;
    float:left;
}
.nom-pack{
    font-size:22px;
}
.pack-desc{
    font-weight:bold;
    color:#000;
    font-size:13px;
}
.pack-info{
    margin-top:15px;
    font-size:11px;
    color:#3D3D3D;
}
.pack-date{
    padding-left:25px;
    float:left;
    height:26px;
    width:145px;
    margin:0 24px;
    font-size:18px;
    font-weight:bold;
    color:#000;
    background:no-repeat url(/images/fond-bas-part.jpg);
}
.un-pack-date{
    padding-left:25px;
    float:left;
    height:26px;
    width:145px;
    font-size:18px;
    font-weight:bold;
    color:#000;
    background:no-repeat url(/images/fond-bas-part.jpg);
}
.pack-date-pro{
    padding-left:25px;
    float:left;
    height:26px;
    width:145px;
    margin:0 24px;
    font-size:18px;
    font-weight:bold;
    color:#000;
    background:no-repeat url(/images/fond-bas-pro.jpg);
}
.un-pack-date-pro{
    padding-left:25px;
    float:left;
    height:26px;
    width:145px;
    font-size:18px;
    font-weight:bold;
    color:#000;
    background:no-repeat url(/images/fond-bas-pro.jpg);
}
.note-pack{
    float:left;
    width:400px;
    height:75px;
    font-size:12px;
}
.btn-250{
    display:block;
    height:32px;
    width:254px;
    background:no-repeat url(/images/btn-250.jpg);
    color:#fff;
    line-height:32px;
    text-decoration:none;
    text-align:center;
}
.pro-1{
    margin:0 24px;
    float:left;
    width:145px;
    height:137px;
    background:no-repeat url(/images/fond-pro-1.jpg) bottom;
    padding:275px 17px 0 8px;
}
.un-pro-1{
    float:left;
    width:145px;
    height:137px;
    background:no-repeat url(/images/fond-pro-1.jpg) bottom;
    padding:275px 17px 0 8px;
}
.pro-2{
    margin:0 24px;
    float:left;
    width:145px;
    height:157px;
    background:no-repeat url(/images/fond-pro-2.jpg) bottom;
    padding:255px 17px 0 8px;
}
.un-pro-2{
    float:left;
    width:145px;
    height:157px;
    background:no-repeat url(/images/fond-pro-2.jpg) bottom;
    padding:255px 17px 0 8px;
}
.pro-3{
    margin:0 24px;
    float:left;
    width:145px;
    height:177px;
    background:no-repeat url(/images/fond-pro-3.jpg) bottom;
    padding:235px 17px 0 8px;
}
.un-pro-3{
    float:left;
    width:145px;
    height:177px;
    background:no-repeat url(/images/fond-pro-3.jpg) bottom;
    padding:235px 17px 0 8px;
}
.pro-4{
    margin:0 24px;
    float:left;
    width:145px;
    height:197px;
    background:no-repeat url(/images/fond-pro-4.jpg) bottom;
    padding:215px 17px 0 8px;
}
.un-pro-4{
    float:left;
    width:145px;
    height:197px;
    background:no-repeat url(/images/fond-pro-4.jpg) bottom;
    padding:215px 17px 0 8px;
}

.un-pack-visu{
    float:left;
    width:180px;
}
.un-pack-desc{
    float:right;
    width:670px;
    padding-top:25px;
}
.un-pack-option{
    width:315px;
    float:left;
}
.list-option{
    font-weight:bold;
    font-size:16px;
}
.un-pack-image{
    float:right;
}
.un-pack-note{
    height:40px;
    font-size:12px;
}
.col-220{
    float:left;
    width:220px;
    height:310px;
    margin-right:25px;
    background:no-repeat url(/images/distrib.jpg) bottom;
}
.col-220-bis{
    float:left;
    width:220px;
    margin-right:25px;
}
.col-220 h2{
    float:left;
    color:#fff;
    margin:0;
    padding:0;
    font-size:20px;
}
.col-230{
    float:left;
    width:230px;   
}

.col-230 h2 {
    color:#CA9000;
    font-size:16px;
    font-weight:normal;
    margin:0;
    padding:0 0 5px 0;

}
.btn-200{
    cursor:pointer;
    display:block;
    height:32px;
    width:200px;
    background:no-repeat url(/images/btn-200.jpg);
    color:#fff;
    line-height:32px;
    text-decoration:none;
    text-align:center;
}
.btn-180{
    cursor:pointer;
    display:block;
    height:32px;
    width:184px;
    background:no-repeat url(/images/btn-180.jpg);
    color:#fff;
    line-height:32px;
    text-decoration:none;
    text-align:center;
}
.btn-160{
    cursor:pointer;
    display:block;
    float:left;
    margin:0 10px 0 10px;
    height:32px;
    width:160px;
    background:no-repeat url(/images/btn-160.jpg);
    color:#fff;
    line-height:32px;
    text-decoration:none;
    text-align:center;
}
.btn-160x160{
    cursor:pointer;
    display:block;
    float:left;
	padding-top:20px;
    margin:0 27px 0 27px;
    height:160px;
    width:160px;
    background:no-repeat url(/images/160x190.jpg);
    color:#fff;
    text-decoration:none;
    text-align:center;
}
.btn-100{
    border:0;
    cursor:pointer;
    display:block;
    float:left;
    margin:0 10px 0 10px;
    height:32px;
    width:102px;
    background:no-repeat url(/images/btn-100.jpg);
    color:#fff;
    line-height:32px;
    text-decoration:none;
    text-align:center;
    cursor:pointer;
}
.col-380{
    float:right;
    width:380px;
    background:no-repeat url(/images/col-3.jpg) 0px 40px;
}
.col-190{
    float:right;
    width:190px;
}
.col-790{
    float:left;
    width:460px;
    background:no-repeat url(/images/fond-inscription.jpg) 0px 22px;
    padding-left:110px;
}
.col-790 label{
    width:90px;
    position:relative;
}
.form-inscription input{
    width:250px;
}
.col-280{
    width:280px;
    float:right;
}
.col-615{
    padding-top:22px;
    width:615px;
    float:right;
}

.une-offre{
    width:670px;
    float:left;
    
}
.detail-offre-tel{
    margin-left:210px;
    width:405px;
    height:270px;
    background:no-repeat url(/images/fond-offre-tel.jpg);
    padding:10px 0 0 22px;
}

/* Formulaire */
.formulaire label{
    text-align:right;
}
.formulaire input{
    height:20px;
    width:257px;
    background:no-repeat url(/images/fond-input.jpg);
    padding:3px 0 0 0;
    border:0;
}
.formulaire .textarea_adresse{
    height:55px;
    width:257px;
    background:no-repeat url(/images/fond-area-1.jpg);
    padding:3px 0 0 0;
    border:0;
}
.formulaire .textarea_message{
    height:136px;
    width:333px;
    background:no-repeat url(/images/fond-area-2.jpg);
    padding:3px 0 0 0;
    border:0;
}
.sep-form{
    font-size:2px;
    height:10px;
}