*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}body{color:#fff;background:#0d3f68;font-family:Franklin Gothic Medium,Arial Narrow,Arial,sans-serif}.containter{padding:10px 10%}.logo{width:210px}.nav{z-index:1000;opacity:.9;background-color:#e3e3e3;outline-style:solid;outline-color:#1870b8;flex-wrap:wrap;justify-content:space-between;align-items:center;width:100%;display:flex;position:fixed;top:0}.nav ul li{margin:10px 20px;list-style:none;display:inline-block}.nav ul li a{color:#1870b8;font-size:18px;font-weight:700;text-decoration:none;position:relative}.nav ul li a:after{content:"";background:#3caadf;width:0;height:3px;transition:all .5s;position:absolute;bottom:-6px;right:50%}.nav ul li a:before{content:"";background:#3caadf;width:0;height:3px;transition:all .5s;position:absolute;bottom:-6px;left:50%}.nav ul li a:hover:after,.nav ul li a:hover:before{width:55%}.headerText{align-self:center;margin-top:13%;margin-left:2%;font-family:Courier New,Courier,monospace;font-size:30px}.headerText h1{text-align:center;margin-top:20px;font-size:60px}.headerText h3{text-align:center;margin-top:15px;font-size:30px}.headerText h3 span{color:#3caadf}#about{color:#ababab;margin:3%;padding:80px 0}.row{flex-wrap:wrap;justify-content:space-between;display:flex}.aboutCol1{flex-basis:30%}.aboutCol1 img{border-radius:15px;width:90%}.aboutCol2{flex-basis:68%}.aboutCol2 p{font-size:20px}.subTitle{color:#e6e5e5;font-size:45px;font-weight:600}.subTitleWork{color:#e6e5e5;text-align:center;font-size:45px;font-weight:600}.tabTitles{margin:20px 0 40px;display:flex}.tabLinks{cursor:pointer;margin-right:55px;font-size:18px;font-weight:500;position:relative}.tabLinks:after{content:"";background:#3caadf;width:0;height:3px;transition:all .2s;position:absolute;bottom:-8px;right:50%}.tabLinks:before{content:"";background:#3caadf;width:0;height:3px;transition:all .2s;position:absolute;bottom:-8px;left:50%}.tabLinks.activeLink:after,.tabLinks.activeLink:before{width:55%}.tabContents ul{padding-inline-start:0}.tabContents ul li{margin:10px 0;font-size:17px;list-style:none}.tabContents ul li ul li{list-style:circle}.tabContents ul li span{color:#3caadf;margin-bottom:2px;font-size:18px}.tabContents{display:none}.tabContents.activeTab{display:block}#portfolio{padding:50px,0;margin:3%}.workList{grid-gap:30px;grid-template-columns:repeat(3,1fr);height:auto;margin-top:50px;display:grid}.work{background-color:#1870b8;border-radius:10px;outline:2px solid #1870b8;position:relative;overflow:auto;scale:95%}.work img{object-fit:cover;width:100%;height:250px;display:block}.tags{grid-column-gap:3%;grid-row-gap:15%;grid-template-columns:auto auto auto;margin-top:5px;display:grid}.EngineTag{text-align:center;background-color:#5a5a92;border-radius:10px;width:auto;text-decoration:none}.CodeTag{text-align:center;background-color:#916458;border-radius:10px;width:auto;text-decoration:none}.RoleTag{text-align:center;background-color:#588f5b;border-radius:10px;width:auto;text-decoration:none}.workDescription{margin:4%}.workDescription h3{margin-bottom:4px;font-size:20px}.workDescription p{min-height:80px;margin-bottom:4px}.description{max-width:800px}.work img{border-radius:10px;width:100%;transition:transform .6s;display:block}.layer{text-align:center;background:linear-gradient(#00000080,#0c65ca);border-radius:10px;flex-direction:column;justify-content:center;align-items:center;width:100%;height:0%;padding:0 40px;font-size:14px;transition:height .45s;display:flex;position:absolute;bottom:0;left:0;overflow:hidden}.layer h3{margin-bottom:20px;font-weight:700}.layer a{color:#3caadf;text-align:center;background:#fff;border-radius:50%;width:35px;height:35px;margin-top:20px;font-size:13px;font-weight:600;line-height:35px;text-decoration:none}.work:hover .layer{height:100%}.btn{color:#fff;border:1px solid #3caadf;border-radius:6px;width:fit-content;margin:50px auto;padding:14px 50px;font-weight:550;text-decoration:none;transition:background .5s;display:block}.btn:hover{background:#3caadf}#contact{margin:3%}.contactLeft{flex-basis:35%}.contactLeft p{margin-top:30px}.contactLeft p i{color:#124dd7;margin-right:15px;font-size:25px}.contactRight{flex-basis:60%}.socialIcons{margin-top:30px}.socialIcons a{color:#ababab;margin-right:15px;font-size:30px;text-decoration:none;transition:transform .5s;display:inline-block}.socialIcons a:hover{color:#124dd7;transform:translateY(-4px)}.btn.btn2{background:#0d3f68;display:inline-block}.btn.btn2:hover{background:#3caadf}.contactRight form{width:100%}form input,form textarea{color:#fff;background:#272730;border:0;border-radius:6px;outline:none;width:100%;margin:15px 0;padding:15px;font-size:18px}form .btn2{cursor:pointer;margin-top:20px;padding:14px 60px;font-size:18px}.icon{color:#fff;width:50px;height:50px}.iconInline{color:#fff;vertical-align:middle;width:35px;height:35px;margin-right:5px}
