
@media only screen and (max-width: 1009px) {
	
	
	li .cornerboxleft:before, li .cornerboxright:before {
		
		content:none ;
	}

	.cornerboxleft {
	
		border-top-left-radius:50px !important;
	}
		
		
		
section#about_this_service,section#about_this_service_title  {
    display: flex;
    flex-flow: column;
    align-items: center;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    margin-top: 34px;
    
   
    
}

#about_this_service h3  {
     font-size: 17px;
    margin-bottom: -1px;
    margin-top: 20px;
    font-weight: 600;
    font-style: italic;
}

#about_this_service h2, #about_this_service_title h2 {
    margin-top: 1em;margin-bottom:45px;
    font-weight: 300;
    font-size: 28px;
    color:#838383;
    border-bottom-color: #B9B9B9;
    border-bottom-width: 3px;
    border-bottom-style: solid;
    text-decoration-color:#FCC40F;
        text-align: center;
    
    
}

.gradient_section {

	background: -moz-linear-gradient(top, rgba(0,0,0,0) 60%, rgba(188,189,190,1) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 60%,rgba(188,189,190,1) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0) 60%,rgb(221, 219, 219) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#bcbdbe',GradientType=0 );
}

section#area_map_title h2 {
      margin-top: 1em;margin-bottom:45px;
    font-weight: 300;
    font-size: 28px;
    color:#838383;
   /*  border-bottom: 1px solid #FCC40F;*/
    
        text-align: center;

}

#area_map h2 {
    margin-top: 1em;
    margin-bottom:45px;
    font-weight: 300;
    font-size: 51px;
    color:#838383;
    border-bottom-color: #B9B9B9;
    border-bottom-width: 3px;
    border-bottom-style: solid;
    text-decoration-color:#FCC40F;
        text-align: center;
}
	
		
		
		
		
		
}

@media only screen and (min-width: 768px) {
   
  	body {
		
		
        
    }
	#top_nav {
		    align-items: flex-end;
		
	}
	
	#top_nav ul{
	display:flex;
	justify-content:flex-end;
	
	
	}
	
	#top_nav a:link, #top_nav a:visited, #top_nav a:hover, #top_nav a:active {
		
		
		font-size: 16px;
    font-weight: lighter;
		
	}
	
	#nav_menu_open_close {
		display:none;
	}
	
	.headeritemsholder {
		height:326px;
	}
	
	#banner{
		
	height: 445px;
	display: flex;
   /* justify-content: flex-end;
    align-items: flex-start;*/
	
	}
	
	
	
	#banner img {
    width: 790.942px;
	}
	
	#welcomesection {
		order:1;
		
	}
	
	#welcomesection h1 {
 
    text-shadow: -1px 1px #ffffff;

    }

	
	#intro_quote_section {
		height:326px;
		
	}
	
	#section_what_do_we_do {
		
		height:231px;
	}
	
	.service {
		height:185px;
		
	}
	
	.service_details_group {
		width:98%;
		    margin-bottom: 48px;
			
			display: flex;
    flex-flow: column;
	
	
	}
	
	#what_do_people_say_about_us {
		height:238px;
	}
	
	#section_what_do_we_do_lower {
		height:341px;
	}
	
	end_of_page_contact {
		height:394px;
	}
	
	.trasvg {
		height:105px;
	}
	
		
		

	body{
	font-family: 'Roboto', sans-serif;
	font-size:16px;
}

#siteholder {
	
	position: relative;
	display: flex;
	flex-flow:column;
	
}

#headeritemsholder {
position:fixed;
background-color:white;	
width:100%;
z-index:1;
padding-top: 12px;
}

#header_items {
	display:flex;
	justify-content:space-around;
	align-items:center;
	   
}



#header_items a:link ,#header_items a:hover,#header_items a:visited,#header_items a:active {
	color:#343333;
	font-size: 2em;
	text-decoration: none;
	margin-left: auto;
    margin-right: 60px;
}



#top_nav a:link ,#top_nav a:hover,#top_nav a:visited,#top_nav a:active {
	color:#343333;
	
    text-decoration: none;
	font-size: 0.5em;
	text-transform: uppercase;
	padding-bottom: 10px;
	FONT-WEIGHT: 300;
}

