/* ---------------------------------------------------------------------------------GERAL--------------------------------------------------------------------------------- */ html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, hr, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin:0; padding:0; border:0; background:transparent;} html { height: 100%; } @import url('https://fonts.googleapis.com/css?family=Slabo+13px'); body{ background-color: #ffffff; /* background-image: url(""); */ /* background-repeat: ; */ background-position: center top; /* margin:0px; padding: 0px; */ height:100%; vertical-align:top; text-align: center; font-size: 100%; /* 16px */ font-family: 'Slabo 13px', serif; color:#000000; } /* ---------------------------------------------------------------------------------BASICO--------------------------------------------------------------------------------- */ #Crisoft img{display: block; max-width: 100%;} /* não usar o max -width para loja virtual */ #Crisoft {margin: 0 auto;} #Crisoft .tx1{font-size: 3em;} /* 48px; */ #Crisoft .tx2{font-size: 2.25em;} /* 36px; */ #Crisoft .tx3{font-size: 2em; } /* 32px; */ #Crisoft .tx4{font-size: 1.5em; } /* 24px; */ #Crisoft .tx5{font-size: 1.125em;} /* 18px; */ #Crisoft .tx6{font-size:1em;} /* 16px; */ #Crisoft .tx7{font-size: 0.875em;} /* 14px; */ #Crisoft .for1{color:#999999} /* formato, alinhamento e cor */ #Crisoft .for1:hover{/*automatizado*/} /* formato, alinhamento e cor */ #Crisoft .for2{color:#ffffff} /* formato, alinhamento e cor */ #Crisoft .for3{color:#666666} /* formato, alinhamento e cor */ #Crisoft .for4{/*automatizado*/} /* formato, alinhamento e cor */ #Crisoft .line1{line-height:30px;} /* formato, alinhamento e cor */ #Crisoft img.center {display: block; margin-left: auto; margin-right: auto; } #Crisoft .menu1 {display: block; padding-left:25px; padding-right:25px; line-height:42px;} #Crisoft .pad1 {display: block; padding:5px 10px 5px 10px;} #Crisoft .pad2 {display: block; padding:0px 15px 0px 15px;} #Crisoft .pad3 {display: block; padding:0px 10px 0px 10px;} #Crisoft .pad4 {display: block; padding:25px 15px 0px 15px;} #Crisoft .baseul{overflow: hidden;text-align: center;} #Crisoft .baseul ul{} #Crisoft .baseul ul li{display: inline-block; list-style: none;} #Crisoft .baseul ul li a{display: inline-block; text-decoration: none; text-align: center;} #Crisoft .baseul_rodape ul{list-style: none; display:table; width:100%;} #Crisoft .baseul_rodape ul li{display: table-cell; vertical-align: middle;} #Crisoft .baseul_rodape ul li.l{text-align:left;} #Crisoft .baseul_rodape ul li.r{text-align:right;} /* #Crisoft .baseul2{overflow: hidden;text-align: center;} #Crisoft .baseul2 ul{list-style: none; } #Crisoft .baseul2 ul li{display: table-cell; vertical-align: middle;} #Crisoft .baseul3{overflow: hidden;text-align: center; } #Crisoft .baseul3 ul{} #Crisoft .baseul3 ul li{display: inline-block; list-style: none; vertical-align: middle; width:100%; max-width:460px;} #Crisoft .baseul4{overflow: hidden;text-align: center;} #Crisoft .baseul4 ul{display: inline-block; list-style: none;} #Crisoft .baseul4 ul li{display: inline-block; vertical-align: top;} #Crisoft .baseul5{} #Crisoft .baseul5 ul{list-style: none; } #Crisoft .baseul5 ul li{display: table-cell; vertical-align: top;} #Crisoft .baseul6{} #Crisoft .baseul6 ul{list-style: none; display:table; width:100%;} #Crisoft .baseul6 ul li{display: table-cell; vertical-align: middle; height:69px;} #Crisoft .baseul6 ul li.l{text-align:left;} #Crisoft .baseul6 ul li.c{text-align:center;} #Crisoft .baseul6 ul li.r{text-align:right;} #Crisoft .floatleft {float:left;} #Crisoft .floatright {float:right;} #Crisoft .paddingleft {padding-left:40px;} #Crisoft .paddingright {padding-right:40px;} #Crisoft .espacamento1 { margin-top:60px; margin-bottom:60px;} #Crisoft .base_table{display: table; width:100%; max-width:1920px;} #Crisoft .base_table2{display: table-row;} #Crisoft .base_table_left{display: table-cell; width:33%; margin-top:0em; text-align:left;} #Crisoft .base_table_center{display: table-cell; width:34%; margin-top:0em; text-align:center; } #Crisoft .base_table_right{display: table-cell; width:33%; margin-top:0em; text-align:right;} #Crisoft .transicao1:hover{-webkit-transition: 1.5s ease-out;-moz-transition: 1.5s ease-out;-o-transition: 1.5s ease-out;transition: 1.5s ease-out; } #Crisoft .transicao1:hover img { -webkit-transition: all 1.5s cubic-bezier(.190, 1.000, .220, 1.000); -moz-transition: all 1.5s cubic-bezier(.190, 1.000, .220, 1.000); -ms-transition: all 1.5s cubic-bezier(.190, 1.000, .220, 1.000); -o-transition: all 1.5s cubic-bezier(.190, 1.000, .220, 1.000); transition: all 1.5s cubic-bezier(.190, 1.000, .220, 1.000); } #Crisoft .transicao1:hover img { -webkit-transform: scale(1.5); -moz-transform: scale(1.5); -ms-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); } #Crisoft .base_video{display: block; width:477px; height:270px;} */ #Crisoft_superior {margin: 0 auto; z-index:3; position:relative;} #Crisoft_superior .base_superior{display: block; width:100%; max-width:1920px; margin-top:0em;} #Crisoft_superior .base_superior_linha{display: block; width:100%; max-width:1920px; height:9px; background-color:#000000;} #Crisoft_superior .base_superior_linha_2{display: block; width:100%; max-width:1920px; height:3px; background-color:#000000;} #Crisoft_superior .base_superior_logo{display: block; width:100%; max-width:1920px;background-color:#dfdfdf;} #Crisoft_superior .base_superior_menu{display: block; width:100%; max-width:1920px; height:42px;} #Crisoft_superior .base_superior_menu_mobile{display: table; width:100%; max-width:1920px; position:absolute; z-index:10000;} #Crisoft_superior .base_superior_banner{display: block; width:100%; max-width:1920px;} #Crisoft_principal {margin: 0 auto; z-index:2; position:relative;} #Crisoft_principal .base_principal{display: block; width:100%; max-width:1920px; margin-top:3em; margin-bottom:3em;} #Crisoft_principal .base_principal_1{display: block; width:100%; max-width:1010px; margin-top:3em; margin-bottom:3em;} #Crisoft_principal .base_principal_2{display: block; width:100%; max-width:467px;} #Crisoft_principal .base_principal_textos{display: block; width:100%; max-width:1010px; margin-top:3em; margin-bottom:3em;} #Crisoft_principal .base_galeria{display: block; width:300px; height:485px;} #Crisoft_principal .base_galeria_1{display: block; position:absolute; width:300px; height:450px;} #Crisoft_principal .base_galeria_2{display: block; position:absolute; width:300px; height:68px; margin-top:417px; } #Crisoft_principal .base_galeria_3{display: block; position:absolute; width:300px; height:30px; margin-top:440px; } #Crisoft_inferior {margin: 0 auto; z-index:1; position:relative;} #Crisoft_inferior .base_inferior{display: block; width:100%; max-width:1920px; margin-top:0em;} #Crisoft_inferior .base_inferior_1{display: block; width:100%; max-width:1920px; background-color:#000000; padding-top:3em; padding-bottom:3em;} /* ---------------------------------------------------------------------------------TELAS---------------------------------------------------------------------------------- */ @media only screen and (max-width: 1920px) { /* 1920 */ body{font-size: 100%;} #Crisoft .versite{display:block;} #Crisoft .vermobile{display:none;} } @media only screen and (max-width: 1680px) { /* 1680 */ body{font-size: 100%;} } @media only screen and (max-width: 1600px) { /* 1600 */ body{font-size: 100%;} } @media only screen and (max-width: 1440px) { /* 1440 */ body{font-size: 100%;} } @media only screen and (max-width: 1366px) { /* 1366 */ body{font-size: 100%;} } @media only screen and (max-width: 1280px) { /* 1280 */ body{font-size: 100%;} } @media only screen and (max-width: 1024px) { /* 1024 */ body{font-size: 100%;} } @media only screen and (max-width: 960px) { /* 960 */ body{font-size: 100%;} } @media only screen and (max-width: 800px) { /* 800 */ body{font-size: 100%;} #Crisoft .espacamento1 { margin-top:30px; margin-bottom:30px;} } @media only screen and (max-width: 768px) { /* 768 */ body{font-size: 100%;} } @media only screen and (max-width: 736px) { /* 736 */ body{font-size: 100%;} } @media only screen and (max-width: 668px) { /* 667 */ body{font-size: 100%;} } @media only screen and (max-width: 640px) { /* 640 */ body{font-size: 100%;} } @media only screen and (max-width: 600px) { /* 600 */ body{font-size: 99%;} } /* -------------------------------------USAR FORMATO DE MOBILE -------------------------------------- */ @media only screen and (max-width: 568px) { /* 568 */ body{font-size: 99%; margin-top:0px;} #Crisoft .versite{display:none;} #Crisoft .vermobile{display:block;} #Crisoft .espacamento1 { margin-top:20px; margin-bottom:20px;} #Crisoft .tx4{font-size: 1.3em; } #Crisoft .baseul_rodape ul{overflow: hidden;text-align: center;} #Crisoft .baseul_rodape ul li{display: inline-block;} #Crisoft .baseul_rodape ul li.l{text-align:center;} #Crisoft .baseul_rodape ul li.r{text-align:center;} #Crisoft .pad2 {display: block; padding:0px 0px 0px 0px;} #Crisoft .pad4 {display: block; padding:0px 0px 0px 0px;} } @media only screen and (max-width: 534px) { /* 533 */ body{font-size: 98%;} #Crisoft .espacamento1 { margin-top:15px; margin-bottom:15px;} } @media only screen and (max-width: 480px) { /* 480 */ body{font-size: 98%;} #Crisoft .espacamento1 { margin-top:10px; margin-bottom:10px;} } @media only screen and (max-width: 414px) { /* 414 */ body{font-size: 97%;} #Crisoft .espacamento1 { margin-top:5px; margin-bottom:5px;} } @media only screen and (max-width: 376px) { /* 375 */ body{font-size: 97%;} } @media only screen and (max-width: 360px) { /* 360 */ body{font-size: 96%;} } @media only screen and (max-width: 320px) { /* 320 */ body{font-size: 96%;} } /* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ */