/************************
 * GENERAL
 ************************/
#page #absolute {
    height: 38px;
    position: relative;
    padding: 0;
    margin: 0;
}

#usrbar_absolute {
    background: url(images/fond.png) repeat-x 0 0;
    color: #fff;
    z-index: 9999;
    width: 100%;
    padding: 0;
    margin: 0;
    height: 40px;
}

.usrbar {
	margin: 0 auto;
    max-width: 1010px;
    position: relative;
    height: 40px;
}

#usrbar_absolute p,
#usrbar_absolute a,
#usrbar_absolute li,
#usrbar_absolute span,
#usrbar_absolute button,
#usrbar_absolute input,
#usrbar_absolute label {
    font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, Verdana, sans-serif;
    font-size: 12px;
    line-height: 12px;
}
#usrbar_absolute p {
    margin: 7px 0;
}
#usrbar_absolute a {
    text-decoration: none;
}
#usrbar_absolute input[type="text"], input[type="password"] {
	padding:0;
}

/************************
 * LOGO
 ************************/
.usrbar_logo,
.usrbar_avatar {
    margin: 4px 0 0 0;
    float: left; 
}
.usrbar_logo img,
.usrbar_avatar img,
.usrbar_logo a,
.usrbar_avatar a {
     height: 30px;
     width: 30px;  
}
.usrbar_logo.kazeco {
    margin: 0;
}
.usrbar_logo .kazeco-logo {
    height: auto;
    width: auto;
}

/************************
 * BOX LEFT
 ************************/
.usrbar_left {
    float: left;
    margin: 0 0 0 5px;
}
.usrbar_left .usrbar_buttonlog > div {
    display: inline-block;
    vertical-align: top;
}
.usrbar_left > div {
    float: left;
}
.usrbar_left form div {
    margin: 0;
}
.usrbar_buttonlog {
    margin-top: 8px;
}
.usrbar_left .usrbar_info form {
    padding: 0;
    background: none;
}
.usrbar_left .usrbar_info span {
    display: block;
    margin: 0;
    padding: 0 10px 0 5px;
}
.usrbar_left .usrbar_info a, .usrbar_info span {
    font-size: 11px;
    line-height: 10px;
    color: white;
    text-decoration: none;
}
#usrbar_absolute .usrbar_left .usrbar_info a:hover {
    color: white;
    text-decoration: underline;
}
.usrbar_left .usrbar_info span:last-child {
    max-width:155px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/*overight button et form templates joomla*/
.usrbar_left .usrbar_info form p a {
    font-size: 9px;
    margin: 0;
    padding: 0;
}
.usrbar_left .usrbar_info form div {
    margin: 0;
}
#usrbar .usrbar_left .usrbar_info form input[type="submit"].button,
#usrbar .usrbar_left .usrbar_info form button,
#usrbar .usrbar_left .usrbar_info form.style input[type="submit"].button,
#usrbar .usrbar_left .usrbar_info form.style button {
    display: block;
    border: none;
    background: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    line-height: 9px;
    border-bottom: 1px solid transparent;
    font-size: 9px;
    padding: 0;
    margin: 1px 5px 0 5px;
    color: white;
    font-weight: normal;
    text-transform: none;
    font-style: normal;
    font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, Verdana, sans-serif;
    height: auto;
    -o-text-shadow: none;
    -moz-text-shadow: none;
    -webkit-text-shadow: none;
    text-shadow: none;

}
#usrbar .usrbar_info form input[type="submit"].button:hover,
#usrbar .usrbar_info form button:hover,
#usrbar .usrbar_info form.style input[type="submit"].button:hover,
#usrbar .usrbar_info form.style button:hover {
    border-bottom-color: white;
    background: none;
    color: white;
}

/*notification joomsocial : ids définis par un autre module*/
#usrbar #jsNotification {
    margin: 10px !important; 
}

