
/*

/www/v/N.NN/_paginas/imagem/style.css

-- caso execute este comando de um IP nao LIBERADO, ajuste a HORA e MINUTOS >>            H i (apenas primeiro digito dos minutos)
https://www.prog-x.com.br/w/?c=__essenciais/utilitarios/arquivosCopiarDePara.php&executar=191&destinoVm=todas-codigo&logExibir=true&caminhoArquivo=/www/v/N.NN/_paginas/imagem/style.css

require_once($var_SESSION["path"]						. "_paginas/imagem/style.css");								// so fazer o require imediatamente ANTES da chamada da funcao

FOI CHAMADO POR: 						??? (retornaremos para ele)
														e VARIOS outros

PARA ACESSAR ESTE CODIGO: 	

*/

body {
	margin: 0;
	padding: 0;
	background: rgba(102, 102, 102, 0.7);
	font-family: 'Dosis', arial, sans-serif !important;
	/* 	font-family: 'Raleway', arial, sans-serif; */
	background-image: url('img/bg.jpg');
	background-repeat: repeat;
	background-position: 0px 0px;
	background-size: 100%;
}

.global {
	text-align: center;
	position: absolute;
	background-color: rgba(102, 102, 102, 0.7);
	width: 100%;
	height: 100%;
}

.middle {
	text-align: left;
	width: 850px;
	margin: 0 auto;
	padding: 0 20px;
}

.middle_window {
	text-align: left;
	width: 60%;
	margin: 0 auto;
	padding: 0;
}

.window {
	float: left;
	width: 100%;
	background: #e7e7e7;
	margin: 7em 0 0 0;
}

.img_editar_mobile .window {
	background-color: unset;
}

.img_editar_mobile .bottom_left_icon{
	float: left;
	width: 20%;
	background-color: unset;
	color: #428bca;
}

.img_editar_mobile .bottom_left_icon i{
	font-size: 35px;
	width: 35px;
}

.top_left,
.bottom_right {
	float: left;
	width: 40%;
	background: #e7e7e7;
}

.window,
.top_left,
.bottom_right {
/* 	min-height: 665px; */
  max-height: 510px;
}

.top_left_pad,
.bottom_right_pad {
	/*float: left;*/
	padding: 2em 5em;
}

.img_editar_mobile .bottom_right{
	width: 100% !important;
	padding-bottom: 0;
}

.bottom_right {
	width: 60%;
	background: #fff;
}

.credits {
	float: left;
	width: 100%;
	text-align: center;
	margin: 20px 0 20px 0;
	color: #fff;
}

.close_window {
	float: right;
	color: #f35959;
	text-decoration: none;
	margin: 2px 0 0 0;
	padding-right: 12px;
}

.logo {
	float: left;
	width: 100%;
	padding: 20px 0;
}

.logo img {
	max-width: 100%;
	max-height: 85px;
}

.intro {
	float: left;
	width: 100%;
	margin-top: 15px;
	color: #3465b2;
}

.intro h1,
.intro h2 {
	padding: 0;
	margin: 0 0 20px 0;
	font-size: 1.5em;
}

.col-metade{
  width:49%;
  padding:0 10px;
  display:inline-block;
}

.barra-esqueda{
  border-left:2px solid #ccc;
}

.intro h2 {
	font-size: 16px;
	font-weight: 400;
	line-height: 26px;
}

.window_close {
	float: left;
	width: 100%;
	text-align: right;
	padding: 5px 0;
}

.title {
	float: left;
	width: 100%;
	color: #428bca;
	margin: 10px 0;
	min-height: 100px;
}

.title h1 {
	float: left;
	width: 100%;
	margin: 0;
	font-weight: 600;
	font-size: 25px;
	font-family: 'Dosis', arial;
	line-height: 1;
}

.title h1 c {
	color: #ce7c36;
	font-weight: 700;
}

.title h2 {
	float: left;
	width: 100%;
	color: #777;
	line-height: 1.8em;
	font-size: 16px;
	font-weight: 400;
	margin: 10px 0 0 0;
}

