﻿@charset "utf-8";
/* CSS Document */

/*============ COMMON STYLES ============*/

body#home #navHome,
body#school-photos #navSchoolPortraits,
body#gallery #navGallery,
body#fundraising #navFundraising,
body#contact-us #navContact {
	color:#5ebef1;
	 }
	 
body#home #navHome:hover,
body#school-photos #navSchoolPortraits:hover,
body#gallery #navGallery:hover,
body#fundraising #navFundraising:hover,
body#contact-us #navContact:hover {
	background-color: #888889;
	color:#5ebef1;
	}

body#photo-order a#navOrder {
	background: url(../images/divBlue.gif) 5% 50% no-repeat, url(../images/divBlue.gif) 95% 50% no-repeat #212121;
	color: #5ebef1;
	text-decoration: none;	
}

#wrapper {
	min-height: 100%;
}
header[role="banner"] {
	padding-top: 1.25em; /*20px*/
}

/*------------ Logo ------------*/
#lauren-daniels-logo {
	display:block;
	padding-bottom: 1.875em; /*30px*/
	text-align:center;
	}

/*------------ Main Navigation ------------*/

header[role="banner"] nav {
	margin: 0 0 1.25em 0; /*0 0 20px 0*/
	padding: 0;
	position: relative;
}
header[role="banner"] ul {
	background: #595a5b;
	height: auto;
	overflow: hidden;
	width: 100%;
}
header[role="banner"] li {
	list-style: none;
	margin: 0;
}
header[role="banner"] nav a {
	color: #fff;
	display: block;
	font: 1.05em/1.5em 'pt_sansbold', "Trebuchet MS", Arial, Helvetica, sans-serif; /* 16.8px/24px */
	font-weight: normal;
	padding: .7em .5em;
	text-align: left;
	text-decoration: none;
	text-transform: uppercase;
}
header[role="banner"] li a:hover, header[role="banner"] li a:active {
	background-color: #888889;
}
header[role="banner"] nav a#pull {
	margin: 0 0 1.25em 0; /*0 0 20px 0*/
	position: relative;
	text-indent:-9999px;
}
header[role="banner"] nav a#pull:after {
	content: "";
	background: url(../images/icon-menu.png) no-repeat;
	width: 36px;
	height: 23px;
	display: inline-block;
	position: absolute;
	left: 50%;
	top: 10px;
	margin-left: -18px
}


/*------------ Order School Photos Button ------------*/
.orderBtn {
	margin-bottom: 1.875em; /*30px*/
	text-align: center;
}

a.arrow_box {
	background-color: #212121;
	background: url(../images/divWhite.gif) 5% 50% no-repeat, url(../images/divWhite.gif) 95% 50% no-repeat #212121;
	color: #FFF;
	display:inline-block;
	font-size:0.875em; /*14px*/
	padding:.5em 3em;
	position: relative;
	text-align:center;
	text-decoration: none;
	text-transform: uppercase;

	-webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}
a.arrow_box:before {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(33, 33, 33, 0);
	border-right-color: #212121;
	border-width: 10px;
	margin-top: -10px;
}
a.arrow_box:after {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(33, 33, 33, 0);
	border-left-color: #212121;
	border-width: 10px;
	margin-top: -10px;
}
a.arrow_box:hover {
	background: url(../images/divBlue.gif) 5% 50% no-repeat, url(../images/divBlue.gif) 95% 50% no-repeat #212121;
	color: #5ebef1;
	text-decoration: none;	
}

/*------------ Main Content ------------*/
div[role="main"] {
	display: block;
	margin-bottom:0;
}

div[role="main"] #main-wrapper, body#contact-us div[role="main"] #main-wrapper {
	background-color: #5ebef1;
	}

body#home div[role="main"] #main-wrapper {
	margin-bottom:0;
	}
	
body#contact-us div[role="main"] #main-wrapper {
	background-color: #212121;
	}
	
div[role="main"] #main-img {
	position:relative;
	}
	
div[role="main"] #main-text {
	background-color: #FFF;
	padding: 3.75em 1.25em; /*60px*/
	}

/*------------ Home ------------*/

.bwWrapper {
    position:relative;
    display:block;
}

.home-mini-promo, #main-wrapper {
	position:relative;	
}

