Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- body{
- margin: 0;
- }
- .navbar{
- display: flex;
- width: 100%;
- height: 118px;
- justify-content: space-around;
- position: fixed;
- top: 0;
- }
- .navbar img{
- display: flex;
- height: 76px;
- padding-left: 96px;
- padding-top: 18px;
- }
- .navbar .menu{
- display: flex;
- float: right;
- flex-direction: row;
- text-decoration: none;
- padding-right: 35px;
- list-style: none;
- color: #ffffff;
- padding-top: 30px;
- }
- #teste{
- width: 100vw;
- height:1500px;
- background: #FFAA2A;
- align-items: center;
- justify-content: center;
- display: flex;
- }
- #resre2{
- width: 100vw;
- height:1500px;
- background: red;
- align-items: center;
- justify-content: center;
- display: flex;
- }
- .white_navbar{
- height: 75px;
- background: transparent;
- /*animation: navbar 0.2s linear forwards;*/
- transition: all 0.6s ease;
- z-index: 10;
- }
- .white_navbar ul{
- display: flex;
- float: right;
- flex-direction: row;
- text-decoration: none;
- padding-right: 35px;
- list-style: none;
- color: #ffffff;
- padding-top: 21px;
- }
- .white_navbar img{
- display: flex;
- height: 55px;
- padding-left: 96px;
- padding-top: 11px;
- }
- .white_navbar a:visited{
- text-decoration: #FFAA2A;
- }
- .black_navbar{
- height: 75px;
- background: rgba(0,0,0);
- /*animation: navbar 0.2s linear forwards;*/
- transition: all 0.6s ease;
- z-index: 10;
- }
- .black_navbar ul{
- display: flex;
- float: right;
- flex-direction: row;
- text-decoration: none;
- padding-right: 35px;
- list-style: none;
- color: #ffffff;
- padding-top: 21px;
- }
- .black_navbar img{
- display: flex;
- height: 55px;
- padding-left: 96px;
- padding-top: 11px;
- }
- .black_navbar a:visited{
- text-decoration: #FFAA2A;
- }
- .navbar li{
- display: flex;
- text-decoration: none;
- padding-right: 34px;
- font-size: 11px;
- font-family: 'Alegreya Sans';
- font-weight: 800;
- letter-spacing: 1px;
- }
- .navbar a{
- text-decoration: #ffffff;
- color: #ffffff;
- }
- .navbar a:visited{
- text-decoration: #FFAA2A;
- }
- .banner .title{
- display: flex;
- justify-content: center;
- align-items: center;
- margin: 0px;
- padding: 0px;
- font-family: 'Vidaloka';
- font-weight: 400;
- font-size: 50px;
- color: #ffffff;
- }
- .banner .subtitle{
- display: flex;
- padding-bottom: 0px;
- margin-bottom: 0px;
- margin: 0;
- padding-top: 12px;
- font-family: 'Alegreya Sans';
- font-weight: 400;
- font-size: 17px;
- color: #ffffff;
- }
- .banner .watch_video{
- text-decoration: none;
- margin-top: 72px;
- font-family: 'Alegreya Sans', sans-serif;
- font-weight: 900;
- font-size: 12px;
- color: #FFAA2A;
- width: 120px;
- height: 100px;
- justify-content: center;
- align-items: center;
- position: absolute;
- display: flex;
- }
- .banner{
- display: flex;
- height: 100vh;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- background: linear-gradient( rgba(0,0,0,.7),rgba(0,0,0,.7)),url("../../static/img/banner.jpg");
- background-repeat: no-repeat;
- background-size: cover;
- }
- .banner .clip{
- -webkit-clip-path: ellipse(19% 13% at 50% 100%);
- clip-path: ellipse(4% 7% at 50% 100%);
- background:#FFAA2A;
- display: flex;
- width: 100%;
- height: 100%;
- position: absolute;
- }
- .banner .clip_mobile{
- display: none;
- color: #FFAA2A;
- font-size: 30px;
- position: absolute;
- align-items: center;
- width: 100%;
- }
- .banner .video_container{
- display: none;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- position: absolute;
- width: 100%;
- height: 100%;
- }
- .scroll_clip{
- color: #000000;
- align-items: center;
- position: absolute;
- width: 120px;
- height: 100%;
- align-items: flex-end;
- justify-content: center;
- margin-right: 300px;
- display: flex;
- font-family: 'Alegreya Sans';
- font-weight: 900;
- font-size: 11px;
- }
- .play_icon{
- padding-left: 3px;
- }
- .hamburger_menu_icon{
- float: right;
- }
- .hamburger_menu_icon img{
- display: flex;
- float: right;
- display: none;
- height: 32px;
- }
- .menu_hamburger{
- display: none;
- flex-direction: column;
- list-style: none;
- background: #000000;
- width: 100vw;
- height: 100vh;
- z-index: 15;
- }
- .menu_hamburger li{
- text-decoration: #ffffff;
- padding-bottom: 20px;
- }
- /*//////////// MOBILE //////////*/
- @media screen and (max-width: 768px){
- .banner{
- align-items: flex-start;
- }
- .banner .title{
- padding-left: 20px;
- width: 30%;
- justify-content: left;
- }
- .banner .subtitle{
- padding-left: 20px;
- float: left;
- font-size: 15px;
- }
- .banner .watch_video{
- padding-left: 20px;
- float: left;
- padding-top: 130px;
- font-size: 13px;
- }
- .banner .clip{
- display: none;
- }
- .banner .clip_mobile{
- display: flex;
- justify-content: center;
- align-items: flex-end;
- height: 100%;
- }
- .navbar{
- justify-content: space-around;
- padding-left: 15px;
- }
- .navbar .menu{
- display: none;
- }
- .navbar img{
- float: left;
- padding-left: 0;
- }
- .hamburger_menu_icon img{
- display: flex;
- float: right;
- padding-top: 30px;
- padding-left: 160px;
- height: 32px;
- }
- .hamburger_menu_icon{
- float: right;
- padding-right: 30px;
- }
- .menu_hamburger{
- display: flex;
- }
- }
- @media screen and (max-width: 1049px){
- .banner .clip{
- -webkit-clip-path: ellipse(19% 13% at 50% 100%);
- clip-path: ellipse(7% 5% at 50% 100%);
- }
- .navbar li{
- font-size: 10px;
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement