body{ background: #fff; font-size: 18px; font-family: 'calibri',sans-serif; color: #00264c; font-weight: 100; }

.fixed-bottom {width: 100%; background: #191919; position: fixed; bottom: 0; z-index: 100; display: none; padding: 20px}
.fixed-bottom h2 {color: #fff;text-align: center; font-size: 18px; margin-top: 5;}
.fixed-bottom p {color: #fff;text-align: center; font-size: 14px; margin-top: 10px;}
.call-button {color: #fff; max-width: 300px; width: 100%; transition: all 0.5s; cursor: pointer; text-align: center; font-weight: 400; font-size: 18px; padding: 10px; background-color: #0064BF; border-radius: 3px;  margin: 0 auto; display: block;}

.greyback{background-color: #f7f7f7; padding: 40px 0; border-top: 1px solid #efefef; border-bottom:  1px solid #efefef;}

#TestWhole{font-size: 25px; margin-top: 20px; font-weight: 500;}
#TestText{font-size: 22px; margin: 0 auto; quotes: "\201C""\201D""\2018""\2019"; padding: 10px 20px; line-height: 1.4;}
#TestText:before {content: open-quote; display: inline; height: 0; line-height: 0; left: -10px; position: relative; top: 30px; color: #ccc; font-size: 3em;}
#TestText:after { content: close-quote; display: inline; height: 0; line-height: 0; left: 10px; position: relative; top: 35px; color: #ccc; font-size: 3em;}

.town{text-align: center; cursor: pointer;}
.town:hover{text-decoration: underline;}
#towns li{list-style: none; display: inline-block;}
#towns {text-align: center;}

body { overflow-x: hidden; /* Prevent scroll on narrow devices */ }
a{ color: #ffffff!important; text-decoration: none;}
a:hover{ text-decoration: underline;}
.blue-link{ color: #00264c !important; }
.blue-link:hover{ color: #ffb600; }
.title{ font-size: 40px; margin-bottom: 0px; margin-top: 0px;  font-weight: 500; color: #00264c; text-align: center;}
.small-title{ font-size: 30px; margin-bottom: 0px; margin-top: 0px;  font-weight: 500; color: #00264c; text-align: center;}
.sub-title{ font-size: 22px; margin-top: 0px; font-weight: 500; margin-bottom: 0px;  text-align: center;}
.yellow-line{ border-bottom: 3px solid #ffb600; width: 20%; margin: 0 auto; margin-top: 20px; margin-bottom: 20px; }
.spacer{ margin-bottom: 20px; margin-top: 20px; overflow: auto; }
.small-spacer{ margin-bottom: 10px; margin-top: 10px; overflow: auto; }
.white{ color: #fff; }
.text-left{ text-align: left !important; }
.bold{ font-weight: 600; }
.clear{display: inline-block;}
.blue-bar a:link{ color: #fff !important; }
.push-left{ float: left; }
.light-blue-bg{ background-color: #1978ce; }
.dark-bg{ background-color: #223243; border-top: solid 2px #1978ce;} 
.see-through-bg{ background: rgba(25, 120, 206, 0.62); padding: 20px; }
/*HEADER SECTION*/

.top-bar{ background-color: #223243; padding: 10px 0px 10px 0px; border-bottom: solid 2px #1978ce; }
.info-top img{ max-width: 20px; width: 100%; float: left; margin-right: 10px;}
.info-top ul{ padding-left: 0px;  margin-bottom: 0px; display: inline-block; float: right; }
.info-top ul li{ line-height: 20px; border-right: 1px solid #fff; color: #fff; display: inline-block; padding: 0 10px; font-weight: normal; font-size: 18px; list-style: none; }
.info-top ul li:first-child { padding-left: 0px; }
.info-top ul li:last-child { border:none; }
header{}
.logo img{ max-width: 225px; width: 100%; float: left; margin-top: 10px; margin-bottom: 10px;}
/*.spacer{ margin-top: 122px; }*/
.button{ border: none; border-bottom: 5px solid #76a321; color: #fff; background: #93c83f; cursor: pointer; font-weight: 600; font-size: 24px; margin-top: 20px; text-align: center; padding: 17px 30px; white-space: nowrap; display: inline-block; text-decoration: none; -webkit-animation-delay: 2s; animation-delay: 2s; -webkit-transition: background 0.3s ease-in-out, color 0.3s ease-in-out; transition: background 0.3s ease-in-out, color 0.3s ease-in-out; -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); width: 100%; max-width: 240px; border-radius: 5px; }
.button:hover{ }
.button:active{transform: translateY(4px);}
.button a{ color: #00264c; }
/*HEADER SECTION*/

/*MIDDLE SECTION*/
.blue-bar{ background-color: #223243; color: #fff; padding: 30px; position: relative; }
.blue-bar p{ text-align: center; font-size: 36px;  font-weight: 100; margin-bottom: 0px;  }
.blue-bar-c2a{ font-weight: 700; font-size:48px;}
.mob-number h2{ background-color: #223243; display: none; font-weight: 700; padding: 10px; margin-top: 10px; text-align: center; color: #fff;}
.content{  text-align: center; margin-top: 60px; margin-bottom: 60px;}
.next-line { display: none;}
.pro-icons{ max-width: 100px; width: 100%; margin: 0 auto; display: block;}
.pro-text{  }

/*MIDDLE SECTION*/

/*BANNER SECTION*/
.banner{ height: 600px; background: url(../images/wembley-glazier.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; }
.banner-title{ font-size: 40px; font-weight: 600; }
.banner-number{ font-size: 70px; font-weight: 600;  margin-top: 0px; display: inline-block;}
.banner-number-wrap{  }
.banner-number-wrap img{ max-width: 60px;  margin-bottom: 30px;}
.banner-title-sub{ font-size: 24px; font-weight: 500; }
.banner-wrap{ margin-top: 80px; }
.banner-box{ background: rgba(25, 120, 206, 0.62); padding: 20px;    height: 420px;}
.banner-box li{ font-size: 30px; background-image: url(../images/white-ticks.png); line-height: 40px; background-repeat: no-repeat; padding-left: 50px;  margin-bottom: 10px; text-align: left; height: 40px; list-style: none;}
.bullets { padding-left: 0px;}
.banner-box h1{ margin-top: 0px; }
.london-bg{ height: 400px; background: url(../images/london.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; }

.replacement .banner { background: url(../images/wembley-glazier2.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; }
.double-glazing .banner { background: url(../images/wembley-glazier3.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; }
.replacement-windows .banner { background: url(../images/wembley-glazier4.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; }
.toughened-glass .banner { background: url(../images/wembley-glazier5.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; }
.boarding-up .banner { background: url(../images/wembley-glazier6.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; }
/*BANNER SECTION*/

/*COOKIE PAGE*/
.cookie-page .title{ text-align: left; }
.cookie-page .sub-title{ text-align: left; }
/*COOKIE PAGE*/


/*FOOTER SECTION*/
footer{ color: #fff;}
.last-link{ border-right: none !important; }
.links{ margin-top: 20px; margin-bottom: 20px; text-align: center; }
.links a{ color: #fff; }
.links a:hover{ text-decoration: none; color: #1978ce;}
.links p{ display: inline-block; margin-bottom: 0px; }
.links ul{ padding: 0px; font-weight: 100; font-size: 18px;}
.links ul li{ display: inline; text-decoration: none; border-right: 1px solid #fff; padding-right: 10px; padding-left: 10px; }
.footer-links h2{ color: #fff; }
.footer-links ul{ padding: 0px; text-align: center; font-weight: 100; }
.footer-links ul li{ display: inline; text-decoration: none; text-align: left; color: #fff; }
.footer-links ul li:after { content: " |";}
.footer-number{ color: #fff; }
/*FOOTER SECTION*/

/*CONTACT*/
/*.details{ text-align: left; clear: both; }*/
.contact-form{  color: #2C458F;  width: 100%; margin: 0 auto;  }
.callback-form input  { border: 1px solid #0c58a1; padding: 10px; width: 49.5%; margin-bottom: 5px;}
.callback-form textarea{  min-height: 120px; border: 1px solid; padding: 10px; width: 100%;}
.callback-form .submit{ margin-top: 10px; max-width: 200px; width: 100%; transition: all 0.5s; cursor: pointer;}
.form-horizontal .form-group{margin-right: 0; margin-left: 0;}
.form-row{ width: 100%; margin: 0 auto; }
.form-half{ border: 1px solid #fff; padding: 10px; float: left; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.form-middle{width: 100%; display: inline-block; }
.right{ margin-right: 10px; }
.form-control{ font-size: 16px;}
#success_message{ display: none; font-size: 24px;}
.well{ background-color: transparent; border:none; box-shadow: none; margin-bottom: 0px; position: relative;}
.btn-warning:hover { color: #fff; background-color: #93c83f; border-color: #76a321;}
.btn-warning.active.focus, .btn-warning.active:focus, .btn-warning.active:hover, .btn-warning:active.focus, .btn-warning:active:focus, .btn-warning:active:hover, .open>.dropdown-toggle.btn-warning.focus, .open>.dropdown-toggle.btn-warning:focus, .open>.dropdown-toggle.btn-warning:hover{ background-color: #c53d14; border-color: #c53d14; }
.form-mob form{ display: none; }
/*CONTACT*/

/*OFF CANVAS MENU AND NAV*/

.menu-link span { display: block; position: absolute; height: 6px; width: 100%; max-width: 40px; background: #223243; border-radius: 9px; opacity: 1; left: 0;}

.menu-link span:nth-child(1) { top: 0px;}

.menu-link span:nth-child(2),#nav-icon3 span:nth-child(3) { top: 12px;}

.menu-link span:nth-child(4) { top: 24px;}

.menu-link.open span:nth-child(1) { top: 18px; width: 0%; left: 50%;}

.menu-link.open span:nth-child(2) { top: 4.5px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg);}

.menu-link.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg);}

.menu-link.open span:nth-child(4) { top: 18px; width: 0%; left: 50%;}


#menu { border-left: 3px solid #033566; position: fixed; top: 0; bottom: 0; width: 220px; height: 100%; background-color: #fff; z-index: 999; -webkit-transform: translate(0px, 0px); -moz-transform: translate(0px, 0px); -o-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); -webkit-transition: 0.15s ease; -moz-transition: 0.15s ease; -o-transition: 0.15s ease; transition: 0.15s ease; right: -220px; }
#menu.active { -webkit-transform: translate(-13.755em, 0px); -moz-transform: translate(-13.755em, 0px); -o-transform: translate(-13.755em, 0px); -ms-transform: translate(-13.755em, 0px); transform: translate(-13.755em, 0px); right: -248px; }
.menu-link { position: absolute; top: 12px; left: -50px; height: 33px; width: 40px; background-position: center center; background-size: 50%; z-index: 99; -webkit-transition: opacity 0.15s ease; -moz-transition: opacity 0.15s ease; -o-transition: opacity 0.15s ease; transition: opacity 0.15s ease; background-repeat: no-repeat; background-size: cover; cursor: pointer; }
.active a.menu-link{ position: absolute; top: 20px; left: -50px; padding-left: 5px; padding-top: 4px; background-repeat: no-repeat; background-size: cover; }
.active a.menu-link.glyphicon{ color: #ff4355; }
#menu ul { list-style: none; padding-left: 0px; }
#menu ul li{ padding: 20px; }
#menu ul a{ text-decoration: none; }

/*.navbar-right{ float: none !important; margin: 0 auto;}*/
.navbar{ margin-bottom: 0px; background: #fff; border-radius: 0px; border-bottom: solid 1px #eee; min-height: 20px;}
.navbar-left{float: none !important; }
.navbar-collapse{ width: 100%; margin: 0 auto; float: left; padding: 0; }
.navbar-inverse{ max-width: 706px; background-color: transparent; border-color: transparent; width: 100%; margin: 0 auto; float: right; margin-top: 40px; margin-bottom: 40px;}
.navbar li>a{ font-size: 14px; font-weight: 500; color: #00264c !important; text-transform: uppercase; padding-top: 0px; padding-bottom: 0px; }
.navbar li>a.nav-last{  }
.navbar-nav>li>a:hover{  color: #1978ce !important; }
/*OFF CANVAS MENU AND NAV*/
/*.navbar-fixed-top { background-color: #fff; border-bottom: 2px solid #ccc; } */
.dropdown{ display: none; }

/*SCROLL TO TOP BUTTON*/
.cd-top { border: 1px solid #fff; display: inline-block; height: 40px; width: 40px; position: fixed; bottom: 40px; right: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); /* image replacement properties */ overflow: hidden; text-indent: 100%; white-space: nowrap; background: #1978ce url(../images/cd-top-arrow.png) no-repeat center 50%; visibility: hidden; opacity: 0; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s;}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover { -webkit-transition: opacity .3s 0s, visibility 0s 0s; -moz-transition: opacity .3s 0s, visibility 0s 0s; transition: opacity .3s 0s, visibility 0s 0s; }
.cd-top.cd-is-visible { /* the button becomes visible */ visibility: visible; opacity: 1; }
/*.cd-top.cd-fade-out { opacity: .5; }*/ 
.no-touch .cd-top:hover { background-color: #e86256; opacity: 1; }
/*SCROLL TO TOP BUTTON*/


.mobile{ display: none; }
.desktop{ display: block; }

.service li {
	display:inline-block;
	color:#FFF;
	background-color:#0064BF;
	line-height:20px;
	margin:10px;
	padding:15px;
}

@media only screen and (max-device-width: 480px) {
        
		ul {
			padding:0px;
			margin:0px;	
		}
		
		.service li {
			display:block;
		 text-align:left;	
		
        }
}

@media only screen and (min-width: 992px) and (max-width: 1200px) {
.mobile{ display: block; }
.desktop{ display: none; }
.next-line{ display: block; }
.navbar li>a{ border:none; }
.logo h2{ float: none; margin: 0 auto; text-align: center; }
.top-bar{ display: none; }
.navbar{ min-height: 0px; padding: 10px; }
.banner-wrap{ text-align: center; }
.banner{ height: auto; }
.banner-box{ height: auto; margin-bottom: 20px;}
.banner-box li{text-align: center; background-image: none; padding: 0;}
.form-desktop form{ display: none; }
.logo img{ display: block; float: none; margin: 0 auto; margin-bottom: 5px; }
.banner-wrap{ margin-top: 20px; }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
.mobile{ display: block; }
.desktop{ display: none; }
.next-line{ display: block; }
.navbar li>a{ border:none; }
.navbar{ min-height: 0px; padding: 10px; }
.logo h2{ float: none; margin: 0 auto; text-align: center; }
.blue-bar a:link{color: #fff;}
.footer-links{ text-align: center; }
.footer-links ul{ text-align: center; }
.links{ text-align: center; }
.top-bar{ display: none;}
.mob-number h2{ display: block; margin-bottom: 0px; margin-top: 0px; font-size: 48px;}
a:link{ color: #fff!important; }
a.colour{ color: #00264c!important; }
a.cookie {color: #00264c!important; }
.banner-wrap{ text-align: center; margin-top: 20px; margin-bottom: 20px;}
.banner{ height: auto; }
.banner-box{ height: auto; }
.banner-box li{text-align: center; background-image: none; padding: 0; font-size: 24px;}
.banner-title{ font-size: 30px; }
.banner-title-sub{ font-size: 18px; }
.form-desktop form{ display: none; }
.logo img{ display: block; float: none; margin: 0 auto; margin-bottom: 5px; }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
.mobile{ display: block; }
.desktop{ display: none; }
.next-line{ display: block; }
.navbar li>a{ border:none; }
.navbar{ min-height: 0px; padding: 10px; }
.logo h2{ float: none; margin: 0 auto; text-align: center; }
.content{ padding: 0px; margin-top: 20px; margin-bottom: 20px; }
.title{ font-size: 30px; }
.small-title{ font-size: 30px; }
.sub-title{ font-size: 22px; }
.blue-bar-c2a{ font-size: 38px; }
.blue-bar p{ font-size: 26px; }
.blue-bar a:link{color: #fff;}
.footer-links{ text-align: center; margin-top: 30px; }
.footer-links ul{ text-align: center; }
.links{ text-align: center; }
.top-bar{ display: none;}
.mob-number h2{ display: block; margin-bottom: 0px; margin-top: 0px; font-size: 38px;}
a:link{ color: #fff!important; }
a.colour{ color: #00264c!important; }
a.cookie {color: #00264c!important; }
.banner-wrap{ text-align: center; margin-top: 20px; margin-bottom: 20px;}
.banner{ height: auto; }
.banner-box{ height: auto; }
.banner-box li{text-align: center; background-image: none; padding: 0; font-size: 20px;}
.banner-title{ font-size: 30px; }
.banner-title-sub{ font-size: 18px; }
.form-desktop form{ display: none; }
.logo img{ display: block; float: none; margin: 0 auto; margin-bottom: 5px; }
.banner-number{ font-size: 30px; }
.banner-number-wrap img{ display: none; }
}

@media only screen and (min-width:250px) and (max-width: 479px){
.mobile{ display: block; }
.desktop{ display: none; }
.next-line{ display: block; }
.navbar li>a{ border:none; }
.navbar{ min-height: 0px; padding: 5px; }
.logo h2{ float: none; margin: 0 auto; text-align: center; font-size: 20px; }
.content{ padding: 0px; margin-top: 20px; margin-bottom: 20px; }
.title{ font-size: 24px; }
.small-title{ font-size: 24px; }
.sub-title{ font-size: 18px; }
.blue-bar{ padding: 10px; }
.blue-bar-c2a{ font-size: 30px; }
.blue-bar p{ font-size: 18px; }
.footer-links{ text-align: center; margin-top: 30px;}
.footer-links ul{ text-align: center; }
.links{ text-align: center; }
.top-bar{ display: none;}
.mob-number h2{ display: block; margin-bottom: 0px; margin-top: 0px; font-size: 20px;}
a:link{ color: #fff!important; }
a.colour{ color: #00264c!important; }
a.cookie {color: #fff!important; }
.banner-wrap{ text-align: center; margin-top: 10px; margin-bottom: 10px;}
.banner{ height: auto; }
.banner-box{ height: auto; }
.banner-box li{text-align: center; background-image: none; padding: 0; font-size: 16px;}
.banner-title{ font-size: 16px; }
.banner-title-sub{ font-size: 12px; }
.banner-number{ font-size: 18px; }
.button{ margin-top: 10px; }
.form-desktop form{ display: none; }
.logo img{ display: block; float: none; margin: 0 auto; margin-bottom: 5px; }
.spacer{ margin-top: 10px; margin-bottom: 10px; }
.links ul{font-size: 16px;}
.navbar li>a{ font-size: 12px; }
.banner-number-wrap img{ display: none; }
.links p{ display: block; }
footer{min-height: 520px;}
.fixed-bottom {display: block;}

}