html { overflow-x: hidden; overflow-y: scroll; } a:hover { text-decoration: none; } .sidebar { position: fixed; left: 0px; top: 0px; right: 552px; bottom: 0px; z-index: 1; width: 40%; height: 100%; } .sidebar .main-info * { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; opacity: 0; -webkit-transform: translateX(-40px); transform: translateX(-40px); } .sidebar .main-info *.bs { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } .main-content { position: relative; overflow: visible; width: 60%; max-width: 1200px; margin-left: 40%; float: none; clear: none; } .main-content:after { position: absolute; content: ''; top: 0; bottom: 0; left: 0; right: 0; -webkit-transition: all 0.8s cubic-bezier(0.79, 0, 0.05, 0.83); transition: all 0.8s cubic-bezier(0.79, 0, 0.05, 0.83); background-color: #fff; } .main-content.active:after { position: absolute; content: ''; top: 0; bottom: 0; left: 0; right: 0; -webkit-transform: translateX(100%); transform: translateX(100%); background-color: #fff; } article { font-size: 18px !important; line-height: 1.8rem; } article p { color: rgba(0, 0, 0, 0.8); } article img { max-width: 100%; } article code { background-color: #fbfbfb !important; width: 100%; max-width: 800px; margin: 0 auto; } article mark { background-color: white; color: #c80000; } .heading, h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif !important; font-weight: 800; text-transform: uppercase; } .heading { font-size: 38px; } .highlight { background-color: #ededed; padding: 4px 8px; /*display: inline-block;*/ } .form-control { border: none; background-color: #e8ebef !important; } .primaryMenu { -webkit-transform: translateY(-90px); transform: translateY(-90px); -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; position: absolute; margin-left: 35px; } .primaryMenu.active { -webkit-transform: translateY(0px); transform: translateY(0px); } .secondaryMenu { position: absolute; widows: 100%; -webkit-transform: translateY(-90px); transform: translateY(-90px); margin-left: 25px; padding-left: 0; z-index: 2; -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } .secondaryMenu.active { -webkit-transform: translateY(0px); transform: translateY(0px); } .btn { border-radius: 6px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .btn.btn-primary { background-color: #31E7B6; border-color: #31E7B6; } .btn.btn-primary:hover { background-color: #32d2a7; border-color: #32d2a7; } .btn.btn-primary:active { -webkit-transform: scale(0.95); transform: scale(0.95); background-color: #32d2a7; border-color: #32d2a7; } .btn-dark-faded { font-weight: 300; font-family: 'Montserrat', sans-serif !important; /*text-transform: uppercase;*/ background-color: rgba(0, 0, 0, 0.07); color: black; } .social:hover a { color: rgba(0, 0, 0, 0.4); } .social a { color: black; font-size: 28px; margin-right: 12px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .social a:hover { color: black; } .social a:hover i { -webkit-transform: scale(1.3); transform: scale(1.3); } section { padding: 10%; } section .heading { margin-bottom: 30px; } section.yellow { background-color: #ffd061; color: #000 !important; } section.yellow .progress .bg-blue { background-color: #c19c43; } section.voilet { background-color: #4768FD; } section.blue { background-color: #cadfdf; } section.orange { color: #fff; background-color: #fb7833; } section.green { background-color: #aaffa7; } section.skin { background-color: #fdead2; } section.aqua { background-color: #00fefe; color: #000 !important; } section.pink { background-color: #fff1f1; } .progress { height: 0.6rem; background-color: #fff; } .progress .bg-blue { background-color: #2e96a5; } .card { border-radius: 6px; border: none; } #timeline { width: 100%; position: relative; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; } #timeline:before { content: ""; width: 3px; height: 100%; background: #000; left: 50%; -webkit-transform: translate(-50%); transform: translate(-50%); top: 0; position: absolute; } #timeline:after { content: ""; clear: both; display: table; width: 100%; } #timeline .timeline-item { margin-bottom: 50px; position: relative; text-align: right; } #timeline .timeline-item .timeline-icon { background: #000; width: 20px; height: 20px; position: absolute; top: 0; left: 50%; overflow: hidden; margin-left: -10px; border-radius: 50%; } #timeline .timeline-item .timeline-content { width: 45%; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } #timeline .timeline-item .timeline-content p { color: rgba(0, 0, 0, 0.7); } #timeline .timeline-item .timeline-content .date { display: inline-block; background-color: rgba(0, 0, 0, 0.1); padding: 10px; border-radius: 3px; } #timeline .timeline-item .timeline-content.right { float: right; text-align: left; } .pagination .page-item.active .page-link { background-color: black; border-color: black !important; color: #fff !important; } .pagination .page-link { border: none; color: #000 !important; } .skill { margin-bottom: 20px; } @media (max-width: 767px) { .sidebar { position: static; width: 100%; padding-left: 65px; } .main-content { width: 100%; margin-left: 0%; } #timeline { margin: 30px; padding: 0px; width: 90%; } #timeline:before { left: 0; } #timeline .timeline-item .timeline-content { width: 90%; float: right; text-align: left; } #timeline .timeline-item .timeline-content:before, #timeline .timeline-item .timeline-content .right:before { left: 10%; margin-left: -6px; border-left: 0; border-right: 7px solid #ee4d4d; } #timeline .timeline-item .timeline-icon { left: 0; } } .hamburger-menu, .hamburger-menu:after, .hamburger-menu:before { width: 24px; height: 4px; } .hamburger-menu { position: relative; -webkit-transform: translateY(8px); transform: translateY(8px); background: black; -webkit-transition: all 0ms 300ms; transition: all 0ms 300ms; } .hamburger-menu.animate { background: rgba(255, 255, 255, 0); } .hamburger-menu:before { content: ""; position: absolute; left: 0; bottom: 8px; background: black; -webkit-transition: bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 350ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms cubic-bezier(0.23, 1, 0.32, 1); } .hamburger-menu:after { content: ""; position: absolute; left: 0; top: 8px; background: black; -webkit-transition: top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 350ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms cubic-bezier(0.23, 1, 0.32, 1); } .hamburger-menu.animate:after { top: 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 350ms 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 350ms 350ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms 350ms cubic-bezier(0.23, 1, 0.32, 1); } .hamburger-menu.animate:before { bottom: 0; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: bottom 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: bottom 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: bottom 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 350ms 350ms cubic-bezier(0.23, 1, 0.32, 1); transition: bottom 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 350ms 350ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 350ms 350ms cubic-bezier(0.23, 1, 0.32, 1); } /*# sourceMappingURL=styles.css.map */