/* 

STYLE SHEET FOR [Grand India Restaurant SITE]
ToC

	1. defaults
	2. structure
	3. links and navigation
	4. fonts
	5. images

Notes

*/


/* --------- 1. defaults  --------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

embed, object, iframe{ /* -----Make iframe responsivemap
 ----- */
	max-width: 100%;
	}
body {
	background-color: #666666;
		}

/************************************************************************************
RESET
*************************************************************************************/

img, fieldset {
	border: 0;
}

/* set image max width to 100% */
img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}

/* ----------- Maximum size -----------------*/

#wrapper {
		max-width: 1000px;
		margin: 0 auto;
		border-top: 0;
		border-bottom: 0;
		padding: 0 0 50px 0;
		background-color: #ffffff;
		}

#fadeshow1 {
		width: 978px;
		height:300px;
		border-top: 1px solid #dddddd;
		border-right: 1px solid #333333;
		border-bottom: 1px solid #333333;
		border-left: 1px solid #dddddd;
		margin: 0 auto;
		}
		
#header {
		width: 100%;
		padding: 0;
		overflow: hidden;
		background-color: #162352;
		border-bottom: 5px solid #ffffff;
		min-height: 270px;
		}

#logo {
		width: 59%;
		float: left;
		}
#headerBox {
		width: 25%;
		float: right;
		text-align: center;
		padding: 20px 2% 0 0;
		}
#small-screen-phone {
		display: none;
		}
.navigation {
		width: 100%;
		float: right;
		text-align:right;
		}
#large-screen-navigation {
		background-color: blue;
		}

#small-screen-navigation {
		display: none;
		}

#sideNav {
		width: 25%;
		float:right;
		margin-top: 20px;
		margin-right: 2%;
		margin-bottom: 20px;
		text-align:center;
		}

.sideBox { 
		padding-bottom: 20px;
		margin-bottom: 10px;
		background-color: #cccccc;
		}

.sideText {
		width: 21%;
		float:right;
		margin-top: 20px;
		margin-right: 2%;
		margin-bottom: 20px;
		padding: 20px 2%;
		text-align:center;
		background-color: #cccccc;
		}

.special {
		padding: 20px;
		margin-bottom: 20px;
		background-color: #F4F6FC;
		}

.largeScreen {
		display: none;
		}

.smallScreen {
		display: block;
		}

#mainContent {
		width: 68%;
		float: left;
		padding: 15px 2% 20px 2%;
		}
#menuContent {
		width: 650px;
		float: left;
		padding: 15px 0 20px 0px;
		}
.menuSection {
		width: 100%;
		}
.menu {
		width: 48%;
		float: left;
		padding: 0 2% 20px 0;
		}
		

#contact {
		float: left;
		text-align: left;
		max-width: 450px;
		width: 45%;
		padding: 20px 2%;
		}
		
#map {
		float: right;
		max-width: 450px;
		width: 48%;
		margin-top: 50px;
		position: relative;
  		padding-bottom: 0%;
		padding-right: 2%;
  		overflow: hidden;
		}

#footer {
		width: 96%;
		background: #162352;
		margin: 0 auto;
		margin-top: 15px;
		padding: 35px 2% 5px 2%;
		clear: both;
		}

#error {
		width: 620px;
		height: 120px;
		margin: 0 auto;
		padding-top: 80px;
		text-align: center;
		}

.separatorInvisible {
		clear: both;
		height: 1px;
		}

	/* float-clearing rules */

.clearFix:after {
    	content: "."; 
    	display: block; 
    	height: 0; 
    	clear: both; 
    	visibility: hidden;
		}	



/* ---------- styling for contact form ----------*/


	
		
/* ---------- 3. links and navigation ---------- */

a {
		}
		
a:hover {
		}



a:link, a:visited  {
		font-size: 1em; 
		text-decoration: none;
		color: #110AA5;
		}

a:hover {
		font-size: 1em;  
		text-decoration: underline;
		}

#sideNav a:link, #sideNav a:visited {
		text-decoration: none;
		text-transform: uppercase;
		font-weight: bold;
		display: block;
		}

#sideNav a:hover {
		background: #777777;
		}

#sideNav a:active {
		padding: 9px 0 11px 0;
		background-color: #444444;
		color: #eeeeee;
		border-top: 1px solid #333333;
		border-right: 1px solid #dddddd;
		border-bottom: 1px solid #dddddd;
		border-left: 1px solid #333333;
		}


#sideNav li li a:link, #sideNav li li a:visited {
		text-decoration: none;
		text-transform: none;
		font-weight: normal;
		padding: 5px 0;
		background-color: #999999;
		color: #111111;
		font-size: 1.2em;
		}

#sideNav li li a:hover {
		background-color: #aaaaaa;
		}

#sideNav li li a:active {
		padding: 4px 0 6px 0;
		background-color: #888888;
		color: #000000;
		border-top: 1px solid #333333;
		border-right: 1px solid #dddddd;
		border-bottom: 1px solid #dddddd;
		border-left: 1px solid #333333;
		}

#sideNav a.voucher:link, #sideNav a.voucher:visited {
		text-decoration: underline;
		text-transform: none;
		font-weight: bold;
		display: block;
		padding: 0;
		background: none;
		color: #000000;
		border: 0;
		}

#sideNav a.voucher:hover {
		background: none;
		color: blue;
		}

#sideNav a.voucher:active {
		padding: 0;
		background: none;
		color: blue;
		}
		
#map a:link, #map a:visited  {
		text-decoration: none;
		}

#map a:hover {
		color: #000000;
		}

.navigation a:link, .navigation a:visited {
		text-decoration: none;
		text-transform: uppercase;
		font-weight: bold;
		display: block;
		color: #ffffff;
		}

.navigation a:hover {
		color: #cccccc;
		}

.navigation a:active {
		color: #eeeeee;
		}
#wrapper #sideNav ul li .collapsibleList li a {
	color: #C03;
	background: none;
	border: 0;
	padding-bottom: 10px;
	text-decoration: underline;
		}
		
#footer a:link, #footer a:visited {
		font-size: 0.8em;
		color: #999999;
		text-decoration: underline;
		}
#footer a:hover {
		text-decoration: none;
		}


/* ---------- 4. fonts ---------- */

body {
		font-family: "Times New Roman", Times, serif;
		line-height: 1.5;
		}

h1, h2, h3, h4, p, ul {
		color: #000000;
		}

h1 {
		font-size: 2.2em;
		font-style: normal;
		font-weight: normal;
		color: #162352;
		margin-bottom: 0.25em; 
		font-family:"Times New Roman", Times, serif;
		}

.special h1 {
		text-align: center;
		}

h2 {
		font-size: 1.2em;
		font-style: normal;
		font-weight: normal;
		color: #110AA5;
		margin-bottom: 0.5em; 
		font-family:"Times New Roman", Times, serif;
		}

.special h2 {
		text-align: center;
		text-transform: uppercase;
		}

.sideBox h2 {
		background: #323232 url(images/menu-bkgd-dark.jpg) 50% top repeat-x;
		color: #ffffff; 
		}

h3 {
		font-size: 1.4em; 
		text-decoration: none;
		font-family:"Times New Roman", Times, serif;
		}
				
h4 {
		}

p {
		font-size: 1.1em;
		line-height: 1.4;
		margin-bottom: 0.5em;
		}

#headerBox p {
		font-size: 1.6em;
		line-height: 1em;
		color: #64D6EB;
		}
#phone p {
    		font-size: 1.6em;
    		line-height: 1em;
    		color: #64D6EB;
    		text-align: center;
		}

#sideNav p {
		margin: 0 10px 0.5em 10px;
		}
		
.menu p {
		margin-bottom: 0;
		}
.special p {
		text-align: center;
		}

.blue {
		font-size: 0.8em;
		color:#6013C7;
		}

.red {
		color:red;
		}
		
#mainContent ul {		
		padding-left: 20px; 
		}

.arrow ul { 
		list-style-position: inside;
		list-style-image: url(images/arrow.jpg);
		font-size: 1.2em;
		padding: 0;
		}

#sideNav ul {
		list-style-type: none;
		width: 100%;
		font-size: 1.2em; 
		}

#sideNav ul ul {
		font-size: 1em;
		}

.navigation ul {
		list-style-type: none;
		}
.navigation li {
		float: none;
		width: 96%;
		padding: 3% 2%;
		margin-top: 0;
		background-color: #15214D;
		border-top: 1px solid #666666;
		border-bottom: #111111;
		line-height:1.2em;
		text-align: center;
		}
.noBorder {
		border-top: 0 !important;
		}
#sideNav li li {
		padding: 0;
		background-color: #999999;
		color: #111111;
		}

#sideNav li li p{
		padding: 10px;
		margin: 0;
		color: #ffffff;
		font-size: 1.4em;

	}
#footer p {
		font-style: normal;
		color: #ffffff;
		text-align: center;
		font-size: 1.2em;
		line-height: normal;
		font-weight: bold;
		}

.credits {
		font-size: 0.8em;
		color: #999999 !important;
		}

.responsive-footer {
		text-align: center;
		
		}
.responsive-footer p{
		display: inline;
		text-align: center;
		}

.centre {		
		text-align: center;
		}