.text {
	float: left;
	width: 100%;
	/*min-height: 100px;*/
}

.text h1 {
	float: left;
	width: 100%;
	padding: 0;
	/*border-bottom: 1px solid #01cd74;*/
	font-size: 18px;
	color: #428bca;
	margin: 0 0 0 0;
	font-weight: 200;
}

.body_area {
	float: left;
	width: 100%;
	min-height: 33em;
  display: contents;
	/* margin-bottom: 1.5em; */
}

table {
	font-size: 13px;
	width: 100%;
}

.form {
	float: left;
	width: 100%;
  height: 460px
}

.form_linha {
	float: left;
	border: 1px solid #bbb;
	margin-bottom: 15px;
	padding: 5px 0;
	height: 32px;
	width: 100%;
}

.form_linha.disabled {
	background: #ebebe4
}

.form_linha.fail {
	border-color: #f17272;
}

.form_linha.removeBox {
	border-color: #fff;
}

.form_linha_right {
	float: right;
	width: 92%;
}

.form_label,
.form_label_right {
	float: left;
	color: #428bca;
	padding: 6px 0;
	margin: 0 0 0 0;
	width: 40px;
	font-size: 16px;
	text-align: center;
}

.form_label_right {
	width: auto;
	margin-left: 5px;
}

.fa-whatsapp {
	color: #2ab200;
}

.fa-times-circle {
	color: #f15555;
}

.form_insert {
	float: left;
	width: 89%;
}

.form_insert>label {
	float: left;
	margin: 6px 0 0 3px;
}

.form_insert>label>span {
	float: left;
	font-size: 12px;
	margin-top: 2px;
}

.form_input_checkbox,
.form_input_radio {
	float: left;
	margin-right: 5px;
}

.form_label_radio {
	float: left;
	margin-right: 5px;
	font-size: 14px;
}

.form_insert>label.label_radio {
	margin-top: 0;
}

.form_insert>label.label_radio span {
	margin-top: 2px !important;
}

.form_input,
.form_input_select {
	float: left;
	background: none;
	border: 0;
	box-shadow: none;
	width: 100%;
	padding: 6px 6px;
	outline: 0;
	font-weight: 500;
	font-size: 12px;
	color: #555;
	font-family: monospace, 'Raleway', arial, sans-serif !important;
}

.form_input::placeholder {
	text-transform: none;
	color: #7b7b7b
}

.form_input_select {
	background: #fff;
	padding: 6px 6px;
}

.form_input.little {
	min-width: 10px;
	width: 40px;
	margin-right: 6px;
}

.area_botoes {
	float: left;
	width: 100%;
	margin: 5px 0 20px 0;
	border-top: 1px solid #eee;
	padding: 10px 0 0 0;
}

.botao {
	float: left;
	text-align: center;
	color: #fff;
	background: #ce7c36;
	padding: 9px 15px;
	text-decoration: none;
	font-size: 13px;
	font-weight: bold;
	cursor: pointer;
	font-size: 15px;
	font-weight: 600;
	border: none;
	text-transform: uppercase
}

.botao_go {
	float: right;
	background: #0b9c17;
	border-color: #0a8615;
}

.botao_go[disabled] {
	background: #aaa;
	cursor: not-allowed;
}

.carteirinha {
	float: left;
	width: 100%;
}

.carteirinha img {
	max-width: 100%;
}

.carteirinha_prc {
	float: left;
	width: 100%;
	margin-top: 20px;
	color: #3465b2;
	text-align: right;
}

.prc_before {
	float: left;
	width: 100%;
	font-size: 14px;
}

.prc_before span {
	color: #666;
	border-right: 1px solid #666;
	margin-right: 5px;
	padding-right: 5px;
}

.prc {
	float: left;
	width: 100%;
	font-size: 25px;
	font-weight: 500
}

#ebmAtivo,
#ebmCarregando {
	float: right;
	margin: -22px 15px 0 0;
}

/***********/

.suggest_div>ul {
	margin-top: 1px !important;
}

.suggest_div>ul>li {
	padding: 7px 5px;
	font-size: 14px;
	font-family: 'Raleway', arial, sans-serif;
}