#usrbar #jsNotification li {
    border: 1px solid transparent;
    background: transparent no-repeat;
}
#usrbar #jsNotification #jsGlobal  {
    background-image: url(images/noti.png);
    background-position: 1px 1px;
}
#usrbar #jsNotification #jsFriend  {
    background-image: url(images/friend.png);
    background-position: 1px -2px;
}
#usrbar #jsNotification #jsInbox  {
    background-image: url(images/mail.png);
    background-position: 2px 1px;
}
#usrbar #jsNotification li:hover {
    background-color: #333435;
    border-color: #333435;
}

/************************
 * BOX RIGHT
 ************************/

.usrbar_right div {
	float: right;
	margin: 0;
	padding: 0;
}
.usrbar_right .usrbar_separator_left, .usrbar_right .usrbar_separator_right, .usrbar_right .usrbar_center {
	margin-top: -2px;
	position: relative;
	height: 28px;
}
.usrbar_right .usrbar_separator_left, .usrbar_right .usrbar_separator_right {
	width: 15px;
}
.usrbar_right .usrbar_center {
	background: url(images/newletter_background.png) repeat-x 0 0;
}
.usrbar_right .usrbar_separator_left div {
	background: url(images/newletter_background_left.png) no-repeat 0 0;
	width: 78px;
	height: 28px;
	position: absolute;
	top: 0;
	right: 0;
}
.usrbar_right .usrbar_separator_right div {
	background: url(images/newletter_background_right.png) no-repeat 0 0;
	width: 78px;
	height: 28px;
	position: absolute;
	top: 0;
	left: 0;
}

/************************
 * NEWSLETTER
 ************************/

.usrbar_center .usrbar_newsletter {
	margin-top: 1px;
    margin-right: 15px;
}
.usrbar_center .usrbar_newsletter a {
    text-decoration: none;
    background: white;
    border-radius: 4px;
    line-height: 14px;
    height: 14px;
    padding: 1px 5px 1px 5px;
    display: block;
    color: #000;
    text-decoration: none;
    margin-top: 5px;
}
.usrbar_center .acymailing_module_form > span,
.usrbar_center .usrbar_newsletter .acymailing_module_form {
	display: inline-block;
    vertical-align: top;
}
.usrbar_center .usrbar_newsletter input[type="text"] {
    width: 90px;
}
.usrbar_center .acymailing_module_form > span {
    margin-top: 6px;
}
.usrbar_center .usrbar_newsletter table {
	display: inline-block;
}
.usrbar_center .usrbar_newsletter table span {
	display: block;
	min-width: 100px;
	margin-top: 0;
    float: none;
}
.usrbar_center .usrbar_newsletter .acymailing_form td {
	padding: 0;
    padding-left: 5px;
}
.usrbar_center .usrbar_newsletter .acymailing_form .acyfield_email {
	padding-top: 1px;
}

/************************
 * addthis
 ************************/
.usrbar_center .usrbar_addthis {
	margin-top: 6px;
}

/************************
 * Panier
 ************************/
.usrbar_panier {
    float: right;
    margin-top: 7px;
    margin-left: 12px;
    position: relative;
}
.usrbar_panier>span {
    vertical-align: middle;
    display: inline-block;
    margin: 0;
}
.usrbar_panier_logo {
    width: 24px;
    height: 24px;
}
.usrbar_panier .usrbar_cart {
    margin-left: 5px;
}

/************************
 * CLEAR FLOAT
 ************************/
.usrbar_clearfloat {
    clear: both;
}


/************************
 * FENETRE LOGIN
 ************************/
