/* ---------INICIO DE INDEX ----------
	           1. CSS Reset
   -----------------------------------------------*/
:root {	--c1: #202020; --c2: #3a3a3a; --c3: #4b4b4b; --c4: #dddddd;}
::selection { background-color: #DCD00B;}
* {	padding:0; margin:0; }

body { color:#fff; font-weight: 300; position:relative; width:100%; background-image: url("../../Nostras/Imagens/Fondos/FondTablor.jpg"); height:100%; overflow: scroll; overflow-x: hidden; 
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;  }
a  { text-decoration:none; color:#fff; outline:none;}
h1 { font-size:36px;	margin-bottom:20px;}
h3 { font-size:18px;	margin-bottom:20px;}
p  { font-size:14px; line-height:21px; color:#fff; margin-bottom:20px;}
#header { height:135px;	background: rgba(255, 70, 41, 0.8); margin-top: -5em;	zoom: 1;
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000);}
#header h3 { float:left; width:377px; height:108px; font-family: 'Roboto Slab', serif; text-align:center; 
  font-size:40px;	padding-top:16px; margin:0;	background: rgba(28, 231, 130, 0.86); zoom: 1;
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000); }
#header h3 span { display:block; font-size:18px; text-transform:uppercase; font-weight:normal;}
#afooter { height:37px; background:#1c171e; position: fixed; bottom:0; left:0; width:100%; color:#5f5c61; 
	text-align:center; line-height:37px; font-size:12px; }
#wrapper { margin-top: 2%; width:940px; margin:0 auto; position:absolute; left:0; right:0; transition-duration: 1s;
	-webkit-transition-duration: 1s; }
a.close { width:52px; height:52px; color:#fff; line-height:52px; text-decoration:none; display:block;float: right; 
	outline:none; font-size:35px; font-weight:normal; text-align:center; padding-right: 0; right:0px; zoom: 1;
	font-family: 'Average Sans', sans-serif; position:absolute; background: rgba(255, 70, 41, 0.8); 
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000); }
#cont {	color:#fff; padding:20px; padding-top:52px; padding-bottom:0; clear:both; margin-top:0px;
	font-family: 'Roboto Slab', serif; background: rgba(255, 70, 41, 0.8); zoom: 1;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000);}
Contador{ display: inline-flex; align-items: center; justify-content: center; }

@keyframes blink { 0% { color: red; } 100% { color: yellow; }}
@-webkit-keyframes blink { 0% { color: red; } 100% { color: yellow; }}
.blink { -webkit-animation: blink 1s linear infinite; -moz-animation: blink 1s linear infinite;
	animation: blink 1s linear infinite;}
