/* --- BARRA LOGIN --- */
.c-barra-login {
    background-color: #2D4D5A;
    display: table;
    font-family: "Open Sans", sans-serif;
    position: relative;
    width: 100%;
    z-index: 9999;
}
.barra-login-cont {
    color: #fff;
    margin: 0 auto;
    padding: 0.125em 0.6em 0.3125em 0em;
    max-width: 1214px;
    width: auto;
 }
.barra-login-cont a {	
    color: #fff;
    font: 400 12px "Open Sans", sans-serif;
    text-decoration: none;
}
.barra-login-cont a:hover { text-decoration: underline; }
.jornais-grpcom {
    display: inline-block;
    text-align: left;
    width: 27.25%;  
}
.assine-clube {
    display: inline-block;
    width: 27.2%;
}
.assine-clube a,
.assine-clube a:hover,
.assine-clube a:visited,
.assine-clube span {
    color:#ffd200;
}
.assine-clube span { padding: 0 0.25em; }

.area-login {
    display: inline-block;
    text-align: right;
    position: relative;
    width: 55.25%;
}
.area-login .carrega-login {
    margin-top: 0.25em;
}
.area-login ul {

}
.area-login li {
    display: inline;
    padding: 0 0.5em 0 0.5em;
    width: auto;
}
.area-login li:hover {
    background-color: #3f6270;
    cursor: pointer;
}
.bot-usuario-on {
    cursor: pointer;
    position: relative;
    width: 1.875em;
}
.bot-usuario-on span {
    border: 5px solid transparent;
    border-top-color:#cbd2d6;
    display: block;
    height: 0;
    position: absolute;
    right: -15px;
    top: 7px;
    width: 0;
}

/* LOGIN EM TERCEIROS */
.c-barra-login-terceiros .barra-login-cont { max-width: 996px; }
.c-barra-login-terceiros .assine-clube { width: 27.2%; }
.c-barra-login-terceiros .area-login { width: 71.75%; }

/* IMAGEM PERFIL */

.nomePerfil .label-letter-name{
	color: #fff;
	float:left;
	height: 35px;
	line-height: 35px;
	margin-right: 10px;
	width: 35px;
}

/* submenu drop down */
.usuario-on li {
    margin-right: 0;
    padding: 0.3125em 1.625em 0.125em 0.9375em;
    position: relative;
}
.usuario-on-submenu {
    background-color: #F4F4F4;
    border: 2px solid #fff;

    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;

    box-shadow: 0 0 4px #aaaaaa;
    color: #666;
    display: none;    
    padding: 10px 15px;
    position: absolute;
    right: -1px;
    top: 30px;
    width: 170px;
    z-index: 1000;
}
    .usuario-on-submenu:after,
    .usuario-on-submenu:before {
        bottom: 100%; 
        border: solid transparent; 
        content: " "; 
        height: 0; 
        width: 0; 
        position: absolute; 
        pointer-events: none;
    }
    .usuario-on-submenu:after {
        border-color: rgba(244, 244, 244, 0); 
        border-bottom-color: #f4f4f4; 
        border-width: 8px; 
        right: 7px; 
        margin-left: -8px;
    }
    .usuario-on-submenu:before {
        border-color: rgba(223, 222, 222, 0); 
        border-bottom-color: #fff; 
        border-width: 11px; 
        right: 4px; 
        margin-left: -11px;
    }

@-moz-document url-prefix() {
    .usuario-on-submenu { right: 4px; }    
}

.usuario-on-submenu li {
    border-bottom: 1px dotted #C3C3C3;
    display: block;
    margin: 0;
    padding: 0.3125em 0 0.3125em 0.625em;
    text-align: left;
    text-decoration: none;
    width: 100%;
}
.usuario-on-submenu li:hover {
    background-color: #e7e7e7;
}
.usuario-on-submenu li a, .usuario-on-submenu li a:hover {
    background: url("../../_imagens/sprite-icones-barra-login.png") 0 0 no-repeat;
    color: #134d86;
    display: block;
    font-family: 'Open Sans', sans-serif;
    font-size: 0.875em;
    padding: 0.2em 0 0.2em 1.5em;
}
.usuario-on-submenu li a:hover {
}
.usuario-on-submenu li a.meu-perfil {
    background-position: -5px -27px;
}
.usuario-on-submenu li a.editar-conta {
    background-position: -5px -50px;
}
.usuario-on-submenu li a.sair {
    background-position: -5px -2px;
}

.notificacoes {display: block; padding: 0 !important; position: relative;}
.notificacoes:hover {background-color: transparent !important;}

