/*! xsource Document - xgrid - version 1.0.0 - xsource.com.br © */
/*
 * O que se segue é o resultado de muita pesquisa sobre estilo cross-browser.
 * Este documento foi formulado e desenvolvido por Thiago Carvalho - Front-end Developer.
 * Email: thiago.xsource@xsource.com.br
 * © 2007 - 2017 copyright.
 */

@charset "UTF-8";
@import url('../structure/fonts.css');
@import url('../modules/form.css');

/* ==========================================================================
	html and body
 	========================================================================== */
	html, body { height: 100%; position: relative; }

/* ==========================================================================
	 header.mainHeader
	 ========================================================================== */
	header.mainHeader { background-color: #3d488d; position: relative; z-index: 998; padding: 1.5rem 0; text-align: center; }
	/** logo **/
	header.mainHeader .logo { width: 100%; max-width: 180px; min-width: 110px; }
	header.mainHeader .logo h1 { visibility: hidden; display: none; }
	header.mainHeader .logo img { width: 100%; }
	/** boxSearch **/
	header.mainHeader .boxSearch { position: absolute; right: 0; top: 0; bottom: 0; -webkit-border-radius:5px; border-radius:5px; -webkit-transition: all linear 0.2s; transition: all linear 0.2s; }
	header.mainHeader .boxSearch input[type="text"]{ width: 0; padding: 0.75rem 1.25rem; transition: color linear 0.125s; color: #fff; color: rgba(255,255,255,0.75); }
	header.mainHeader .boxSearch input[type="text"]:focus { color: #7cd262; }
	header.mainHeader .iconSearch { cursor: pointer; float: right; margin-top: 7px; margin-right: 5px;}
	header.mainHeader .boxSearch.open { width: 80%; background-color: rgba(0,0,0,0.25); z-index: 1; }
	header.mainHeader .boxSearch.open input[type="text"]{ width: 80%; width: calc(100% - 38px); }

	@media (min-width: 1400px){
		header.mainHeader .iconSearch { margin-top: 13px; }
		header.mainHeader .boxSearch input[type="text"]{ padding: 16px 20px; padding: 1.05rem 1.25rem; }
	}

	@media (max-width:960px){
		header.mainHeader .iconSearch { margin-top: 0; }
		header.mainHeader .iconSearch { -webkit-transform: scale(0.8); transform: scale(0.8); }
		header.mainHeader .boxSearch.open + .logo { opacity: 0.01; }
		header.mainHeader .boxSearch input[type="text"] { font-size: 13px; font-size: 0.8125; padding: 0.5rem 1rem; }
	}
	@media (max-width: 640px){
		header.mainHeader { padding: 1rem 0; }
	}

 /* ==========================================================================
    mainContent
    ========================================================================== */
		/** titleSectionBar **/
		.titleSectionBar { position: relative; text-align: center }
		*[class*="titleSectionBar"] h2 { font-size: 30px; font-size: 1.875rem; color: #3d488d; font-weight: 800; }
		*[class*="titleSectionBar"] h2::after { content: " "; display: inline-block; position: relative; left: 3px; top: 5px; width: 28px; height: 5px; background-color: #80b370; margin-top: -5px; }
		*[class*="titleSectionBar"] h2.current { display: inline-block; *display: inline; *zoom: 1; }
		@media (min-width:960px){
			*[class*="titleSectionBar"] h2 { font-size: 36px; font-size: 2.25rem; margin-bottom: 1.25rem; }
		}
		@media (max-width: 640px){
			*[class*="titleSectionBar"] h2 { font-size: 24px; font-size: 1.5rem; margin-bottom: 0.75rem; }
			*[class*="titleSectionBar"] h2::after { display: none; }
		}

		/* mainContent */
		.mainContent { position: relative; }
		.mainContent h3.title { display: none; visibility: hidden; }
		.mainContent p { min-height: 14px; }
		.mainContent .labelInfo { color: #3d488d; font-size: 16px; font-size: 1rem; font-weight: 600; }
		.sectionBar { background-color: #fff; -webkit-box-shadow: 0 1px 10px rgba(0,0,0,0.15); box-shadow: 0 1px 10px rgba(0,0,0,0.15); padding: 1.55rem; transition: all linear 0.2s; }

		/** terms **/
		.terms { border: 1px solid #eee; border-radius: 3px; padding: 1rem 1rem; max-height: 350px; overflow: hidden; overflow-y: auto; transition: all linear 0.2s; }
		.terms:hover { box-shadow: 0 1px 5px rgba(0,0,0,0.2);}
		.boxAcceptTerms { font-size: 13px; font-size: 0.8125rem; cursor: pointer; position: relative; margin-top: 10px; }
		.boxAcceptTerms label.labelAcceptTerms { cursor: pointer; display: block; padding-left: 16px; }
		.boxAcceptTerms input[type="checkbox"] { position: absolute; left: 0; top: 3px; cursor: pointer; }

		.acceptWhats { position: relative; }
		.acceptWhats label,
		.acceptWhats input[type="checkbox"] { position: relative; display: inline-block; display: inline; *zoom: 1; cursor: pointer; vertical-align: middle; margin: 0; }

		.steps { position: relative; margin-bottom: 2rem; text-align: center }
		.steps ul { width: 100%; display: block; position: relative; }
		.steps ul li { display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; }
		.steps ul li a { display: block; padding: 0.75rem; font-size: 10px; font-size: 0.625rem; background-color: #fff; background-image: linear-gradient(to bottom, #fff, #e9f0f6); border: 1px solid #dbe5ed; color: #8ea1b2; opacity: 0.45;}
		.steps ul li.done a,
		.steps ul li.current a { opacity: 0.99;  }
		.steps ul li.done a,
		.steps ul li.current a { color: #099a7e; }
		.steps ul li.done a::before,
		.steps ul li.current a::before { background: url("/imagens/ipld/iconCheckSmall.png") no-repeat center center; display: inline-block; content: " "; width: 16px; height: 14px; vertical-align: middle; position: relative; top: -1px; }
		.steps ul li a .current-info, .steps ul li a .number { display: none; }

		.input-file-fake { width: auto; position: relative; }
		.input-file-fake #button-file { display: inline-block; display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; cursor: pointer; padding: 0.55rem 1rem;  color: #3d488d; font-size: 14px; border: 2px solid; border-radius: 3px; }
		.input-file { font-size: 13px; }

		/*
		ul[role="tablist"] { display: none; visibility: hidden; }
		.crumbPath { position: relative; width: 100%; height: 6px; background-color: #eee; clear: both; -webkit-border-radius: 15px; border-radius: 15px; margin-bottom: 2rem; }
		.crumbPath .progress { background-color: #55ae5f; display: block; position: absolute; left: 0; bottom: 0; top: 0; transition: all ease-out 1.25s; -webkit-border-radius: 15px; border-radius: 15px; }
		.crumbPath .progress::before {content: "";display: block;width: 14px;height: 14px;background: #55ae5f;right: 0;position: absolute;top: -4px;-webkit-border-radius: 50%;border-radius: 50%;}
		.crumbPath .progress::after {content: "";display: block;width: 8px;height: 8px;background: #fff;right: 3px;position: absolute;top: -1px;-webkit-border-radius: 50%;border-radius: 50%;}
		*/
		@media (max-width: 640px){
			.aceitoCheckbox { width: 100%; display: block; }
		}

/* ==========================================================================
    buttons footer action
   ========================================================================== */
	.actions { border-top: 1px dashed #ddd; padding: 25px 0 10px; margin-top: 25px; text-align: right; }
	.actions ul li { display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; margin-left: 10px; }
	.actions ul li a { font-size: 11px; font-weight: 400; text-transform: uppercase; padding: 12px 18px; -webkit-border-radius:5px; border-radius:5px; transition: all linear 0.2s; display: block; }
	.actions ul li.disabled a { display: none; visibility: hidden; }
	.actions ul li a[href="#previous"] { color: #666; }
	.actions ul li a[href="#previous"]:hover { background-color: #f6f6f6; }
	.actions ul li a[href="#next"],
	.actions ul li a[href="#finish"]{ background-color: #3d488d; color: #fff;  }
	.actions ul li a[href="#next"]:hover,
	.actions ul li a[href="#finish"]:hover { background-color: #80b370; }

	/* ==========================================================================
		 content404
		 ========================================================================== */
		.content404 {
				position: relative;
	 			width: 100%;
	 			height: 90%; /* Navegadores que não aceitam a funcao calc */
	 			height: calc(100% - 95px);
	 			max-height: 920px;
				display: block;
	 	 }
		.content404 .alignVertical{ display: flex; flex-direction: column; width: 100%; max-width: 1400px; height: 90%; margin: auto; }
		.content404 .alignVertical .title { margin: auto;}
		.content404 .alignVertical .title img { margin-bottom: 1rem; }
		.content404 .alignVertical .title h2 { color: #ccc; font-weight: 600; font-size: 32px; font-size: 2rem; }
		.content404 .alignVertical .title p { font-size: 14px; font-size: 0.875rem; }
		.content404 .alignVertical .title .btnBack { background-color: #3d488d; color: #fff; font-weight: 600; padding: 0.8rem 2rem; font-size: 14px; font-size: 0.875rem; -webkit-border: 3px; border-radius: 3px; margin: 1.25rem 0; transition: all linear 0.18s; }
		.content404 .alignVertical .title .btnBack:hover { background-color: #7cd262; }
		@media (max-width: 1430px){
			.content404 .alignVertical{	max-width: 1170px; }
		}
		@media ( max-width: 960px ){
			.content404 .alignVertical{ padding: 0 15px; padding: 0 0.9375rem; }
		}
		@media (max-width:480px){
			.content404 { padding: 2rem 0; min-height: 100%; }
			.content404 .alignVertical .title h2{ font-size: 24px; font-size: 1.5rem; }
			.content404 .alignVertical .title .btnBack { width: 100%; }
		}