* {
		padding: 0;
		margin: 0;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	body {
		font-family: "Roboto", serif, sans-serif;
	}
    .header {
		background-color: #fff;
		padding: 50px 0 50px 20px;
		padding: 50px 20px;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		border-bottom: 1px solid #ddd;
		position: relative;
		z-index: 1000;
    }
	.header h1 {
		margin: 0;
	}
	h1 {
		font-size: 32px;
		margin: 100px 0 80px 0;
		text-align: center;
		font-weight: 300;
		text-transform: uppercase;
	}
	h2 {
		font-size: 26px;
		margin: 10px 0;
		font-weight: 300;
		text-transform: uppercase;
	}
	header p {
		font-size: 14px;
		margin: 0;
		font-weight: 200;
	}
	
	
	
	
	

    .header a,
    .dropbtn {
      display: block;
      color: #000;
      text-align: left;
      padding: 12px 16px;
      text-decoration: none;
      font-size: 16px;
      background: none;
      border: none;
      font-family: inherit;
      cursor: pointer;
    }

    .header a:hover,
    .dropdown:hover .dropbtn {
      text-decoration: underline;
    }

    nav {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      align-items: center;
    }

    .dropdown {
      position: relative;
    }

    .dropdown-content {
      display: none;
      position: absolute;
      background-color: #fff;
      min-width: 180px;
      box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
      z-index: 1001;
    }

    .dropdown-content a {
      color: #000;
      padding: 10px 16px;
      text-decoration: none;
      display: block;
    }

    .dropdown:hover .dropdown-content {
      display: block;
    }

    .icon {
      display: none;
      font-size: 26px;
      cursor: pointer;
      padding: 10px 16px;
    }

	.button
	{
		background-color: #fff;
		color: #000;
		padding: 10px 20px;
		text-decoration: none;
		font-size: 16px;
		font-weight: 300;
		text-transform: uppercase;
		margin-top: 15px;
		display: inline-block;
		border:2px solid #000;
	}

	.button:hover {
		background-color: #000;
		color: #fff;
	}
	
	
	main {
		width: 100%;
	}
	img {
		max-width: 100%;
		display: block;
	}
	.row {
		display: flex;
		flex-wrap: wrap;
		margin: 0 auto 80px auto;
		position:relative;
		width:100%;
	}
	.col-50 {
		width: 50%;
		margin:auto;
	}
	.col-25 {
		width: 25%;
		vertical-align: middle;
	}
	.col-100 {
		width: 100%;
		vertical-align: middle;
	}
	.title {
		position: absolute;
		margin: 20px auto;
		padding:60px;
		background-color: #fff;
		width:50%;
		text-align: center;
		text-transform: uppercase;
		top: 45%;
		left: 50%;
		transform: translate(-50%, -50%);
		min-width:320px;
		height: fit-content;
	}
	.title span {
		font-size: 14px;
		margin: 0;
		font-weight: 200;
		letter-spacing: 1vw;
		text-transform: uppercase;
		margin: 10px;
	}
	.txt {
		padding: 60px;
		font-size: 16px;
		line-height: 1.5;
		color: #000;
		text-align: center;
	}
	.bg-gray {
		background-color: rgb(191, 202, 207);
	}
	.bg-black {
		background-color: #000;
	}
	.bg-black h2, .bg-black p {
		color: #fff;
	}
	.right {
		float: right;
		clear: right;
	}
	.full {
			max-width: 80%;
	}
	.inner {
		width: 80%;
		margin-left:auto;
		margin-right: auto;
	}

    @media screen and (max-width: 1000px) {
	  .col-25 {
    width: 50%;
  }
  .col-50 {
    width: 100%;
  }
	}
    @media screen and (max-width: 768px) {
      nav {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        display: none;
        background-color: #fff;
        padding-top: 20px;
        border-top: 1px solid #ccc;
      }

      .header.responsive nav {
        display: flex;
      }

      .icon {
        display: block;
      }
	  .dropdown {
      width:100%;
    }

      .dropdown-content {
        position: static;
        box-shadow: none;
        padding-left: 40px;
		display: block;
      }


		.col-50 {
			width: 100%;
		}
		.col-25 {
			width: 100%;
		}
		.full {
			max-width: 100%;
		}
	  
    }