#usrbar_absolute .usrbar_windowlog {
    position: fixed;
    top: 80px;
    left: 50%;
    margin-left: -130px;
    color: #000;
    background: #fff url(images/logo-kaze-46px.png) no-repeat;
    width: 240px;
    border: #56585a 10px solid;
    padding: 5px 0 5px 0;
    -webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.4);
    -moz-box-shadow: 0 3px 5px rgba(0,0,0,0.4);
    box-shadow: 0 5px 3px rgba(0,0,0,0.4);
    
}
#usrbar_absolute .usrbar_windowlog.kazeco {
    background: #fff;
    border-color: #A0DCDC;
}
#usrbar_absolute .usrbar_windowlog.kazeco .usrbar_windowlog_logo {
    display: block;
    position: absolute;
    top: -3px;
    left: -3px;
    z-index: 2;
    height: 36px;
    width: 36px;
    background: url(images/logo-kazeco.png) 0 0 no-repeat;
}
#usrbar_absolute .usrbar_windowlog h4 {
	margin: 14px 5px 20px 60px;
	text-align: left;
	font-size: 20px;
	line-height: 15px;
	font-family: "Asuka";
    color: #000;
}
#usrbar_absolute .usrbar_windowlog h4 span {
	display: block;
	font-size: 11px;
}
#usrbar_absolute .usrbar_windowlog p,#usrbar_absolute .usrbar_windowlog li a {
    text-decoration: none;
    font-size: 10px;
    color: #000;
}
#usrbar_absolute .usrbar_windowlog li a:hover {
    color: #000;
    text-decoration: underline;
}
#usrbar_absolute .usrbar_windowlog fieldset, #usrbar_absolute .usrbar_windowlog form div {
	text-align: center;
	margin: 10px 0 10px 0;
	padding: 0 10px 10px 10px;
	border: none;
}
#usrbar_absolute .usrbar_windowlog form div {
	margin-top: 6px;
	margin-bottom: 6px;
}
#usrbar_absolute .usrbar_windowlog form.short {
	margin-left: 50px;
}
#usrbar_absolute .usrbar_windowlog form.short div {
    margin-top: 0;
    margin-bottom: 0;
    padding: 0 5px 5px 10px;
}
#usrbar_absolute .usrbar_windowlog p {
    margin-bottom: 10px;
}
#usrbar_absolute .usrbar_windowlog label {
    font-size: 10px;
    min-width: 65px;
    display: inline-block;
    text-align: right;
}
#usrbar_absolute .usrbar_windowlog div {
    margin-left: auto;
    margin-right: auto;
    width: 120px;
}

#usrbar_absolute .usrbar_windowlog .usrbar_windowlog_sup {
    background: #56585a url(images/croix.png) no-repeat;
    position: absolute;
    top: -3px;
    right:  -3px;
    display: block;
    width: 17px;
    height: 17px;
    cursor: pointer;
}
#usrbar_absolute .usrbar_windowlog.kazeco .usrbar_windowlog_sup {
    background-color: #A0DCDC;
}
#usrbar_absolute .usrbar_windowlog .usrbar_facebook span{
    font-weight: normal;
} 
#usrbar_absolute .usrbar_windowlog .usrbar_facebook a{
    text-decoration: none;
    font-weight: normal;
}
#usrbar_absolute .usrbar_windowlog ul {
	margin: 0 0 5px 10px;
	list-style: none;
}

/*******************************
 * PANIER
 *******************************/

.usrbar_cart_info {
	position: relative;
    margin: -20px 0 0 auto;
    height: 40px;
    width: 200px;
}

.usrbar_cart_info ul {
    position: absolute;
    right: 0;
    top: 0;
	margin: 0;
	padding: 0;
}

