/* typography */

*{margin:0; padding:0; box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
*:after,*:before{box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
table { border-collapse:collapse; border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var {font-style:normal; font-weight:normal; }
caption,th {text-align:left;}

q:before,q:after {content:'';}
abbr,acronym { border:0;}
header,nav,section,article,aside,footer,hgroup,figure {display: block; }
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0;}
/* Firefox */
input[type=number] {-moz-appearance: textfield;}

button:focus, input:focus, .form-control:focus, .btn:focus, .btn-close:focus,.page-link:focus{outline: none ;box-shadow: none;outline-color: transparent;outline-width: 0;border-color: unset;}
h1,h2,h3,h4,h5,h6,p,ul,ol,figure{margin-bottom: 0;}
html, body{max-width: 100%;}
img{max-width: 100%;height: auto;}
.modal-content{border: 0;}
ul,li{list-style: none;padding: 0;}
.custom-control-input:focus~.custom-control-label::before,.form-check-input:focus{box-shadow: none;}
a, a:hover{text-decoration: none;outline: 0;outline-color: transparent;outline-width: 0;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
button{-webkit-appearance: none;-moz-appearance: none;appearance: none;}

/*font family*/

:root {
    --font-itim: "Itim", cursive;
  }



/*font family*/

body {font-size:18px;width: 100%;color: #000;font-weight: 400;font-family: var(--font-itim);background: linear-gradient(to bottom, black 0%, black 50%, #00d8e9 100%);background-repeat: no-repeat;}
.container{max-width: 1280px; margin: 0 auto;padding: 0 16px;}
.wrapper{width: 100%;overflow: hidden;}
.error{ color: red !important; font-size: 14px;}
.bdr_radius{border-radius: 16px;}

/* typography */

html {scroll-behavior: smooth;}
.header{margin: 0 50px;}
.header .navbar-toggler-icon{background-image: url(../img-videos/hamburger.svg);background-repeat: no-repeat;background-size: cover;width: 40px;height: 40px;}
.header .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {background-image: url(../img-videos/hamburger-close.svg);background-repeat: no-repeat;background-size: cover;}
.header .navbar-toggler{box-shadow: none;}
.overview_page{margin: 50px;background-color: #20242d;border-radius: 40px;border: 0;padding: 30px 0;padding-bottom: 40px;}
.header{font-family: var(--font-itim);}
.header .navbar-brand{font-size: 36px;color: #00d8e9;pointer-events: none;}
.header .nav-link{font-size: 24px;padding:12px 24px !important;}
.header .nav-link{color: #fff !important;}
.header .nav-link:hover{color: #00d8e9 !important;}
.header .nav-link.active{color: #00d8e9 !important;}
.intro{padding-top: 40px;color: #fff;}
.intro h1{color: #00d8e9;}
.intro .col-md-5 img{border-radius: 30%;height: 450px;box-shadow: 0px 4px 30px rgba(0, 216, 233, 0.6);}
.intro ul img:hover{transform: scale(1.1);}
.intro li{padding-right: 20px;}
.intro li:last-child{padding-right: 0;}
.intro p{max-width: 600px;}
.intro .cv_btn, .contact_form .cv_btn, .about .cv_btn, .services .cv_btn{background-color: #00d8e9;color: #fff;padding: 12px 24px;border-radius: 12px;display: inline-block;border: 0;}
.intro .cv_btn:hover, .contact_form .cv_btn:hover, .about .cv_btn:hover, .services .cv_btn:hover{box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2), 0 6px 20px rgba(0, 216, 233, 0.5);transition: all 0.3s ease;}
.intro, .about, .skills, .my_projects, .services,.contact_form{margin: 50px;padding: 40px 0;background-color: #20242d;border-radius: 40px;color: #fff;}
.about span, .skills span, .my_projects span, .services span, .contact_form span{color: #00d8e9;}
.my_projects a{word-break: break-all;}
@keyframes dance {
    0%, 100% {
      transform: translate(0, 0) rotate(0deg);
    }
    25% {
      transform: translate(-5px, -5px) rotate(-5deg);
    }
    50% {
      transform: translate(5px, 5px) rotate(5deg);
    }
    75% {
      transform: translate(-5px, -5px) rotate(-3deg);
    }
}
.card-inner {position: relative;width: 100%;height: 100%;transition: transform 0.6s;transform-style: preserve-3d;border-radius: 24px;}
.card:hover .card-inner {transform: rotateY(180deg);}
.card-front, .card-back {position: absolute;width: 100%;height: 100%;backface-visibility: hidden;display: flex;align-items: center;justify-content: center;padding: 10px;box-sizing: border-box;border-radius: 24px;}
.card-front {background-color: #fff;}
.card-back {background-color: #fff;color: #00d8e9;transform: rotateY(180deg);}
.card-back ul{padding-left: 40px;}
.card-back li{padding-bottom: 24px;list-style-type: disc;}
.card-front img{width: 150px;}
.my_projects ul, .services ul{padding-left: 40px;}
.my_projects li{font-size: 24px;list-style-type: disc;}
.my_projects h5{padding: 16px 0;}
.my_projects h3{color: #00d8e9;padding-left: 40px;}
.card {width: 100%;height: 350px;perspective: 1000px;margin: auto;margin-bottom: 24px;animation: dance 3s infinite ease-in-out;transition: transform 0.2s ease-in-out;border-radius: 24px;}
.services li{font-size: 20px;padding: 12px 0;list-style-type: disc;}
.contact_form .form-control{height: 50px;}
.footer{margin: 40px 0;}
.footer p{font-size: 18px;}
.footer .btn-link:hover{transform: scale(1.1);}
