*{ /* margin: 0; padding:0; */ box-sizing:border-box; } a{ text-decoration:none; color:#555; } ul{ list-style-type:none; } body{ /* font-family: "Open Sans", sans-serif; */ font-family: 'Poppins', sans-serif; } html{ scroll-behavior: smooth; } header{ background:#5D5B5B; /* width:100%; */ align-items: center; /* padding-left:90px; padding-right:90px; */ } /* .logo{ float:left; } */ .hflex{ color:white; width:80%; display: flex; margin:auto; align-items: center; justify-content: space-between; } .hflex2 { width: 80%; display: none; margin: auto; align-items: center; justify-content: space-between; } .links ul li a{ color: #C99043; } /* .container{ } */ .links ul li{ flex-basis: 100%; font-size:16px; font-weight:700; color:#C99043; display:inline; margin-left:70px; } /* fixed nav */ .fixed-nav { position: fixed; top: 0; left: 0; width: 100%; background: #5D5B5B; margin:auto; color:#C99043; z-index:2; } #menuItemm{ height:0px; width:0px; visibility:hidden; } .socialicon{ display:flex; } /* WWA BEGINS */ .patternbg{ /* box-shadow: 0 10px 29px 0 rgb(68 88 144 / 20%); */ /* -webkit-box-shadow: 0 10px 5px #888888; -moz-box-shadow: 0 10px 5px #888888; */ box-shadow: 0 20px 29px 0 rgb(68 88 144 / 20%); } .wwaflex{ display:flex; justify-content:space-around; align-items:top; margin:auto; width:80%; margin-top:90px; padding-bottom:150px } .wwa h2{ color:#C99043; font-size:29px; } .line{ width: 195px; height: 1px; background-color:black; margin-top:-10px; margin-bottom: 35px; padding: 0px; } .wwaimage img{ width:400px; } .wwa p{ line-height:2.2em; } .cardf{ display:flex; justify-content:space-around; margin:auto; width:80%; } .card{ box-shadow: 0 10px 19px 0 rgb(68 88 144 / 20%); padding:25px; margin-top:-100px; background-color:rgb(237, 233, 233); z-index:1; } .card h3{ color:#C99043; text-align:center; } .card p{ text-align:left; line-height:2.2em; font-size:16px; } .card2{ box-shadow: 0 10px 19px 0 rgb(68 88 144 / 20%); padding:25px; width:20%; margin-top:-100px; background-color:rgb(237, 233, 233); z-index:1; margin:auto; margin-top:40px; } .card2 h3{ color:#C99043; text-align:center; } .card2 p{ text-align:left; line-height:2.2em; font-size:16px; } /* remaining side of beefahs */ .blackline{ width: 120px; height: 1px; background-color:black; } .linetextflex{ display:flex; align-items:center; } .smallinfo{ margin-left:10px; } .ceo{ margin-top:180px; } /* Beginding styling for expertise */ /* Third section */ .btn{ /* background: rgb(29, 158, 29); */ border: 1px solid black; font-family: 'Poppins', sans-serif; color:black; letter-spacing: 1px; display: inline-block; padding: 7px 10px; /* margin: 30px 20px 20px 0; */ } .second-bg{ display: block; background-image: url(../images/brownbg.png); background-size: cover; margin-top:130px; /* padding: 10px 10px; */ padding: 30px 0 30px 0; width:95%; } .mainexpertise{ padding:0; margin:0; } .expertise{ font-size:20px; font-family: 'Poppins', sans-serif; width: 80%; margin:auto; } .expertise h1{ color:#C58630; margin-top:0; } .expertise h3{ font-size:15px; margin-bottom:0; font-weight:200; } .expertise a{ margin-top:0; font-weight:400; font-size:15px; } /* end of expertise*/ /* House pictures */ .housepictures{ text-align:center; margin-top:300px; margin-bottom:300px; } .housepicturesflex{ display:flex; justify-content:space-around; width:80%; margin:auto; } .hpics img{ width:280px; margin-left:10px; } /* footer */ footer{ background:#242C2E; font-family: 'Poppins', sans-serif; margin-top:200px; } .fflex{ display:flex; justify-content:space-around; padding-top:80px; padding-bottom:80px; } .firstaxis{ color:#EBEBEB; } .firstaxis h3{ font-size:16px; } .firstaxis p { font-size:13px; line-height:2; color:#BBBAB9; } .secondaxis{ color:#EBEBEB; } .secondaxis h3{ font-size:16px; } .secondaxis p { font-size:12px; line-height:2; color:#BBBAB9; } .socialicon{ display:flex; } .cccontainer{ text-align:center; margin:auto; padding-bottom:40px; } .copyright{ font-size:14px; color:#BBBAB9; } .dm{ color:#E9E9E8; } /* Media query */ @media (max-width: 510px){ #menuItemm{ background-color: #5D5B5B; width:210px; height:240px; z-index:3; cursor:pointer; position:fixed; top:6%; left: 155px; cursor:pointer; visibility:hidden; } #menuItemm li a { display: block; position: relative; color: #fff; top:-35px; margin-bottom:20px; font-family:poppins; /* padding: 10px 20px; */ font-weight: 500; } .menulist{ margin-top:32px; } .icon { position: absolute; top: 18px; left: 170px; width: 1.7em; cursor: pointer; font-weight: 700; font-size: 200; color: white; z-index: 4; } } @media (max-width: 500px){ .hflex{ color:white; width:80%; display: none; margin:auto; align-items: center; justify-content: space-between; } .hflex2 { width: 80%; display: flex; margin: auto; align-items: center; justify-content: space-between; } /* about us */ .wwaflex { display:block; margin: auto; width: 80%; margin-top:120px; padding-bottom: 90px; } .wwaimage img { margin-top:40px; width: 100%; } .cardf { display:block; margin: auto; width: 80%; } .card { box-shadow: 0 10px 19px 0 rgb(68 88 144 / 20%); padding: 25px; margin-top:70px; background-color: rgb(237, 233, 233); z-index: 1; } .card2 { box-shadow: 0 10px 19px 0 rgb(68 88 144 / 20%); padding: 25px; width: 80%; margin-top:70px; background-color: rgb(237, 233, 233); z-index: 1; margin: auto; margin-top: 40px; } /* our expertise */ .second-bg { display: block; background-image: url(../images/brownbg.png); background-size: cover; padding: 10px 0 30px 0; width: 95%; } .housepicturesflex{ display:block; } .housepicturesflex { width: 100%; margin: auto; } .housepictures { text-align: center; margin-top: 80px; margin-bottom:0; } .hpics img { width: 290px; padding-right:10px; } .smallimg{ margin-right:6px; margin-top:-10px; padding-top:0px; } .fflex{ display:block; padding-left: 50px; padding-right: 50px; } .cccontainer { text-align: left; margin: none; padding-bottom: 40px; padding-left: 50px; padding-right: 50px; line-height:2.3em; font-size:12px; } .secondaxis h3{ margin-bottom:20px; margin-top:20px; } footer { margin-top:80px; } } @media (max-width: 320px){ #mainpicture{ width:100%; } #menuItemm { background-color: #5D5B5B; width: 210px; height: 240px; z-index: 3; cursor: pointer; position: fixed; top: 6%; left: 100px; cursor: pointer; visibility: hidden; } .small{ width:40px; margin-top:30px; } .line { width: 200px; height: 1px; background-color: black; margin-top: 25px; margin-bottom: 20px; padding: 0px; } }