566 lines
29 KiB
HTML
566 lines
29 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ru">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="">
|
|
<meta name="keywords" content="">
|
|
<meta name="format-detection" content="telephone=no">
|
|
<title>Gsap</title>
|
|
<link href="css/main.css" rel="stylesheet">
|
|
<link rel="shortcut icon" href="img/favicon_1.ico" type="image/x-icon">
|
|
<style>
|
|
@keyframes animate-circle {
|
|
from {
|
|
transform: scale(0);
|
|
opacity: 1;
|
|
}
|
|
to {
|
|
transform: scale(1);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
#preloader{
|
|
width: 100%;
|
|
height: 100%;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 999;
|
|
background: #1C1C1C;
|
|
background: linear-gradient(to right, rgba(36, 31, 31, 1) 0%, rgba(36, 31, 31, 1) 32%, rgba(74, 71, 70, 1) 100%);
|
|
}
|
|
.loader {
|
|
position: fixed;
|
|
top: 50%;
|
|
left: 50%;
|
|
height: 10rem;
|
|
width: 10rem;
|
|
transform: translateX(-50%) translateY(-50%);
|
|
}
|
|
.loader > .circle {
|
|
position: absolute;
|
|
height: inherit;
|
|
width: inherit;
|
|
background: #B66449;
|
|
border-radius: 0;
|
|
animation: animate-circle 2s cubic-bezier(.9, .24, .62, .79) infinite;
|
|
}
|
|
.loader > .circle:nth-of-type(1) {
|
|
animation-delay: 0s;
|
|
}
|
|
.loader > .circle:nth-of-type(2) {
|
|
animation-delay: calc(2s / -3);
|
|
}
|
|
.loader > .circle:nth-of-type(3) {
|
|
animation-delay: calc(2s / -6);
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="preloader">
|
|
<div class="loader">
|
|
<div class="circle"></div>
|
|
<div class="circle"></div>
|
|
<div class="circle"></div>
|
|
</div>
|
|
</div>
|
|
<main class="main main--home" style="opacity:0">
|
|
<canvas class="noise" id="noise"></canvas>
|
|
<div class="header">
|
|
<div class="header__left">
|
|
<div class="header__letter">P</div>
|
|
<div class="header__socials"><a href="" target="_blank">
|
|
<svg>
|
|
<use xlink:href="./svg/sprite.svg#fb"></use>
|
|
</svg></a><a href="" target="_blank">
|
|
<svg>
|
|
<use xlink:href="./svg/sprite.svg#tw"></use>
|
|
</svg></a><a href="" target="_blank">
|
|
<svg>
|
|
<use xlink:href="./svg/sprite.svg#in"></use>
|
|
</svg></a></div>
|
|
</div>
|
|
<div class="header__right">
|
|
<ul class="header__menu">
|
|
<li class="active"><a class="js-scroll-link" href="javascript:;" data-link="0">HOME</a></li>
|
|
<li><a class="js-scroll-link" href="javascript:;" data-link="1">Projects</a></li>
|
|
<li><a class="js-scroll-link" href="javascript:;" data-link="2">awwards</a></li>
|
|
<li><a class="js-scroll-link" href="javascript:;" data-link="3">testimonials</a></li>
|
|
<li><a class="js-scroll-link" href="javascript:;" data-link="4">experience</a></li>
|
|
<li><a class="js-scroll-link" href="javascript:;" data-link="5">blog</a></li>
|
|
<li><a class="js-scroll-link" href="javascript:;" data-link="6">CONTACT</a></li>
|
|
</ul>
|
|
<div class="header__phone"><a href="tel:+23155908368">+2(315) 590 83 68</a></div>
|
|
</div>
|
|
</div>
|
|
<div class="scroll">
|
|
<div class="home-page">
|
|
<div class="page-title show">
|
|
<ul>
|
|
<li>
|
|
<div class="title">my name is robert</div>
|
|
<div class="number">1.0</div>
|
|
</li>
|
|
<li>
|
|
<div class="title">Portfolio</div>
|
|
<div class="number">2.0</div>
|
|
</li>
|
|
<li>
|
|
<div class="title">my awwards</div>
|
|
<div class="number">3.0</div>
|
|
</li>
|
|
<li>
|
|
<div class="title">testimonials</div>
|
|
<div class="number">4.0</div>
|
|
</li>
|
|
<li>
|
|
<div class="title">working experience</div>
|
|
<div class="number">5.0</div>
|
|
</li>
|
|
<li>
|
|
<div class="title">from the blog</div>
|
|
<div class="number">5.0</div>
|
|
</li>
|
|
<li>
|
|
<div class="title">contact</div>
|
|
<div class="number">6.0</div>
|
|
</li>
|
|
</ul>
|
|
<canvas class="noise noise--inner" id="noise_menu"></canvas>
|
|
</div>
|
|
<div class="scrollable">
|
|
<section class="home">
|
|
<div class="sticky-title">
|
|
<ul>
|
|
<li>
|
|
<div>my name is robert</div>
|
|
<div>1.0</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="content">
|
|
<div class="content__left">
|
|
<div class="content__title">
|
|
<div class="h1">GET YOUR</div>
|
|
<div class="h1">GREAT</div>
|
|
<div class="h1">Design</div>
|
|
</div>
|
|
<div class="content__description">
|
|
<div class="small">Hello, my name is Pattison and i am UX/UI designer and front-end developer, im working via developer 9 years and i know all about design</div>
|
|
</div>
|
|
<div class="content__btn-block">
|
|
<div class="content__btn-label small">(hire me :)</div><a class="content__btn-btn btn btn--arrow js-scroll-link" href="#hireme" data-link="6">
|
|
<svg>
|
|
<use xlink:href="./svg/sprite.svg#arrow"></use>
|
|
</svg></a>
|
|
</div>
|
|
<div class="home__numbers">
|
|
<div class="home__number">
|
|
<div class="home__number-digital" data-number="8">8</div>
|
|
<div class="home__number-text small">Years <br>experience</div>
|
|
</div>
|
|
<div class="home__number">
|
|
<div class="home__number-digital" data-number="5">5</div>
|
|
<div class="home__number-text small">Themeforest <br>awwards</div>
|
|
</div>
|
|
<div class="home__number">
|
|
<div class="home__number-digital" data-number="60">60</div>
|
|
<div class="home__number-text small">Projects <br>Done</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="content__right">
|
|
<div class="home__circles">
|
|
<div class="home__circles-lines"></div>
|
|
<div class="home__circle home__circle--left"><img class="home__circle-img" src="img/image-1.jpg" alt=""></div>
|
|
<div class="home__circle home__circle--right">
|
|
<div class="home__circle-text">
|
|
<label class="input-file" for="brief"><span>Fill out the <br>brief to find out <br>the cost</span></label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="scrollable">
|
|
<section class="projects">
|
|
<div class="sticky-title">
|
|
<ul>
|
|
<li>
|
|
<div>Portfolio</div>
|
|
<div>2.0</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="content">
|
|
<div class="content__left">
|
|
<div class="content__title">
|
|
<div class="h1">projects</div>
|
|
</div>
|
|
<ul class="content__menu projects__menu">
|
|
<li class="active"><a href="javascript:;">BERLING agency website</a></li>
|
|
<li><a href="javascript:;">Prettylittlething american shop</a></li>
|
|
<li><a href="javascript:;">Benhome - Architecture theme</a></li>
|
|
<li><a href="javascript:;">Gilhouse - architecture website</a></li>
|
|
<li><a href="javascript:;">gilber - personal website</a></li>
|
|
<li><a href="javascript:;">jonny - personal website</a></li>
|
|
</ul>
|
|
<div class="content__btn-block">
|
|
<div class="content__btn-label small">View all works</div><a class="content__btn-btn btn btn--arrow" href="https://www.behance.net/" target="_blank" rel="nofollow">
|
|
<svg>
|
|
<use xlink:href="./svg/sprite.svg#arrow"></use>
|
|
</svg></a>
|
|
</div>
|
|
</div>
|
|
<div class="content__right">
|
|
<div class="projects__blocks">
|
|
<div class="projects__block active"><a href="#" target="_blank" rel="nofollow"><img src="img/project-1.jpg" alt=""></a></div>
|
|
<div class="projects__block active"><a href="#" target="_blank" rel="nofollow"><img src="img/project-2.jpg" alt=""></a></div>
|
|
<div class="projects__block active"><a href="#" target="_blank" rel="nofollow"><img src="img/project-3.jpg" alt=""></a></div>
|
|
<div class="projects__block active"><a href="#" target="_blank" rel="nofollow"><img src="img/project-4.jpg" alt=""></a></div>
|
|
<div class="projects__block active"><a href="#" target="_blank" rel="nofollow"><img src="img/project-5.jpg" alt=""></a></div>
|
|
<div class="projects__block active"><a href="#" target="_blank" rel="nofollow"><img src="img/project-6.jpg" alt=""></a></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="scrollable">
|
|
<section class="awards">
|
|
<div class="sticky-title">
|
|
<ul>
|
|
<li>
|
|
<div>my awwards</div>
|
|
<div>3.0</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="content">
|
|
<div class="content__left">
|
|
<div class="content__title">
|
|
<div class="h1">Explore my</div>
|
|
<div class="h1">profile</div>
|
|
</div>
|
|
<div class="content__description">
|
|
<div class="small">Hello, my name is Pavel Suslov and i am UX/UI designer and front-end developer, im working via developer 9 years and i know all about design</div>
|
|
</div>
|
|
<div class="content__btn-block">
|
|
<div class="content__btn-label small">View behance</div><a class="content__btn-btn btn btn--arrow" href="#">
|
|
<svg>
|
|
<use xlink:href="./svg/sprite.svg#arrow"></use>
|
|
</svg></a>
|
|
</div>
|
|
</div>
|
|
<div class="content__right">
|
|
<div class="content__subtitle">Professional <span>awards</span></div>
|
|
<div class="content__awards awards__list">
|
|
<div class="content__award">
|
|
<div class="content__award-img"><img src="img/award-1.png" alt=""></div>
|
|
<div class="content__award-title">
|
|
<p>1ST WINNER CREATIVE DESIGN CHAMPIONSHIP</p>
|
|
</div>
|
|
<div class="content__award-text small">For most favorited design voted by NY City Style customers</div>
|
|
</div>
|
|
<div class="content__award">
|
|
<div class="content__award-img"><img src="img/award-2.png" alt=""></div>
|
|
<div class="content__award-title">
|
|
<p>BEST 5 BRANDING PROJECT OF NOMINATIONS</p>
|
|
</div>
|
|
<div class="content__award-text small">For best creative & usable health care mobile app design</div>
|
|
</div>
|
|
<div class="content__award">
|
|
<div class="content__award-img"><img src="img/award-3.png" alt=""></div>
|
|
<div class="content__award-title">
|
|
<p>8 Years of Membership</p>
|
|
</div>
|
|
<div class="content__award-text small">Has been part of the Envato Community for over 8 years</div>
|
|
</div>
|
|
<div class="content__award">
|
|
<div class="content__award-img"><img src="img/award-4.png" alt=""></div>
|
|
<div class="content__award-title">
|
|
<p>Exclusive Author</p>
|
|
</div>
|
|
<div class="content__award-text small">Sells items exclusively on Envato Market</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="scrollable">
|
|
<section class="testimonials">
|
|
<div class="sticky-title">
|
|
<ul>
|
|
<li>
|
|
<div>testimonials</div>
|
|
<div>4.0</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="content" style="background-image: url(images/testmonials-bg.png); background-size: auto 100%; background-repeat: no-repeat; background-position: center center;">
|
|
<div class="content__left">
|
|
<div class="content__title">
|
|
<div class="h1">+250</div>
|
|
<div class="h1">happy</div>
|
|
<div class="h1">clients</div>
|
|
<div class="small">I love my work and every project is my pride</div>
|
|
</div>
|
|
<div class="testimonials__clients">
|
|
<div class="testimonials__client"><img src="img/client-1.png" alt=""></div>
|
|
<div class="testimonials__client"><img src="img/client-2.png" alt=""></div>
|
|
<div class="testimonials__client"><img src="img/client-3.png" alt=""></div>
|
|
<div class="testimonials__client"><img src="img/client-4.png" alt=""></div>
|
|
</div>
|
|
</div>
|
|
<div class="content__right">
|
|
<div class="content__subtitle"><span>Creative</span> & dedicated is things that my studio brings for your business</div>
|
|
<div class="content__slider slides testimonials__slider">
|
|
<div class="slides__container">
|
|
<div class="slides__inner">
|
|
<div class="slide">
|
|
<div class="content__slider-text small">“ If you are seeking an Interior designer that will understand exactly your needs, and someone who will utilise their creative and technical skills in parity with your taste, then Suzanne at The Bauhaus Studio is perfect.</div>
|
|
<div class="content__slider-name">david & elisa</div>
|
|
<div class="content__slider-staff small">Apartment view lake at Brooklyn</div>
|
|
</div>
|
|
<div class="slide">
|
|
<div class="content__slider-text small">“ If you are seeking an Interior designer that will understand exactly your needs, and someone who will utilise their creative and technical skills in parity with your taste, then Suzanne at The Bauhaus Studio is perfect.</div>
|
|
<div class="content__slider-name">elisa</div>
|
|
<div class="content__slider-staff small">Apartment view lake at Brooklyn</div>
|
|
</div>
|
|
<div class="slide">
|
|
<div class="content__slider-text small">“ If you are seeking an Interior designer that will understand exactly your needs, and someone who will utilise their creative and technical skills in parity with your taste, then Suzanne at The Bauhaus Studio is perfect.</div>
|
|
<div class="content__slider-name">david & elisa</div>
|
|
<div class="content__slider-staff small">Apartment view lake at Brooklyn</div>
|
|
</div>
|
|
<div class="slide">
|
|
<div class="content__slider-text small">“ If you are seeking an Interior designer that will understand exactly your needs, and someone who will utilise their creative and technical skills in parity with your taste, then Suzanne at The Bauhaus Studio is perfect.</div>
|
|
<div class="content__slider-name">david</div>
|
|
<div class="content__slider-staff small">Apartment view lake at Brooklyn</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="slides__controls">
|
|
<button class="slides__btn slides__btn--prev btn btn--invert btn--arrow" id="prevButton">
|
|
<svg>
|
|
<use xlink:href="./svg/sprite.svg#arrow"></use>
|
|
</svg>
|
|
</button>
|
|
<button class="slides__btn slides__btn--next btn btn--arrow" id="nextButton">
|
|
<svg>
|
|
<use xlink:href="./svg/sprite.svg#arrow"></use>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="scrollable">
|
|
<section class="experience">
|
|
<div class="sticky-title">
|
|
<ul>
|
|
<li>
|
|
<div>working experience</div>
|
|
<div>5.0</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="content">
|
|
<div class="content__bg" style="background-image: url(images/exp-bg.jpg);"></div>
|
|
<div class="content__left">
|
|
<div class="content__title">
|
|
<div class="h1">Education &</div>
|
|
<div class="h1">experience</div>
|
|
</div>
|
|
<div class="content__description">
|
|
<div class="small">I have been developing sites for 8 years and I know for sure the main trends and directions of modern design, you will get a decent result</div>
|
|
</div>
|
|
<div class="content__btn-block"><a class="content__btn-btn btn" href="#">resume</a></div>
|
|
</div>
|
|
<div class="content__right">
|
|
<div class="content__awards experience__list">
|
|
<div class="content__award">
|
|
<div class="content__award-img"><img src="img/soc-fb.svg" alt=""></div>
|
|
<div class="content__award-title"><span class="small">2019-2021</span>
|
|
<p>facebook</p>
|
|
</div>
|
|
<div class="content__award-text small">Assertively exploit wireless initiatives rather than synergistic core competencies.</div>
|
|
</div>
|
|
<div class="content__award">
|
|
<div class="content__award-img"><img src="img/soc-be.svg" alt=""></div>
|
|
<div class="content__award-title"><span class="small">2017-2019</span>
|
|
<p>behance</p>
|
|
</div>
|
|
<div class="content__award-text small">im working via developer 9 years and i know all about design</div>
|
|
</div>
|
|
<div class="content__award">
|
|
<div class="content__award-img"><img src="img/soc-tw.svg" alt=""></div>
|
|
<div class="content__award-title"><span class="small">2014-2017</span>
|
|
<p>twitter</p>
|
|
</div>
|
|
<div class="content__award-text small">Credibly streamline mission-critical value with multifunctional functionalities. Leading team designers.</div>
|
|
</div>
|
|
<div class="content__award">
|
|
<div class="content__award-img"><img src="img/soc-inst.svg" alt=""></div>
|
|
<div class="content__award-title"><span class="small">2012-2014</span>
|
|
<p>instagramm</p>
|
|
</div>
|
|
<div class="content__award-text small">Proven ability to lead and manage a wide variety of design and development projects in team and independent situations.</div>
|
|
</div>
|
|
<div class="content__award">
|
|
<div class="content__award-img"><img src="img/soc-in.svg" alt=""></div>
|
|
<div class="content__award-title"><span class="small">206-2012</span>
|
|
<p>linkedin</p>
|
|
</div>
|
|
<div class="content__award-text small">Assertively exploit wireless initiatives rather than synergistic core competencies.</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="scrollable">
|
|
<section class="news">
|
|
<div class="sticky-title">
|
|
<ul>
|
|
<li>
|
|
<div>from the blog</div>
|
|
<div>5.0</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="content">
|
|
<div class="content__left">
|
|
<div class="content__title">
|
|
<div class="h1">latest</div>
|
|
<div class="h1">news</div>
|
|
<div class="small">I love my work and every project is my pride</div>
|
|
</div>
|
|
<ul class="content__menu news__menu">
|
|
<li class="active"><a href="javascript:;">How to design well?</a></li>
|
|
<li><a href="javascript:;">Lemon Illustration design</a></li>
|
|
<li><a href="javascript:;">Paul theme Branding</a></li>
|
|
<li><a href="javascript:;">Best typography 2020</a></li>
|
|
<li><a href="javascript:;">my name is pattison</a></li>
|
|
</ul>
|
|
<div class="content__btn-block">
|
|
<div class="content__btn-label small">View all works</div><a class="content__btn-btn btn btn--arrow" href="blog.html" target="_blank">
|
|
<svg>
|
|
<use xlink:href="./svg/sprite.svg#arrow"></use>
|
|
</svg></a>
|
|
</div>
|
|
</div>
|
|
<div class="content__right">
|
|
<div class="news__blocks">
|
|
<div class="news__block active">
|
|
<div class="news__block-info">
|
|
<div class="news__block-date small">3th January, 2020</div>
|
|
<div class="news__block-text small">Berling ® — minimalism photography agency website. with the help of a minimalistic design, the site turned out to be very user-friendly and responsive, and the brand became more.</div>
|
|
<div class="news__block-number">(01)</div>
|
|
</div>
|
|
<div class="news__block-image"><a href="blog.html" target="_blank"><img src="img/news-1.jpg" alt=""></a></div>
|
|
</div>
|
|
<div class="news__block active">
|
|
<div class="news__block-info">
|
|
<div class="news__block-date small">3th January, 2020</div>
|
|
<div class="news__block-text small">Berling ® — minimalism photography agency website. with the help of a minimalistic design, the site turned out to be very user-friendly and responsive, and the brand became more.</div>
|
|
<div class="news__block-number">(02)</div>
|
|
</div>
|
|
<div class="news__block-image"><a href="blog.html" target="_blank"><img src="img/news-2.jpg" alt=""></a></div>
|
|
</div>
|
|
<div class="news__block active">
|
|
<div class="news__block-info">
|
|
<div class="news__block-date small">3th January, 2020</div>
|
|
<div class="news__block-text small">Berling ® — minimalism photography agency website. with the help of a minimalistic design, the site turned out to be very user-friendly and responsive, and the brand became more.</div>
|
|
<div class="news__block-number">(03)</div>
|
|
</div>
|
|
<div class="news__block-image"><a href="blog.html" target="_blank"><img src="img/news-3.jpg" alt=""></a></div>
|
|
</div>
|
|
<div class="news__block active">
|
|
<div class="news__block-info">
|
|
<div class="news__block-date small">3th January, 2020</div>
|
|
<div class="news__block-text small">Berling ® — minimalism photography agency website. with the help of a minimalistic design, the site turned out to be very user-friendly and responsive, and the brand became more.</div>
|
|
<div class="news__block-number">(04)</div>
|
|
</div>
|
|
<div class="news__block-image"><a href="blog.html" target="_blank"><img src="img/news-4.jpg" alt=""></a></div>
|
|
</div>
|
|
<div class="news__block active">
|
|
<div class="news__block-info">
|
|
<div class="news__block-date small">3th January, 2020</div>
|
|
<div class="news__block-text small">Berling ® — minimalism photography agency website. with the help of a minimalistic design, the site turned out to be very user-friendly and responsive, and the brand became more.</div>
|
|
<div class="news__block-number">(05)</div>
|
|
</div>
|
|
<div class="news__block-image"><a href="blog.html" target="_blank"><img src="img/news-5.jpg" alt=""></a></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="scrollable" id="hireme">
|
|
<section class="contacts">
|
|
<div class="sticky-title">
|
|
<ul>
|
|
<li>
|
|
<div>contact</div>
|
|
<div>6.0</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="content">
|
|
<div class="content__left">
|
|
<div class="content__title">
|
|
<div class="h1">Hire me</div>
|
|
<div class="small">Enjoy coffe with me</div>
|
|
</div>
|
|
<ul class="content__menu contacts__menu">
|
|
<li class="active"><a class="noicon" href="javascript:;" onclick="window.open('mailto:robert@info.com')">mail: robert@info.com</a></li>
|
|
<li class="active"><a class="noicon" href="javascript:;" onclick="window.open('skype:robert')">skype: robert</a></li>
|
|
<li class="active"><a href="https://behance.net/Paulggooo" target="_blank">www.behance.net/Paulggooo</a></li>
|
|
<li class="active"><a class="noicon" href="https://t.me/robert_inc" target="_blank">telegram: robert_inc</a></li>
|
|
</ul>
|
|
<div class="contacts__copyright small">© Pattison 2021. All Rights Resevered</div>
|
|
</div>
|
|
<div class="content__right">
|
|
<div class="content__subtitle">Let's grab a coffee and jump on <span>conversation</span> chat with me.</div>
|
|
<form class="content__contacts contacts__form js-contact-form" method="post">
|
|
<div class="content__brief">
|
|
<div class="content__brief-title">
|
|
<label class="input-file">
|
|
<input type="file" name="file" id="brief"><span>send a brief</span>
|
|
</label>
|
|
</div>
|
|
<div class="content__brief-text small">I recommend filling out a brief to assess the cost of the project. <label for="brief">Brief</label></div>
|
|
</div>
|
|
<div class="content__form">
|
|
<label class="content__form-input">
|
|
<input type="text" name="name"><span class="content__form-placeholder">name</span>
|
|
</label>
|
|
<label class="content__form-input">
|
|
<input type="email" name="emal" required=""><span class="content__form-placeholder">EMAIL *</span>
|
|
</label>
|
|
<label class="content__form-input">
|
|
<input type="text" name="msg" required="" minlength="10"><span class="content__form-placeholder">MESSAGE *</span>
|
|
</label>
|
|
<div class="content__form-btn">
|
|
<button class="btn btn--arrow" type="submit">
|
|
<svg>
|
|
<use xlink:href="./svg/sprite.svg#arrow"></use>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
<script src="js/main.js"></script>
|
|
</body>
|
|
</html> |