.notificacoes a.abre-notificacoes {cursor: pointer; padding: 0 0 10px 10px;}
.notificacoes a.abre-notificacoes span {
	color: #fff;
	background-color: #ff8800; 
	border-radius: 4px; 
	padding: 0 4px;
}
.notificacoes ul {
    background-color: #F4F4F4;
    border: 2px solid #fff;

    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;

    box-shadow: 0 0 4px #aaaaaa;
    color: #666;
    padding: 10px;
    position: absolute;
    right: -8px;
    top: 24px;
    width: 280px;
    z-index: 1000;
}

    .notificacoes ul:after, .notificacoes ul:before { bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
    .notificacoes ul:after { border-color: rgba(244, 244, 244, 0); border-bottom-color: #f4f4f4; border-width: 8px; right: 7px; margin-left: -8px; }
    .notificacoes ul:before { border-color: rgba(223, 222, 222, 0); border-bottom-color: #fff; border-width: 11px; right: 4px; margin-left: -11px; }

.notificacoes:hover ul {text-align: left;}
.notificacoes li {
    border-bottom: 1px solid #dfdede; 
    display: inline-block !important;
    margin: 0 !important;
    padding: 10px 0;
    text-align: left !important; 
    width: 100%;
}
.notificacoes li:hover {background-color: #ebebeb !important;}
.notificacoes li a {color: #666 !important; line-height: 12px; margin: 0; outline: none; text-align: left; padding: 0;}
.notificacoes li a img {border: 2px solid #dfdede; float: left; margin-right: 10px; width: 28px}
.notificacoes li a span {font-weight: 600;}
.notificacoes li.notificacoes-mais  {border-bottom: none; padding: 5px 0 0; text-align: center !important;}
.notificacoes li.notificacoes-mais:hover {background-color: f4f4f4 !important; text-decoration: underline;}

.modal-login span { color:#fff; font: 12px "Open Sans", sans-serif; }

/*-- Espaco que centraliza a barra quando a publicidade/comparador esta na lateral do site --*/
.barra-login-cont .compensa-publiarea {
    width: 16.5%;
}

span.carrega-login {
	background: url(../../_imagens/icone-barra-login-carregando.gif) 0 0 no-repeat;
	display: block;
	height: 16px;
	position: absolute;
	right: 0;
	top: -16px;
	width: 16px;
}

@media screen and (max-width: 1280px) {
	.c-barra-login {
		text-align: center;
	}
    .barra-login-cont .compensa-publiarea {
        display: none;
    }    
    .barra-login-cont {
        max-width: 1002px;
        padding: 0.125em 0 0.3125em;
        width: 96%;
    }
    .jornais-grpcom,
    .assine-clube,
    .area-login {
        width: 32%;
    }
}
@media screen and (max-width: 780px) {	
	.c-barra-login {
		background-color: #f4f4f4;
		padding: 0.35em 0;
	}
	span.carrega-login {
		background: url(../../_imagens/icone-barra-login-carregando-resp.gif) 0 0 no-repeat;
	}
	.barra-login-cont a,
	.assine-clube a,
	.assine-clube a:hover,
	.assine-clube a:visited,
	.assine-clube span {
		color: #666;
		text-transform: uppercase;
	}
	.barra-login-cont a.modal-login,
	.barra-login-cont a.modal-login span {font-weight: 600;}	
	.assine-clube a.assine {color: #134d86; font-weight: 600;}
    .assine-clube,
    .area-login {
        width: 45%;
    }	
    .jornais-grpcom {
        display: none;
    }	
	.area-login li {
		padding: 0.5em;
		color: #666;
	}
	.area-login li:hover {
		background-color: transparent;
		color: #666;
	}
	.modal-login span { 
		color: #666;
		font-size: 12px;
	}
	.c-barra-login-terceiros .assine-clube {
		text-align: left;
		width: 38%;
	}
	.c-barra-login-terceiros .area-login { width: 60%; }	
}
@media screen and (max-width: 649px) {
	.assine-clube {text-align: left; width: 20%}
	.assine-clube a.clube,
	.assine-clube span { display: none; }
	
	.area-login { text-align: rigth; width: 72% }
}

@media screen and (max-width: 479px) {
    .assine-clube {
        float: left;
        text-align: center;
        width: 50%;
    }
    .assine-clube a.assine { color: #666; }
    .area-login {
        text-align: center;
        width: 50%;
    }
    .area-login .usuario-off li:first-child + li { display: none; }
      
	.barra-login-cont a.modal-login,
	.barra-login-cont a.modal-login span {color: #134d86; font-weight: 600;}

	/* submenu drop down */
	.usuario-on-submenu {
	    right: -60%;
	    top: 36px;
	}
    .usuario-on-submenu:after { right: 40.5%; }
    .usuario-on-submenu:before { right: 39%; }
    
    .notificacoes ul { right: -665%; top: 28px; }
    .notificacoes ul:after { right: 59%; }
    .notificacoes ul:before { right: 58%; }
    
    .notificacoes li.notificacoes-mais { padding: 0; }
}