/* Colour
==================================================
 
Dark Blue = #023059
Medium Blue = #03588C
Blue = #1EA4D9
Sky Blue = #5CC8F2


================================================== */


/* Adobe Fonts */

@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,400;0,700;1,400;1,700&display=swap');

/* BASE STRUCTURE */

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

* { box-sizing: border-box; }

body {font-family: 'Merriweather', serif; font-weight: 400; font-style: normal; -webkit-font-smoothing:antialiased!important; background-color: #fff;}
.row {max-width:1400px; margin:0 1rem;}
.container-fluid {padding-left:0; padding-right:0;}

/* HEADER */

header {width:100%; z-index:100; top:0; left:0; -webkit-transition: height 0.3s; position:fixed;  
    -moz-transition: height 0.3s;
    -ms-transition: height 0.3s;
    -o-transition: height 0.3s;
    transition: height 0.3s; height:auto;
    background-image:url('https://londononlocation.co.uk/wp-content/uploads/2020/09/header_bg.jpg');
	}
	 	
img.logo {margin:25px auto 25px; -webkit-transition: all 0.7s;
	    -moz-transition: all 0.7s;
	    -ms-transition: all 0.7s;
	    -o-transition: all 0.7s;
	    transition: all 0.7s; width:325px; display:block;}	

img.tab {width:50px; display: inline-block; position:fixed; top:0}
		
header.smaller img.logo {width:150px; margin:10px auto 10px} 
header.smaller {height:auto;}	

#menu {display:none!important}
.subhead {background-color:#a48a7b}


/* TYPOGRAPHY */
       
h1, h2, h3, h4, h5, h6 {font-family: 'Merriweather', serif; color:#a48a7b; text-align:left; padding:0; font-weight:700; font-style: normal; letter-spacing: -0.4px;}

h1 { font-size: 40px; line-height: 1.15; margin:35px 0 35px;}
h2 { font-size: 38px; line-height: 1.15; margin:0 0 20px;}
h3 { font-size: 34px; line-height: 1.25; margin:0 0 20px;}
h4 { font-size: 28px; line-height: 1.25; margin:0 0 20px;}
h5 { font-size: 20px; line-height: 1.5; margin:0 0 15px;}
h6 { font-size: 15px; line-height: 1.5; margin-bottom: 20px; }

p {font-size: 19px; line-height:1.5; margin:0 0 35px; color:#666; font-weight:400; text-align:left; word-wrap: break-word; letter-spacing: 0;}
p a:link { color:#666; font-weight:400; text-decoration: underline}
p a:visited { color:#666; }
p a:hover { color:#999;}
p em, em {font-style:italic;}

p.location {margin-bottom:15px}
.location__inner {padding:20px; background-color:#f7f7f7}
.locfilm {display:block}

strong {font-weight: 700;}

ul li, ol li {line-height:1.65; font-weight:400; font-size:22px; color:#666; text-align: left; list-style: none;}
ul {margin:0; padding-left:0}

ol {list-style:upper-alpha; list-style-position:inside; }
ul {margin-bottom:40px;}

hr { border: 0; clear:both; display:block; margin:40px auto; width: 98%; background-color:#afafaf; height: 1px; }

a:link { color:#a48a7b; font-weight:600; text-decoration:none;}
a:visited { color:#a48a7b; text-decoration:none;}
a:hover { color:#878787; text-decoration:none;}

/*FEATURED SECTIONS */

section.featured {margin-top:120px; margin-bottom:40px; height:350px; width:100%; overflow:hidden; position:relative; }
.featoverlay {background:rgba(0,0,0,0.6); width:100%; height:100%; position:absolute;}
.featoverlay h1 {color:#fff; position:absolute; font-size: 34px; bottom: 20px; max-width:90%;}

section.featured img {flex-shrink: 0;
	width: 100vw;
    height: 100vh;
    display:flex; justify-content:center; align-items:center; 
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;}

p.menutitle {display: none}

.film_detail {padding:20px; background:#f7f7f7;}
.capture_number {font-size:16px; margin-bottom:0; color:#a48a7b}

div.film__detial {min-height:160px}

.filmlist {padding:20px 35px; background-color:#f7f7f7; margin-bottom:10px!important; font-weight:400}
.filmlist a:link, .filmlist a:hover {font-weight:400!important}
.film_headings {font-size:150%;}

section.decades {padding:25px 0 35px; background-color:#eeeeee; }
section.decades h5 {text-align:center}
section.decades a:link {display: block; width:100%; text-align:center; padding:10px 2px; margin:10px auto; font-size:18px}
section.decades a:link:hover {color:#666; background-color:rgba(0,0,0,0.1)}


/* HOMEPAGE */

section.home {margin-top:200px; margin-bottom:30px}

.film_detail hr {margin: 10px auto 20px;}
.film_detail p {font-size:16px}

.nopad {padding:0}
.film_show {display:block; min-height:80px}

.attachment-lolthumb {margin:0 20px 20px 0}
img.size-location {height:auto!important}

ul.ap_pagination li {width:auto!important}
ul.ap_pagination li a, ul.ap_pagination li a:active, ul.ap_pagination li a:visited {

	font-size:18px!important;
	padding:8px 10px;
	color:#666!important;
}

ul.ap_pagination li a:hover, ul.ap_pagination li a.selected {
	background-color:#f7f7f7;
	color:#a48a7b!important;
}
ul.ap_pagination {border-top:1px solid #f7f7f7!important; border-bottom:1px solid #f7f7f7; padding: 6px 10px 0;}

ul.layout_H {padding-bottom:0!important; width:100%!important; margin-bottom:30px; margin-top:20px;}

div.w3-bar button {padding:10px; background-color:#fff; border:1px solid #f7f7f7; border-bottom:0px; font-family: 'Merriweather', serif; font-weight: 400; font-size:18px}
div.w3-bar button.active {background-color:#f7f7f7; font-weight: bold;}
div.tab p a:link {text-decoration: none;}

div.tab h5 {margin-bottom:0}

#tab-content-wrapper {width:100%}

/* FORM */

.nf-form-content {margin:0!important; padding:0!important}
div.nf-form-fields-required {margin:35px 0}
  
form {
    max-width: 1400px;
    padding:0;
    margin: 0;
}

fieldset{
    border: none; padding:0;
	margin-bottom:30px;
}
legend {
    font-size: 1.7em;
    margin-bottom: 25px;
	color:#002856;
}
label {
    display: block;
    margin-bottom: 8px;
    color:#a48a7b; 
}
input[type="text"],
input[type="date"],
input[type="datetime"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
textarea,
select {
    background: rgba(255,255,255,.1);
    border: none;
    font-size: 18px;
    margin: 0;
    outline: 0;
    padding: 15px;
    width: 100%;
    box-sizing: border-box; 
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box; 
    background-color: #e7e7e7;
    color:#8a97a0;
    -webkit-box-shadow: 0 1px 0 rgba(0,0,0,0.03) inset;
    box-shadow: 0 1px 0 rgba(0,0,0,0.03) inset;
    margin-bottom: 15px;
    
}
input[type="text"]:focus,
input[type="date"]:focus,
input[type="tel"]:focus,
input[type="datetime"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
textarea:focus,
select:focus{
    background: #d2d9dd;
}
select{
    -webkit-appearance: menulist-button;
    height:35px;
}
.screen-reader-text {display:none}
.number {
    background: #007cba;
    color: #fff;
    height: 30px;
    width: 30px;
    display: inline-block;
    font-size: 0.8em;
    margin-right: 4px;
    line-height: 30px;
    text-align: center;
    text-shadow: 0 1px 0 rgba(255,255,255,0.2);
    border-radius: 15px 15px 15px 0px;
}
input[type="checkbox"], input[type="radio"] {margin-right:10px;}



input[type="submit"], input[type="reset"],
input[type="button"]
{
    position: relative;
    display: block;
    padding: 19px 39px 18px 39px;
    color: #FFF;
    margin: 20px auto 0;
    background: #002b49;
    font-size: 18px;
    text-align: center;
    font-style: normal;
    width: 100%;
    border: 0;
    margin-bottom: 10px;
}
input[type="submit"]:hover,
input[type="button"]:hover
{
    background: #0d4f7d;
}
	


article {padding:1.5em; background-color: #fff; border-radius:5px; box-shadow: 0 0 6px rgba(0,0,0,0.25); margin-bottom:40px; min-height:400px; position: relative;}
article img {
border-radius: 5px 5px 0 0;
display: block;
margin-bottom: 1.5em;
margin-left: -1.5em;
margin-top: -1.5em; position: relative; width: calc(100% + 3em); max-width:145%!important; height:auto; z-index:80}
article p {font-size:16px; line-height:1.35; margin-bottom:0 }




/* FOOTER  */

footer {font-family: 'Merriweather', serif; font-weight:400; background:#f7f7f7;}
footer h4 {font-size:20px; color: #a48a7b}
footer p {font-size: 15px; line-height:1.65; margin:0 0 30px; text-align:center; word-wrap: break-word; letter-spacing: 0;}
footer ul li {font-size: 15px; line-height:2; }
footer ul li a:link, footer ul li a:visited {color: #666; font-weight:400}
footer ul li a:hover {color: #999;}

footer i.fab {font-size:24px; margin-right:5px; color:#fff; text-align:center}
footer i.fab:hover {color:#a48a7b;}

.footlogo {width:300px}

section.footerbase {padding-bottom:100px;}
section.subfooter {width:100%; background: #8e7568; margin:0; padding:15px 0;}
.subfooter p, .subfooter p a:link {color: #fff; font-size:95%; margin-bottom:5px}
p.silver {text-align:right}

.button {font-weight:400; padding:10px 20px; border: 1px solid #023059; color:#023059; width:auto; margin-top:15px; font-size:14px}
a:link.button, a:visited.button {color:#023059; text-decoration: none}
a:hover.button {color:#a0a0a0; border:1px solid #a0a0a0}

.button .fas {margin-left:7px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
.button:hover .fas {margin-left:20px}

.result {margin:10px auto; display:block; width:150px; text-align:center; background-color: #ca60a1 }


.az-tabs {margin:40px 0}
  button.az-tab {padding:10px; border-radius:0; background-color:white; color:#666; line-height:1; border:1px solid #afafaf;}
  button.az-tab:hover {background-color:#8e756850; }
  button.az-tab.active {color:white; background-color:#8e7568; }
  .film_az div.film {margin:1rem auto}

  .film_az div.film a {width:100%; margin:0}

  
/* WORDRPESS SPECIFICS */

.alignleft {float:left; margin:0 35px 10px 0; padding:3px; border:0 solid #ececec; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
.alignright {float:right; margin:0 0 10px 35px; padding:3px; border:0 solid #ececec; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
.aligncenter {border:0 solid #ececec; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
.alignnone {border:0 solid #ececec; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}

.remove-bottom { margin-bottom: 0 !important; }
.half-bottom { margin-bottom: 15px !important; }
.add-bottom { margin-bottom: 30px !important; }
.extra-bottom { margin-bottom: 80px !important; }


.remove-top { margin-top: 0 !important; }
.half-top { margin-top: 15px !important; }
.add-top { margin-top: 30px !important; }
.extra-top { margin-top: 80px!important; }

 
.design {text-align:center; margin-top:30px}


body.page-template-archive-films section.content {
    padding-top: 215px;
}
 

@media (max-width: 767px) {
    body.page-template-archive-films section.content {
        padding-top: 140px;
    }
}

.az-tabs.az-tabs-grouped {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 20px;
    margin: 5px 0 15px;
}

.az-tabs.az-tabs-grouped button.az-tab,
.az-tabs.az-tabs-grouped button.az-tab:hover,
.az-tabs.az-tabs-grouped button.az-tab.active {
    appearance: none;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #a48a7b;
    font-family: inherit;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.4;
    cursor: pointer;
}

.az-tabs.az-tabs-grouped button.az-tab:hover,
.az-tabs.az-tabs-grouped button.az-tab.active {
    color: #a48a7b90;
    text-decoration: underline;
}


  /* #MOBILE
  ================================================== */
  
  

@media only screen and (min-width: 768px) and (max-width: 959px) {

    .attachment-lolthumb {float:left; }


    p {font-size: 18px; line-height:1.55;} 
    img.homelogo {width:240px;}
    .hero h1 { font-size: 2.75em; width:75%; }
    
	footer h4 {text-align:left}
    footer p {text-align:left;}
	img.tab {width:60px;}
        #menu {display:none!important}

		 .quote__text {font-size: 30px; line-height: 1.3; }
    .quote__text {font-size: 30px; line-height: 1.3;}
    .featoverlay h1 {font-size: 40px; max-width:90%;}

    
}
  
@media only screen and (min-width: 960px) and (max-width: 1023px) {
    
    .row { margin:0.5rem 1rem}


    p {font-size: 18px; line-height:1.55;} 
    img.homelogo {width:280px;}
    .hero h1 { font-size: 2.75em; width:75%; }
    .attachment-lolthumb {float:left; }

	
    footer h4 {text-align:left}
    footer p {text-align:left;}
	blockquote p {font-size: 40px;}
	img.tab {width:60px;}

    #menu {display:none!important}
    

}
  
@media only screen and (min-width: 1024px) and (max-width: 1200px) {
	
        section.home {margin-top:240px}


    p {font-size: 18px; line-height:1.55;} 
    .showcase p {font-size:18px}
    
    img.homelogo {width:270px;}
    .hero h1 { font-size: 2.75em; width:75%;}
	
    footer h4 {text-align:left}
    footer p {text-align:left;}
    blockquote p {font-size: 40px;}
	img.tab {width:60px;}
    p.menutitle {display:inherit; font-size: 16px; line-height:1; margin:-33px 0 0 35px; color:#fff; font-weight:400; text-align:left; }

      div#navtoggler{display:none!important}
    #menu {display:block!important}
    .menutitle {display:none!important}
    .featoverlay h1 {font-size: 48px; max-width:70%;}
    .attachment-lolthumb {float:left; }


     nav ul {
	-webkit-font-smoothing:antialiased;
    list-style: none; 
    margin: 0; text-align:center;
    padding: 0; text-transform:uppercase; z-index:8888; font-size: 0; 
}
nav ul li {
    margin: 0;
    padding: 0;
    position: relative;
	text-align:center; display:inline-block; font-family: 'Merriweather', serif;  

}
nav a { color: #fff;
    display: inline-block;
    font-size:13px;
    line-height:2rem;
    padding: 0 15px;
    text-align: center;
    text-decoration: none;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
			margin:0; font-weight:400; letter-spacing:1px;
}

nav a:visited {color:#fff;}
ul.sub-menu li a { text-align:center;}
nav ul li a:link {color:#fff; font-weight:400}
nav ul li a:hover, nav li a:hover, nav li:hover a { color: #777; }

nav li ul {
    opacity: 0;
    position: absolute;
    top: 0; 
    visibility: hidden;
    z-index: 1;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
	-webkit-box-shadow: 6px 6px 6px -1px rgba(0,0,0,0.4);
	-moz-box-shadow: 6px 6px 6px -1px rgba(0,0,0,0.4);
    box-shadow: 6px 6px 6px -1px rgba(0,0,0,0.4);
    left:50%; margin-left:-135px;
					
}
nav li:hover ul {
    opacity: 1;
    top: 98px;
    visibility: visible;
	background:#fff;
	width:275px; z-index:9999; display:inline; text-align:center; left:50%; margin-left:-135px;
}
nav li ul li a {font-size:13px; line-height:1.25; float: left; width: 275px; text-align:left; margin:0; color:#000!important; padding: 20px;
}
nav ul ul li {border-bottom:1px solid #f7f7f7;}
nav li ul li:hover {background: #03588C; }
nav ul li ul {visibility:hidden; z-index:9999; opacity:0; position: absolute; top: 120px;}

header.smaller nav a {line-height:3rem;}
header.smaller nav li:hover ul {top: 60px;}
header.smaller nav li ul li a {line-height:1.25; padding:20px}

nav ul ul:before {
  position: absolute;
  top: -10px;
  left: 45%;
  display: inline-block;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #ccc;
  border-left: 10px solid transparent;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  content: '';
}

nav ul ul:after {
  position: absolute;
  top: -9px;
  left: 45%;
  display: inline-block;
  border-right: 9px solid transparent;
  border-bottom: 9px solid #ffffff;
  border-left: 9px solid transparent;
  content: '';
}

.design {text-align:right; margin-top:5px}
  .quote__text {font-size: 34px; line-height: 1.5; }
    .callout__text {font-size: 34px; line-height: 1.5;}

    
}
  
@media only screen and (min-width: 1201px) {
	
.container-fluid { padding-left: 0; padding-right: 0;}
	
    .row {max-width:1400px; margin:0 auto; padding-left: 0.5rem; padding-right: 0.5rem;}

    section.home {margin-top:240px}

    
    p {font-size: 18px; line-height:1.75;} 
    article p {font-size: 18px; line-height:1.55;} 
    .showcase p {font-size:18px}

    ul li, ol li {font-size:22px;}

    img.homelogo {width:300px;}
    .hero h1 { font-size: 3.75em; width:75%; margin:0 auto 0 1rem; }
	footer h4 {text-align:left}
    footer p {text-align:left;}
    blockquote p {font-size: 40px;}
    .featoverlay h1 {font-size: 55px; max-width:1440px}
	img.tab {width:60px;}
    p.menutitle {display:inherit; font-size: 16px; line-height:1; margin:-33px 0 0 35px; color:#fff; font-weight:400; text-align:left; }
    .attachment-lolthumb {float:left; }


    div#navtoggler{display:none!important}
    #menu {display:block!important}
    .menutitle {display:none!important}

     nav ul {
	-webkit-font-smoothing:antialiased;
    list-style: none; 
    margin: 0; text-align:center;
    padding: 0; text-transform:uppercase; z-index:8888; font-size: 0; 
}
nav ul li {
    margin: 0;
    padding: 0;
    position: relative;
	text-align:center; display:inline-block; font-family: 'Merriweather', serif;  

}
nav a { color: #fff;
    display: inline-block;
    font-size:14px;
    line-height:3rem;
    padding: 0 .9vw;
    text-align: center;
    text-decoration: none;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
			margin:0;
    font-weight:400; letter-spacing:1px;
}

nav a:visited {color:#fff;}
ul.sub-menu li a { text-align:center;}
nav ul li a:link {color:#fff; font-weight:400}
nav ul li a:hover, nav li a:hover, nav li:hover a { color: #777; }

nav li ul {
    opacity: 0;
    position: absolute;
    top: 0; 
    visibility: hidden;
    z-index: 1;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
	-webkit-box-shadow: 6px 6px 6px -1px rgba(0,0,0,0.4);
	-moz-box-shadow: 6px 6px 6px -1px rgba(0,0,0,0.4);
    box-shadow: 6px 6px 6px -1px rgba(0,0,0,0.4);
    left:50%; margin-left:-135px;
					
}
nav li:hover ul {
    opacity: 1;
    top: 98px;
    visibility: visible;
	background:#fff;
	width:275px; z-index:9999; display:inline; text-align:center; left:50%; margin-left:-135px;
}
nav li ul li a {font-size:14px; line-height:1.25; float: left; width: 275px; text-align:left; margin:0; color:#000!important; padding: 20px;
}
nav ul ul li {border-bottom:1px solid #f7f7f7;}
nav li ul li:hover {background: #03588C; }
nav li ul li:hover a {color:#fff!important;}
nav ul li ul {visibility:hidden; z-index:9999; opacity:0; position: absolute; top: 120px;}

header.smaller nav a {line-height:3rem;}
header.smaller nav li:hover ul {top: 60px;}
header.smaller nav li ul li a {line-height:1.25; padding:20px}

nav ul ul:before {
  position: absolute;
  top: -10px;
  left: 45%;
  display: inline-block;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #ccc;
  border-left: 10px solid transparent;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  content: '';
}

nav ul ul:after {
  position: absolute;
  top: -9px;
  left: 45%;
  display: inline-block;
  border-right: 9px solid transparent;
  border-bottom: 9px solid #ffffff;
  border-left: 9px solid transparent;
  content: '';
}
    

}