*{
margin:0;
padding:0;
border:0;
list-style:none;
cursor:default;
text-decoration:none;
color:#001;
font-family: 'Century-Gothic';
font-size : 1em;
}

@font-face {
    font-family: 'Century-Gothic';
    src: url('fonts/Century-Gothic.eot');
    src: url('fonts/Century-Gothic.eot?#iefix') format('embedded-opentype'),
           url('fonts/Century-Gothic.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Century-Gothic bold';
    src: url('fonts/Century-Gothic.eot');
    src: url('fonts/Century-Gothic.eot?#iefix') format('embedded-opentype'),
           url('fonts/Century-Gothic bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Century-Gothic italic';
    src: url('fonts/CenturyGothic.eot');
    src: url('fonts/Century-Gothic.eot?#iefix') format('embedded-opentype'),
           url('fonts/Century-Gothic Italique.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

h1{font-weight:normal;}
h2{font-weight:normal;}

html{
margin:0 auto;
width : 100%;
height : 100%;
background:#ececec;
}

body{
position:relative;
margin:0 auto;
top : 9em;
width : 640px;
}

#alpha_lab{
position:relative;
width : 100%;
width : 638px;
height:auto;
background:#eee;
border : #fff solid 1px;
z-index:0;
}

#header{
position:relative;
top:0;
left : 2%;
width: 98%;
height:60px;
line-height:60px;
z-index:1;
}
#header span{
font-family: 'Century-Gothic';
font-size : 1em;
}
#header i{font-family: 'Century-Gothic italic';}

.header {
display : inline;
font-family: 'Century-Gothic bold';
font-size:1.75em;
color:#001;
letter-spacing:2px;
}

#abc_lab{
position:relative;
top:0px;
left:0px;
width: 100%;
height: auto;
z-index:1;
overflow:hidden;
}

#abc_a{
float:left;
position:relative;
top:0;
margin-left:10px;
width : 200px;
height : 200px;
z-index:1;
overflow:hidden;
margin-bottom:5px;
}
.abc_a {
float:left;
position:relative;
top:0;
left:0;
width : 100%;
height : 100%;
cursor:pointer;
border-radius:6px;
background : #e5e5e5;
}

.abc_a img{
width: 100%;
height:auto;
border-radius:6px;
opacity : 1;
cursor:pointer;
}
.abc_a img:hover{
opacity : 0.7;
}

#abc_peinture{
float:left;
position:relative;
top:0;
margin-left:10px;
width : 200px;
height : 200px;
z-index:1;
overflow:hidden;
margin-bottom:5px;
background:#eee;
}
.abc_peinture {
float:left;
position:relative;
top:0;
left:0;
width : 100%;
height : 100%;
cursor:pointer;
border-radius:6px;
overflow:hidden;
}
.abc_peinture img{
width: 100%;
height:auto;
border-radius:6px;
opacity : 1;
cursor:pointer;
}
.abc_peinture img:hover{
opacity : 0.85;
}

#abc_b{
float:left;
position:relative;
top:0;
margin-left :10px;
width: 200px;
height: 200px;
text-align:right;
z-index:1;
overflow:hidden;
background : #e0e0e0;
border-radius:6px;
}
.abc_b{
float : right;
position:relative;
top:5px;
right : 5px;
width : 92.5px;
height : 92.5px;
margin-left : 0px;
margin-bottom:10px;
background : #eee;
cursor:pointer;
border-radius:6px;
opacity:1;
font-family: 'Century-Gothic bold';
font-size : 1.2em;
}
.abc_b:hover{
background:#fff;
}
.abc_b img{
width: 100%;
height:auto;
border-radius:6px;
cursor:pointer;
}
.abc_b span{
position:relative;
top : 4%;
right : 10%;
font-family: 'Century-Gothic bold';
}
#jazz{margin-left : 5px;}

.abc_b_animals{
float :right;
position:relative;
right : 5px;
width : 92.5px;
height : 92.5px;
margin-left : 0;
background : #eee;
background-size : 100%;
cursor:pointer;
border-radius : 6px;
opacity:1;
font-family: 'Century-Gothic bold';
font-size : 1.2em;
}
.abc_b_animals:hover{
background:#fff;
background-size : 100%;
}
.abc_b_animals span{
position : relative;
top : 3%;
right : 10%;
font-family: 'Century-Gothic bold';
}
.abc_b_animals img{
width: 100%;
height:auto;
border-radius : 6px;
cursor:pointer;
}

.abc {
float : right;
position:relative;
top:0px;
right : 10px;
width : 92.5px;
height : 92.5px;
margin-left : 0px;
margin-bottom:10px;
background:#eee url(abc_assets/zebra0.png) 0 0 no-repeat;
background-size : 100%;
cursor:pointer;
border-radius:6px;
opacity:1;
font-family: 'Century-Gothic bold';
font-size : 1.2em;
}
.abc:hover{
background : #fff url(abc_assets/zebra0.png) 0 0 no-repeat;
background-size : 100%;
}
.abc span{
position:relative;
top : 4%;
right : 10%;
font-family: 'Century-Gothic bold';
cursor:pointer;
}

#footer{
position:relative;
width: 100%;
height:auto;
top:0px;
left:0px;
z-index:1;
overflow:hidden;
}

#abc_links_L{
float:left;
width: auto;
height:60px;
z-index:1;
overflow:hidden;
}
#abc_links_L div{
float:left;
position:relative;
top:0px;
left:0px;
margin-left:8px;
width: 93.5px;
height:40px;
line-height:50px;
}

#footer{
width : 100%;
height : 2em;
}
#footer a{
float:right;
position:relative;
right : 10px;
width: auto;
font-family: 'Century-Gothic bold';
cursor:pointer;
font-size : 1em;
z-index:4;
}
#footer a:hover{color : #0af;}

.abc_links a{
font-family: 'Century-Gothic bold';
color:#001;
cursor:pointer;
z-index:4;
font-size:1.25em;
}
.abc_links a:hover{
color : #fff;
}

#abc_down{
position:relative;
margin:0 auto;
width:  100%;
height : 0em;
overflow:hidden;
margin-top:10px;
background:#fee;
}
.abc_down{
/*float:left;*/
width: 95px;
height:95px;
margin-left:5px;
margin-bottom:5px;
background:#eee;
cursor:pointer;
border-radius:12px;
opacity:0.75;
}
.abc_down:hover{
opacity:1;
background:#eee;
}
.abc_down img{
width: 100%;
height:auto;
border-radius:12px;
cursor:pointer;
}

/*-----------------------------------------------------------
						RESIZE
-----------------------------------------------------------*/
@media only screen and (max-device-width: 960px), only screen and (max-width: 1680px){


}

@media only screen and (max-device-width: 1344px), only screen and (max-width: 1344px){

body{top:6em;}

}


@media only screen and (max-device-width: 960px), only screen and (max-width: 1280px){


}


@media only screen and (max-device-width: 960px), only screen and (max-width: 960px){

html{
margin:0 auto;
width:640px;
}

}


@media only screen and (max-device-width: 640px), only screen and (max-width: 640px){

body {
top : 3.5em;
width:640px;
}

}


@media only screen and (max-device-width: 320px), only screen and (max-width: 320px){

html{
margin:0 auto;
width:308px;
/*overflow:hidden;*/
}

.abc_a {
width: 95px;
height: 95px;
}

body {
top:2em;
padding : 0em 0.5em 0em 0.5em;
}

}