.bold {		
		font-weight: bold;
		}

.italicText {
		font-size: 1.3em;
		font-style: italic;
		font-weight: normal;
		color: #666;
		margin-bottom: 0.5em;
		}

.warning {
		font-weight: bold;
		color: red;
		}
.warningBlack {
		font-weight: bold;
		color: #000000;
		}
.reservation {
		font-weight: bold;
		padding: 20px 0;
		}

.formField, select {
		"Times New Roman", Times, serif;
		}


/* ---------- 5. images ---------- */

img {
		border: 0;
		margin: 0;
		padding: 0;
 		}
		
#sideNav img {
		margin-top: 8px;
 		}

.hygieneRating {
		float: right;
		padding-left: 20px;
 		}

#footer img {
		float: right;
 		}
		
/* --- Cookie Message ---*/

#cookie-msg {
	background-color: #000000;
    	bottom: 0;
    	width: 100%;
   	position: fixed;
   	text-align: center;
    	z-index: 9999;
	display:block;
	left: 0;
}

#cookie-msg-inner {
padding-bottom: 10px;
}

#cookie-msg-inner p {
	color: #ffffff;
	display: inline;
	font-size: 1em;
     	font-weight: 500;
	margin-bottom:0;
}

#cookie-msg-inner a:link, #cookie-msg-inner a:visited  {
	text-decoration: underline;
	color: #fff;
	font-size: 1em;
}
#cookie-msg-inner a:hover  {
	text-decoration: none;
}

#cookie-msg-inner button {
	border: 2px solid #CCCCCC; 
	background-color: #162352; 
	padding: 2px 5px;
	margin: 8px 0 0 20px;
    	line-height:130%;
	color: #fff;
}

#delete-cookie-msg {
    	margin: 0 0 20px 80px;
}

#delete-cookie-msg-inner {
    	overflow: hidden;
}

#delete-cookie-msg-inner p {
    	display: inline;
	font-size: 1.0em;
}


#delete-cookie-msg-inner button {
	border: 2px solid #CCCCCC; 
	background-color: #162352;
	color: #FFF;
	padding: 2px 5px;
}
/* -----------6.  Responsive slideshow ---------------- */

body {
 -moz-opacity: .999;
}
	
#gallery {
	position: relative;
}


#gallery div p {
	text-align: center;
}
#controls {
	text-align: center;
}
#pager    a, #main .control  {
	font-size: 12px;
	font-weight: bold;
	color: #FFF;
	background: #0E3B3B;
	padding: 2px 5px;
	text-decoration: none;
	margin-left: 5px;
	cursor: pointer;
}
#pager a.activeSlide {
	background-color: #E6E2AF;
	color: #000;
}
#pager a:hover, #playControl:hover {
	background: #900;
}


.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }

.callbacks_nav {
  position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  top: 52%;
  left: 0;
  opacity: 0.7;
  z-index: 3;
  text-indent: -9999px;
  overflow: hidden;
  text-decoration: none;
  height: 61px;
  width: 38px;
  background: transparent url("responsiveslider/themes.gif") no-repeat left top;
  margin-top: -45px;
  }

.callbacks_nav:active {
  opacity: 1.0;
  }

.callbacks_nav.next {
  left: auto;
  background-position: right top;
  right: 0;
  }

/* ---------- styling for contact form ----------*/


#bookingForm {
		width: 100%;
		}

form {
		border: 1px solid #ccc;
		padding: 10px;
		}

fieldset {
    		border: 0;
    		padding: 20px;
    		margin-bottom: 1em;
    		min-width: initial;
}

.formField, select {
		border: 1px solid #ccc;
		width: 100%;
		}

label {
		float: left;
		font-size: 1em;
		color: #666666;
		padding: 2% 2% 2% 0;
		}

.row input {
		float: left;
		padding: 10px;
		color: #666666;
		font-size: 1em;
		font-family: "Times New Roman", Times, serif;
		}
.row textarea {
		float: left;
		padding: 10px;
		color: #666666;
		font-size: 1em;
		font-family: "Times New Roman", Times, serif;
}

.row {
		margin-bottom: 10px;
		}

.row2 input {
		float: left;
		margin-left: 18px;
		}
.row2 textarea {
		float: right;
		text-align: right;
		width: 280px;
		}

.row2 {
		margin-bottom: 5px;
		}


.submitButton {
		border: 2px solid #333333; 
		background-color: #1100AC;
		color: #FFF;
		padding: 2px 5px;
		margin-top: 10px;
		}
.warning {
		font-weight: bold;
		color: #ff0000;
		}

.g-recaptcha{
		padding: 0;
}

select {
		width: 200px;
		}