*{ margin: 0; padding: 0; box-sizing: border-box; font-family: 'Poppins',sans-serif; }

body { background: #080808; color:#fff; }

#header { width: 100%; height: 100vh; background-image: url("images/background image.jpg"); background-repeat: no-repeat; background-size:contain; background-position: left; }

/*#section{ padding-left: 33%;  display: flex; }*/
.container{padding: 10px 10%;}

nav{display: flex; align-items: center; justify-content: space-between;}

.logo{ width: 150px;margin-right: 150px;margin-left: 30%;}

nav ul li { display: inline-block; list-style: none;  margin-top: 10px;  margin-left: 20px; cursor: pointer;}

nav ul li a{ color:#fff;  text-decoration: none;  font-size: 18px;  position: relative;}

nav ul li a::after{ content: ''; width: 0; height: 3px; background: #ff004f; position: absolute; left:0; bottom: -6px; transition: 0.5s;}

nav ul li a:hover::after{width: 100%;}

.header-text{margin-left: 35%;line-height: 1rem;margin-top: 8%; font-size: 20px;}


.header-text h1{ font-size: 30px;margin-top: 0px;line-height: 5rem;}

.header-text h1 span{ font-size: 40px;margin-top: 15px;line-height: 5rem;}

.header-text h1 span{color: #ff004f;}

#button1{padding: 0.3rem 0.8rem; font-size: 1rem; background-color: #ff004f;

color: #fff; font-weight: 600; border-radius: 4px; border:2px solid black; margin-left: 35%; margin-top: 1rem;}

#about{ margin-top: 10%; color:#ababab;}

.row{display: flex; justify-content: space-between;flex-wrap: wrap; }

.about-col-1{ flex-basis: 28%;}

.about-col-1 img{width: 100%; border-radius: 15px;}

.about-col-2{ flex-basis: 72%;padding-left: 50px;}

.h1{font-weight: 600; font-size: 40px; color: white;}

.tab-titles{ display: flex; margin: 20px 0 40px;}

.tab-links{ margin-right: 50px; font-size: 18px; font-weight: 500; cursor: pointer; position: relative;}

.tab-links::after{ content: ''; width: 0; height: 3px; background: #ff004f; position: absolute; left:0; bottom: -8px; transition: 0.5s;}

.tab-links.active-link::after{width: 80%;}

.tab-contents ul li{ list-style: none; margin: 10px 0; }

.tab-contents ul li span{ color: #b54769;font-size: 14px;}

.tab-contents{display: none;}

.tab-contents.active-tab{ display: block;}

/*--------------------------------------------------------services----------------------------------------------------------------------------------*/

#services{ padding: 100px 0;}

.services-list{ display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap:80px; margin-top:45px; justify-content: space-around;}

.services-list div{ background: #262626; padding: 40px; font-size: 15px;font-weight: 300; border-radius: 10px; transition: background 0.5s, transform 0.5s;}

.services-list div i{ font-size: 40px; margin-bottom: 25px;}

.services-list div h2{ font-size: 30px; font-weight: 500; margin-bottom: 15px;}

.services-list div a{ background-color: grey; padding: 4px; border-radius: 2px; text-decoration: none; color: #fff; font-size: 13px;font-weight: 300; margin-top: 20px; display: inline-block;}

.services-list div:hover{background: #ff004f; transform: translateY(-10px);}