#top_nav a:hover {
	
	color:black;
	font-weight:500;
}
	

#header_items .fa-3{
	
	font-size: 25px;
    margin-top: 5px;
	transform: scale(1.5,1);
    padding-right: 7px;
	
}

#main_phone_number {
	
	
    padding-top: 7px;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: #fec40d;
    padding-bottom: 1px;
}

#header_items .fa-2x {
    font-size: 1.5em;
    margin-top: 7px;
}

#banner {
	    margin-top: 70px;
		    background-image: url(https://www.thehospitalitynetwork.co.uk/img/header.png);
    /* background-color: blue; */
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
}

#banner img {
	width:100%;
		/*! height:463px; */
	order: 2;
	display:none;
}

#nav_menu_open_close {
	
}

#top_nav {
	display:none;
	display:flex;
	flex-flow:column;
		align-items:stretch;
	justify-content:center;
	
}
#top_nav li {
	
	text-align:center;
	padding: 6px;
    font-size: 1.6em;
	margin-right: 16px;
}

#top_nav a{
	text-decoration:none;
	
	
}

#top_nav ul {
	
	display:flex;
	
}

#top_nav li {
	justify-content:flex-end;
}


.to {
	font-size: 2.8em;
    padding-left: 0.5em;
    font-weight: 400;
}

.the{
	    text-transform: uppercase;
		font-size:1.5em;
}

.welcome {
	font-size:4.4em;
	font-weight: 500;
}

.hospitality {
	
	    font-size: 2.9em;
    font-weight: 700;
}

#intro_quote_section {
	height: 216px;
	background-color:#fec40d;
	display:flex;
	justify-content:center;
	align-items: flex-end;
	
}

#introtext { 
	height:7.4375em;
	color:#333333;
	margin: 0px 19% -16px 19%;
	
    text-align: center;
	
}

.I{
	font-size: 98px;
    float: left;
}

.speachmark {
	font-size: 98px;
	float:right;
}

.arrow-down {
width: 0;
    height: 0;
    border-left: 28px solid transparent;
    border-right: 28px solid transparent;
    border-top: 29px solid #fec40d;
  
}

#welcomesection {
	/*! height:119px; */
	display:flex;
	justify-content:center;
	align-items:center;
	text-align: center;
	padding-left: 206px;
    align-self: center;
	
}

#section_what_do_we_do,#intro_quote_section {
	
	padding-left: 17px;
	
}

#welcomesection .Network {
	    font-size: 1.5em;
		    line-height: 39px;
}

#logo {
	    max-width: 160px;
    height: auto;
    position: relative;
    top: 55px;
    left: 35px;
	
}


#blockmenu {
	
	/*display:none;*/
}

/*BLOCKMENU */

#blockmenu {
	  
	/*
	  position: relative;
    
    order: 5;
    top: -3356px;

    left: 4px;
	
	*/
	top: 192px;
    left: 7px;
    position: absolute;
}

#blockmenu {
	
	
}

#blockmenu ul {
	display: flex;
	flex-flow:column;
	
}

#blockmenu li {
	width: 9.7em;
    height: 7.8em;
	background-color:#343333;
	margin-bottom:10px;
	display:none;
	display: flex;
	justify-content: center;
	align-items: center;
}

#blockmenu li a:link,#blockmenu li a:visited,#blockmenu li a:hover,#blockmenu li a:active{
	font-size:0.5em;
	font-weight:500;
	color:white;
	text-decoration:none;
	    font-size: 1em;

		

}


.accrossbox {
    display: flex;
    flex-direction: row;
    width: 100%;
    /*justify-content: space-between;*/

}

.accrossbox li {
	
	margin-right:10px;
	
}

/* SERVICEs */

.services {
	height:137px;
	display:flex;
	order:3;
	
}

.service {
	height:157px;
	border-bottom-style:solid;
	border-bottom:1px solid #b5b6b7;
	
	display:flex;
	align-items: center;
}

.service{
    background: -moz-linear-gradient(top, rgba(0,0,0,0) 60%, rgba(188,189,190,1) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 60%,rgba(188,189,190,1) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0) 60%,rgb(221, 219, 219) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#bcbdbe',GradientType=0 );
} 

.service img {
	
	width: auto;
    height: 100%;
}

.service hr {
	width:80%;
	color:#fcc40f;
}

.service h3 {
	text-transform:uppercase;
	    font-size: 2.5em;;
		   
			
}

.service_details_group > p {
	    align-self: flex-start;
	    margin-left:32px;
    
    width: 60%;
	font-size:20px;
	    font-weight: 500;
}

.servicehead {
	display:flex;
	justify-content:flex-start;
	align-items:flex-end;
	    border-bottom: 3px solid #fee183;
	    margin-bottom: 5px;
		margin-left: 30px;
}

.servicehead h3 a {
    
    color:black;
    font-size:2.5ems;
    text-decoration: none;
}
/*
.servicehead > a:link, .servicehead > a:visited, .servicehead > a:hover,.servicehead > a:active {
//links as they were before adding buttons with the two classes below

	    font-size: 21px;
    color: #FCC40F;
    text-decoration: none;
    margin-left: auto;
    font-weight: 400;
    padding-bottom: 2px;
    padding-right: 3px;
}

*/


 .servicehead > a:link,
 .servicehead > a:visited,
 .servicehead > a:active {
	    font-size: 21px;
	    color: #FCC40F;
	    text-decoration: none;
	    margin-left: auto;
	    font-weight: 400;
	    padding-bottom: 2px;
	    padding-right: 3px;
	    border-width: 1px;
	    /* border-color: blue; */
	    padding: 7px 4px 7px 7px;
	    box-shadow: black;
	    /* background-color: #000000; */
	    border-radius: 5px;
	    /* margin: 0px 0px 4px 10px; */
	    box-shadow: 1px 2px 8px #888888;
}

 .servicehead > a:hover { 
  font-size: 21px;
    color: #FCC40F;
    text-decoration: none;
    margin-left: auto;
    font-weight: 400;
    padding-bottom: 2px;
    padding-right: 3px;
        border-width: 1px;
    /* border-color: blue; */
    border-style: solid;
    padding: 6px 4px 7px 7px;
   box-shadow: 1px 2px 16px #888888;
     
    

 }




#what_do_people_say_about_us {
	background-color:333333;
	height:71px;
	color:#838383;
	   
	display:flex;
	justify-content:center;
	align-items:center;
	font-weight: 300;
	height: 197px;

	 background: -moz-linear-gradient(top, rgba(0,0,0,0) 60%, rgba(188,189,190,1) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 60%,rgba(188,189,190,1) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0) 60%,rgb(221, 219, 219) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#bcbdbe',GradientType=0 );
	
}

#what_do_people_say_about_us h2 {
    margin-bottom: 47px;
	 font-size: 3.7em;
}

#section_what_do_we_do_lower blockquote {
    text-align: center;
    margin: 64px 20% 0px 20%;
	font-size: 1.3em;
}
 
 section#section_what_do_we_do_lower p {
    font-weight: 400;
    margin-top: 7px;
}
 
.people_say {
	font-weight:500;
}

#section_what_do_we_do_lower {
	display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 7.577875em;
	    height: 287px;
    flex-flow: column;
    color: #838383;
    font-family: roboto;
    font-weight: 200;
    font-size: 1.2em;
}

#section_what_do_we_do_lower .arrow-down {
	
	border-top-color:#333333;
	
}

#section_what_do_we_do {
	display:flex;
	justify-content:flex-start;
	align-items:center;
	    height: 10.882em;
	flex-flow: column;
	color:#838383
}

.do? {
	
	
}


#section_what_do_we_do .arrow-down {


	
}

#section_what_do_we_do h2 {
	    margin-top: 1em;
    font-weight: 300;
	font-size: 51px;
	border-bottom-color: #fcc40f;
    border-bottom-width: 3px;
    border-bottom-style: solid;
}

/* END OF PAGE CONTACT FORM */

input[type="text"], input[type="submit"] {
    padding-left: 6px;
    font-size: 19px;
}

#end_of_page_contact {
	order:4;
	 display:flex;
	background-color:#343333;
	
	/*height: 20.688em;*/
    padding-top: 45px;
    padding-bottom: 45px;
	justify-content: space-evenly;
	align-items:center;
	flex-flow:column;
}

#end_of_page_contact h2 {
color:#838383;
font-weight:300;
font-size:1em;
font-family: 'Roboto', sans-serif;
    font-size: 2.125em;
	margin-bottom:1.5em;

}

#end_of_page_contact submit {
	-webkit-appearance: none;
  -webkit-border-radius: 0;
	
}


#end_of_page_contact form{
	 display:flex;
	 
}

#end_of_page_contact form {
	 display:flex;
	height:140px;
	justify-content:center;
	align-items:center;
}

#end_of_page_contact form {


}

/*
#form_left, #form_right {
background-color:white;

}
*/

#form_left {
display:flex;
	flex:6;
	
	
	flex-flow:column wrap;
	
	
	justify-content: flex-start;
}

#form_left *, #form_right * {
	
	margin-bottom:10px;
	
}

#end_of_page_contact form textarea {
height: 108px;	
	
}


#form_right {
display:flex;
	flex:6;
	
	
	flex-flow:column wrap;
	
	justify-content:flex-start;
	
  margin-left: 1em;
	
}

.fommcontainer{

	width:80%;
}

#form_left input, #form_right input{
	/* width: 395px; */
	height: 49px;
}

.trapholder {
	background-color:#ffecd8;
	width:100%;
	order:9;
	display:flex;
	flex-flow:column;
	align-items: center;
    justify-content: flex-start;
}



.trapezoid {
	 border-top: 100px solid #fec40d;;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    height: 0;
    width: 12.3173125em;
}


.trasvg {
	    height: 89px;
	width:100%;
	order:5;
	background-image: url('img/trapezoid-2.svg');
	background-image: url('https://www.thehospitalitynetwork.co.uk/img/trapezoid-2.svg');
	
	display:flex;
	justify-content:center;
	align-items:center;
	width: 100%;
      /*  background-size: cover;*/
}


.trasvg a:link, .trasvg link:hover, .trasvg link:visited, .trasvg link:active {
	
	text-decoration:none;
	color:#333333;
	font-size:1.35em;
}

	
	.cornerboxleft:before {

       content: "";
    position: absolute;
   top: 0px;
    right: 0px;
    border-width: 0 30px 30px 0;
    border-style: solid;
    border-color: #fff #fff #343333 #343333;
    /* background: #ffffff; */
    display: block;
    width: 0;
	
      }
	
	.cornerboxright:before {
        content: "";
    position: absolute;
    top: 0px;
    left: 0;
    border-width: 0 30px 30px 0;
    border-style: solid;
    border-color: rgba(0,0,0,0) #fff rgba(0,0,0,0) #343333;
    /* background: #ffffff; */
    display: block;
    width: 0;
    transform: scaleX(-1);
      }
	  
	  .has_a_corner {
		  position:relative;
	  }
	  
	  
	  #header_image_and_main_page_heading {
			display:flex;
			justify-content:center;
			align-items:center;
			    height: 188px;
    background-repeat: no-repeat;
    background-size: cover;
	margin-top: 30px;
	}
	
	#service_page_title {
		font-size:2em;
		
		font-weight: 500;
		color: white;
	}
		
	#servicegallery_text {
		
		
		display:flex;
		flex-flow:column;
		align-items:center;
		text-align:center;
		padding-left:20px;
		padding-right:20px;
		padding-bottom:20px;
		    margin-top: 34px;
		
	}
	
	#lower_body_text {
    display: flex;
    flex-flow: column;
    align-items: center;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    
}

 /*
 
 For styling lsits in the sevice gallery secction
 
#servicegallery_text li {
    text-align: left;
    list-style-type: disc;
}

#servicegallery_text ul {
    margin-left:40px;
}
*/


	
	#service_header_gallery {
		padding-top: 9px;
		display: flex;
		flex-flow: row wrap;
		justify-content: space-evenly;
		justify-content: center;
		padding-bottom: 36px;
		align-items: center;
		
	
	}
	
	#service_header_gallery img{
	     
		 max-width:361px;
		  margin: 0px 15px 0px 15px;
	}
	
	#spacer_div {
		
		/*height:60px;*/
		    height: 143px;
	}
	
	#form_message_box {
		
	width: 540px;
    height: 150px;
    justify-content: center;
    align-items: center;
    display: flex;
    font-size: 1.6em;
    background-color: white;
		
	}
	
	.karaoke_video_booth #service_page_title {
    
		
	display:none;
	}
	
	.magic_mirror #service_page_title {
    
	
	text-stroke:0.03em;
	text-stroke-color:black;
	}
	
	
	.image_gallery_box img {
	
	border-width: 1px;
    border-color: lightgray;
    border-style: solid;
	
	}
	
	
	.magic_mirror h1#service_page_title {

		
		text-shadow:
    -1px -1px 0 #343333,
    1px -1px 0 #343333,
    -1px 1px 0 #343333,
    1px 1px 0 #343333;  
	}
	
	.dropdownmenu {
		display:block;
		
	}
	
	#actualdropdownmenu {
    display:none;
	position: absolute;

	}
	
	#siteholder #top_nav #actualdropdownmenu:hover,
	#siteholder #top_nav .dropdownmenu a:hover,
	/*
	.dropdownmenu{
		display: flex;
		
	}
	
	#actualdropdownmenu ul {
    display: flex;
    flex-flow: column;
	}
	
	#actualdropdownmenu li a {
    font-size:1.3em;
	}
	*/
	
	#address_section {
		display:flex;
		justify-content:space-around;
		margin-top:50px;
		margin-bottom:50px;
	}
	
	address_section .detailsbox {
		    width: 30%;
		
	}
	
	#address_section .socicon {
	margin-top:10px;    
	    
	}
	
 .socicon a:link,
 .socicon a:visited ,
 .socicon a:hover ,
 .socicon a:active  
{
	text-decoration:none;  
	    margin-top:10px;
	    display:inline-block;
	    color:black;
	}
	

.socicon i {	
	font-size:30px;
}
	

	
	.detailsbox h2 {
		font-size: 2em;
		padding-bottom: 0.3em;
	}
	.contact_us #headeritemsholder {
		border-bottom-style: solid;
		border-bottom-color: #fec40d;
		border-bottom-width: 3px;
	}
	
	
	#tables {
	margin-top:15px;
	justify-content:space-evenly;
	width:100%
	}

	#tables li{
		list-style-type: circle !important;
		text-align:left;
	}
	
	.image_gallery_box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-bottom: 26px;
	
	}
	
	.image_caption {
    margin-top: 11px;
    font-size: 1.5em;
	}

	#service-features-list 
	{
		display: flex;
		flex-flow: row;
		justify-content: space-around;
		margin-bottom:30px;
		
	}
	
	#service-features-list ul li {
		list-style-type: circle;
		font-size: 16px;
	
	}
	
	
	
section#about_this_service,section#about_this_service_title  {
    display: flex;
    flex-flow: column;
    align-items: center;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    margin-top: 34px;
    
   
    
}

#about_this_service h3  {
     font-size: 17px;
    margin-bottom: -1px;
    margin-top: 20px;
    font-weight: 600;
    font-style: italic;
}

#about_this_service h2, #about_this_service_title h2 {
    margin-top: 1em;margin-bottom:45px;
    font-weight: 300;
    font-size: 51px;
    color:#838383;
    border-bottom-color: #B9B9B9;
    border-bottom-width: 3px;
    border-bottom-style: solid;
    text-decoration-color:#FCC40F;
        text-align: center;
    
    
}

.gradient_section {

	background: -moz-linear-gradient(top, rgba(0,0,0,0) 60%, rgba(188,189,190,1) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 60%,rgba(188,189,190,1) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0) 60%,rgb(221, 219, 219) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#bcbdbe',GradientType=0 );
}

section#area_map_title h2 {
      margin-top: 1em;margin-bottom:45px;
    font-weight: 300;
    font-size: 51px;
    color:#838383;
   /*  border-bottom: 1px solid #FCC40F;*/
    
        text-align: center;

}

#area_map h2 {
    margin-top: 1em;
    margin-bottom:45px;
    font-weight: 300;
    font-size: 51px;
    color:#838383;
    border-bottom-color: #B9B9B9;
    border-bottom-width: 3px;
    border-bottom-style: solid;
    text-decoration-color:#FCC40F;
        text-align: center;
}


}
