Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- * {
- margin: 0;
- padding: 0;
- font-family: 'Poppins', sans-serif;
- box-sizing: border-box;
- }
- body {
- background: #080808;
- color: white;
- }
- #header {
- width: 100%;
- height: 100vh;
- background-image: url(/about-borislav/images/background.jpg);
- background-size: cover;
- background-position: center;
- }
- .container {
- padding: 10px 10%;
- }
- nav {
- display: flex;
- align-items: center;
- justify-content: space-between;
- flex-wrap: wrap;
- }
- .logo {
- width: 150px;
- }
- nav ul li {
- list-style: none;
- display: inline-block;
- margin: 10px 10px;
- }
- nav ul li a {
- color: white;
- text-decoration: none;
- font-size: 20px;
- position: relative;
- }
- nav ul li a::after {
- content: '';
- width: 0;
- height: 3px;
- left: 0;
- position: absolute;
- background: #ff004f;
- bottom: -5px;
- transition: 0.6s;
- }
- nav ul li a:hover {
- color: #7c0f0f;
- }
- nav ul li a:hover::after {
- width: 100%;
- }
- .info-person {
- margin-top: 20%;
- font-size: 30px;
- }
- .info-person p span {
- background: #193047;
- color: #E4F0F4;
- font-family: "Lato", "Arial", "Helvetica", sans-serif;
- ;
- border: 2px solid #ffefd3;
- border-radius: 12px;
- padding: 2px 5px;
- }
- .info-person h1 {
- font-size: 50px;
- margin-top: 30px;
- }
- .info-person h1 span {
- color: #da1616;
- }
- /* ----------------about Me------------------- */
- .about-person {
- padding: 80px 0;
- color: #f4ecdf;
- }
- .row {
- display: flex;
- flex-wrap: wrap;
- justify-content: space-between;
- }
- .col-1-about {
- flex-basis: 35%;
- }
- .col-1-about img {
- width: 100%;
- border-radius: 20px;
- }
- .col-2-about {
- flex-basis: 60%;
- }
- .col-2-about h1 {
- font-size: 55px;
- font-weight: 400;
- color: #f4ecdf;
- }
- .col-2-about p {
- color: #E4F0F4;
- }
- .educations-tab {
- display: flex;
- margin: 20px 0 40px;
- }
- .links {
- margin-right: 50px;
- font-size: 20px;
- position: relative;
- font-weight: 500;
- cursor: pointer;
- }
- .educations-tab p {
- color: #f4ecdf;
- font-size: 30px;
- }
- .links::after {
- content: '';
- position: absolute;
- left: 0;
- width: 0;
- height: 3px;
- background: #ff004f;
- bottom: -6px;
- transition: 0.5s;
- }
- .links.active::after {
- width: 50%;
- }
- .education-content ul li {
- list-style: none;
- margin: 15px 0;
- font-size: 20px;
- }
- .education-content ul li span {
- color: #9f4040;
- font-weight: 600;
- font-size: 25px;
- }
- body>div.about-person>div>div>div.col-2-about>div.education-content>ul>li:nth-child(4)>span:nth-child(2) {
- color: #e8f809;
- font-size: 25px;
- }
- .education-content {
- display: none;
- }
- .education-content.active-content {
- display: block;
- }
- /* ------------- service-------------- */
- #services {
- padding: 30px 0;
- }
- #services>div>h1 {
- color: #f4ecdf;
- font-size: 40px;
- }
- .services-list {
- display: grid;
- grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
- grid-gap: 40px;
- margin-top: 60px;
- }
- .services-list div{
- background: #414040;
- font-size: 16px;
- border-radius: 15px;
- font-weight: 400;
- padding: 40px;
- transition: backgrond 0.5s, transform 0.5s;
- }
- .services-list div i{
- font-size: 50px;
- margin-bottom: 30px;
- }
- .services-list div h2{
- color:#9f4040;
- font-size: 30px;
- margin-bottom: 20px;
- font-weight: 500;
- }
- .services-list div a{
- display: inline-block;
- font-size: 20px;
- margin-top: 20px;
- color:#f4ecdf;
- text-decoration: none;
- cursor: pointer;
- font-weight: 400;
- }
- .services-list div:hover{
- background: #ff004f;
- transform: translateY(-15px);
- }
- .services-list div a:hover{
- color:#193047
- }
- /* -------------- portfolio--------------- */
- #portfolio{
- padding: 30px 0;
- }
- .workList{
- display: grid;
- grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
- grid-gap: 40px;
- margin-top: 50px;
- }
- .work{
- border-radius: 15px;
- position: relative;
- overflow: hidden;
- }
- .work img{
- width: 100%;
- border-radius: 15px;
- display: block;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement