Untitled
unknown
plain_text
2 years ago
8.2 kB
1
Indexable
Never
body, html { font-family: "Poppins", sans-serif; margin: 0 0; width: 100vw; height: 100vh; text-align: center; } * { margin: 0; padding: 0; } h1 { color: #eb839b; font-family: "Gochi Hand", cursive; font-size: 937.5%; margin-top: 0x; margin-bottom: 0.1px; } h2 { color: #eb839b; font-size: 250%; margin: 1% 0; } h3 { color: #e76583; font-size: 160%; } p { color: rgb(58, 57, 57); font-size: 125%; margin-bottom: 50px; } hr { border: dotted #f1dde2 6px; border-bottom: none; margin: 0 35%; } span { color: rgb(58, 57, 57); } nav { display: inline-block; justify-content: center; } .info-table { text-align: left; width: auto; margin: 2% 25% 0; } .info-info { width: 30%; } .cv-table { text-align: left; text-indent: 1%; justify-content: center; margin: 2% 25%; } .w { width: 150px; } .td { color: #e76583; font-weight: bold; } .td-bg { background-color: #f7c3cf; margin-left: 20%; vertical-align: top; } #summary { width: 50%; margin: 40px auto 40px auto; } .nav-links { line-height: 0.6; padding: 28px 0; background-color: none; } .nav-links li { display: inline-block; margin: 0 15px; background-color: none; } .nav-links li a { text-decoration: none; padding: 5px 0; position: relative; background-color: none; } .nav-links li a::after { content: ""; background: #eb839b; width: 0; height: 2px; position: absolute; bottom: 0; left: 0; transition: width 0.5s; } .nav-links li a:hover::after { width: 100%; background-color: none; } .top-about { width: 100vw; height: 20vw; background-color: rgb(58, 57, 57); padding-top: 5%; } .top-contact { width: 100vw; height: 600px; background-color: rgb(58, 57, 57); padding-top: 5rem; } .formStyle { display: inline-block; width: fit-content; } ::placeholder { color: rgb(58, 57, 57); padding: 3%; } .first-section, .second-section, .third-section { display: flex; gap: 1rem; } .fourth-section { display: flex; flex-direction: column; } input:focus, input:hover, select { outline: none; border: 2px solid rgb(255, 255, 255); } .inputStyleOne { background-color: #eaa9b8; width: 100%; height: 50px; margin: 5px; padding: 0 1%; border-radius: 15px; border: 2px solid rgb(58, 57, 57); transition: 0.3s border-color; } .inputStyleTwo { background-color: #e98ea3; width: 100%; height: 50px; margin: 5px; padding: 0 1%; border-radius: 15px; border: 2px solid rgb(58, 57, 57); } .inputStyleThree { background-color: #e77791; width: 100%; height: 50px; margin: 5px; padding: 0 1%; border-radius: 15px; border: 2px solid rgb(58, 57, 57); } .inputStyleFour { background-color: #e77791; width: 103% !important; height: 54px; margin: 5px; padding: 0 1%; border-radius: 15px; border: 2px solid rgb(58, 57, 57); } .submitStyle { background-color: #e95577; width: 116px; height: 50px; margin: 5px; border-radius: 25px; border: 2px solid rgb(58, 57, 57); place-self: center; } .submitStyle:hover { background-color: #c94765; cursor: pointer; width: 116px; height: 50px; margin: 5px; border-radius: 25px; border: 2px solid rgb(58, 57, 57); } .messageStyle { background-color: #eb6786; width: 500px; height: 200px; margin: 5px; border-radius: 15px; resize: none; border: 2px solid rgb(58, 57, 57); padding: 1rem; } .messageStyle::placeholder { padding: 0; } .map { padding-top: 5rem; overflow-x: hidden; } .workImgLeft { position: absolute; left: 20%; top: 10%; width: 11%; } .workImgRight { position: absolute; left: 70%; top: 45%; width: 11%; } .cv-img { width: 2%; } .websites { font-size: 100%; margin-bottom: 1%; font-weight: bold; margin-right: 8%; } .webclick:hover { color: white; } .top-about h2 { text-align: center; margin: 0; } .header { position: fixed; box-shadow: 0 -6px 10px 5px rgb(58, 57, 57); width: 100%; height: 7%; background-color: #ffffff; } .top-site { /* width: 100vw; */ height: 52.2vw; background-color: rgb(58, 57, 57); padding-top: 5%; } .top-contact h3 { margin-left: -350px; } .bot-site { background-color: rgb(58, 57, 57); padding: 1px 0 1px; margin-top: 3%; } .left-cloud { position: absolute; right: 200px; width: 230px; height: 230px; } .right-cloud { position: absolute; left: 200px; width: 230px; height: 230px; } .tree { width: 50%; margin-bottom: 0; } .skill-row { width: 50%; margin: 40px auto 40px auto; text-align: left; } #one { color: #eb839b; font-size: 125%; line-height: -1; margin-bottom: 100px; } .ps-img { width: 15%; float: left; margin-right: 30px; } .java-img { width: 15%; float: right; margin-left: 30px; } .javahead { text-align: right; } #javap { text-align: right; } .coding-img { width: 15%; float: left; margin-right: 30px; } .noemi-pic { width: 12%; margin-bottom: 1%; } a { color: #eb839b; text-decoration: none; } #copyright { line-height: 0; color: rgb(255, 255, 255); } .footer-links { margin: 0 10px; font-size: 120%; line-height: 6; } .external-links:hover { background-color: #f8e0c4; } .footer-links:hover { background-color: #f8e0c4; } .btn { background: #eb839b; background-image: -webkit-linear-gradient(top, #eb839b, #e76583); background-image: -moz-linear-gradient(top, #eb839b, #e76583); background-image: -ms-linear-gradient(top, #eb839b, #e76583); background-image: -o-linear-gradient(top, #eb839b, #e76583); background-image: linear-gradient(to bottom, #eb839b, #e76583); -webkit-border-radius: 11; -moz-border-radius: 11; border-radius: 11px; color: #ffffff; font-size: 20px; padding: 10px 20px 10px 20px; text-decoration: none; } .btn:hover { background: #f7c3cf; background-image: -webkit-linear-gradient(top, #f7c3cf, #e76583); background-image: -moz-linear-gradient(top, #f7c3cf, #e76583); background-image: -ms-linear-gradient(top, #f7c3cf, #e76583); background-image: -o-linear-gradient(top, #f7c3cf, #e76583); background-image: linear-gradient(to bottom, #f7c3cf, #e76583); text-decoration: none; } #myBtn { position: fixed; /* Fixed/sticky position */ bottom: 20px; /* Place the button at the bottom of the page */ right: 30px; /* Place the button 30px from the right */ z-index: 99; /* Make sure it does not overlap */ border: none; /* Remove borders */ outline: none; /* Remove outline */ background-color: #eb839b; /* Set a background color */ color: white; /* Text color */ cursor: pointer; /* Add a mouse pointer on hover */ padding: 15px; /* Some padding */ border-radius: 50px; /* Rounded corners */ font-size: 18px; /* Increase font size */ } #myBtn:hover { background-color: #555; /* Add a dark-grey background on hover */ } @media (max-width: 1555px) { .workImgLeft { transition: 1s; left: 5%; } .workImgRight { transition: 1s; left: 84%; } } @media (max-width: 810px) { .workImgLeft, .workImgRight { display: none; } } @media (max-width: 768px) { .top-contact { height: 800px; } .inputStyleOne, .inputStyleTwo, .inputStyleThree, .inputStyleFour, .messageStyle { width: auto !important; } .formStyle { display: flex; flex-direction: column; width: 100%; } .top-contact h3 { margin: 0; padding-left: 10px; float: left; } .first-section, .second-section, .third-section, .fourth-section { flex-direction: column; gap: 0; padding-right: 1rem; } .submitStyle, .submitStyle:hover { width: 100%; } }