/*=================================Template Name : Paul Lapkin - Portfolio TemplateTemplate URI:Description: An Awesome Portfolio TemplateAuthor : MehediAuthor URI : webmasum.xyzSupport: engineermasum64@gmail.comVersoion: 1.0=====================================*//*==================================CSS INDEX=========1.COMMON CSS 2.Hero 3.ABOUT 4.PROCESS 5.EXPERIENCE 6.PORTFOLIO 7.TESTMONEL 8.CONTUCT=====================================*//*==================================1.COMMON CSS=====================================*/@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');*{margin: 0; padding: 0; box-sizing: border-box;}html,body{background-color: #fff; color: #000; font-family: "Roboto", sans-serif; font-weight: 400; font-size: 10px; text-rendering: optimizeLegibility; line-height: 1.2;}a,a:hover{text-decoration: none; color: #fff;}p{margin-top: 0;}ul{margin: 0; padding: 0;}h1, h2, h3, h4{font-family: "Raleway", sans-serif; margin-top: 0; font-weight: bold;}h1{font-weight: 700; font-size: 650%; text-transform: uppercase; letter-spacing: 3px; color: #fff; margin: 0; padding: 0; display: inline-block;}h2{font-size: 400%; color: #000;}h3{font-size: 400%; color: #fff; margin-bottom: 45px;}h4{font-size: 160%;}ul li{list-style: none;}/*REUSUABL COMPNENETS*/.row{max-width: 1180px; margin: auto;}section,#about{padding: 120px 0;}.btn:link,.btn:visited,.btn{width: 203px; background: #ff2b4a; color: #fff; display: inline-block; text-align: center; font-size: 160%; padding: 10px 0; border: 2px solid #ff2b4a; transition: .5s; cursor: pointer;}.btn:hover,.btn:active{background: transparent; color: #ff2b4a;}.section-title{text-align: center; margin-bottom: 60px;}.section-title p{font-size: 16px; color: #6f6f6f; margin-top: 20px;}/*==================================2.HERO=====================================*/#hero{height: 100vh; background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(img/hero.jpg) no-repeat center / cover;}.logo{float: left; height: 45px; margin-top: 45px;}.nav-icon{color: #fff; float: right; margin-top: 45px;}.nav-icon ion-icon{font-size: 400%; border: 1px solid #fff;}nav.uk-sticky-fixed{background: rgba(0, 0, 0, 0.3);}nav.uk-sticky-fixed .logo,nav.uk-sticky-fixed .nav-icon{margin: 25px 0;}.hero-text-box{width: 1180px; margin: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center;}h1::before{content: ''; display: block; height: 2px; width: 100%; background: #fff;}h1::after{content: ''; display: block; height: 2px; width: 100%; background: #fff;}.hero-text-box span{font-size: 230%; color: #fff; margin-top: 15px; display: inline-block;}.scroll-down{position: absolute; left: 0; right: 0; bottom: 60px; margin: auto; width: 40px;}.scroll-down a ion-icon{font-size: 400%; color: #ff2b4a; position: relative; -webkit-animation: 1s arrow infinite ease; animation: 1s arrow infinite ease;}@-webkit-keyframes arrow{0%{top: 10px;}50%{top: 30px;}100%{top: 10px;}}@keyframes arrow{0%{top: 10px;}50%{top: 30px;}100%{top: 10px;}}/* HAMBURGER MENU*/.menu-container{width: 100%; height: 0; background: rgba(0, 0, 0, 0.95); z-index: 9999; position: fixed; top: 0; left: 0; overflow: hidden;}.close-btn ion-icon{position:absolute; top: 45px; right: 85px; color: #fff; font-size: 400%; border: 1px solid #fff;}.close-btn:hover ion-icon{cursor: pointer;}.menu-item{text-align: center; position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%);}.menu-item ul li{margin: 15px 0;}.menu-item ul li a{color: #fff; font-size: 300%; text-transform: uppercase; transition: .3s; display: block;}.menu-item ul li a:hover{color: #ff2b4a; font-size: 320%;}/*==================================3.ABOUT=====================================*/.grid-about-container{display: grid; grid-template-columns: 1fr 1fr; grid-gap: 60px;}.paul{width: 100%; -webkit-clip-path: polygon(0% 20%, 60% 20%, 60% 0%, 100% 50%, 60% 100%, 60% 80%, 0% 80%); clip-path: polygon(0% 20%, 60% 20%, 60% 0%, 100% 50%, 60% 100%, 60% 80%, 0% 80%);}.intro{font-size: 180%; color: #222; font-weight: 700;}.description{font-size: 160%; color: #222; margin: 30px 0; width: 90%;}/*==================================4.PROCESS=====================================*/#process{background:#f6f6f6;}.grid-process-container{display: grid; grid-template-columns:repeat(4, 1fr); grid-gap: 10px; color: #fff; text-align: center;}.grid-process-items{padding: 80px 0;}.grid-process-items:nth-child(1){background:#10c6fc;}.grid-process-items:nth-child(2){background:#835aeb;}.grid-process-items:nth-child(3){background:#002453;}.grid-process-items:nth-child(4){background:#ff2b4a;}.grid-process-items ion-icon{font-size: 450%; margin-bottom: 30px;}.grid-process-items h4{text-transform: uppercase; color: #fff;}/*==================================5.EXPERIENCE=====================================*/#experience{background: url(img/working-pogress.jpg) no-repeat center / cover; color: #fff; background-attachment: fixed;}.grid-experience-container{display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 10px;}.grid-experience-items,.grid-education-items{background: rgba(0, 0, 0, 0.8) ; padding: 45px 30px;}.job,.education, h4{font-size: 180%; color: #fff;}.job,.education, span{font-size: 160%; margin: 10px; display: inline-block;}.job,.education, p{font-size: 160%;}#experience hr{border: 0; border-bottom: 1px solid #fff; margin: 30px;}/*==================================6.PROTFOLIO=====================================*/.grid-protfolio-container{display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 10px; grid-auto-rows: minmax(250px, auto);}.grid-protfolio-items img{width: 100%; height: 100%;}.grid-protfolio-items:nth-child(5){grid-column: 1/3; height: 300px;}.uk-position-bottom{font-size: 200%;}.uk-lightbox{background: rgba(0, 0, 0, 0.8);}.protfolio-filter{text-align: center; margin-bottom: 30px;}.protfolio-filter button{border: 1px solid #000; padding: 5px; background: #000; color: #fff; font-size: 160%; margin: 0 5px; margin-bottom: 10px;}.protfolio-filter button:hover{cursor: pointer; background: #ff2b4a; border-color: #ff2b4a;}.protfolio-filter .mixitup-control-active{background: #ff2b4a; border-color: #ff2b4a;}/*==================================7.testimonial=====================================*/#testimonial{background: url(img/testimonial.jpg) no-repeat center top / cover ;}.grid-testimonial-container{display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 10px;}.quote img{height: 35px;}#testimonial p{margin:45px 0; font-size: 160%;}.signature{margin-bottom: 30px;}.signature img{height: 45px;}#testimonial span{font-size: 140%; margin-left: 0;}/*==================================8.CONTACT=====================================*/#contact{background: url(img/contact.jpg) no-repeat center / cover;}.grid-contact-container{display: grid; grid-template-columns: 1fr 1fr; grid-gap: 10px;}.grid-contact-items:nth-child(1){background:rgba(0, 0, 0, 0.8); padding: 45px 30px;}.single-form input[type="text"],.single-form input[type="email"],.single-form textarea{width: 100%; border: 1px solid #fff; background: transparent; color: #fff; font-size: 140%; padding: 10px; margin: 10px 0;}.single-form-btn{text-align: right; margin-top: 30px;}.nested-grid-contact-container{display: grid; grid-template-columns: 1fr; grid-row-gap:10px;}.nested-grid-contact-items{background: rgba(0, 0, 0, 0.8); padding: 45px 30px;}.nested-grid-contact-items p{font-size: 160%; color: #fff;}.single-form-btn{-webkit-animation-duration: 3s; animation-duration: 3s;}/*==================================9.FOOTER=====================================*/footer{background: #222; padding: 60px 0; text-align: center;}.social-icons{margin-bottom: 15px;}.social-icons ul li{display: inline-block;}.social-icons ul li a ion-icon{color: #fff; font-size: 200%; border-right: 1px solid #fff; padding: 0 10px;}.social-icons ul li:hover a ion-icon{color: #ff2b4a;}.copyright{font-size: 120%; color: #fff;}.totop{margin-top: 25px;}.totop .uk-totop{padding: 10px 6px; color: #f5f5f5; transition: .5s; border: 1px solid #f5f5f5;}.totop .uk-totop:hover{background: #fff; color: #000;}