@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: local('Roboto Thin'), local('Roboto-Thin'), url(fonts/roboto/vzIUHo9z-oJ4WgkpPOtg1_esZW2xOQ-xsNqO47m55DA.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Light'), local('Roboto-Light'), url(fonts/roboto/Hgo13k-tfSpn0qi1SFdUfT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Regular'), local('Roboto-Regular'), url(fonts/roboto/2UX7WLTfW3W8TclTUvlFyQ.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), url(fonts/roboto/RxZJdnzeo3R5zSexge8UUT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url(fonts/roboto/d-6IYplOFocCacKzxwXSOD8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: local('Roboto Black'), local('Roboto-Black'), url(fonts/roboto/mnpfi9pxYH-Go5UiibESIj8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 100;
  src: local('Roboto Thin Italic'), local('Roboto-ThinItalic'), url(fonts/roboto/12mE4jfMSBTmg-81EiS-YRsxEYwM7FgeyaSgU71cLG0.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: local('Roboto Light Italic'), local('Roboto-LightItalic'), url(fonts/roboto/7m8l7TlFO-S3VkhHuR0at4bN6UDyHWBl620a-IRfuBk.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: local('Roboto Italic'), local('Roboto-Italic'), url(fonts/roboto/1pO9eUAp8pSF8VnRTP3xnvesZW2xOQ-xsNqO47m55DA.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 500;
  src: local('Roboto Medium Italic'), local('Roboto-MediumItalic'), url(fonts/roboto/OLffGBTaF0XFOW1gnuHF0YbN6UDyHWBl620a-IRfuBk.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'), url(fonts/roboto/t6Nd4cfPRhZP44Q5QAjcC4bN6UDyHWBl620a-IRfuBk.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 900;
  src: local('Roboto Black Italic'), local('Roboto-BlackItalic'), url(fonts/roboto/bmC0pGMXrhphrZJmniIZpYbN6UDyHWBl620a-IRfuBk.woff) format('woff');
}



/*
	COR 1 #FF9900		
	COR 2 #ff6400
	COR 3 #FFBE00

*/

/* ########################################################################## */
/* ########################################################################## */
/* ########################################################################## */
/* 0. CSS GENERAL CONFIG */
/* ########################################################################## */
@-webkit-keyframes rotation {
    from {-webkit-transform: rotate(0deg);}
    to   {-webkit-transform: rotate(359deg);}
}



/* ########################################################################## */
/* ########################################################################## */
/* ########################################################################## */
/* 1. MAINS CSS - CONFIGURA��ES GERAIS */
/* ########################################################################## */
*{
	border:none;
	list-style:none;
	outline:none;
	resize:none;
	font-family: Roboto, Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
}

body{ height:auto; background:#fafafa; overflow: hidden}

.limite		{ width:100%; max-width:1280px; margin:0 auto}
.clear		{ clear:both}
.hidden		{ display:none !important}
.linhaBreak	{ height:1px; border-bottom:1px solid #e5e5e5; margin:15px 0; clear:both}
.nomargin	{ margin:0 !important}
.nomarginB	{ margin-bottom:0 !important}


.header .linksLogin .link-text, .header .linksLogin .link-text:hover,
.columns, .header h1, .header h1	img,
.box-cadastro-redes a img, .box-cadastro-redes a img:hover,
.contaBox .userSubmenu a, .contaBox .userSubmenu li:hover a,
.contaBox, .contaBox:hover, .contaBox .nomeUsuario, .contaBox:hover .nomeUsuario,
.linkTopo a, .linkTopo a:hover, .linkTopo a	img, .linkTopo a span,
.comandos-tela-cartao a, .comandos-tela-cartao a:hover,
.comandos-tela-cartao a span, .comandos-tela-cartao a:hover span,
.comandos-tela-cartao a	img, .comandos-tela-cartao a:hover img,
.inputFile, .inputFile:hover,
.comandos-tela-cartao input.butonAction, .comandos-tela-cartao input.butonAction:hover,
.left-off-canvas-menu li a, .left-off-canvas-menu li a:hover,
.horizontalTabs ul li, .horizontalTabs ul li:hover,
.litsaDeEventos li a.eventoEditButton:hover, .litsaDeEventos li a.eventoEditButton,
.addEvento:hover .iconPlus, .addEvento .iconPlus,
.addEvento:hover .create, .addEvento .create
	{-webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease;}
	
/* LOADER */        
.loaderFullScreen               { position: fixed; left: 0; top:0; right: 0; bottom: 0; width: 100%; height: 100%;
                                  background:url(../images/estrutura/load_fullscreen.gif) center center no-repeat rgba(248,155,28,0.7); z-index: 100000; display: none}
	
/* LISTA DE ALERTAS */
.lista-alertas			{ margin:0; padding:0}

/* TEXTOS */
.hiperText				{ font-weight:900; color:#a0a0a0; text-align:center; padding:13% 5%; font-size:3.5rem; line-height:1em}
.subHiperText			{ font-weight:700; color:#b5b5b5; text-align:center; padding:5px 0; font-size:2.3rem; line-height:1em}


/* input file */
.inputFile				{ position:relative; background:#f2f2f2; cursor:pointer; display:inline-block; margin:5px auto;
						font-size:0.75rem; text-transform:uppercase; white-space:nowrap; padding:10px 20px; -moz-border-radius:4px; border-radius:4px; 
						background: rgb(255,255,255); /* Old browsers */
						background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(237,237,237,1) 100%); /* FF3.6+ */
						background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(237,237,237,1))); /* Chrome,Safari4+ */
						background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* Chrome10+,Safari5.1+ */
						background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* Opera 11.10+ */
						background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* IE10+ */
						background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(237,237,237,1) 100%); /* W3C */
						filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
						-webkit-box-shadow: 0 2px 6px 2px rgba(0,0,0,0.07);
						box-shadow: 0 2px 6px 2px rgba(0,0,0,0.07);
						border:1px solid #e5e5e5; border-bottom:1px solid #ccc; color:#666 !important;
}
.inputFile input		{ position:absolute; width:100%; height:100%; left:0; top:0; bottom:0; right:0; cursor:pointer; z-index:1; opacity:0}

.inputFile:hover		{ border-bottom:1px solid #e5e5e5; padding-bottom:11px; color: #666;
						background: rgb(237,237,237); /* Old browsers */
						background: -moz-linear-gradient(top,  rgba(237,237,237,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
						background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(237,237,237,1)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
						background: -webkit-linear-gradient(top,  rgba(237,237,237,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
						background: -o-linear-gradient(top,  rgba(237,237,237,1) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
						background: -ms-linear-gradient(top,  rgba(237,237,237,1) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
						background: linear-gradient(to bottom,  rgba(237,237,237,1) 0%,rgba(255,255,255,1) 100%); /* W3C */
						filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
						-webkit-box-shadow:none;
						box-shadow:none;
						cursor:pointer
}

/* CHECKBOXS */

.labelCheckbox			{ position:relative; padding:10px 0 10px 35px; min-height:35px; font-size:0.75rem;}
.labelCheckbox input[type=text]	{ position:absolute; left:0; top:50%; margin:-17.5px 0 0 0; text-indent:-9999px; width:30px; height:30px; cursor:pointer; border:1px solid #ccc; -moz-border-radius:100%; border-radius:100%; }

.labelCheckbox.true input[type=text]	{ background:url(../images/estrutura/icon-checked.png) center center no-repeat #fff}


/* UPLOADS */
.specialFormBox 		{ display: block; margin: 5px 0; background: #f2f2f2; padding: 10px; color: #666; font-size: 12px; text-align: center; 
						font-weight: 300; border: 1px solid #e1e1e1; -webkit-border-radius: 3px; border-radius: 3px}
								
.specialFormBox .imgBox		{ width:125px; height:125px; -moz-border-radius:100%; border-radius:100%; margin:15px auto;
											background-position:center center; background-repeat:no-repeat; background-size:cover; border:2px solid #e5e5e5;
											overflow:hidden}
											

.specialFormBox .imgBox img			{ -moz-border-radius:100%; border-radius:100%;}									
						

.previewCartao                  { margin:0; text-align: center; }

/* abas */
.abas								{}
.abas .ab							{ cursor:pointer; display:block; font-size:0.75rem; border-bottom:1px solid #fff; border-top:1px solid #f2f2f2; 
									padding:15px 30px 15px 18px; text-transform:uppercase; position:relative}
.abas .ab.on,
.abas .ab:hover						{
									background: rgb(254,190,16); /* Old browsers */
									background: -moz-linear-gradient(top,  rgba(254,190,16,1) 0%, rgba(248,155,28,1) 100%); /* FF3.6+ */
									background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,190,16,1)), color-stop(100%,rgba(248,155,28,1))); /* Chrome,Safari4+ */
									background: -webkit-linear-gradient(top,  rgba(254,190,16,1) 0%,rgba(248,155,28,1) 100%); /* Chrome10+,Safari5.1+ */
									background: -o-linear-gradient(top,  rgba(254,190,16,1) 0%,rgba(248,155,28,1) 100%); /* Opera 11.10+ */
									background: -ms-linear-gradient(top,  rgba(254,190,16,1) 0%,rgba(248,155,28,1) 100%); /* IE10+ */
									background: linear-gradient(to bottom,  rgba(254,190,16,1) 0%,rgba(248,155,28,1) 100%); /* W3C */
									filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#febe10', endColorstr='#f89b1c',GradientType=0 ); /* IE6-9 */
									color:#fff;}
.conteudoBox h3.sideBarTitle		{ padding:15px; display:block; margin-top:0;}

.counterContatos					{ display:inline-block; padding:5px 6px; float:right; margin-top:-3px; color:#FFF; background:#F60; 
									-moz-border-radius:4px; border-radius:4px; font-size:0.9em; line-height:1em;
									 position:absolute; right:5px; top:50%; margin-top:-10px;}

/* tabs horizontais */

.horizontalTabs                                             { background: #fdbe12;}
.horizontalTabs ul li                                       { float: left; box-sizing: border-box; padding:1.2%; text-align: center;
                                                              color: #fff; cursor: pointer; font-size: 0.85rem; border-right: 1px solid rgba(255,255,255,0.3);
                                                                text-shadow: 1px 1px 1px rgba(0,0,0,0.1)}
.horizontalTabs ul li:last-child                            { border:none}
.horizontalTabs ul li:hover,
.horizontalTabs ul li.abaAtual                              { background: #fd8d10; position: relative}

.horizontalTabs ul li.abaAtual:after                        { content: ""; width: 1px; height: 1px; border: 10px solid transparent; border-top: 10px solid #fd8d10;
                                                            position:absolute; left: 50%; top: 100%; margin: 0 0 0 -10px}


/* VERTIFCAL TABS */
.verticalTabs li                                            {cursor:pointer; display:block; font-size:0.75rem; border-bottom:1px solid #fff; border-top:1px solid #f2f2f2; 
                                                            padding:15px 30px 15px 18px; text-transform:uppercase; position:relative}
.verticalTabs li.abaAtual,
.verticalTabs li:hover                                             {background: rgb(254,190,16); /* Old browsers */
                                                            background: -moz-linear-gradient(top,  rgba(254,190,16,1) 0%, rgba(248,155,28,1) 100%); /* FF3.6+ */
                                                            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,190,16,1)), color-stop(100%,rgba(248,155,28,1))); /* Chrome,Safari4+ */
                                                            background: -webkit-linear-gradient(top,  rgba(254,190,16,1) 0%,rgba(248,155,28,1) 100%); /* Chrome10+,Safari5.1+ */
                                                            background: -o-linear-gradient(top,  rgba(254,190,16,1) 0%,rgba(248,155,28,1) 100%); /* Opera 11.10+ */
                                                            background: -ms-linear-gradient(top,  rgba(254,190,16,1) 0%,rgba(248,155,28,1) 100%); /* IE10+ */
                                                            background: linear-gradient(to bottom,  rgba(254,190,16,1) 0%,rgba(248,155,28,1) 100%); /* W3C */
                                                            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#febe10', endColorstr='#f89b1c',GradientType=0 ); /* IE6-9 */
                                                            color:#fff;}

.abas                                                       { display: none}


/* PAGINADOR */
ul.pagination							{ display:block; padding:15px 2%; text-align:center; margin-bottom:35px}
ul.pagination li						{ float:none; display:inline-block}

/* botoes */
.buttonFull								{ display:block; width:100% !important; box-sizing:border-box; padding-left:0 !important; padding-right:0 !important; text-align:center}

/* JAVADIV */
#javax_faces_developmentstage_messages      {  margin:0; padding: 0}


/* LIGHTBOXS */
@media only screen and (max-width: 40.063em) { 
    .reveal-modal    { margin: 0 !Important; width: 100% !Important }
} /* min-width 641px,

  
  
  
  
 /* C.1 AVISO DE NAVEGADORES - Bloqueia navegadores antigos ou não homologados */
/* --------------------------------------- */
#avisoNavegador								{position:fixed; left:0; top:0; right:0; bottom:0; width:100%; height:100%; 
											background:#000; z-index:1000000000000000}
*+html #avisoNavegador						{ display:block !important}
*html #avisoNavegador						{ display:block !important}


#avisoNavegador h3							{ text-align:center; padding:15% 0 0; color:#fff; font-size:4em; font-weight:700; letter-spacing:-0.05em;}
#avisoNavegador p							{ color:#999; text-align:center }
#avisoNavegador img							{ max-width:68px; margin:2%}

h1{ font-weight: 300}

/* ########################################################################## */
/* ########################################################################## */
/* ########################################################################## */
/* ########################################################################## */
/* ########################################################################## */
/* ########################################################################## */
/* ########################################################################## */
/* 2. HEADER */
/* ########################################################################## */
.header				{ background:#FF9900}
	
/* 2. Logo */
.boxLogoSearch		{ position:relative; padding:0px 0 0px 160px; box-sizing:border-box; height:65px}


.header h1			{ margin:0; vertical-align:middle; position:absolute; left:0; top:0; height:65px;}
@media only screen and (max-width: 40em) { 
	.boxLogoSearch		{ padding:0; text-align:center}
	.header h1			{ position:relative; width:100%; text-align:center}
}
.header h1 img		{ vertical-align:middle; width:150px !important; max-width:150px !important; min-width:150px !important; margin:15px auto}

.header .linksLogin .link-text					{ color:#ffedda; display:inline-block; margin:21px 0; padding:5px 10px; font-size:0.9rem; font-weight:400}
.header .linksLogin .link-text:first-child		{ border-right:1px solid rgba(255,255,255,0.2)}
.header .linksLogin .link-text:hover			{ text-decoration:underline; color:#fff}


#busca-header							{ display:inline-block; background:#fff; -moz-border-radius:4px; border-radius:4px; margin:14px auto 0; width:100%}
#busca-header input[type=text]			{ border:none; float:left; width:85%; margin:0; -webkit-box-shadow:none; box-shadow:none;}
#busca-header input[type=text]:focus	{ background:none}
#busca-header input[type=submit]		{ float:left; width:15%; background:url(../images/estrutura/busca-topo.png) center center no-repeat transparent; cursor:pointer;
										text-indent:-9999px; padding:8px 0}

.linkTopo								{ text-align:right; height:65px}									
.linkTopo a								{ display:inline-block; vertical-align:top; width:28%; height:65px; color:#fff; font-size:0.8rem; padding:0 1%; font-weight:300; position:relative;}

.linkTopo a:hover						{ background:#FDBD10; border:none; text-decoration:none}

.linkTopo a	img							{ float:left; width:25%; margin:17px 0 0}
.linkTopo a	span						{ float:left; width:70%; padding-top:27px; margin-left:5%; text-align:left; white-space:nowrap}

@media only screen and (max-width: 1160px) { 
	.linkTopo a			{ padding:0 1%}
	.linkTopo a	span	{ font-size:11px}
}	

@media only screen and (max-width: 64.063em) { 
	.linkTopo			{ text-align:right; }
	.linkTopo a			{ display:inline-block; float:none; padding:0 5%; width:auto}
	.linkTopo a	img		{ width:auto}
}									

i.counterNovos			{ display:inline-block; background:#900; color:#fff; font-size:0.65rem; padding:2px 5px 0; line-height:1rem; -moz-border-radius:4px; border-radius:4px; width:auto; font-style:normal; position:absolute; left:30px; top:15px; border:none}	

.contaBox 								{ position:relative; text-align:center; height:65px;}
.contaBox:hover							{ background:#fff}
.userFoto								{ float:left; width:45px; height:45px; -moz-border-radius:100%; border-radius:100%; margin:10px 5px;
										background-position:center center; background-repeat:no-repeat; background-size:cover; vertical-align:top}
.contaBox .userFoto{ float: none; margin: 10px auto}									
.contaBox .nomeUsuario					{vertical-align:top; display: block; padding: 12px 15px; text-align: left; font-weight:300}
.contaBox:hover .nomeUsuario			{ color:#F90}

@media only screen and (max-width: 1080px) { 
	.contaBox .userFoto					{ float:none; margin:11px auto}
}	

.contaBox:hover .userSubmenu			{ display:block}
.contaBox .userSubmenu					{ display:none; position:absolute; z-index:10000; background:#fff; top:100%; right:0; min-width:225px; width:100%; -webkit-border-radius: 0 0 4px 4px;
										border-radius: 0 0 4px 4px;}
										
.contaBox .userSubmenu a				{ display:block; text-align:left; padding:10px 15px; color:#666; border-bottom:1px solid #e5e5e5; font-size:0.7rem}
.contaBox .userSubmenu li:last-child a	{ border:none; -webkit-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px}
.contaBox .userSubmenu li:hover	a		{ background:#F90; color:#fff}





.feedBackChanel         { position: fixed; right:25px; bottom: 0; z-index: 100000; text-align: right;
                         width: 100%; max-width: 350px;}
.feedbackAb             { display: inline-block; padding: 15px; margin-right: 10px; cursor: pointer; background: #ff9900; color:#fff;
                        font-size: 18px; -moz-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0}
.feedBackForm           { display:none; background: #fff; border:2px solid #F90; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0;
                        padding: 20px; text-align: left; width: 100%;  border-bottom:none}

.feedBackForm p         { font-size: 12px;}
.feedBackForm textarea  { height: 150px}

.msgSucesso             { text-align: center; display:none}
.msgSucesso img         { max-width: 75px; margin: 15px auto}
.msgSucesso h4          { color: #5d9f06}

/* ########################################################################## */
/* 3. FOOTER */
/* ########################################################################## */
.footer				{ border-top:1px solid #e5e5e5}
.footer img			{ margin-top:20px;}
.footerLinks		{ display:inline-block; padding:35px 10px; font-size:11px; color:#666;}


/* ########################################################################## */
/* 4. MOBILE MENU */
/* ########################################################################## */
.buttonResponsiveMenu{ float:left; padding:5px; background:#FFBE00;
	-webkit-border-radius: 4px; border-radius: 4px; margin-top:10px; margin-left:15px; position:relative; z-index:10000}
	
.buttonResponsiveMenu:hover{ background:#ff6400}

.left-off-canvas-menu ul	{ padding:0; margin:0}
.left-off-canvas-menu li a	{ display:block; font-size:0.7rem; font-weight:300; color:#fff; padding:10px 15px; border-bottom:1px solid #333; border-top:1px solid #666}
.left-off-canvas-menu li a:hover	{ background:#121212}


/* ########################################################################## */
/* ########################################################################## */
/* ########################################################################## */
/* ########################################################################## */	
/* 5. ESTRUTURA BASICA DOS CARTOES*/
/* ########################################################################## */
.cartaoItem		{ -webkit-perspective: 1000; -moz-perspective: 1000; perspective: 1000;
					width:100%; max-width:680px; height:377px; margin:15px auto;	z-index:2; position:relative}
					
.cartaoItem	 .card-bt-gira					{ position:absolute; width:35px; height:35px; padding:5px 0;
				background:url(../images/estrutura/sprites.png) center center no-repeat #f2f2f2;
				-webkit-border-radius: 4px; border-radius: 4px;
				right:-25px; top:-25px; z-index:1000; cursor:pointer;
				text-align:center; opacity:0.5;
				-webkit-box-shadow: 0 1px 1px 1px rgba(0,0,0,0.2);box-shadow: 0 1px 1px 1px rgba(0,0,0,0.2);
				-webkit-transition: all 300ms ease;	-moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease;	transition: all 300ms ease;}

.cartaoItem	 .card-bt-gira:hover			{ opacity:1; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease;
											transition: all 300ms ease;} 
.cartaoItem .cartaoFrenteVerso 							{ width:100%; -webkit-transition: 0.6s;	-webkit-transform-style: preserve-3d; -moz-transition: 0.6s;
											-moz-transform-style: preserve-3d; transition: 0.6s; transform-style: preserve-3d; position:relative; z-index:5}

.cartaoItem .cartaoFrenteVerso .front, 
.cartaoItem .cartaoFrenteVerso .back {
				width:100%;overflow:hidden; 
				margin:0 auto;	
				-webkit-backface-visibility: hidden;
				-moz-backface-visibility: hidden;
				backface-visibility: hidden;
				position: absolute;
				top: 0;
				left: 0;
				-webkit-transition: all 300ms ease;
				-moz-transition: all 300ms ease;
				-ms-transition: all 300ms ease;
				-o-transition: all 300ms ease;
				transition: all 300ms ease;
				z-index:2}

.cartaoItem .cartaoFrenteVerso .front.dropArea.ui-droppable, 
.cartaoItem .cartaoFrenteVerso .back.dropArea.ui-droppable { overflow: visible}

.cartaoItem .cartaoFrenteVerso .front {z-index: 2;}
.cartaoItem .cartaoFrenteVerso .back { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg);	transform: rotateY(180deg)}
.cartaoItem .cardBox				{ width:100%; max-width:680px; height:377px; position:relative}
.cartaoItem .cardBox .bgImg			{ width:100%; position:absolute; z-index:999; top:0; left:0; width:100%; display:block; margin:0 auto}
.cartaoItem .rotateCard.girarCartao	{ position:absolute; right:-5px; bottom:-20px; background:#F60; padding:5px 5px 0; opacity:0.5;	z-index:15000;
						-webkit-border-radius:4px; border-radius:4px;}
.cartaoItem .rotateCard.girarCartao:hover	{ opacity:1}
.cartaoItem .textBox				{ z-index:10000; position: absolute}
.cartaoItem .addedField .textBox                         { position: relative !important}
.cartaoItem .imgBox					{ z-index:10000;}
.cartaoItem .imgBox img				{ width:100%; height:100%}


.comandos-tela-cartao				{ padding:0 10px; text-align:center}

.comandos-tela-cartao input.butonAction,
.comandos-tela-cartao a				{ display:inline-block; position:relative; min-width:75px; height:75px; padding:15px; box-sizing:border-box; 
									background:#fff; vertical-align:top; -moz-border-radius:4px; border-radius:4px;}
									
.comandos-tela-cartao input.butonAction	{ font-size:0.75rem; padding:48px 15px 15px}

.comandos-tela-cartao input.butonAction.salvar	{ background:url(../images/estrutura/icon-salvar.png) center 15px no-repeat #fff}
.comandos-tela-cartao input.butonAction.salvar:hover	{ background:url(../images/estrutura/icon-salvar-hover.png) center 15px no-repeat #F90; color:#FFF}

.comandos-tela-cartao a.laranja		{ background-color:#F90}
.comandos-tela-cartao a.laranja span	{ color:#fff}
.comandos-tela-cartao a.laranja:hover	{ background-color:#FC0}

.comandos-tela-cartao a	img			{ position:absolute; left:50%; top:15px; z-index:1; margin-left:-12px}
.comandos-tela-cartao .on		{ display:none}
.comandos-tela-cartao a span		{ font-size:0.75rem; text-align:center; display:block; padding:35px 0 0; 
									color:#666; white-space:nowrap}
.comandos-tela-cartao a:hover		{ background:#F90}
.comandos-tela-cartao a:hover span	{ color:#fff}

.comandos-tela-cartao a:hover .on	{ display:block}
.comandos-tela-cartao a:hover .out	{ display:none}

@media only screen and (max-width: 600px) {
	.comandos-tela-cartao a 		{ height:55px; min-width:50px; padding:15px 5px }
	.comandos-tela-cartao a span	{ display:none}
	.comandos-tela-cartao input.butonAction{ text-indent:-9999px; height:55px; padding:41px 5px 15px; min-width:50px}
}


/*
@media screen and (orientation:portrait) { 	
	.cartaoItem {	
		-webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; 
		-o-transition: all 300ms ease; transition: all 300ms ease;
		-moz-transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		-o-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);}
   
}
/* Landscape * /
@media screen and (orientation:landscape) {
   
}


/* ########################################################################## */
/* ########################################################################## */
/* ########################################################################## */
/* ########################################################################## */	
/* 6. TELAS */
/* ########################################################################## */
.conteudoBox					{ width:96%; max-width:1200px; background:#fff; margin:45px auto; -moz-border-radius:4px; border-radius:4px;
							-webkit-box-shadow: 0 2px 0 1px rgba(0,0,0,0.1); box-shadow: 0 2px 0 1px rgba(0,0,0,0.1);}
							
.conteudoBox .tituloConteudo	{ padding:15px; font-size:1.6em; line-height:1em; color:#F90; letter-spacing:-0.04em; font-weight:600;  background:#fcfcfc; border-top:2px solid #e5e5e5;
								-webkit-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; border-bottom:1px solid #e5e5e5; text-shadow: 1px 1px 1px #fff;}
.conteudoBox .tituloConteudo.tituloAba{ margin-bottom:0}

.conteudoBox h3					{ color:#666; font-size:1.6rem; font-weight:100; padding:5px 0}

/* ########################################################################## */
/* 6.1 TELA DO CARTAO PUBLICO */
/* ########################################################################## */
	.conteudo.telaCartao	{ padding:25px 0}
	        
        .chamadaCadastro                { margin: 25px auto; width: 100%; max-width: 500px; padding: 10px; background: #fff;
                                        -moz-border-radius: 6px; border-radius: 6px;}
	.chamadaCadastro h3             { font-weight: 300; margin: 0}
	.chamadaCadastro                { font-size: 12px}
        .chamadaCadastro .button        { margin-bottom: 0}
        
        
        
/* ########################################################################## */
/* 6.2 Cadastro */
/* ########################################################################## */
	.box-cadastro-redes		{ margin:25px 0; padding-left:15px}
	.camposCadastro			{ border-right:1px solid #ccc; margin-top:-8px}
	@media only screen and (max-width: 40em) { 
		.box-cadastro-redes{ border:none; padding:0; margin:0 }
	}	
	.box-cadastro-redes a img	{ opacity:0.7}
	.box-cadastro-redes a img:hover	{ opacity:1}
/* ########################################################################## */
/* 6.3 Perfil */
/* ########################################################################## */	
	
.userFoto.fotoPerfil{ display:inline-block; width:155px; height:155px; margin:15px auto; float:none}
	
/* ########################################################################## */
/* 6.3 Login */
/* ########################################################################## */
.conteudoBox.loginBox		{ max-width:450px}

.linksLogin a				{ display:block; font-size:0.7rem; color:#666; padding:5px 15px; text-decoration:underline}

.roundFoto                      { width: 150px; height: 150px; margin: 15px auto 0; -moz-border-radius:100%; border-radius:100%;
                                  background-size:cover; border:2px solid #f2f2f2;
                                   background-position: center center; background-repeat: no-repeat}
.conteudoBox h3.userNamePlaceholder            { text-align: center; color: #F90}



/* ########################################################################## */
/* 6.3 Tela cartao / logado */
/* ########################################################################## */
.caixaTelaCartao			{ padding:1% 0}

@media only screen and (max-width: 700em) { 
		.caixaTelaCartao{ padding:1% 5%}
	}

/* ########################################################################## */
/* 6.4 Aceite de cart�o
/* ########################################################################## */
.mensagemCartaoEnviado		{ width:100%; position:relative; max-width:450px; margin:35px auto; box-sizing:border-box; padding:50px 10px 0; background:#fff;
						-moz-border-radius:4px; border-radius:4px;}
.mensagemCartaoEnviado .userFoto	{ position:absolute; left:50%; top:0; margin:-45px 0 0 -45px; width:90px; height:90px;}
.mensagemCartaoEnviado h3	{ color:#F90; font-weight:300; font-size:1.2rem}
.mensagemCartaoEnviado p	{ font-size:0.75rem; line-height:1.2em; font-style:italic}
.mensagemCartaoEnviado p span.quotation	{ font-size:2rem; display:inline-block; vertical-align:top}
.mensagemCartaoEnviado p span.quotation:last-child	{ vertical-align:bottom}

/* ########################################################################## */
/* 6.5 Lista de contatos
/* ########################################################################## */
.listaContatos li .listaContato			{ display:block; position:relative; margin:15px 0; border:1px solid #e5e5e5; -moz-border-radius:4px; border-radius:4px; 
										box-sizing:border-box; padding:15px 5px 15px 115px}
										
.listaContatos li .listaContato.showed	{ margin-bottom:0}										

.listaContatos li .userFoto 			{ position:absolute; left:15px; top:50%; width:75px; height:75px; margin-top:-38px}

.listaContatos li h3		{ color:#F60; font-size:1.9em; margin:0; line-height:1.1em;}
.listaContatos li h4		{ color:#F60; font-size:0.75em; font-weight:300; color:#666}
.listaContatos li p a		{ font-weight:300; color:#fff; text-transform:uppercase; font-size:0.8em; padding:7px 10px;  -moz-border-radius:4px; border-radius:4px; background:#F90;
							display:inline-block; margin:5px}

.listaContatos li p a img	{ opacity:0.5; margin-right:5px; display:inline-block; max-width:15px; vertical-align:middle}

.boxacoes					{ position:absolute; right:10px; top:40%}
.boxacoes a					{ display:inline-block; margin:5px; padding:10px; margin-top:-6px;  -moz-border-radius:4px; border-radius:4px; background:#f2f2f2; cursor:pointer}
.boxacoes a:hover			{ background:#F90}
.boxacoes a img				{ opacity:0.7; width:23px;}

.boxCartao					{ padding:15px; -moz-border-radius:4px; border-radius:4px; margin-bottom:15px }

@media only screen and (max-width: 1010px) {
	.boxacoes				{ position:relative; display:inline-block}
}


.buscaTopo					{ padding:15px 0 0; background:#f6f6f6; margin-bottom:0}
.buscaTopo form				{ margin-bottom:0 !important}

.buscaTopo input,
.buscaTopo select,
.buscaTopo button			{ margin-bottom:15px !important}

.buscaTopo small.error						{ margin-top:-15px !important}


/* ########################################################################## */
/* 6.6 Excluir cart�o
/* ########################################################################## */
.boxExclusao				{ padding:2%; background:#f2f2f2; border:1px solid #e5e5e5; -moz-border-radius:4px; border-radius:4px; margin-bottom:15px; padding-bottom:35px}
.contatoExclusao			{ position:relative; padding:0 0 0 100px; margin:5px 10%}
.contatoExclusao .userFoto	{ width:75px; height:75px; position:absolute; left:0; top:0}

.contatoExclusao h3			{ margin-bottom:0; padding-top:10px; font-weight:300}
.contatoExclusao h4			{ font-size:12px; color:#666; font-weight:300}

.cartaoExclusao				{ margin-bottom:35px}


/* ########################################################################## */
/* 6.7 Meus cart�es
/* ########################################################################## */
.listaMeusCartoes li			{ padding:15px 2% 55px; position:relative}

.boxGerenciamento				{ position:absolute; bottom:15px; left:50%; width:95%; max-width:600px; padding:5px; background:#fff;
								-moz-border-radius:4px; border-radius:4px; z-index:1000000; margin:0 0 0 -300px;
								border:1px solid #e5e5e5; min-width:355px}
																
.boxGerenciamento .boxacoes		{ margin-top:-10px}
.boxGerenciamento label			{ display:block; margin-top:7px}

.addCartaoBox					{ padding:15px}

@media only screen and (max-width:660px) {
.boxGerenciamento				{ margin-left:0; left:2.5%}	
.boxGerenciamento .boxacoes		{ position:absolute; right:0}
}

/* ########################################################################## */
/* 7 Sala de eventos
/* ########################################################################## */

.addEvento                              { float: right; padding: 0.7rem}
.addEvento .iconPlus                    {-webkit-border-radius:100%; border-radius:100%; font-size: 1rem; border:1px solid #999; padding: 0.5rem 0.6rem;
                                        color:#999; display: inline-block; text-align: center; margin-right: 3px}
.addEvento .create                      { font-size: 1.2rem; text-transform: uppercase; vertical-align:baseline; font-weight: 300; color:#999}

.addEvento:hover .iconPlus              {border:1px solid #fdbe12; color:#fdbe12}
.addEvento:hover .create                {  color:#fdbe12}

.eventosFilter                          { border:1px solid #ccc; -webkit-border-radius:20px; border-radius:20px; 
                                          padding:0.5% 10% 0.5% 1%; position:relative; margin-bottom: 1.2rem}

.eventosFilter input                    { border:none; padding: 0; -webkit-box-shadow:none; box-shadow:none; margin: 0; padding: 0;
                                        height: 1.7125rem;}
.eventosFilter input:focus              { background: #fff; color: #fd8d10}
.eventosFilter .iconSearch              { position: absolute; right: 1%;  font-size: 1.6rem; padding:0.7% 1%; top:0; color: #ccc} 

.litsaDeEventos                         {}

.litsaDeEventos li:nth-child(odd) {
   background-color: #fafafa;
}

.litsaDeEventos li                      {box-sizing: border-box; padding: 2% 75px 2% 130px; text-align:left; clear: both;
                                        position:relative; min-height: 150px}

.litsaDeEventos li .eventoPreview       { position: absolute; left:2%; top:50%; width:100px;  height:100px; background-position: center center; background-repeat: no-repeat;
                                        background-size: cover;-webkit-border-radius: 100%; border-radius:100%; margin: -50px 0 0;
                                        border:6px solid #e5e5e5}
.litsaDeEventos li .eventoPreview a.linkEvento
                                        { position: absolute; left: 0; top:0; right:0; bottom:0}

.litsaDeEventos li h3                   { margin:0.4rem 0 0; padding-bottom: 0}
.litsaDeEventos li h3 a                 { margin: 0.2rem 0; font-size: 1.6rem; line-height: 1.1em; font-weight: 400; color:#666;}


.litsaDeEventos li .eventoPrivacidade,
.litsaDeEventos li .eventoStatus        { font-size: 1.25rem; text-transform: uppercase; color: #fff; text-align: center; -webkit-border-radius:100%; border-radius:100%;
                                        display: inline-block; padding:0.6rem 0.7rem; font-weight: 100; line-height: 1em; margin: 0.2rem 0;
                                        }
.litsaDeEventos li .dates                   { color: #999; font-weight: 400; font-size: 0.8rem; display: block}
.litsaDeEventos li .eventoStatus.futuro     { background: #22acb1}
.litsaDeEventos li .eventoStatus.andamento  { background: #a7cd38}
.litsaDeEventos li .eventoStatus.encerrado  { background: #eeedeb; color: #666}

       
.litsaDeEventos li .eventoPrivacidade.publico                  { background: #e9316d}
.litsaDeEventos li .eventoPrivacidade.privado                  { background: #4ebfed}

.litsaDeEventos li a.eventoEditButton        { position: absolute; right:2%; top:36%; color: #ccc; padding: 0.53rem 0.7rem;
                                                -webkit-border-radius:100%; border-radius:100%; font-size: 1.4rem; border:3px solid #ccc;
                                                background: #fff }
.litsaDeEventos li a.eventoEditButton:hover { border-color:#fdbe12; color:#fdbe12}

.noEvento                                   { padding: 10% 0}
.noEvento h4                                 { color: #ccc; font-size: 2.1rem; font-weight: 600}

.semEventos                                 { padding: 15% 0; text-align: center; color: #ccc; font-size: 2.1rem; font-weight: 600; display:none }

input.picker {
	margin:0;
	padding:0;
	border:0;
	border-right:40px solid green;
}
.colpick { z-index: 100000}


.appLink { text-align:center; padding:0 0 10px 0; text-shadow: 1px 1px 1px #fff; background: #fff; padding: 7px; -webkit-border-radius: 6px;
border-radius: 6px; width: auto; margin:10px auto 0; font-size: 12px; display: inline-block}