.suggest_div>input,
.suggest_div>input::placeholder {
	font-size: 12px !important;
	font-family: monospace !important;
}

.suggest_div>input::placeholder {
	text-transform: none;
	color: #7b7b7b;
}

.suggest_wrap {
	min-width: 100%;
}

.renomear_tipo,
.inserir_cep,
.nao_sei_cep {
	float: right;
	font-size: 13px;
	color: #666;
	text-decoration: none;
}

.img_editar_mobile .area_botoes_crop{
	display: none;
	width: 35%;
	top: -1px;
	float: right;
}

.img_editar_mobile .area_botoes_crop.fixed{
	width: 100%;
	display: none;
}

.img_editar_mobile .area_botoes_crop.fixed .botao_go{
	float: right;
	display: none;
}

.img_editar_mobile .botoes_crop_grupo{
	margin-bottom: 0;
}

.img_editar_mobile .botoes_crop_grupo a{
	color: #fff;
	cursor: pointer;
	border-radius: 3px;
	margin-right: 3px;
	display: inline-table;
	margin-top: 10px;
	text-decoration: none;
	padding: 7px 8px;
}

.img_editar_mobile .botoes_crop_grupo a:focus{
	background-color: #2353ab;
}

.img_editar_mobile .botoes_crop_grupo .op_selected{
	background-color: #2353ab;
}

.img_editar_mobile .group_options{
	margin-bottom: 10px;
}

.img_editar_mobile .area_botoes{
	margin: auto;
	float: none;
	display: table;
	width: auto;
	padding: 0;
}

.img_editar_mobile .area_botoes a{
	font-size: 13px;
	padding: 7px 8px;
	border-radius: 3px;
	margin-right: 5px;
}

.img_editar_mobile .botao_capturar{
	background-color: #2353ab;
	margin: 0;
}

.img_editar_mobile .botao_del_img{
	background-color: #c54949 !important;
}

.img_editar_mobile .botao_back:focus, .img_editar_mobile .botao_back:active,
.img_editar_mobile .botao_capturar:focus, .img_editar_mobile .botao_capturar:active,
.img_editar_mobile .botao_del_img:focus, .img_editar_mobile .botao_del_img:active {
	color: #fff;
	text-decoration: none;
}

.imagem_grid {
	float: left;
	width: 100%;
	border: 1px solid #ddd;
	border-radius: 3px;
	background-color: #eee;
	margin-top: 10px;
}

.imagem_grid_pad {
	padding: 20px;
}

.imagem_grid_group {
	float: left;
	width: 100%;
	margin-bottom: 20px;
}

.cropper-container{
  margin: 0 auto;
}

.padding-bottom{
  padding-bottom:10px;
}
  
.border-bottom-mod{
  border-bottom:1px solid #ccc;
}

.imagem_grid_group:last-child {
	/*margin-bottom: 0; */
}
.imagem_grid_pad h1 {
	float: left;
	width: 100%;
	padding: 0 0 6px 0;
	margin: 0 0 15px 0;
	font-size: 17px;
	font-family: 'Dosis', arial, sans-serif !important;
	border-bottom: 1px solid #ddd;
	color: #428bca;
}

.imagem_solo {
	float: left;
	height: 130px;
	margin: 0 10px 10px 0;
	display: table;
}
.imagem_grid_group.reorder .imagem_solo{
	cursor: move;
}

.imagem_detalhes{
	display: table-row-group;
	color: #444 !important;
	font-size: 12px !important;
}

.imagem_solo img {
	float: left;
	height: 130px;
	max-width: 100%;
	margin-bottom: 5px;
}

.imagem_solo_botao {
	position: relative;
	float: right;
	margin-left: -25px;
	width: 20px;
}

.imagem_solo_botao .deletar {
	float: left;
	text-decoration: none;
	color: #fff;
	background: #ff5454;
	width: 20px;
	text-align: center;
	padding: 3px 0;
	font-size: 15px;
}