.Eslida{ margin: 0 auto; text-align: justify; display:block; position: relative; padding-left: 1em; font-weight: 600;} 
form button[type="submit"]{ border: 1px solid #000; border-radius:5px; display:block; color:#F8F8E1; 
	background-color:#6614AF;} 
form button[type="submit"]:hover{ cursor:pointer; color: #53ED07}
.close:before {  position: relative; content: url("../../Nostras/Imagens/Sign+.png"); top:.5em; left: -2em;
  z-index: 99999}
.open:before  { left: 3%; top:-5em;content:url("../../Nostras/Imagens/Sign-.png"); z-index: 99999; }
.close.open { width:925px; float:none; text-align:right; padding-left:25px; background:none; background-color: aqua; 
	margin-right: 4%;}
.upbox { transform: translate(0px, -200px);	-ms-transform: translate(0px, -200px);
	-webkit-transform: translate(0px, -200px); 	transition-duration: 1s;-webkit-transition-duration: 1s;}
.none {	display:none;}
.block {display:block;}
.container {overflow:hidden;position:relative;}
.slides {position:absolute; top:0; left:0; list-style:none; padding:0; margin:0;}
.slides li { position:absolute; top:0; width:920px; display:none; padding:0px; margin:0;}
.slides li .inner { padding:40px; padding-top:0;}
#loopedSlider, #newsSlider { margin:0 auto; position:relative; clear:both; height:300px;}
#loopedSlider .container { overflow:visible;}
.slides li { padding-bottom:0;}
a.previous, a.next { position:absolute; top:100px; font-size:55px; font-family: 'Clicker Script', cursive; color:#fff; z-index:9999;}
a.previous { left:-15px;}
a.next { right:-15px;}

/* 2.2 Countdown style */
#countdown { padding:0;	position:relative; margin-left:377px;}
.hasCountdown {}
.item {	display: inline-block; text-align:center; margin:0 15px; padding:0; text-transform:uppercase; font-size:14px;
	line-height:45px; width:100px; height:auto; font-family: 'Roboto Slab', serif; transition: background 1s; 
    -webkit-transition: background 1s; -moz-transition: background 1s;-o-transition: background 1s;}
.item span {clear:both; color:#fff;	display:inline-block; text-transform:lowercase;	padding:0;}
.item p { text-align:center; margin:40px 0 0; font-size:40px; padding:0; font-weight:bold;}
/* 2.3 social style */
.socialWrap { width:526px; margin:0 auto; text-align:center;}
.socialWrap a {	display:inline-block; width:58px; height:58px; font-size:0; text-indent:-10000px; margin:0 20px 0 0;
	background: url("../../Nostras/Imagens/Ext/social.png") 0 0 no-repeat; background-color: rgb(255, 255, 255); border-radius:100px;
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)"; 
    -moz-border-radius:100px;-webkit-border-radius:100px;  transition: background 0.5s; background-color: rgba(255, 255, 255, 0.3);
	-webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s;}
.socialWrap a.last { margin-right:0;}
.socialWrap a:hover { background-position:0 100%;}
.socialWrap a.fb { background-position:-58px 0;}
.socialWrap a.fb:hover { background-position:-58px 100%;}
.socialWrap a.gp { background-position:-116px 0;}
.socialWrap a.gp:hover { background-position:-116px 100%;}
.socialWrap a.pin { background-position:-174px 0;}
.socialWrap a.pin:hover { background-position:-174px 100%;}
.socialWrap a.glb {	background-position:-232px 0;}
.socialWrap a.glb:hover { background-position:-232px 100%;}
.socialWrap a.a { background-position:-290px 0;}
.socialWrap a.a:hover { background-position:-290px 100%;}
.socialWrap a.in { background-position:-348px 0;}
.socialWrap a.in:hover { background-position:-348px 100%;}

/* 2.4 contact us style */
#contactdiv { width:790px; margin:0 auto;}
#contactdiv input { width:355px; height:36px; background:#fff; font-size:16px; line-height:27px; color:#c5c3c5;
	font-style:italic; padding:10px 16px; margin:0 11px 18px 0; border:none;	font-family: 'Roboto Slab', serif;
	-moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px;}
#contactdiv textarea { width:357px; height:96px; background:#fff; font-size:16px; line-height:18px; color:#c5c3c5;
	padding:15px; margin-right:0; margin-bottom:10px; float:none; border:none; font-family: 'Roboto Slab', serif;
	font-style:italic; -moz-border-radius:6px;-webkit-border-radius:6px; border-radius:6px;}
#contactdiv input.btn { width:175px; height:57px; padding:0; margin:0 auto; display:block; background:#1c171e;
	float:none; cursor:pointer; font-size:18px; color:#fff; font-weight:bold; opacity: 1;  -moz-transition: opacity .25s ease-in-out;	transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; font-style:normal; }
#contactdiv input.btn:hover { opacity: 0.8;}
.error_message { color:#000;padding-bottom:10px; font-size:12px; }
#success_page {	color:#9ce726; padding-bottom:10px;	font-size:12px; }
/* 2.5 About us style */
#about {width:800px; margin:0 auto;}
/* 2.6 subscription style */
#subscription {	width:737px; margin:0 auto;	text-align:center;}
#subscription input#subemail {float:left; width:517px; height:36px; background:#fff; font-size:16px; border:none;
  line-height:27px; color:#c5c3c5; font-style:italic;	padding:10px 16px; margin:0 10px 0 0;border-radius:6px;
  font-family: 'Roboto Slab', serif; -moz-border-radius:6px;-webkit-border-radius:6px; }
#subscription input.btn2 {width:175px;height:57px;padding:0;margin:0 auto;display:block;background:#1c171e;	
  float:none; cursor:pointer;	font-size:18px;	color:#fff;	font-weight:bold;opacity: 1;
  transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; font-style:normal; border:none; -moz-border-radius:6px;	-webkit-border-radius:6px; border-radius:6px;}