.usrbar_cart_info ul li {
	overflow: hidden;
	max-height: 0;
	opacity: 0;
	display: block;
	max-width: 190px;
	background: #444;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
	border-radius: 5px;
	font-size: 12px;
	line-height: 16px;
	padding: 0 10px;
	margin-top: 0;
	-webkit-transition-property: opacity, max-height, padding, margin;
	-webkit-transition-duration: 0.5s;
	-webkit-transition-timing-function: ease, ease, ease, ease-in-out;
	-moz-transition-property: opacity, max-height, padding, margin;
	-moz-transition-duration: 0.5s;
	-moz-transition-timing-function: ease, ease, ease, ease-in-out;
    -ms-transition-property: opacity, max-height, padding, margin;
    -ms-transition-duration: 0.5s;
    -ms-transition-timing-function: ease, ease, ease, ease-in-out;
	-o-transition-property: opacity, max-height, padding, margin;
	-o-transition-duration: 0.5s;
	-o-transition-timing-function: ease, ease, ease, ease-in-out;
	transition-property: opacity, max-height, padding, margin;
	transition-duration: 0.5s;
	transition-timing-function: ease, ease, ease, ease-in-out;
}

.usrbar_cart_info ul li.show { 
	opacity: 1;
	max-height: 40px;
	padding: 2px 10px;
	margin-top: 10px;
	-webkit-transition-property: opacity, max-height, padding, margin;
	-webkit-transition-duration: 0.5s;
	-webkit-transition-timing-function: ease, ease, ease, ease-in-out;
	-moz-transition-property: opacity, max-height, padding, margin;
	-moz-transition-duration: 0.5s;
	-moz-transition-timing-function: ease, ease, ease, ease-in-out;
    -ms-transition-property: opacity, max-height, padding, margin;
    -ms-transition-duration: 0.5s;
    -ms-transition-timing-function: ease, ease, ease, ease-in-out;
	-o-transition-property: opacity, max-height, padding, margin;
	-o-transition-duration: 0.5s;
	-o-transition-timing-function: ease, ease, ease, ease-in-out;
	transition-property: opacity, max-height, padding, margin;
	transition-duration: 0.5s;
	transition-timing-function: ease, ease, ease, ease-in-out;
}

/************************
 * DESIGN DES BOUTONS
 ************************/

#usrbar_absolute .kaze-btn,
#usrbar_absolute .kaze-btn-black,
#usrbar_absolute .usrbar_windowlog form input[type="submit"].button,
#usrbar_absolute .usrbar_windowlog form button,
#usrbar_absolute .usrbar_windowlog form.style input[type="submit"].button,
#usrbar_absolute .usrbar_windowlog form.style button,
#usrbar_absolute .usrbar_newsletter input[type="submit"],
#usrbar_absolute .usrbar_newsletter input[type="button"]
{
     display: block;
     cursor: pointer;
     text-decoration: none;
     margin: 0;
     text-transform: none;
    font-style: normal;
    font-weight: normal;
    font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, Verdana, sans-serif;
    font-size: 12px;
     text-align: center;
     border: none;
     -o-text-shadow: none;
     -moz-text-shadow: none;
     -webkit-text-shadow: none;
     text-shadow: none;
     box-shadow: none;
}

#usrbar_absolute .kaze-btn,
#usrbar_absolute .usrbar_windowlog form input[type="submit"].button,
#usrbar_absolute .usrbar_windowlog form button,
#usrbar_absolute .usrbar_windowlog form.style input[type="submit"].button,
#usrbar_absolute .usrbar_windowlog form.style button
{
    background: url(images/bouton.png) no-repeat;
    color: black;
    padding: 0;
    width: 120px;
     height: 22px;
     line-height: 22px;
}

#usrbar_absolute .usrbar_windowlog form input[type="submit"].button,
#usrbar_absolute .usrbar_windowlog form button,
#usrbar_absolute .usrbar_windowlog form.style input[type="submit"].button,
#usrbar_absolute .usrbar_windowlog form.style button 
{
    margin: 0 auto;
    border: none;
    background: url(images/bouton-connexion-popup.png) no-repeat;
    text-align: left;
    padding-left: 36px;
}
#usrbar_absolute .usrbar_windowlog.kazeco form input[type="submit"].button,
#usrbar_absolute .usrbar_windowlog.kazeco form button,
#usrbar_absolute .usrbar_windowlog.kazeco form.style input[type="submit"].button,
#usrbar_absolute .usrbar_windowlog.kazeco form.style button {
    background: url(images/bouton-connexion-popup-kazeco.png) no-repeat;
}

