/* =RESET -----------------------------------------------------------------------------------------------*/ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,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,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline}body{line-height:1;color:black;background:white}ol,ul{list-style:none}table{border-collapse:separate;border-spacing:0}/* tables still need 'cellspacing="0"' in the markup */caption,th,td{text-align:left;font-weight:normal}blockquote:before,blockquote:after,q:before,q:after{content:""}blockquote,q{quotes:""""} /* Misc ******************************************************************/ .margin90 { margin-bottom:90px; } body { overflow-x:hidden; overflow-y:scroll; } .content { background-color:#fff; padding-top:90px; position:relative; z-index:90 } .content img { margin-bottom:20px; } .centered { text-align:center; vertical-align: middle; } .centered h2 { margin-bottom: 80px; } .header{ position:relative; } /* NAV ******************************************************************/ .nav-container { background-color:#1b1b1b; height:70px; position: relative; z-index: 200; } nav { z-index: 200; width: 100%; background-color:#38120d; position: relative; float:left; height:70px; float:right; } nav ul { margin-right:150px; float:right; } #logo_small { float:left; margin-left:60px; margin-top: 10px; } #redes { position: relative; float:right; margin-right:5px; } nav li { padding-left:-200px; display: inline; list-style: none; } nav li a {margin-top:20px; text-decoration: none; font-size: 14px; color: #a4a4a4; font-weight: 400; display: inline-block; text-align: center; } nav li a:hover, nav li a.selected { color: #fff; text-decoration: none; } .sticky { position: fixed; top: 0px; z-index: 200; } /* LEVEL ONE */ ul.dropdown { position: relative; float:left; margin:5px 30px 0; padding:0; } ul.dropdown li { float:left; margin-top:15px; font-family:'Source Sans Pro', Arial, Helvetica, sans-serif; font-size:14px; list-style:none; position:relative; } ul.dropdown li a { text-decoration:none; color:#ccc; padding:0 20px 0 23px; margin-right:-10px; } ul.dropdown a:hover { color:#fff; } ul.dropdown > li > a {font-weight:bold;} /* LEVEL TWO */ ul.dropdown ul { visibility: hidden; position: absolute; left: 10px; display: block; } ul.dropdown ul li { float:none; font-size:12px; border-bottom:1px solid #CCC; padding:0; } ul.dropdown ul li a { display:block; background:rgba(102,102,102,0.4); margin-left:-10px; margin-top:3px; margin-bottom:3px; width:62px; font-size:16px;font-weight: bold; } ul.dropdown ul li a:hover { color: #fff;} .sticky { position: fixed; top: 0px; z-index: 200; } /* Home ******************************************************************/ #arrow { width:79px; height:78px; background: url(../img/next_arrow.png) no-repeat center -79px; position:absolute; bottom:10px; z-index:200; } #arrow a { position:absolute; left:0px; z-index:200; width:79px; height:78px; background: url(../img/next_arrow.png) no-repeat center top; background: rgba(255,255,255, 0); -webkit-transition: background 0.2s linear; -moz-transition: background 0.2s linear; -o-transition: background 0.2s linear; transition: background 0.2s linear; } #arrow a:hover { background: url(../img/next_arrow.png) no-repeat center -79px; background: rgba(255,255,255, 0.8); } #head { background: url(../img/head.png) no-repeat 50% bottom ; height:100%; width:900px; max-width:900px; position:absolute; display:block; z-index: 100; bottom:0px; -moz-background-size:contain; -webkit-background-size:contain; background-size:contain; margin-left:25px;} } img#logo { position:absolute; z-index:200 } /* Paralaxed elements ******************************************************************/ #parallax { background: url(../img/about_bg2.png) no-repeat center top ; width:100%; height:600px; position:absolute; display:block; z-index: 10; } #parallax_2 { background: url(../img/about_bg3.png) no-repeat center top ; width:100%; height:600px; position:absolute; display:block; z-index: 1; } #parallax_3 { background: url(../img/services_bg2.png) no-repeat center top; display:block; width:100%; height:600px; position:absolute; z-index: 2; } #parallax_4 { background: url(../img/indio.jpg) no-repeat center top; display:block; width:100%; height:750px; position:absolute; z-index: 10; } #parallax_5 { background: url(../img/works_bg2.png) no-repeat center top ; width:100%; height:600px; position:absolute; display:block; z-index: 1; } #parallax_6 { background: url(../img/works_bg3.png) no-repeat center top ; width:100%; height:600px; position:absolute; display:block; z-index: 10; } /* Parallax mobile ******************************************************************/ #parallax_mobile { background: url(../img/about_bg2.png) no-repeat center top ; width:100%; height:450px; position:absolute; display:block; z-index: 10; } #parallax_2_mobile { background: url(../img/about_bg3.png) no-repeat center top ; width:100%; height:450px; position:absolute; display:block; z-index: 1; } #parallax_3_mobile { background: url(../img/services_bg2.png) no-repeat center bottom ; width:100%; height:450px; position:absolute; display:block; z-index: 1; } #parallax_4_mobile { background: url(../img/services_bg3.png) no-repeat center bottom ; width:100%; height:450px; position:absolute; display:block; z-index: 10; } #parallax_5_mobile { background: url(../img/works_bg2.png) no-repeat center bottom ; width:100%; height:450px; position:absolute; display:block; z-index: 1; } #parallax_6_mobile { background: url(../img/works_bg3.png) no-repeat center bottom ; margin-top:100px; width:100%; height:450px; position:absolute; display:block; z-index: 10; } /* About ******************************************************************/ #about_header { background: url(../img/about_bg.jpg) no-repeat center center ; background-color:#075977; width:100%; height:450px; position:relative; display:block; text-align: center; } #about_header_mobile { background: url(../img/about_bg.jpg) no-repeat center center ; background-color:#e24e4e; width:100%; height:450px; position:relative; display:block; text-align: center; } #about_header h1 { font-size: 220px; font-weight: 900; letter-spacing: -8px; line-height: 115px; color:black; text-transform:uppercase; margin-top:200px; z-index: 3; position:relative; } /* Services ******************************************************************/ #services_header { background: url(../img/services_bg.jpg) no-repeat center center ; background-color:#D9CEAD; width:100%; height:450px; position:relative; display:block; text-align: center; } #services_header_mobile { background: url(../img/services_bg.jpg) no-repeat center center ; background-color:#e24e4e; width:100%; height:450px; position:relative; display:block; text-align: center; } #services_header h1 { font-size: 220px; font-weight: 900; letter-spacing: -8px; line-height: 115px; color:black; text-transform:uppercase; margin-top:200px; z-index: 3; position:relative; } .services_item {margin-bottom:40px;} #process h3 { text-transform:uppercase; margin-bottom:20px; } /* Works ******************************************************************/ #works_header { background: url(../img/works_bg.jpg) no-repeat center center ; background-color:#961E3C; width:100%; height:450px; position:relative; display:block; text-align: center; } #works_header_mobile { background: url(../img/works_bg.jpg) no-repeat center center ; background-color:#e24e4e; width:100%; height:450px; position:relative; display:block; text-align: center; } #works_header h1 { font-size: 220px; font-weight: 900; letter-spacing: -8px; line-height: 115px; color:black; text-transform:uppercase; margin-top:200px; z-index: 3; position:relative; } .client h5 { text-transform:uppercase; margin-top:2px; margin-bottom:20px; } /* Gallery ******************************************************************/ #portfolio{ padding-top:70px; position:relative; display:block; text-align: center; } #portfolio_bg { background: url(../img/gallery_bg.jpg) repeat 0 0; background-color:#f6f5f8; width:100%; height:100%; position:absolute; z-index:20; top:0px; left:0px; background-attachment: fixed; -webkit-background-size: cover; background-size: cover; } .titulo_portfolio { background:url("../images/titulo_portfolio.png") no-repeat center 0; margin-bottom:30px; z-index: 30; position:relative; text-align: center; height:80px; width: 100%; } .caixa-descricao { clear: both; margin-bottom: 2rem; display: none; } /*.caixa-descricao.ativo { display: block; }*/ .caixa-descricao h2 { display: block; line-height: auto; width: 100%; text-align: left; color: #AC2325; font-size: 27px; margin-bottom: 20px; letter-spacing: 0; line-height: 2rem; } .caixa-descricao > p { color: #AC2325; font-size: 16px; text-align: left; line-height: 1.5rem; } .titulo_conteudo { margin-top:50px; margin-bottom:70px; z-index: 30; position:relative; text-align: center; width: 100%; height:80px; background:url("../images/titulo_conteudo.png") no-repeat scroll center 0 transparent; } .titulo_makingof { margin-top:100px; margin-bottom:70px; z-index: 30; position:relative; text-align: center; width: 100%; height:80px; background:url("../images/titulo_making.png") no-repeat scroll center 0 transparent; } .titulo_demo { text-align:center; padding:100px 0; background:url("../img/titulo_demoreel.png") no-repeat scroll center 100px transparent; height:77px; width:100%; position:relative; } .titulo_equipe{ margin-top:10px; margin-bottom:20px; z-index: 30; position:relative; text-align: center; width: 100%; background:url("../images/titulo_equipe.png") no-repeat; height:100px; } .cont { margin-top:240px; margin-bottom:70px; position:relative; text-align: center; width: 100%; } .cima { margin-top:-72px; } #gallery h2 { margin-top:100px; } #gallery h3 { font-size:20px; margin-top:20px; margin-bottom:40px; } #gallery_items { position:relative; z-index:30 } /* IMG hover effect ******************************************************************/ figure {max-width:360px; margin:0px auto ;padding:0px; text-align:center;} figure img { max-width: 100%; position: relative; z-index: 900; } figure a { position: relative; display: block; line-height: 0px; text-decoration: none; } figure a:hover { text-decoration: none; } figure a:hover img { opacity: 0.4; filter: alpha(opacity=40); /* IE6-IE8 */ -webkit-transition: opacity .3s ease-in-out; -moz-transition: opacity .3s ease-in-out; -o-transition: opacity .3s ease-in-out; -ms-transition: opacity .3s ease-in-out; transition: opacity .3s ease-in-out; } figure a:before { content: "+"; display: block; font-size: 40px; line-height: 1em; height: 1em; width: 1em; text-align: center; color: red; font-weight: bold; position: absolute; top: 50%; left: 50%; z-index: 100; margin: -0.5em 0 0 -0.5em; } a.enlarge:before { content: "+"; } /* Buttons ******************************************************************/ button.cta { font-family: 'Source Sans Pro', sans-serif; font-size: 18px; font-style: italic; font-weight: 300; color: #ffffff; padding: 10px 20px; background:#e24e4e; text-shadow: 0px 1px 0px rgba(120,36,50,1), 0px 1px 0px rgba(255,255,255,0); border: 0px; } button.cta:hover { background:#ff5555; } button.cta:active { margin-top:1px; } /* Map and contact ******************************************************************/ #contato { background: url(../img/contato_bg.jpg) repeat-y center center; display:block; position:relative; z-index: 90; } #contato h2 { color:white; margin-top:100px; margin-bottom:20px; } #contato h1 { font-size: 100px; color:black; margin-bottom:50px; } #contato a { color:#e4f1f7; } #contato p { color:#e6612c; text-align: left; font-family: "Source Sans Pro", Helvetica, Arial, sans-serif; font-size: 13px; text-transform: uppercase; font-weight: bold; line-height: 1.3; } #map { height:400px; width:100%; position: relative; } /* Social icons ******************************************************************/ .list-social li { padding:0 10px 10px 0; list-style: none; margin:0px; text-align: center; display: inline-block; margin-top:50px; margin-bottom:50px; } .list-social li.facebook a { background:url(../img/social_facebook.png) no-repeat 0 0; height:56px; width:56px; display:block; float:left; background-position:0 0; } .list-social li.twitter a { background:url(../img/social_twitter.png) no-repeat 0 0; height:56px; width:56px; display:block; float:left; background-position:0 0; } .list-social li.forrst a { background:url(../img/social_forrst.png) no-repeat 0 0; height:56px; width:56px; display:block; float:left; background-position:0 0; } .list-social li.dribbble a { background:url(../img/social_dribbble.png) no-repeat 0 0; height:56px; width:56px; display:block; float:left; background-position:0 0; } .list-social li.rss a { background:url(../img/social_rss.png) no-repeat 0 0; height:56px; width:56px; display:block; float:left; background-position:0 0; } .list-social li.facebook a:hover, .list-social li.twitter a:hover, .list-social li.forrst a:hover, .list-social li.dribbble a:hover, .list-social li.rss a:hover { background-position:0 -56px; } /* Footer ******************************************************************/ #footer { background-color:#666; display:block; position:relative; height:60px; z-index: 90; } #footer p { margin: 60px 0px; } #img.source-image { width: 100%; position: absolute; top: 0; left: 0; } .bt { display:list; position:relative } bt li { padding-left:-200px; display: inline; list-style: none; } bt li a {margin-top:20px; text-decoration: none; font-size: 14px; color: #ff3366; font-weight: 400; display: inline-block; text-align: center; } .nome{ font-size: 25px; line-height: 40px; font-weight: 600; color:#ff3366; text-align: center; font-weight: 400; font-family: 'Source Sans Pro'; position: absolute; letter-spacing:-1px; background: #000; bottom: 150px; z-index:9999999; width:300px; } /* #Forms ================================================== */ /* General Forms */ form { margin-bottom: 0px; } fieldset { margin-bottom: 20px; } label, legend { display: block; font-weight: bold; font-size: 13px; } input[type="checkbox"] { display: inline; } label span, legend span { font-weight: normal; font-size: 13px; color: #444; } input[type="text"], input[type="password"], input[type="email"], textarea, select { border: 1px solid #ccc; padding: 10px 10px; outline: none; overflow: hidden; font: 14px "Source Sans Pro", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #e6612c; margin: 0; width: 100%; max-width: 100%; display: block; margin-bottom: 10px; background: #e9eae9; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; } select { padding: 0; } input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, textarea:focus { border: 1px solid #ccc; background: #fff; color: #e6612c; } textarea { min-height: 200px; font: 14px "Source Sans Pro", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; } select { width: 220px; } /* Text Selection */ /* #Buttons ================================================== */ a.button, button, input[type="submit"], input[type="reset"], input[type="button"] { /*-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;*/ background: #e6612c; -webkit-transition: background 0.2s ease-out, color 0.2s ease-out; -moz-transition: background 0.2s ease-out, color 0.2s ease-out; -o-transition: background 0.2s ease-out, color 0.2s ease-out; -ms-transition: background 0.2s ease-out, color 0.2s ease-out; -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.3); -moz-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.3); box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.3); border: 0; float: right; padding-left: 10px; padding-right: 10px; padding-top: 8px; padding-bottom: 8px; color: #fff; display: inline-block; font-size: 14px; line-height: 16px; letter-spacing: 1px; text-decoration: none; cursor: pointer; font-family: "Source Sans Pro", Helvetica, Arial, sans-serif; text-transform: uppercase; } a.button:hover, button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover { color: #fff; background: #333; /*background: #34b489;*/ } a.button:active, button:active, input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active { color: #fff; background: #222; /*-moz-box-shadow: inset 0px 0px 0px 1px #fff; -webkit-box-shadow: inset 0px 0px 0px 1px #fff; -box-shadow: inset 0px 0px 0px 1px #fff;*/} .button.full-width, button.full-width, input[type="submit"].full-width, input[type="reset"].full-width, input[type="button"].full-width { width: 100%; padding-left: 0 !important; padding-right: 0 !important; text-align: center; } a.button .buttonarrow, button .buttonarrow { width: 5px; height: 10px; background: url('../images/tiles/buttonarrow.png') no-repeat; display: inline-block; -webkit-transition: background 0.2s ease-out; -moz-transition: background 0.2s ease-out; -o-transition: background 0.2s ease-out; -ms-transition: background 0.2s ease-out; } a.button:hover .buttonarrow, button:hover .buttonarrow { background-position: right; } /* Dark Button */ a.button.dark { background: #222; color: #fff; } a.button.dark:hover { background: #ffc539; color: #000; } a.button.dark .buttonarrow { background: url('../images/tiles/buttonarrow.png') no-repeat; background-position: right; } a.button.dark:hover .buttonarrow { background: url('../images/tiles/buttonarrow.png') no-repeat; background-position: left; } /* Contato */ #contactform input { float: left; width: 203px; margin-right: 10px; } #contactform input.last { margin-right: 0px; } #contactform textarea { float: left; width: 438px; max-width: 438px; height: 200px; } .errormessage, .sendingmessage, .successmessage { float: left; color: #777; font-size: 12px; line-height: 30px; text-decoration: none; display: none; width: 100%; } .errormessage { color: #ffc539; } input[type="text"].formerror, textarea.formerror { border: 1px solid #ffc539; } .google-map { height: 310px; width: 100%; } .laranja { height: 150px; width: 100%; vertical-align:"middle"; line-height:200px; background:url("../img/titulo_contato.png") no-repeat center 20px #e6612c; } /* PORTFOLIO */ /* Simple Reset ------------------------------------------------------------ */ html, body, div, h1, h2, ul, li, dl, dd, dt, p { margin: 0; padding: 0; } ul { list-style: none; } /* Import Fonts ------------------------------------------------------------ */ @import url(http://fonts.googleapis.com/css?family=Quattrocento); /* Custom Classes ------------------------------------------------------------ */ .group:after { visibility: hidden; display: block; content: ""; clear: both; height: 0; margin-bottom: -10px;} * html .group { zoom: 1; } /* IE6 */ *:first-child+html .group { zoom: 1; } /* IE7 */ /* General Styles ------------------------------------------------------------ */ a { color: #444; text-decoration: underline; -moz-transition: 0.4s all linear; -webkit-transition: 0.4s all linear; -o-transition: 0.4s all linear; transition: 0.4s all linear; outline-color: #aaa; } a:hover { color: #4f0d4d; } .demo-top { margin-bottom: 0.35714em; padding-bottom: 0.5em; border-bottom: 3px solid #000; } .credits { font-family: 'Quattrocento', serif; font-size: 1.28571em; line-height: 1.16667em; text-align: center; color: #444; margin-bottom: 2.66667em; } .back-to-post { border-top: 1px solid #000; margin-bottom: 3em; } /* Filter */ dl { margin-bottom: 3em; color: #777; } dt, dd { float: left; } dt { margin-right: 5px; } .filter li { float: left; font-family:"Source Sans Pro", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; } .filter li:last-child:after { content: ""; } .filter a { padding: 0 10px; color: #777; text-decoration: none; } .filter a:hover, .current a { color: #fff; background-color: #e6612c; } /* Portfolio Items */ .portfolio { width: 940px; margin-left:0px; } .portfolio li { float: left; margin-right: 20px; margin-bottom: 2em; border: 1px solid #ccc; -moz-box-shadow: 0 5px 5px -3px #222; -webkit-box-shadow: 0 5px 5px -3px #222; box-shadow: 0 5px 5px -3px #222; } .portfolio li:nth-child(4n) { margin-right: 0; } .portfolio a { display: block; border: 3px solid #fff; text-decoration: none; background: #ffF;} .portfolio img { width: 210px; height: 130px; display: block; } /* FIM PORTFOLIO */ .teste { margin-top:400px; } .endereco_br { text-align: left; font: 17px "Source Sans Pro", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #E6612C; line-height: 30px !important; margin-bottom: 80px; } .destaque { font-weight: 500; font-size: 18px; } .espaco_branco { height:70px; width:100%; position: relative; background: #fff; } .baixo{ font-family:"Source Sans Pro", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #ccc; margin-top:20px; font-size: 13px; text-align: center; width: 100%; display: block; word-spacing: 3px; } .bto{ font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #fff; z-index: 999; position:absolute; font-size: 12px; text-align: center; width: 210px; background-color: #902d2f; opacity: 0.9; display: block; margin-top:-33px; margin-left:1px; } .ft{ font-size: 11px; } .play{ position:absolute; background: url(../images/play.png) no-repeat; width: 32px; height: 31px; margin-left: 95px; margin-top: -80px; } .conteudo_videos{ background: url("../img/gallery_bg.jpg") repeat-y scroll center center #F6F5F8; height: 100%; left: 0; position: relative; top: 0; width: 100%; z-index: 9; } .espaco{ margin-top:60px; } .portfolio2 li { float: left; margin-right: 20px; margin-bottom: 2em; border: 1px solid #ccc; -moz-box-shadow: 0 5px 5px -3px #222; -webkit-box-shadow: 0 5px 5px -3px #222; box-shadow: 0 5px 5px -3px #222; } .portfolio2 li:nth-child(4n) { margin-right: 0; } .portfolio2 a { display: block; border: 3px solid #fff; text-decoration: none; } .portfolio2 img { width: 210px; height: 130px; display: block; border: 1px solid #ccc; } .portfolio_conteudo_cinza li { float: left; margin-right: 20px; margin-bottom: 80px; } .portfolio_conteudo_cinza li:nth-child(4n) { margin-right: 0; } .portfolio_conteudo_cinza a { display: block; border: 0px solid #fff; text-decoration: none; } .portfolio_conteudo_cinza img { width: 210px; height: 130px; display: block; border: 1px solid #ccc; } .bto2{ font-family: 'Source Sans Pro', Arial, "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #666; z-index: 999; position:absolute; font-size: 12px; text-align: left; width: 210px; display: block; margin-top:0px; margin-left:1px; } .txt2{ font-family: 'Source Sans Pro', Arial, "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #ff6600; z-index: 999; position:absolute; font-size: 14px; text-align: left; width: 210px; display: block; font-weight:400; margin-left:1px; margin-top:15px; } .btplay { } .titulohome { float:left; margin-left: 5%; margin-top: 35%; position: absolute; } /*-------------------------------------------------- CONTATO ---------------------------------------------------*/ .google-map { height: 267px; width: 100%; } .gm { margin-top:-120px; } .contact-success { padding: 5%; margin-top: -23px; overflow: hidden; margin-bottom: 10px; margin-left: 10px; float:left; } .contact-success { margin-left: 0px; margin-top: 5px; font-weight: bold; color: #cc0000; font-size: 14px; font-family: 'Source Sans Pro', Arial, "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; float:left; } .form ul { margin: 0; padding: 0; list-style-type: none; } .form li { position: relative; } .form input, .form textarea { width: 90%; margin-bottom: 12px; position: relative; } .form textarea { width: 90%; height: 155px; } .form input.submit { width: 75px; margin-right: 30px; } .form li p, .form input.submit { margin-bottom: 0; } .form em { color:#cc0000; display: inline; font-size: 11px; font-style: normal; font-weight: bold; } .form .contact-error { color: #cc0000; font-size: 12px; font-family: 'Source Sans Pro', Arial, "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; position: absolute; top: 5px; right:40px; } .contact-info { list-style-type: none; padding: 0; margin: 0; } .socio { float: right; margin-right: 60px; margin-top: 33px; } .mapa-mundo{ width:100%; width:970px; height:476px; background:url(../img/mapa-mundo.png) no-repeat center 0; position:relative; overflow: hidden; margin: 0 auto; } /* #viajamos-o-mundo.animado .mapa-mundo { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); -webkit-transition: all 750ms ease; -moz-transition: all 750ms ease; -ms-transition: all 750ms ease; -o-transition: all 750ms ease; transition: all 750ms ease; }*/ /*#viajamos-o-mundo .mapa-mundo a:nth-child(odd) { -webkit-transform: translateY(-500px); -moz-transform: translateY(-500px); -ms-transform: translateY(-500px); -o-transform: translateY(-500px); transform: translateY(-500px); } #viajamos-o-mundo .mapa-mundo a:nth-child(even) { -webkit-transform: translateY(1000px); -moz-transform: translateY(1000px); -ms-transform: translateY(1000px); -o-transform: translateY(1000px); transform: translateY(1000px); } #viajamos-o-mundo.animado .mapa-mundo a { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); -webkit-transition: all 750ms ease 1s; -moz-transition: all 750ms ease 1s; -ms-transition: all 750ms ease 1s; -o-transition: all 750ms ease 1s; transition: all 750ms ease 1s; } */ .icone-mapa { width:20px; height:27px; display:block; background:url("../img/icone-mapa.png"); position:absolute; z-index: 10; } /*Frana*/ .icon-1 { left: 455px; top: 180px; display: none; } /*Bergen*/ .icon-2 { left: 460px; top: 140px; } /*Cuba*/ .icon-3{ left: 235px; top: 265px; z-index:99; } /*Italia*/ .icon-4{ left: 490px; top: 210px; z-index:99; } /*Madrid*/ .icon-5{ left: 435px; top: 205px; z-index:99; } /*Frana*/ .icon-6{ left: 450px; top: 180px; z-index:999; } /*Miami*/ .icon-7{ left: 225px; top: 245px; z-index:99; } /*New Orleans*/ .icon-8{ left: 200px; top: 237px; z-index:99; } /*Budapeste*/ .icon-9{ left:490px; top: 185px; z-index:99; } /*Punta Cana*/ .icon-10{ left: 257px; top: 270px; } /*Turquia*/ .icon-11{ left: 530px; top: 210px; } /*Dubai*/ .icon-12{ left: 588px; top: 255px; } /*Santiago e Atacama*/ .icon-13{ left: 250px; top: 425px; } /*Philadelfia*/ .icon-14{ left: 250px; top: 200px; } /*Montreal*/ .icon-15{ left: 260px; top: 180px; } /*Cidade do Mexico*/ .icon-16{ left: 176px; top: 268px; z-index:999; } /*San Francisco*/ .icon-17{ left: 111px; top:208px; z-index:999; } /*Los Angeles*/ .icon-18{ left: 126px; top:230px; z-index:999; } /*Marrocos*/ .icon-19{ left: 425px; top: 240px; } /*New York*/ .icon-20{ left: 270px; top: 190px; } /*Manaus*/ .icon-21{ left: 272px; top: 330px; } /*Rio de Janeiro*/ .icon-22{ left: 322px; top: 385px; } /*Porto Seguro*/ .icon-23{ left: 336px; top: 361px; } /*Santa Catarina*/ .icon-24{ left: 306px; top: 401px; } /*Kuala Lumpur Malsia */ .icon-25{ left: 714px; top: 303px; } /*Penang, Malsia */ .icon-26{ left: 806px; top: 601px; } /*Bangkok, Tailndia */ .icon-27{ left: 715px; top: 283px; } /*Ho Chi Minh, Vietn */ .icon-28{ left: 730px; top: 290px; } /*Hong Kong*/ .icon-29{ left: 748px; top: 258px; } /*Singapura*/ .icon-30{ left: 725px; top: 315px; } /*Chiang Mai, Tailndia*/ .icon-31{ left: 708px; top: 268px; } .balao { background:#696d71; font-size:11px; color:#FFF; font-family:Arial, Helvetica, sans-serif; padding:3px 2px; width:100px; position:absolute; left:30px; text-align:center; border-radius:5px; z-index:10; display:none; } .titulo_home{ margin-right:0px; margin-bottom:0px; width:521px; height: 56px; } @font-face { font-family: 'chunkfive_exregular'; src: url('../fonts/chunkfive/chunkfive_ex-webfont.eot'); src: url('../fonts/chunkfive/chunkfive_ex-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/chunkfive/chunkfive_ex-webfont.woff') format('woff'), url('../fonts/chunkfive/chunkfive_ex-webfont.ttf') format('truetype'), url('../fonts/chunkfive/chunkfive_ex-webfont.svg#chunkfive_exregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'intro_lightregular'; src: url('../fonts/intro/intro_light-webfont.eot'); src: url('../fonts/intro/intro_light-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/intro/intro_light-webfont.woff') format('woff'), url('../fonts/intro/intro_light-webfont.ttf') format('truetype'), url('../fonts/intro/intro_light-webfont.svg#intro_lightregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'intro_regularregular'; src: url('../fonts/intro2/intro_regular-webfont.eot'); src: url('../fonts/intro2/intro_regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/intro2/intro_regular-webfont.woff') format('woff'), url('../fonts/intro2/intro_regular-webfont.ttf') format('truetype'), url('../fonts/intro2/intro_regular-webfont.svg#intro_regularregular') format('svg'); font-weight: normal; font-style: normal; } .titulo1{ position: relative; float: right; color: #fff; font-family:'intro_regularregular','Source Sans Pro', Arial, Helvetica, sans-serif; text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; font-size:30px; width:500px; top:90%; right: 3%; font-weight:bold; text-align: right; } .titulo2{ position: relative; float: right; color: #fff; font-family:'intro_regularregular','Source Sans Pro', Arial, Helvetica, sans-serif; text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; font-size:30px; width:500px; top:85%; right: 3%; font-weight:bold; text-align: right; } .aereas{ color: #E6612C; } .drone{ text-align:left; width:100%; margin-bottom:20px; } .drone_imagem{ } .drone_texto{ margin-top:85px; margin-left:-80px; } .drone_cor { color: #AC2325; font-size: 24px; text-decoration: none; } .drone_link { color: #AC2325; font-size: 16px; text-decoration: underline; }