.imagem_solo_botao .clonar,
.imagem_solo_botao .editar {
	float: left;
	text-decoration: none;
	color: #fff;
	background: #3d65a7;
	width: 20px;
	text-align: center;
	font-size: 15px;
	padding: 3px 0;
}

.imagem_solo_botao .clonar {
	background: #ce7c36 !important;
}

.imagem_solo_botao .ver {
	float: left;
	text-decoration: none;
	color: #fff;
	background: #38801b;
	width: 20px;
	text-align: center;
	font-size: 14px;
	padding: 2px 0;
}

.block_opcao_envio {
	float: left;
	width: 100%;
	margin-bottom: 10px;
}

.opcao_envio {
	float: left;
	padding: 4px 7px;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 3px;
	width: 40%;
}

.area_opcao_envio {
	float: left;
	width: 100%;
	display: none
}

.crop_options {
	float: left;
	width: 100%;
}

.crop_options>span {
	float: left;
	width: 100%;
	font-size: 14px;
	margin-bottom: 10px;
}

.div_botaoAspecto {
	float: left;
	margin: 0 5px 5px 0;
	width: 100px;
}

.div_botaoAspecto input {
	float: left;
	text-align: center;
	color: #fff;
	background: #3465b2;
	padding: 5px 7px;
	cursor: pointer;
	border: 0;
	border-radius: 2px;
	width: 100%;
}

.div_botaoAspecto input.btnOff {
	background: #aaa;
}

.div_botaoAspecto>span {
	float: left;
	width: 100%;
	text-align: center;
	font-size: 13px;
	margin-top: 3px;
}

.facebook_crop_aviso {
	float: left;
	width: 100%;
	margin: 20px 0;
	font-size: 13px
}

#box_recortar {
/* 	float: left; */
	width: 100%;
	max-height: 410px;
}

#box_recortar>#imagem {
	max-width: 100% !important;
	height: auto !important;
}

#imgRecortada {
	max-width: 100% !important;
	height: auto !important;
}

.zjcrop-holder,
.zjcrop-holder>div {
	max-width: 100% !important;
}

.opcao_envio_input {
	float: left;
	width: 40%;
	border: 1px solid #ddd;
	padding: 5px 5px;
	border-radius: 3px 0 0 3px;
}

.opcao_envio_submit {
	float: left;
	border: 0;
	padding: 6px 10px;
	color: #fff;
	background: #428bca;
	cursor: pointer;
}

.opcao_add_url,
.opcao_add_video {
	float: left;
	border: 0;
	padding: 7px 10px;
	color: #fff;
	background: #49ab4c;
	cursor: pointer;
}

.altura_controlar{
  min-height: 150px;
}

.suggest_div>ul>li {
	font-size: 12px;
	padding: 4px 8px;
}

#divUploadDesktop {
	margin: 0 !important;
  height: 460px;
}

.group_options {
	float: left;
	width: 105%;
}

.area_botoes_crop,
.area_botoes_crop .botao {
	float: right;
}

.area_botoes_crop.fixed{
	position: fixed;
	right: 2%;
	top: 0;
	z-index: 9999;
	padding:10px;
	background: #fff;
}

.area_botoes_crop .botao {
	padding: 5px 0px;
	font-size: 14px;
	min-width: 100px;
	font-weight: bold;
}

.area_botoes_crop .botao_go {
	margin-bottom: 10px;
	background-color: #0b9c17;
	cursor: pointer;
	box-shadow: 0 0 0 rgba(11, 156, 23, 0.4);
	animation: pulse 2s infinite;
	animation-fill-mode: both;
	animation-iteration-count: infinite;
  margin-left:10px;
}

/* substituir RGB da cor do botão */

@-webkit-keyframes pulse {
	10% {
		-webkit-box-shadow: 0 0 0 0 rgba(11, 156, 23, 0.3);
	}
	80% {
		-webkit-box-shadow: 0 0 0 10px rgba(11, 156, 23, 0);
	}
	100% {
		-webkit-box-shadow: 0 0 0 0 rgba(11, 156, 23, 0);
	}
}

@keyframes pulse {
	10% {
		-moz-box-shadow: 0 0 0 0 rgba(11, 156, 23, 1);
		box-shadow: 0 0 0 0 rgba(11, 156, 23, 1);
	}
	80% {
		-moz-box-shadow: 0 0 0 10px rgba(11, 156, 23, 0);
		box-shadow: 0 0 0 10px rgba(11, 156, 23, 0);
	}
	100% {
		-moz-box-shadow: 0 0 0 0 rgba(11, 156, 23, 0);
		box-shadow: 0 0 0 0 rgba(11, 156, 23, 0);
	}
}

.botoes_crop {
	width: 100%;
	margin-bottom: 8px;
  border-bottom: 1px solid #ccc;
}

.botoes_crop,
.botoes_crop_grupo,
.botoes_crop_item {
	float: left;
}

.box_crop_esquerda{
  padding: 0px !important;
}

.box_crop_esquerda .group_options{
  width: 100%;
}

.botoes_crop_grupo {
	margin-right: 5px;
	margin-bottom: 8px;
  border-bottom: 1px solid #ccc;
}

.group_options > .crop_options > .botoes_crop_grupo > .botoes_crop_item {
	border-radius: 3px;
	margin-right: 10px;
  margin-bottom: 10px;
}

.botoes_crop_item {
	padding: 7px 10px;
	background-color: #337ab7;
	border: 1px solid #2e6da4;
	color: #fff;
	text-decoration: none;
	cursor: pointer;
	outline: 0;
	font-size: 14px;
}

.botoes_crop_grupo .botoes_crop_item:first-child {
	border-radius: 3px 0 0 3px;
}

.botoes_crop_grupo .botoes_crop_item:last-child {
	border-radius: 0 3px 3px 0;
}

body.full .opcao_envio_input,
body.full .opcao_envio {
	width: 60%
}

.imagem_grid_span,
.imagem_grid_span_salvando,
.imagem_grid_span_salvo{
	font-size: 15px;
    color: #444;
    font-weight: normal;
}
.imagem_grid_span_salvando,
.imagem_grid_span_salvo{
	float:right;
	display: none;
}
.imagem_grid_span_salvo{
	color: #38801b;
    font-weight: bold;
}
/***********/

body.full,
body.full .global {
	background-image: none;
	background: #fff;
}

body.full .window {
	margin: 0;
}

body.full .bottom_right,
.bottom_right.full,
body.full .middle_window {
	width: 100%;
}

body.full .credits {
	display: none;
}

body.full .body_area {
	min-height: auto;
	margin-bottom: 1.5em;
	max-height: 510px;
}

body.full .title {
	margin-top: 0;
}

.imagem_grid i.play_video {
	position: relative;
	z-index: 9999;
	top: 50px;
	margin-right: -30px;
	left: -56%;
	color: white;
	opacity: .7;
	font-size: 30px;
	cursor: pointer;
}

.aspectoDefaultCrop{
	background-color:#0b9c17 !important;
	border: 1px solid #0b9c17 !important;
}

#carregando{
	display: none;
	border: 0px solid lightgray;
	border-radius: 5px;
	color: #2A6496;
	/* font-weight: bold; */
	left: 50%;
	position: fixed;
	top: 50%;
	width: 210px;
	padding: 30px;
	text-align: center;
	position: fixed;
	transform: translate(-50%, -50%);
}

#carregando .fa{
	font-size: 25px;
	margin-right: 10px;
}

.aplicarLoadBG{
	background-color: #ccc;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0.5;
	filter: sepia(10%) grayscale(50%);
	z-index: 99999;
}

@keyframes textoPulsar {
	0% { transform: scale(1); opacity: 1; }
	
	50% { transform: scale(1.25);  opacity: 0.5; }
	
	100% { transform: scale(1); opacity: 1 }
}
/* Use @-webkit-keyframes for Safari/Chrome */

#textoPulsar {
	animation: textoPulsar 2s infinite;
}

@media only screen and (max-width: 1650px) {
	.middle_window {
		width: 98%;
	}
	.window,
	.top_left,
	.bottom_right {
		min-height: 770px;
	}
	.top_left_pad,
	.bottom_right_pad {
		padding: 1.5em;
		padding-top: 0;
	}
	.body_area {
		min-height: 40em;
	}
	.form_linha_right {
		width: 94%;
	}
}

