/* Variáveis */

:root {
 --cor-base:#502c93;
 --cor-clara:#7f56cc;
 --cor-escura:#291150;
 --cor-bg:#03081e;
 --cor-dois:#050c3a;
}

/* Reset */

* {
 margin:0; padding:0; border:0; outline:0;
 box-sizing:border-box;
}

/* Base */ 

html {
 position:relative;
 min-height:100%;
}

body {
 margin:0;
 height:100%;
 min-width:300px;
 overflow-y:scroll;
 overflow-x:hidden;
 background-color:var(--cor-bg);
 background-position:center top;
 background-repeat:no-repeat;
 background-attachment:fixed;
 color:#fff;
 font-family:Helvetica,Arial,Garuda;
 font-size:1em;
 font-weight:400;
}

/* jQuery UI */

.ui-widget {
 font-style:inherit !important;
 font-family:inherit !important;
 font-size:100% !important;
}

.ui-dialog-titlebar-close {
 visibility:hidden;
}

.ui-tooltip-content {
 font-size:0.8em;
}

.ui-accordion-header {
 outline:none !important;
}

.ui-datepicker {
 font-size:0.95em !important;
}

.ui-progressbar-value {
 height:2em !important;
}

#dialog {
 display:none;
}

.dialog-fixed {
 position:fixed !important; 
}

/* Tags */

a {
 text-decoration:none;
 color:#fff;
 outline:none;
}

a:hover {
 text-decoration:none;
 color:#a0a0e0;
}

input[type=text],input[type=password],input[type=file],select,textarea {
 width:100%;
 max-width:600px;
 border:1px solid #fff;
 background-color:#fff;
 border-radius:2px;
 color:#000;
 margin-bottom:5px;
 padding:8px;
 outline:none;
 resize:none;
 font-family:Helvetica;
 color:#000;
}

input[type=text]:focus,input[type=password]:focus,select:focus,textarea:focus {
 background-color:#eee;
}

button,input[type=button],input[type=submit] {
 background-color:var(--cor-base);
 border:solid 2px var(--cor-base);
 border-radius:3px;
 margin:5px 0;
 padding:8px 15px;
 color:#fff;
 font-weight:bold;
 outline:none;
 cursor:pointer;
}

button:hover,input[type=button]:hover,input[type=submit]:hover {
 border:solid 2px #fff;
}

hr {
 border:0;
 width:100%;
 height:1px;
 background-color:var(--cor-base);
}

break {
 flex-basis:100%;
 width:0; height:0; 
 overflow:hidden;
}

main {
 width:100%;
 max-width:1250px;
 margin:200px auto 50px;
 padding:0;
}

/* Específicos */

.nosel {
 user-select:none;
 -moz-user-select:none;
 -ms-user-select:none;
 -webkit-user-select:none;
 -webkit-touch-callout:none;
 -webkit-tap-highlight-color:transparent;
}

.yessel {
 user-select:text !important;
 -moz-user-select:text !important;
 -ms-user-select:text !important;
 -webkit-user-select:text !important;
}

.noresp {
 display:inline;
}

.flex {
 display:flex;
 flex-wrap:wrap;
 justify-content:center;
}

@media screen and (max-width:639px) {
 .noresp {
  display:none;
 }
}

/* Projeto */

.menu {
 width:100%;
 height:60px;
 position:fixed;
 top:0;
 left:0;
 z-index:999;
 background-color:rgba(0,0,0,0.75);
 text-align:center;
}

.menuitem_sobre {
 display:inline-block;
 background-image:linear-gradient(var(--cor-escura),var(--cor-clara));
 border-bottom:2px solid #fff;
 border-left:2px solid #fff;
 border-right:2px solid #fff;
 box-shadow:0 8px 6px rgba(0,0,0,0.8);
 padding:7px 40px 12px;
 margin:0 15px;
 text-align:center;
 font-weight:bold;
 font-size:1.7em;
}

.menuitem_sobre:hover {
 background-image:linear-gradient(var(--cor-clara),var(--cor-escura));
 color:#fff;
}

.menuitem {
 display:inline-block;
 vertical-align:top;
 font-size:1.3em;
 margin:7px 15px;
 padding:10px;
}

