@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap"); *{ margin: 0; padding: 0; font-family: "Montserrat", sans-serif; } header{ background-color: #cda63c; /*#272727*/ position: relative; /*sticky*/ top: 0; bottom: 0; left: 0; right: 0; text-align: center; height: 85px; width: 100%; margin-bottom: 80px; } .galleryHeader{ background-color: #cda63c; /*#272727*/ position: static; /*sticky*/ top: 0; bottom: 0; left: 0; right: 0; text-align: center; height: 85px; width: 100%; margin-bottom: 80px; } #logo-image{ width: auto; height: 70px; margin-top: 6.5px; transform: translateX(-30px); } .navMenu a { color: black; /* changes nav menu default font color */ text-decoration: none; font-size: 1.2em; text-transform: uppercase; font-weight: 500; display: inline-block; width: 130px; -webkit-transition: all 0.3s ease-in-out; /*to make white color ease in when hovered*/ transition: all 0.3s ease-in-out; transform: translateY(-25px); } .navMenu a:hover { color: white; /* #fddb3a */ } /*------------------------ everything body ------------------------*/ body{ background: white; text-align: center; line-height: 150%; } /*------------------------ everything footer ------------------------*/ footer{ display: flex; background-color: #cda63c; /*#272727*/ font-family: "Montserrat", sans-serif; position: static; text-align: center; height: 150px; width: 100%; bottom: 0; margin-top: 80px; align-items: center; justify-content:center; } a{ text-decoration: none; color: black; } iframe{ width: 100%; height: 300px; } /*---------------------------NAWRAS-------------------------- */ .DivCourses,.DivChefs,.DivCourses1,.DivChefs1{ box-shadow: 4px 3px 8px 1px #969696; -webkit-box-shadow: 4px 3px 8px 1px #969696; background-color: rgb(255, 255, 255); text-align: center; width: 1300; height: 450; margin-left: 100; cursor: pointer; } .course1,.course2,.course3,.course4,.course1-1,.course2-1,.course3-1,.course4-1{ float:left; margin:20px; box-shadow: 1px 1px 4px 1px #969696; font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; background-color: rgb(255, 255, 255); text-align: center; width:280; height:400; } .button1,.button2,.button3,.button1-1,.button2-1,.button4,.button3-1,.button4-1 { display: inline-block; padding: 10px 25px; font-size: 15px; text-align: center; color: #fff; background-color: #6b84c3; border: none; border-radius: 10px; box-shadow: 0 9px #999; margin: 20%; } .button2,.button1-1,.button4-1,.button2-1 ,.button4{ background-color: #97989c; box-shadow: 0 9px rgb(119, 118, 118); } .button3:active,.button1:active,.button3-1:active{ background-color: #3e8e41; box-shadow: 0 5px #666; transform: translateY(7px); } .chef1,.chef2,.chef3,.chef4,.chef1-1,.chef2-1,.chef3-1,.chef4-1{ float:left; margin:20px; box-shadow: 1px 1px 4px 1px #969696; font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; font-size:small; background-color: rgb(255, 255, 255); text-align: center; width:280; height:400; } #myVideo { position: fixed; right: 0; bottom: 0; min-width: 100%; min-height: 100%; } .sweets,.bakery{ position: relative; box-shadow: 1px 1px 4px 1px #686666; font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; background-color: rgb(255, 255, 255); float:left; margin: 100px; margin-left: 250px; align-items: center; } .swe,.bek{ position: relative; font-size: 40px; font-family:georgia,garamond,serif; color:rgb(255, 255, 255); } input[type=text], select, textarea { width: 100%; padding: 12px; border: 1px solid #ccc; margin-top: 6px; margin-bottom: 16px; resize: vertical; } input[type=submit] { background-color: #71781c; color: white; padding: 12px 20px; border: none; cursor: pointer; } .content { box-shadow: 1px 1px 4px 1px #969696; font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; background-color: rgb(255, 255, 255); float: right; width: 40%; margin-top: 150px; padding: 50px; margin-right: 90px; } .info { float: left; width: 40%; margin-top: 30px; padding: 50px; } .address_info,.email_info,.phone_info{ margin: 120px; }