.main-promo-text {
	color: #FFF;
	margin: 4em 5em 1em 1em;
	position: relative;
	width: 85%;
}
.main-promo-text p a {
	color: #FFF;
	text-decoration:none;
}
.main-promo-text h1 {
	border-bottom:1px solid #FFF;
	font-family:'heuristicaitalic', "Times New Roman", Times, serif;
	font-size:225%;
	margin-bottom:1em;
	text-align: left;
	text-transform:capitalize;	
}

.main-promo-text h1.homeHeading em {
	font-family:'pt_sans_narrowregular', "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:65%;
	margin-bottom:.5em;
	text-transform:uppercase;
}

.home-mini-promo h2 {
	bottom: .1em;
	color: #fff;
	position:absolute;
	right:0;
	text-align: left;
	text-indent: .5em;
	text-shadow:1px 1px 1px #212121;
	width:95%;
}

.home-mini-promo h2.homeHeading {
	font-family: 'heuristicaitalic', "Times New Roman", Times, serif;
	font-size:1.7em;
	text-transform:none;	
}
.home-mini-promo h2 span {
	background: url(../images/diagonal-lines.png) 0 0 repeat;
	display: block;
	font-family:'pt_sans_narrowregular', "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:.7em;
	text-transform:uppercase;
}

#orderOnline {
	background-color:#212121;
	color: #5ebef1;
	text-align:center;
}

#orderOnline a {
	display:block;
	padding:3em 1.5em;
	text-transform:uppercase;
}

#orderOnline a:hover {
	text-decoration: none;
}

#orderOnline .main-heading {
	background:url(../images/icon-flourish.png) 50% 0 no-repeat;
	display: block;
	font: 1.75em/1em  'pt_sansbold', "Trebuchet MS", Arial, Helvetica, sans-serif;
	padding-top:40px;
	}
	
#orderOnline .sub-heading {
	font: 1.3em/1.5em 'pt_sans_narrowregular', "Trebuchet MS", Arial, Helvetica, sans-serif; /* 32px/XXpx */
	letter-spacing:3px;
	}

/*------------ Bottom Content ------------*/
#about-lauren-daniels {
	background-color:#FFF;
	padding:4em 0 2em 0;	
}
#about-lauren-daniels h3 {
	font-size: 325%;
	font-family:'pt_sans_narrowregular', "Trebuchet MS", Arial, Helvetica, sans-serif;
	margin-bottom: 1.3em;
	text-transform: uppercase;
	}
#about-lauren-daniels h3 span {
	font-size: 75%;
	font-family: 'heuristicaitalic', "Times New Roman", Times, serif;
	display:block;
	text-transform:lowercase;
	}
#about-lauren-daniels p em {
	display: block;
	font-family:'pt_sansbold_italic', "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-style: normal;
	margin-bottom: 2em;
}

/*------------ Gallery ------------*/
a.galleryBtn {
	background:#5ebef1 url(../images/icon-gallery.png) 50% 50% no-repeat;
	height:80px;
	margin-bottom:0;
	position:absolute;
	width:80px;
	-webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}
a.galleryBtn span {
	bottom: 2px;
	color: #FFF;
	font-size:.8125em; /*13px*/
	font-weight:normal;
	left:0;
	display:block;
	position:absolute;
	text-align:center;
	text-decoration:none;
	text-transform:uppercase;
	width:100%;
}

a.galleryBtn:hover {
	background:#212121 url(../images/icon-gallery-over.png) 50% 50% no-repeat;
	color: #5ebef1;
	height:90px;
	width:90px;	

	-webkit-transform: scale(1.2, 1.2);
    -moz-transform: scale(1.2, 1.2);
    -o-transform: scale(1.2, 1.2);
    -ms-transform: scale(1.2, 1.2);
    transform: scale(1.2, 1.2);
	
    -webkit-transform-origin: bottom left;
    -moz-transform-origin: bottom left;
    -o-transform-origin: bottom left;
    -ms-transform-origin: bottom left;
    transform-origin: bottom left;
}

.gallery-thumbs {
	display: none;
}

/*------------ Contact Us ------------*/

.contact-details {
	color: #FFF;
	margin: 2em;
	position: relative;
}
.contact-details p span {
	font-family: 'pt_sansbold', "Trebuchet MS", Arial, Helvetica, sans-serif;
}
.contact-details ul {
	list-style: none;
}
.contact-details ul li {
	margin-left:0;
}
.contact-details ul li span {
	display: inline-block;
	width:2em;
}