.menuitem_sub {
 background-color:rgba(0,0,0,0.75);
 border-top:1px solid #fff;
 padding:12px 15px 15px;
 line-height:1.8em;
}

#menu_hamb_ico {
 display:none;
 width:90px;
 vertical-align:top;
 margin-top:15px;
 cursor:pointer;
}

#menu_resp {
 display:none;
 position:absolute;
 top:50px;
 left:0;
 width:100%;
 background:rgba(0,0,0,0.75);
 padding:30px 10px 10px;
}

.menu_item_resp {
 display:inline-block;
 width:100%;
 background:rgba(0,0,0,0.8);
 border:1px solid #fff; 
 padding:10px;
 margin-bottom:10px;
 font-weight:bold;
 color:#fff;
 cursor:pointer;
}

.rodape {
 width:100%;
 background-color:var(--cor-bg);
 text-align:center;
 padding:0 30px;
}

.rodshasta {
 width:100%;
 text-align:center;
 padding:0 10px 25px;
}

.inweb {
 width:100%;
 background-color:var(--cor-dois);
 text-align:left;
 padding:12px 10px;
 font-size:0.8em;
}

.floatwhats {
 position:fixed;
 bottom:0;
 right:10px;
 z-index:999;
 cursor:pointer;
}

.floatwhats_img {
 width:58px;
 border:0;
 transition:0.3s;
}

.floatwhats_img:hover {
 width:68px;
}

.centro {
 width:95%;
 margin:0 auto;
 background-color:rgba(1,14,33,0.7); 
 border-top:1px solid #fff;
 padding:50px 30px;
 font-size:1.1em;
 line-height:1.5em;
}

.tit {
 margin-top:-85px;
 text-align:left;
}

h1 {
 font-size:2em;
 font-weight:bold;
 margin:0;
}

.sobre01 {
 width:100%;
 max-width:500px;
 border:3px solid #fff;
 box-shadow:0 10px 10px rgba(0,0,0,0.7);
 margin-right:-70px;
 margin-left:40px;
 margin-bottom:30px;
}

.sobre02 {
 display:none;
 width:80%;
 max-width:500px;
 border:3px solid #fff;
 box-shadow:0 10px 10px rgba(0,0,0,0.7);
 margin-bottom:30px;
}

.bgindex {
 background-position:center top;
 background-repeat:no-repeat;
 background-size:cover;
}

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

@media screen and (max-width:1550px) {
 .menuitem_sobre {
  padding:7px 30px 12px;
  margin:0 15px 0 10px;
  font-size:1.5em;
 }
 .menuitem {
  font-size:1.1em;
  margin:10px 5px 0;
  padding:10px;
 }
 .menuitem_sub {
  padding:9px 15px 13px;
  line-height:2em;
 }
}

@media screen and (max-width:1250px) {
 .menuitem_sobre {
  padding:7px 20px 12px;
  font-size:1.3em;
 }
 .menuitem {
  font-size:1em;
  margin:11px 0 0;
 }
 .menuitem_sub {
  line-height:2.5em;
 }
}

@media screen and (max-width:1110px) {
 .menu {
  height:50px;
  text-align:left;
 }
 .menuitem_sobre {
  border-bottom:1px solid #fff;
  border-left:1px solid #fff;
  border-right:1px solid #fff;
  padding:5px 15px 10px;
  margin:0 10px;
  font-size:1.1em;
  position:relative;
  z-index:999;
 }
 .menuitem {
  display:none;
 }
 #menu_hamb_ico {
  display:inline-block;
 }
 main {
  margin:130px auto 30px;
 }
 .centro {
  padding:40px 20px;
  font-size:0.95em;
 }
 .tit {
  margin-top:-65px;
 }
 h1 {
  font-size:1.1em;
 }
 .sobre01 {
  max-width:400px;
 }
}

@media screen and (max-width:800px) {
 .inweb {
  font-size:0.7em;
 }
 .floatwhats_img {
  width:40px;
 }
 .floatwhats_img:hover {
  width:40px;
 }
 .sobre01 {
  display:none;
 }
 .sobre02 {
  display:inline-block;
 }
}