#usrbar_absolute .kaze-btn:hover,
#usrbar_absolute .usrbar_windowlog form input[type="submit"].button:hover,
#usrbar_absolute .usrbar_windowlog form button:hover,
#usrbar_absolute .usrbar_windowlog form.style input[type="submit"].button:hover,
#usrbar_absolute .usrbar_windowlog form.style button:hover
{
    text-decoration: none;
    color: black;
}

#usrbar_absolute .kaze-btn-header {
    background: url(images/bouton-connexion.png) no-repeat;
    text-align: left;
    padding-left: 29px;
    width: 73px;
}
#usrbar_absolute .kaze-btn-header.kzplay {
    background: url(images/bouton-connexion-kzplay.png) no-repeat;
}
#usrbar_absolute .kaze-btn-header.kazeco {
    background: url(images/bouton-connexion-kazeco.png) no-repeat;
}
#usrbar_absolute .kaze-btn-black,
#usrbar_absolute .usrbar_newsletter input[type="submit"],
#usrbar_absolute .usrbar_newsletter input[type="button"]
 {
    color: white;
    display: inline-block;
    padding: 2px 15px;
    line-height: 16px;
    background-color: #333435;
    -webkit-box-shadow: inset 1px 1px 2px #000;
    -moz-box-shadow: inset 1px 1px 2px #000;
    box-shadow: inset 1px 1px 2px #000;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
}
#usrbar_absolute .usrbar_newsletter input[type="submit"],
#usrbar_absolute .usrbar_newsletter input[type="button"] {
    background-color: #55585a;
}
#usrbar_absolute .kaze-btn-black:hover,
#usrbar_absolute .usrbar_newsletter input[type="submit"]:hover,
#usrbar_absolute .usrbar_newsletter input[type="button"]:hover
{
    background-color: #e11b27;
    color: white;
    text-decoration: none;
}

#page #usrbar_absolute .usrbar_windowlog form input:focus,
#page #usrbar_absolute .usrbar_windowlog form button:hover,
#page #usrbar_absolute .usrbar_windowlog form.style input:focus,
#page #usrbar_absolute .usrbar_windowlog form.style button:hover,
#usrbar_absolute .usrbar_windowlog button:hover,
#usrbar_absolute .usrbar_windowlog input:focus {
    color: black;
}
#usrbar_absolute .usrbar_windowlog input[type="text"],
#usrbar_absolute .usrbar_windowlog input[type="password"] {
    width: 110px;
    background: white;
    border-radius: 0;
    border: 1px solid #C8C8C8;
    padding: 1px 0px 1px 5px;
    color: black;
    box-shadow: none;
}
#usrbar_absolute .usrbar_windowlog input[type="text"]:hover, #usrbar_absolute .usrbar_windowlog input[type="password"]:hover {
    border: 1px solid black;
}
#usrbar_absolute .usrbar_windowlog form input:-moz-placeholder,
#usrbar_absolute .usrbar_windowlog form.style input:-moz-placeholder { color: #666; }
#usrbar_absolute .usrbar_windowlog form input::-webkit-input-placeholder,
#usrbar_absolute .usrbar_windowlog form.style input::-webkit-input-placeholder { color: #666; }
#usrbar_absolute .usrbar_windowlog form input:focus,
#usrbar_absolute .usrbar_windowlog form.style input:focus {
    background: white;
    color: black;
    border: 1px solid black;
}

/************************
 * responsive
 ************************/
@media screen and (max-device-width : 480px) and (orientation:portrait), (max-width : 480px) and (orientation:portrait) {
    .usrbar_panier {
        display: none;
    }  
}
@media screen and (max-device-width : 770px), (max-width: 980px) {
    .usrbar_right {
        display: none;
    }
    #usrbar_absolute .usrbar_windowlog {
        top: 60px;
    }
}