a.mapBtn {
	background:url(../images/icon-map.png) 0 0 no-repeat;
	top:8.5em;
	display: block;
	height:42px;
	position:absolute;
	right:0;
	text-indent: -9999px;
	width:28px;
	
	-webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}

a.mapBtn:hover {
	top:8em;
} 

.target {
display:none;
width:auto;
}

.googleMap {
	margin-bottom: 1.25em; /*20px*/
	overflow: hidden;
}

/*------------ Footer ------------*/

footer[role="contentinfo"] {
	background: #212121;
	color: #fff;
	font-size:0.84375em; /*13.5px*/
	padding-top: 1.25em; /*20px 0*/
	text-align: center;
}


 @media screen and (max-width: 400px) {

div[role="main"].grid-container {
	padding-left: 0;
    padding-right: 0;
	}

/*------------ Main Navigation ------------*/
header[role="banner"] nav {
	height: auto;
}
header[role="banner"] ul {
	display: none;
	border-left: 1px solid #3E3E3E;
	border-top: 1px solid #3E3E3E;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
header[role="banner"] li {
	border-bottom: none;
}
header[role="banner"] li a {
	border-right: 1px solid #3E3E3E;
	border-bottom: 1px solid #3E3E3E;
	padding: .7em;
}

.error-text{margin-left:0;}

/*------------ Gallery ------------*/
a.galleryBtn {
	bottom:0;
	left:0;
}
a.galleryBtn:hover {	
    -webkit-transform-origin: bottom left;
    -moz-transform-origin: bottom left;
    -o-transform-origin: bottom left;
    -ms-transform-origin: bottom left;
    transform-origin: bottom left;
}

/*---- Tushar Add New Css (19-05-2014) ----*/
fieldset div input, fieldset div textarea, fieldset div select{width:92%;}
.greyBGgrid{padding: 30px 10px;}
.RightGrid{border-left:0px solid #bcbcbc; padding-left:0px !important;}
.mob-paddingLR0{padding-left:0px; padding-right:0px;}

.subnav li{float:none;}
.subnav li{float:none;padding-bottom:7px;}

.package{padding-left:10px !important; padding-top:10px;}
.amount{padding-top:0px; padding-left:10px;}

.padding2{padding:10px 10px 25px 0 !important;}

.special-group fieldset div{margin: 0 0 8px;}
.form-grid{padding:0 0 20px !important;}

.EmailAdd fieldset div label{width:100%;}
.EmailAdd fieldset div input, fieldset div textarea, fieldset div select{width:90%;}

.inner-grid-parent h1{margin-right:0; margin-left:0;}

}

/*============ MOBILE ============*/
@media screen and (min-width: 400px) and (max-width: 767px) {
	
	div[role="main"].grid-container {
	padding-left: 0;
    padding-right: 0;
	}

/*------------ Main Navigation ------------*/
header[role="banner"] nav {
	height: auto;
}
header[role="banner"] ul {
	display: none;
	border-left: 1px solid #3E3E3E;
	border-top: 1px solid #3E3E3E;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
header[role="banner"] li {
	border-bottom: none;
	float: left;
	position: relative;
	width: 50%;
}
header[role="banner"] li a {
	border-right: 1px solid #3E3E3E;
	border-bottom: 1px solid #3E3E3E;
}

/*------------ Gallery ------------*/
a.galleryBtn {
	bottom:0;
	left:0;
}
a.galleryBtn:hover {	
    -webkit-transform-origin: bottom left;
    -moz-transform-origin: bottom left;
    -o-transform-origin: bottom left;
    -ms-transform-origin: bottom left;
    transform-origin: bottom left;
}

/*---- Tushar Add New Css (19-05-2014) ----*/
fieldset div input, fieldset div textarea, fieldset div select{width:94%;}
.RightGrid{border-left:0px solid #bcbcbc; padding-left:10px !important;}

.package{padding-left:10px !important; padding-top:10px;}
.amount{padding-top:0px; padding-left:10px;}

.padding2{padding:20px 10px 40px 0 !important;}

.EmailAdd fieldset div label{width:100%;}

.inner-grid-parent h1{margin-right:15%; margin-left:15%;}
.error-text{margin-left:0;}
.subnav li{float:none;padding-bottom:7px;}

}

/*============ TABLET ============*/
@media screen and (min-width: 767px) and (max-width: 1025px) {
.subnav li {padding-bottom:10px;}	
div[role="main"].grid-container {
	padding-left: 0;
    padding-right: 0;
	}

/*------------ Main Navigation ------------*/
header[role="banner"] nav {
	height: auto;
}
header[role="banner"] ul {
	display: none;
	border-left: 1px solid #3E3E3E;
	border-top: 1px solid #3E3E3E;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
header[role="banner"] li {
	border-bottom: none;
	float: left;
	position: relative;
	width: 50%;
}

header[role="banner"] li a {
	border-right: 1px solid #3E3E3E;
	border-bottom: 1px solid #3E3E3E;
}

/*------------ Main Content ------------*/	
div[role="main"] #main-text {
	min-height: 672px;
	}

/*------------ Home ------------*/

.main-promo-text {
	bottom:0;
	margin: 0 5em 1em 0;
	right:0;
	position: absolute;
	width: 35%;
}

/*------------ Gallery ------------*/
a.galleryBtn {
	right:0;
	top:0;
}
a.galleryBtn:hover {	
    -webkit-transform-origin: top right;
    -moz-transform-origin: top right;
    -o-transform-origin: top right;
    -ms-transform-origin: top right;
    transform-origin: top right;
}

/*---- Tushar Add New Css (19-05-2014) ----*/
fieldset div input, fieldset div textarea, fieldset div select{width:80%;}
fieldset div label{padding-top:0px;}

.package{padding-left:10px !important;}
.amount{padding-top:0px; padding-left:10px;}
.special-group fieldset div input, fieldset div textarea, fieldset div select{width:82%;}
.special-group fieldset label{float:left; width:30%; line-height:37px;}

.LeftBttn{margin-left:30%;}

.padding2{padding:0px 10px 40px 0 !important;}

.EmailAdd fieldset div label{width:35%;}

.error-text{margin-left:0;}

}

/*============ DESKTOP ============*/
@media screen and (min-width: 1025px) {
	
div[role="main"] {
	padding-bottom: 1.25em; /*20px*/
}
	
div[role="main"] #main-wrapper, body#contact-us div[role="main"] #main-wrapper {
	margin-bottom: 1.875em; /*30px*/
	}

body#home div[role="main"] {
	margin-bottom: 1.875em; /*30px*/
	}

	
/*------------ Logo ------------*/
#lauren-daniels-logo {
	text-align:left;
	}
/*------------ Main Navigation ------------*/
header[role="banner"] nav {
	margin-bottom: 1.25em; /*20px*/
	padding: 0;
}
header[role="banner"] ul {
	background: none;
	display: block;
	margin-top:3px;
}
header[role="banner"] li {
	float: left;
}
header[role="banner"] nav a {
	color: #212121;
	display: inline-block;
	text-align: center;
	padding:.3em 0;
	margin-right:1em;
	margin-left: 1em;
}
header[role="banner"] li a:hover, header[role="banner"] li a:active {
	background: none;
	color: #fff;
}
header[role="banner"] nav a#pull {
	display: none;
}
	 
body#home #navHome:hover,
body#school-photos #navSchoolPortraits:hover,
body#gallery #navGallery:hover,
body#fundraising #navFundraising:hover,
body#contact-us #navContact:hover {
	background: none;
	color:#fff;
	}