#subscription input.btn2:hover {opacity: 0.8;}
.ri-grid {width: 600px;}
.ri-grid ul li, .ri-grid ul li a { width: 100px;height: 100px;}
.ri-grid ul li a img {width: 100%;}

/*---------------------------------------------------------------------------------
 3. Background slider CSS style
-------------------------------------------------------------------------------*/
.ri-grid {margin:0px auto;position: relative;height: auto;}
.ri-grid ul {list-style: none;display: block;width: 100%;margin: 0;padding: 0;}
.ri-grid ul:before, .ri-grid ul:after {	content: '';display: table;}
.ri-grid ul:after {	clear: both;}
.ri-grid ul {zoom: 1; /* For IE 6/7 (trigger hasLayout) */}
.ri-grid ul li {-webkit-perspective: 400px;-moz-perspective: 400px;	-o-perspective: 400px;-ms-perspective: 400px;perspective: 400px;margin: 0;
	padding: 0;	float: left;position: relative;	display: block;	overflow: hidden;background: #000;}
.ri-grid ul li a { display: block;outline: none;position: absolute;left: 0;	top: 0;	width: 100%;height: 100%;
	-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;-o-backface-visibility: hidden;
	-ms-backface-visibility: hidden;backface-visibility: hidden;-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;-o-transform-style: preserve-3d;-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;-webkit-background-size: 100% 100%;-moz-background-size: 100% 100%;
	background-size: 100% 100%;	background-position: center center;	background-repeat: no-repeat;
	background-color: #333;	-webkit-box-sizing: content-box;-moz-box-sizing: content-box;	box-sizing: content-box; }
/* Grid wrapper sizes */
.ri-grid-size-1 { width: 55%; }
.ri-grid-size-2 { width: 100%; }
.ri-grid-size-3 { width: 100%; margin-top: 0px; }
/* Shadow style */
.ri-shadow:after, .ri-shadow:before { content: ""; position: absolute; z-index: -2; bottom: 15px; left: 10px;
  width: 50%; height: 20%; max-width: 300px; max-height: 100px; box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7); 
  -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); 
  -o-transform: rotate(-3deg); transform: rotate(-3deg); }
.ri-shadow:after { right: 10px; left: auto; -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg);
  -ms-transform: rotate(3deg);-o-transform: rotate(3deg);	transform: rotate(3deg); }
.ri-grid-loading:after, .ri-grid-loading:before { display: none;}
.ri-loading-image { display: none;}
.ri-grid-loading .ri-loading-image { position: relative; width: 30px; height: 30px; left: 50%; margin: 100px 0 0 -15px; display: block; }

/*---------------------------------------------------------------------------------
 5. Theme changes style 
-------------------------------------------------------------------------------*/
.theme-changer-wrap {position:absolute;z-index:5000;top:20px;left:-200px;}
.theme-changer {float: left; background:url("../../Nostras/Imagens/Fondos/Claro-5.jpg") repeat scroll;
	text-transform:uppercase;font-weight:bold;font-size:12px;font-family:Helvetica, Arial;padding:15px 20px;
	border-bottom-right-radius: 3px;-moz-border-bottom-right-radius: 3px;-webkit-border-bottom-right-radius: 3px;}
