/*
	     
	     
	                                                             \
	                                                      !l-    GG:
	                                                      !GGGG. GGGGGGSllllS
	                                                      'GGGGGGGGG^  9GGGGG
	             ~                                         9GGGGGGGp. :SGGGGG
	        :SGGGGGGGS:                                    !GGGGGGGGGGGGGGGGG
	        \GGGGGGGGGGS                                   !GGGGGGGGGGGGGGf"
	          `^*GGGGGGGS                                  SGGGGGGGGGGGGf
	              %GGGGGG                                 :GGGGGGGGGGGG"
	               GGGGGG                                :GGGGGGGGGGGGL
	     .SGGG:~   GGGGGG    :ll.                       lGGGGGGGGGGGGG
	     SGGGGGGl !GGGGGO :SGGGGG                     ;GGGGGGGGGGGGGGG         :lSGGSl:
	     GGGGGGGGGGGGGGGSGGGGGGGG~                .:lGGGGGGGGGGGGGGGGG       ;SGGGGGGGGf
	    (GGGGGGGGGGGGGGGGGGGGGGGG,          .:lSGGGGGGGGGGGGGGGGGGGGGG     lGGGGS" "l*
	    *GGGGGG9T9GGGGGGGGGGGGGGGG       ;GGGGGGGGGGGGGGGGGGGGGGGGGGGG  :GGGGGS^
	             SGGGGGS    '^^^`     :SGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGlGGGGGGf
	             GGGGGG[            lGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGG9`
	            'GGGGGG           ;GGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGf
	            lGGGGGG          GGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGS`
	            SGGGGGG         SGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGG"
	            GGGGGGf        SGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGS*
	            GGGGGG~       lGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGG~
	            GGGGGG        GGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGG
	           'GGGGGG       !GGGGGGGGGGGGGGGGGGGGGGGGGGf` 'VGGGGGGGG.
	           'GGGGGG       lGGGGGGGGGGGGGGGGGGGGGGGGGL      lGGGGGGG,                  
	           'GGGGGG       %GGGGGGGGGGGGGGGGGGGGGGGGS         %GGGGGG\
	            GGGGGG~      lGGGGGGGGGGGGGGGGGGGGGGGGL          'GGGGGGl
	            GGGGGGS      !GGGGGGGGGGGGGGGGGGGGGGGGL            \GGGGGS
	            9GGGGGGG     'GGGGGGGGGGGGGGGGGGGGGGGGL              GGGGGG,
	            'GGGGGGGS.    GGGGGGGGGGGGGGGGGGGGGGGG                \GGGGGG           
	             \GGGGGGGGS;  !GGGGGGGGGGGGGGGGGGGGGS, .               'GGGGGG;
	              "GGGGGGGGGGGSGGGGGGGGGGGGGGGGGGGGGGGGGGGl              %GGGGGS;
	               ~*SGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGS              "GGGGGGG
	                   `"*****"^^^^^^^^^^^^^^^^^^^^^^^^^^^^^                '^``
	     
 .---.  .----. .-.   .-. .----. .-. .-..----.    .-. .-..----. .----. .----..----.   .--.  
{_   _}/  {}  \|  `.'  |/  {}  \| |/ //  {}  \   | |/ //  {}  \| {}  \| {_  | {}  } / {} \ 
  | |  \      /| |\ /| |\      /| |\ \\      /   | |\ \\      /|     /| {__ | .-. \/  /\  \
  `-'   `----' `-' ` `-' `----' `-' `-'`----'    `-' `-'`----' `----' `----'`-' `-'`-'  `-'
                                                                                           
                                                                                           
                                                                                           
                                                                                           
*/





body{
	margin: 0;
	padding: 0;
	background-color: #f9f8f0;



}

/*header*/

header{
	height:8vw;
	width: 100%;
	background-color: #7f635e;
	position: fixed;
	display: flex;
	align-items: center;
	z-index: 9999;
}

h1 img{
	width: 12vw;
	height: 8vw;
	margin-top:-2vw;
	margin-left: 2vw;
}