@media only screen and (max-width: 1400px) {
	.window,
	.top_left,
	.bottom_right {
		min-height: 700px;
	}
	.body_area {
		min-height: 35em;
	}
	.form_linha_right {
		width: 92%;
	}
}

@media only screen and (max-width: 1220px) {
	.title h1 {
		/*font-size: 21px;*/
	}
	.window,
	.top_left,
	.bottom_right {
		min-height: 680px;
	}
	.body_area {
		min-height: 34em;
	}
}

@media only screen and (max-width: 1075px) {
	.img_editar_mobile .title h1{
		font-size: 18px;
		margin-bottom: 0 !important;
	}
	.img_editar_mobile .title{
		width: 65% !important;
	}
	.title h1 {
		/*font-size: 18px;*/
	}
	.window {
		margin-top: 4em;
	}
	.window,
	.top_left,
	.bottom_right {
		min-height: 450px;
	}
	.body_area {
		min-height: 32em;
	}
}

@media only screen and (max-width: 980px) {
	.form_insert {
		width: 80%;
	}
	.form_linha_right {
		width: 90%;
	}
}

@media only screen and (max-width: 900px) {
	.form_insert {
		width: 85%;
	}
	.window,
	.top_left,
	.bottom_right {
		min-height: 600px;
	}
	.body_area {
		min-height: 30em;
	}
}

@media only screen and (max-width: 710px) {
	body {
		background-image: none;
	}
	.top_left,
	.bottom_right {
		width: 100%;
		min-height: auto;
		padding-bottom: 1.5em;
	}
	.form_insert {
		width: 88%;
	}
	.body_area {
		min-height: auto;
	}
	.botao {
		font-size: 13px;
	}
	.top_left_pad {
		padding: 1.5em;
	}
	.bottom_right_pad {
		padding: 0 1.5em 2em 1.5em;
	}
	.logo {
		text-align: center;
	}
	.logo img {
		height: 60px;
	}
	.top_left_pad.into_etapas {
		float: left;
		width: 100%;
		padding: 1.5em 0;
	}
	.into_etapas .intro,
	.into_etapas .carteirinha,
	.into_etapas .carteirinha_prc {
		display: none;
	}
	.into_etapas .logo {
		padding: 0;
	}
	.into_etapas .logo img {
		/*height: auto;*/
	}
	.window {
		margin-top: 2em;
		min-height: initial;
	}
	.title {
		min-height: initial;
		margin-bottom: 25px;
	}
	.form_linha_right {
		width: 91%;
	}
}

@media only screen and (max-width: 650px) {
	.crop_options > .botoes_crop_grupo .botoes_crop_item{
		margin: 1px;
		border-radius: 3px !important;
		padding: 7px !important;
	}
}

@media only screen and (max-width: 500px) {
	.form_insert {
		width: 83%;
	}
	.top_left_pad,
	.bottom_right_pad {
		padding: 1em;
	}
	.form_linha_right {
		width: 88%;
	}
	
	.area_botoes_crop{
		margin-bottom: 10px;
		width: 100%;
		float: none;
	}
	
	.group_options {
    width: 100%;
	}
	
	body.full .opcao_envio_input, body.full .opcao_envio {
		width: 95%;
	}
	
	.area_botoes_crop .botao_go{
		float: left;
	}

	.area_botoes_crop .botao_back{
		float: right;
		margin-bottom: 40px;
	}
	
	.img_editar_mobile #box_recortar {
		max-height: 250px;
	}
		
}
@media only screen and (max-width: 400px) {
	.imagem_solo {
		float: right;
	}
	.imagem_solo,
	.imagem_solo img{
		max-width: 100%;
    height: auto;
/* 		width: 100%; */
/* 		height: 85px; */
	}
}
@media only screen and (max-width: 360px) {
	.form_insert {
		width: 80%;
	}
	.form_insert>label>span {
		float: initial;
	}
	.form_linha_right {
		width: 91%;
	}
}