.changer-inner {overflow:hidden;width:114px;}
.theme-changer-wrap a {	float:left;	display:block;	margin-right:3px;margin-left:3px;margin-bottom:5px;	width:32px;
	height:32px}
a.light-skin {
	height:32px;
	width:51px;
	margin-bottom:5px;
	float:left;
	display:block;
	box-shadow: #b2b2b2 1px 1px 1px;
	margin-right:3px;
	margin-left:3px;
	background:#fff; }
a.dark-skin {
	height:32px;
	width:51px;
	margin-bottom:5px;
	float:left;
	display:block;
	box-shadow: #b2b2b2 1px 1px 1px;
	margin-right:3px;
	margin-left:3px;
	background:#3f3f3f;
	opacity:1;
	z-index:1000; }
a.color-themes {cursor:pointer;}
a.col2 {background:#FF772F}
a.col1 {background:#29C5FF}
a.col3 {background:#F63180}
a.col4 {background:#00B159}
a.col5 {background:#FF4629}
a.col6 {background:#B53CF0}
.changer-inner span {display: block;margin-bottom:15px}
div.open-close {position: relative;	border-top-right-radius: 3px;border-bottom-right-radius: 3px;
  -moz-border-top-right-radius: 3px;-moz-border-bottom-right-radius: 3px;-webkit-border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px;left:0;	display: block;	width:38px;	height: 36px; float: left; 
  cursor:pointer; background:url("../../Nostras/Imagens/Ext/sett.png") #2e2e2e no-repeat 50% 50%; opacity:0.8; 
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";	filter: alpha(opacity=80);}

/*---------------------------------------------------------------------------------
 6. Responsive style
-------------------------------------------------------------------------------*/
@media screen and (max-width: 950px){
	#wrapper{ width:90%;	}
	#header h3{	width:75%;	}
	#countdown{	margin-left: 35%; }
	.item{ width: 20%; margin:0 2%;	}	
	.slides,.slides li{	width:100% !important;	}	
	.socialWrap{ width:100%;}	
	#contactdiv{ width:100%;}
	#contactdiv textarea,#contactdiv input{	width:86%; float:none !important; margin-right:0;}
	#contactdiv textarea{ height: 63px;	margin-bottom:10px;	}
	#contactdiv input {	height: 24px; margin-bottom:10px;	}
	#about{	width:100%;	}	
	#subscription{width:100%; }	
	#subscription input#subemail{ width: 89%; margin-bottom:10px; float:none; }}
@media screen and (max-width: 810px){ body{min-height:700px;}
	#header h3{	font-size: 38px;} #header h3 span{ font-size: 16px; }}
@media screen and (max-width: 768px){ #header{position: relative;}
	#header h3{	position: absolute;	top: -125px; width: 100%; float: none; display: block; font-size: 38px;	}
	#header h3 span{ font-size: 16px; }
	#countdown{	margin-left: 0;	}
	.item p{ font-size: 40px;}
	.item{ font-size: 13px;	}	
	#loopedSlider, #newsSlider{	min-height: 500px; height: 100%; }
	ul.slides{	min-height: 463px;	height: 100%; }}
@media screen and (max-width: 650px){ #wrapper{ top: 200px !important; }
	.upbox{	transform: translate(0px, -70px);-ms-transform: translate(0px, -70px); -webkit-transform: translate(0px, -70px);  }}
@media screen and (max-width: 400px){ #loopedSlider, #newsSlider{min-height: 650px;	height: 100%; }
	ul.slides{min-height: 600px;height: 100%; }	.item{ width: 19%; }.item p { font-size: 36px; }}

.Contiente { position: relative; z-index: 2; margin-left: 10em; width: 65vmin; height: 65vmin; top: 1em}
.Display{ margin:0 auto; display: block; font-size: 20pt; background-color:#58D3F7;text-align: center;}
.keypad { position: absolute; margin-left: 17em; top: -9em;	width: 100%; height: 100%; display: flex;
  align-items: center; padding: 0 13vmin;	flex-wrap: wrap; align-content: center; justify-content: center; 
  gap: 1.75vmin 2.75vmin;}

@media only screen and (max-width : 900px) {
   .Contiente { position: relative; z-index: 999; margin-left: -.51em; width: 60vmin; height: 60vmin; margin-top: 1em}
   .keypad { position: absolute; margin-left: 9em; top: -4.5em; width: 100%; height: 100%; display: flex; align-items: center; padding: 0 13vmin;	flex-wrap: wrap; align-content: center; justify-content: center; gap: 1.55vmin 2.55vmin;}
	.number {  width: 14vmin; height: 14vmin; }
	.number:before {content: ""; position: absolute; width: 3vmin; height: 3vmin;}
	.number {content: ""; font-size: 5px}.number:nth-child(3):after {content: ""; font-size: 5px} }

.number { position: relative; width: 8vmin;	height: 8vmin; border-radius: 100%; cursor: pointer;
	background: radial-gradient(circle at 50% 50%, #000 3.45vmin, #37373700 3.85vmin), 
		conic-gradient(from 0deg at 50% 50%, #222 0 25%, #555 50%, #222 75% 100%);
	box-shadow: 0 0.25vmin 0.5vmin -0.1vmin #ccc8, 0 -0.25vmin 0.35vmin -0.1vmin #000c; }
.number:before { content: ""; position: absolute; width: 6vmin;	height: 6vmin; left: 1vmin;top: 1vmin;
	background: linear-gradient(0deg, #fff1 20%, #fff0 40%), linear-gradient(180deg, var(--c1), var(--c2), var(--c3));
	border-radius: 100%; box-shadow: 0 0.25vmin 0.2vmin -0.1vmin #fff8 inset, 0 0.6vmin 0.2vmin -0.1vmin #0008 inset; filter: blur(1px); }
.number:after {	content: ""; background: #fc00;	width: 100%; height: 100%; position: absolute;	border-radius: 100%; 
  left: 0; top: 0; color: var(--c4); z-index: 1; display: flex; justify-content: center; font-size: 1.5vmin; 
  align-items: center;padding-top: 3.5vmin; font-style: italic; }
.number span {font-size: 4vmin;	color: var(--c4); width: 100%; height: 100%; display: flex; justify-content: center; 
	position: absolute;	align-items: center; padding-bottom: 1.5vmin; }
.number:active:before, .number:active:after, .number:active span {transform: scale(0.925);}
.number:active { --c4: #4fffe3; text-shadow: 0 0 0.5vmin #000, 0 0 3vmin var(--c4), 0 0 5vmin var(--c4);
	box-shadow: 0 0 3vmin -1.5vmin var(--c4) inset,	0 0.25vmin 0.5vmin -0.1vmin #ccc8, 0 -0.25vmin 0.35vmin -0.1vmin #000c; }

/*  parpadeo de textos */
.parpadeo{ animation-name: parpadeo; animation-duration: 1s; animation-timing-function: linear; 
  animation-iteration-count: infinite; -webkit-animation-name:parpadeo; -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: linear;-webkit-animation-iteration-count: infinite;}
@-moz-keyframes parpadeo{ 0% { opacity: 1.0; } 50% { opacity: 0.0; } 100% { opacity: 1.0; }}
@-webkit-keyframes parpadeo { 0% { opacity: 1.0; } 50% { opacity: 0.0; }  100% { opacity: 1.0; }}
@keyframes parpadeo { 0% { opacity: 1.0; }  50% { opacity: 0.0; } 100% { opacity: 1.0; }}
.textual{ font-weight:700; text-align: center; font-family:helvetica; font-weight:bold; color:#0CF945; 
  text-transform:uppercase;}
.red { color: #E81010; margin-left: 5%; line-height: 1.7; }
.yell { color: #FFFD1D; margin-left: 1%; line-height: 1.3; }
.blue { color: #0A346C; margin-left: 1%; line-height: 1.3; }