/*------------ Order School Photos Button ------------*/
.orderBtn {
	text-align: right;
}

/*------------ Main Content ------------*/	
div[role="main"] #main-text {
	min-height: 672px;
	padding: 4.0625em 3.75em; /*65px 60px*/
	}

/*------------ Home ------------*/

.main-promo-text {
	bottom:0;
	margin: 0 5em 1em 0;
	right:0;
	position: absolute;
	width: 35%;
}

/*------------ Bottom Content ------------*/
#about-lauren-daniels h3 {
	margin-top: .5em;
	}
#about-lauren-daniels h3 span {
	/*text-indent: 1em;*/
	}
	
/*------------ Gallery ------------*/
a.galleryBtn {
	right:0;
	top:0;
}
a.galleryBtn:hover {	
    -webkit-transform-origin: top right;
    -moz-transform-origin: top right;
    -o-transform-origin: top right;
    -ms-transform-origin: top right;
    transform-origin: top right;
}
	

/* #Forms
================================================== */

/* -- Labels -- */
fieldset div label {
	width: 40%;
}
/* -- Input Defaults -- */
fieldset div input, fieldset div textarea, fieldset div select {
	width: 50%;
}
/* -- Submit Buttons -- */

input#sendEnquiry {
	margin: 0 3.5em 0 0;
}

p.hint {
	margin-left: 42%;
}

}