h1{
	margin-left: 1vw;
	padding: 0;
	font-family: "Verdana","sans-serif";
	font-size: 3vw;

}

a{
	text-decoration: none;
	color: #faf7ef;
}

ul{
	list-style: none;
	margin: 8vw;
	display:flex;
	
}

li{
	font-family: "futura","sans-serif";;
	font-size: 1.5vw;
	margin: 0 0 0 5vw;

}

nav{
	margin: 0 0 0 15vw;
}

.btn{
	display: block;
	padding: 1.1vw;
	text-decoration: none;
	border-bottom: 2vw solid #a0697a;
	background-color: #c589a4;
	color: #ffff;
	border: solid 0.8vw #a0697a;
	position: relative;
	overflow: hidden;
	font-size: 1.5vw;
	font-family: "verdana";
}

.btn:hover{

}


/* home */

.main{
	padding-top: 6%;
 
}

.main h1{
	position: relative;
	margin-top: 50vw;
	margin-left: 30vw;
	color: #ffff;
}

/* footer */


footer{
	width: 100%;
	height: 20vw;
	background-color:#7f635e ;
	text-align: center;

	}



	ul.footer-menu li{
		display: inline;
		margin-top: 8vw;
		margin-left: 13%;
		color: #ffff;
	}

/* about page */

.red-bar {
	margin-top: -1vw;
	width: 100%;
	height: 4vw;
	background-color: #9c131b;
	box-shadow: 0.5vw 0.5vw #7f635e;
}

.about-img img{
	width: 100%;
	height: 20vw;
	object-fit: cover;
	position: relative;

}

.about-img h1{
	position: absolute ;
	margin-top: -18vw;
	margin-left: 5vw;
	font-size: 5vw;
	color: #ab5e61;
}

.about img{
	margin-top: 1vw;
	width: 27vw;
	height: 25vw;
	
}

.about-us h3{
	margin-left: 1vw;
	color: #9c131b;
	font-size: 2.5vw;
	font-family: "verdana";
	margin-top: 2vw;
}

.about-us h4{
	margin-left: 1vw;
	color: #7f635e;
	font-size: 1.5vw;
	font-family: "futura";
	font-weight: normal;
	line-height: 2.5vw;
	width: 90%;
}


.about{
	display: flex;
	width: 100%;
	height: 30%;
margin-right: 2vw;
}

.our-history img{
	width: 100%;
	height: 20vw;
	object-fit: cover;
	
}

.our-history h3{
	margin-left: 1vw;
	color: #9c131b;
	font-size: 2.5vw;
	font-family: "verdana";
	margin-top: 2vw;

}

.our-history h4{
	margin-left: 1vw;
	color: #7f635e;
	font-size: 1.5vw;
	font-family: "futura";
	font-weight: normal;
	line-height: 2.5vw;
	width: 90%;
}

/* Here is the breakpoint for smartphones */
@media screen and (max-width:479px) {

	figure{
		background-color: royalblue;
		width: 375px;
		height: 627px;
	}

	h2,h3,h4,h5 {
		display: none;
}


}

/* Here is the breakpoint for large smart phones */

@media screen and (min-width:480px) and (max-width: 766px) {

	figure{
		background-color: limegreen;
		width: 480px;
		height: 768px;

	}

	h1,h3,h4,h5 {
		display: none;
}


}

/* Here is the breakpoint for tablets */

@media screen and (min-width:767px) and (max-width: 1365px) {

	figure{
		background-color: goldenrod;
		width: 768px;
		height: 1024px;

	}

	



}

/* Here is the breakpoint for laptops */

@media screen and (min-width:1366px) and (max-width: 1919px) {
	figure{
		background-color:hotpink;
		width: 1366px;
		height: 1024px;

	}



}

/* Here is the breakpoint for desktops */

@media screen and (min-width:1920px)  {
	figure{
		background-color:rebeccapurple;
		width: 1920px;
		height: 1080px;

	}




}