.master-slider{
position: relative;
visibility: hidden;
-moz-transform: translate3d(0 , 0 , 0);
}
.master-slider a {
-webkit-transition: none;
-o-transition: none;
transition: none;
}
.master-slider, .master-slider * {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.master-slider.before-init{}
.master-slider.ms-fullheight{height: 100%;}
.ms-layout-partialview .ms-view {
overflow: visible;
background-color:transparent;
}
.ms-layout-partialview .ms-container { overflow: hidden; }
.master-slider img, .ms-slide-bgvideocont video {max-width:none;}
.ms-ie img{border:none;}
.ms-ie8 * {opacity:inherit;filter:inherit;}
.ms-ie7   {zoom:1;}
.ms-moz .ms-slide-bgcont>img { transform: translateX(0px); }
.ms-loading-container{
position:absolute;
width:100%;
top:0;
}
.ms-slide-auto-height { display: table; }
.ms-loading-container .ms-loading,
.ms-slide .ms-slide-loading {
width: 36px;
height: 36px;
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/script/masterslider/style/loading-2.gif) no-repeat center white;
border-radius: 60px;
box-shadow: 0px 0px 3px rgba(0,0,0,0.2);
position: absolute;
left: 50%;
top: 50%;
margin: -18px;
opacity: 0.9;
} .ms-no-swipe, .ms-def-cursor{cursor:auto !important;}
.ms-grab-cursor{cursor: url(//www.jslawfirm.ca/wp-content/themes/jslaw/script/masterslider/style/grab.png), move;}
.ms-grabbing-cursor{cursor: url(//www.jslawfirm.ca/wp-content/themes/jslaw/script/masterslider/style/grabbing.png), move;}
.ms-ie .ms-grab-cursor{cursor: move;}
.ms-ie .ms-grabbing-cursor {cursor: move;}
.ms-view {
margin:0px auto;
overflow:hidden;
background:black;
position:relative;
-webkit-perspective: 2000px;
-moz-perspective: 2000px;
-ms-perspective: 2000px;
perspective: 2000px;
}
.ms-view .ms-slide-container{position:relative;}
.ms-slide {
position:absolute;
height:100%;
-webkit-transform: translateZ(0px);
-ms-transform: translateZ(0px);
-o-transform: translateZ(0px);
transform: translateZ(0px);
}
.ms-wk .ms-slide {
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.ms-slide.selected {}
.ms-slide .ms-slide-bgcont,
.ms-slide .ms-slide-bgvideocont{
position: absolute;
overflow:hidden;
width: 100%;
}
.ms-slide .ms-slide-link {
display: block;
width: 100%;
height: 100%;
position: absolute;
top:0;
z-index: 110;
}
.ms-ie .ms-slide-link {
background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBR‌​AA7) 0 0 repeat;
}
.ms-slide .ms-slide-bgvideocont{
z-index: 105;
height: 100%;
}
.ms-wk .ms-slide .ms-slide-bgvideocont,
.ms-wk .ms-slide-bgvideocont>video{
-webkit-transform: translateZ(0.3px);
transform: translateZ(0.3px);
}
.ms-slide .ms-slide-bgvideo{
position: absolute;
top: 0px;
}
.ms-inner-controls-cont, .ms-container {position: relative; margin:0 auto;}
.ms-slide .ms-slide-bgcont img , .ms-container , .ms-inner-controls-cont{
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
}
.ms-slide .ms-layer,
.ms-fixed-layers .ms-layer,
.ms-overlay-layers .ms-layer {
position:absolute;
pointer-events: auto;
}
.ms-layer-mask {
position: absolute;
overflow: hidden;
}
.ms-layer-mask .ms-layer{
position: relative;
}
.ms-slide .ms-slide-layers,
.ms-overlay-layers .ms-slide-layers,
.ms-fixed-layers {
position: absolute;
overflow:hidden;
width:100%;
height: 100%;
z-index: 109;
top:0px;
pointer-events: none;
}
.ms-slide .ms-slide-video{
position:absolute;
top:0;
z-index: 111;
background:black;
padding:0;
margin: 0;
border: none;
}
.ms-parallax-layer {
width: 100%;
position: absolute;
top: 0;
}
.ms-scroll-parallax-cont{
position: absolute;
top:0;
width: 100%;
height: 100%;
}
.ms-wk .ms-scroll-parallax-cont{
-webkit-transform: translateZ(0.4px);
transform: translateZ(0.4px);
}   .ms-overlay-layers {
position: absolute;
top: 0;
z-index: 120;
width: 100%;
height: 100%;
pointer-events: none;
} .ms-action-layer{cursor: pointer;}
.ms-btn-container{position: absolute;}
.ms-btn {
text-decoration: none;
display: inline-block;
color:black;
position: relative;
padding: 8px 15px;
cursor: pointer;
white-space: nowrap;
}
.ms-default-btn{
background: #0074A2;
border-radius: 5px;
color: #FFF;
}
.ms-default-btn:hover{background-color: #0098D5;}
.ms-default-btn:active{top:1px;}
.ms-btn-s{
padding: 14px 17px;
font-size: 80%;
line-height: 0;
}
.ms-btn-m{
padding: 12px 40px;
}
.ms-btn-n{
padding: 8px 25px;
font-size: 95%;
}
.ms-btn-l{
padding: 17px 50px;
font-size: 120%;
}
.ms-btn-box{}
.ms-btn-round{border-radius: 5px;}
.ms-btn-circle{border-radius: 100px;}
.ms-btn-outline-box{}
.ms-btn-outline-round{border-radius: 5px;}
.ms-btn-outline-circle{border-radius: 100px;} .ms-layer.video-box{background:black;}
.ms-layer.video-box iframe{
padding:0;
margin: 0;
border: none;
position: absolute;
z-index: 111;
}
.ms-slide .ms-slide-vpbtn , .ms-slide .ms-video-btn{
position:absolute;
cursor: pointer;
z-index: 112;
}
.ms-slide .ms-slide-vcbtn{
position:absolute;
cursor: pointer;
z-index: 113;
}
.ms-slide-vcbtn-mobile{
position: relative;
bottom: 0;
left:0;
width:100%;
height: 28px;
background-color: black;
color: white;
text-align: center;
cursor: pointer;
z-index: 113;
}
.ms-slide-vcbtn-mobile .ms-vcbtn-txt {
text-transform: uppercase;
font-family: sans-serif;
font-size: 0.75em;
display: inline-block;
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/script/masterslider/style/video-close-btn.png) no-repeat 0px 3px;
padding-left: 15px;
height: 15px;
color: #DBDBDB;
margin-top: 7px;
}
.ms-wk .ms-slide .ms-slide-vcbtn,
.ms-wk .ms-slide .ms-slide-layers,
.ms-wk .ms-slide .ms-slide-vpbtn,
.ms-wk .ms-slide .ms-slide-video,
.ms-wk .ms-slide-link {
-webkit-transform: translateZ(0.44px);
transform: translateZ(0.44px);
}
.ms-video-img{
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
}
.ms-mask-frame{
overflow:hidden;
position:absolute;
float:left;
} .ms-thumb-list{
overflow:hidden;
position:absolute;
}
.ms-thumb-list.ms-dir-h {width: 100%;}
.ms-thumb-list.ms-dir-v {height: 100%; top: 0;}
.ms-thumbs-cont{position: relative;}
.ms-thumb-frame img{width:100%;	height:auto;}
.ms-thumb-frame{
cursor: pointer;
float: left;
overflow: hidden;
opacity: 0.5;
-webkit-transition: opacity 300ms;
-moz-transition: opacity 300ms;
-ms-transition: opacity 300ms;
-o-transition: opacity 300ms;
transition: opacity 300ms;
}
.ms-thumb-frame-selected{ opacity: 1; }
.ms-tabs .ms-thumb-frame {
background-color: #F6f6f6;
text-shadow: 0 1px 1px white;
color: #222;
border: solid 1px white;
border-width: 0 1px 1px 0;
overflow: visible;
position: relative;
opacity: 1;
-webkit-transition: all 300ms ease-out;
-moz-transition: all 300ms ease-out;
-ms-transition: all 300ms ease-out;
-o-transition: all 300ms ease-out;
transition: all 300ms ease-out;
}
.ms-tabs.ms-dir-h .ms-thumb-frame {margin-top: 12px;}
.ms-tabs.ms-dir-v .ms-thumb-frame {margin-left: 12px;}
.ms-tabs.ms-dir-v.ms-align-left .ms-thumb-frame {margin-left: 0px;}
.ms-tabs.ms-dir-h.ms-align-top {z-index: 140;}
.ms-tabs.ms-dir-h.ms-align-top  .ms-thumb-frame{margin-top: -12px;}
.ms-tabs .ms-thumb{padding: 20px 20px;}
.ms-tabs .ms-thumb-frame-selected {	opacity: 1; background: #EDEDED;}
.ms-tabs .ms-thumb-frame .ms-thumb-ol {
position: absolute;
opacity: 0;
-webkit-transition: all 300ms ease-out;
-moz-transition: all 300ms ease-out;
-ms-transition: all 300ms ease-out;
-o-transition: all 300ms ease-out;
transition: all 300ms ease-out;
}
.ms-tabs.ms-dir-h .ms-thumb-frame .ms-thumb-ol {
top: 0px;
left: 50%;
margin-left: -12px;
border-bottom: solid 12px #F6f6f6;
border-left: solid 12px transparent;
border-right: solid 12px transparent;
}
.ms-tabs.ms-dir-h.ms-align-bottom .ms-thumb-frame-selected .ms-thumb-ol{
opacity: 1;
top:-12px;
border-bottom-color: #EDEDED;
}
.ms-tabs.ms-dir-h.ms-align-top .ms-thumb-frame .ms-thumb-ol {
bottom: 0px;
top:auto;
border-bottom:0px;
border-top: solid 12px #F6f6f6;
}
.ms-tabs.ms-dir-h.ms-align-top .ms-thumb-frame-selected .ms-thumb-ol{
opacity: 1;
bottom:-12px;
border-top-color: #EDEDED;
}
.ms-tabs.ms-dir-v .ms-thumb-frame .ms-thumb-ol {
top: 50%;
left: 0;
margin-top: -12px;
border-right: solid 12px #EDEDED;
border-top: solid 12px transparent;
border-bottom: solid 12px transparent;
}
.ms-tabs.ms-dir-v.ms-align-right .ms-thumb-frame-selected .ms-thumb-ol{
opacity: 1;
left:-12px;
border-right-color:#EDEDED;
}
.ms-tabs.ms-dir-v.ms-align-left .ms-thumb-frame .ms-thumb-ol {
left: auto;
right: 0;
border-right: 0;
border-left: solid 12px #EDEDED;
}
.ms-tabs.ms-dir-v.ms-align-left .ms-thumb-frame-selected .ms-thumb-ol{
opacity: 1;
right:-12px;
border-left-color:#EDEDED;
} .ms-thumb-list.ms-dir-h .ms-thumblist-fwd, .ms-thumb-list.ms-dir-h .ms-thumblist-bwd {
height: 100%;
width: 20px;
position: absolute;
left: 0;
cursor: pointer;
background: rgba(128, 128, 128, 0.5);
text-align: center;
color: white;
}
.ms-thumb-list.ms-dir-h .ms-thumblist-bwd {
right: 0;
left: auto;
}
.ms-thumb-list.ms-dir-h .ms-thumblist-fwd:after, .ms-thumb-list.ms-dir-h .ms-thumblist-bwd:after {
content: close-quote;
top: 43%;
position: relative;
border: solid rgba(0, 0, 0, 0);
border-width: 5px 5px 5px 0px;
display: block;
border-right-color: #FFF;
width: 6px;
height: 1px;
}
.ms-thumb-list.ms-dir-h .ms-thumblist-bwd:after {
border-width: 5px 0px 5px 5px;
border-left-color: #FFF;
left: 7px;
} .ms-thumb-list.ms-dir-v .ms-thumblist-fwd, .ms-thumb-list.ms-dir-v .ms-thumblist-bwd {
width: 100%;
height: 20px;
position: absolute;
top: 0;
cursor: pointer;
background: rgba(128, 128, 128, 0.5);
text-align: center;
color: white;
}
.ms-thumb-list.ms-dir-v .ms-thumblist-bwd {
bottom: 0;
top: auto;
}
.ms-thumb-list.ms-dir-v .ms-thumblist-fwd:after, .ms-thumb-list.ms-dir-v .ms-thumblist-bwd:after {
content: close-quote;
left: 43%;
position: relative;
border: solid rgba(0, 0, 0, 0);
border-width: 0px 5px 5px 5px;
display: block;
border-bottom-color: #FFF;
height: 1px;
top: 5px;
width: 0;
}
.ms-thumb-list.ms-dir-v .ms-thumblist-bwd:after {
border-width: 5px 5px 0px 5px;
border-top-color: #FFF;
top: 7px;
}
.ms-bullet{cursor:pointer;float: left;}
.ms-bullets.ms-dir-h {
position: absolute;
bottom: 20px;
right: 50%;
width: 100px;
}
.ms-bullets.ms-dir-v {
position: absolute;
top:50%;
}
.ms-bullets.ms-dir-v .ms-bullet{
float: none;
}
.ms-bullets.ms-dir-h .ms-bullets-count {
position: relative;
right: -50%;
}
.ms-sbar {position: absolute;}
.ms-sbar.ms-dir-h {
left: 10px;
right: 10px;
top: 5px
}
.ms-sbar.ms-dir-v {
top: 10px;
bottom: 10px;
right: 5px
}
.ms-sbar .ms-bar {
height: 4px;
background: #333;
border-radius: 4px;
}
.ms-sbar.ms-dir-v .ms-bar {	width: 4px;}
.ms-sbar .ms-bar{
position:relative;
-webkit-transition: opacity 300ms;
-moz-transition: opacity 300ms;
-ms-transition: opacity 300ms;
-o-transition: opacity 300ms;
transition: opacity 300ms;
}
.ms-timerbar {
width: 100%;
bottom: 0px;
position: absolute;
}
.ms-ctimer {
position: absolute;
top: 30px;
left: 30px;
cursor: pointer;
}
.ms-ctimer-bullet {}
.ms-time-bar{
-webkit-transition: width 120ms linear;
-moz-transition: width 120ms linear;
-ms-transition: width 120ms linear;
-o-transition: width 120ms linear;
transition: width 120ms linear;
}
.ms-ie7 .ms-tooltip-arrow{
height:0px;
}
.ms-slide-info {position: absolute;}
.ms-slide-info.ms-dir-v {top:0;}
.ms-slide-info.ms-dir-h {width:100%;}
@keyframes point-anim{
0% 		{transform: scale(0.5); -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -o-transform: scale(0.5); -ms-transform: scale(0.5);  opacity: 1; }
100% 	{transform: scale(0.5); -webkit-transform: scale(0.5); -moz-transform: scale(1.5); -o-transform: scale(1.5); -ms-transform: scale(1.5);  opacity: 0; }
}
@-webkit-keyframes point-anim{
0% 		{-webkit-transform: scale(0.5); opacity: 1; }
100% 	{-webkit-transform: scale(1.5);	opacity: 0; }
} .ms-android .ms-tooltip-point .ms-point-border{
animation:none;
-moz-animation:none;
-webkit-animation:none;
-o-animation:none;
}.ms-skin-default .ms-slide .ms-slide-vpbtn,
.ms-skin-default .ms-video-btn{
width: 50px;
height: 51px;
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/script/masterslider/skins/default/light-skin-1.png) no-repeat -14px -150px;
top: 50%;
left: 50%;
margin: -25px 0 0 -25px;
}
.ms-skin-default .ms-slide .ms-slide-vcbtn {
width: 30px;
height: 30px;
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/script/masterslider/skins/default/light-skin-1.png) no-repeat -24px -28px;
top: 18px;
right: 30px;
} .ms-skin-default .ms-nav-next,
.ms-skin-default .ms-nav-prev {
width: 30px;
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/script/masterslider/skins/default/light-skin-1.png);
background-position: -89px -26px;
height: 40px;
cursor: pointer;
top: 50%;
left: 30px;
margin-top: -20px;
position: absolute;
z-index: 140;
}
.ms-skin-default .ms-nav-next {
right: 30px;
left: auto;
background-position: -89px -103px;
}
.ms-skin-default .ms-bullet {
width: 10px;
height: 10px;
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/script/masterslider/skins/default/light-skin-1.png) no-repeat;
margin: 4px;
background-position: -34px -117px;
}
.ms-skin-default .ms-bullet-selected {
background-position: -34px -84px;
}
.ms-skin-default .ms-time-bar {
height: 3px;
background: #FFFFFF;
border-top: solid 1px rgba(0, 0, 0, 0.41);
}
.ms-skin-default .ms-tooltip{
position: absolute;
z-index: 210;
cursor: auto;
}
.ms-skin-default .ms-tooltip-top .ms-tooltip-arrow,
.ms-skin-default .ms-tooltip-bottom .ms-tooltip-arrow{
border-left: solid 10px transparent;
border-right: solid 10px transparent;
position: absolute;
left: 50%;
margin-left: -10px;
}
.ms-skin-default .ms-tooltip-top .ms-tooltip-arrow{
border-top: solid 10px;
border-top-color: silver;
border-top-color: rgba(240, 240, 240, 0.88);
bottom: -10px;
}
.ms-skin-default .ms-tooltip-bottom .ms-tooltip-arrow {
border-bottom: solid 10px;
border-bottom-color: silver;
border-bottom-color: rgba(240, 240, 240, 0.88);
top: -10px;
}
.ms-skin-default .ms-tooltip-right .ms-tooltip-arrow,
.ms-skin-default .ms-tooltip-left .ms-tooltip-arrow{
border-top: solid 10px transparent;
border-bottom: solid 10px transparent;
position: absolute;
top: 50%;
margin-top: -10px;
}
.ms-skin-default .ms-tooltip-right .ms-tooltip-arrow{
border-right: solid 10px;
border-right-color: silver;
border-right-color: rgba(240, 240, 240, 0.88);
left: -10px;
}
.ms-skin-default .ms-tooltip-left .ms-tooltip-arrow {
border-left: solid 10px;
border-left-color: silver;
border-left-color: rgba(240, 240, 240, 0.88);
right: -10px;
}
.ms-skin-default .ms-tooltip-point {cursor: pointer;}
.ms-skin-default .ms-tooltip-point .ms-point-center {
width: 12px;
height: 12px;
border-radius: 15px;
border: solid 2px #BBB;
background: white;
margin: -8px 0 0 -8px;
position: absolute;
z-index: 105;
}
.ms-skin-default .ms-tooltip-point .ms-point-border {
width: 22px;
height: 22px;
background: black;
background:rgba(0, 0, 0, 0.36);
margin: -11px 0 0 -11px;
position: absolute;
border-radius: 15px;
animation: point-anim 1.5s infinite ;
-moz-animation: point-anim 1.5s infinite;
-webkit-animation: point-anim 1.5s infinite;
-o-animation: point-anim 1.5s infinite;
}
.ms-skin-default .ms-tooltip {
max-width:200px;
}
.ms-skin-default .ms-tooltip-cont {
padding: 10px;
background: silver;
background: rgba(240, 240, 240, 0.88);
text-shadow: 0 1px 0px white;
margin-left: -1px;
} @media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) {
.ms-skin-default .ms-slide .ms-slide-vpbtn,
.ms-skin-default .ms-video-btn,
.ms-skin-default .ms-slide .ms-slide-vcbtn,
.ms-skin-default .ms-nav-next,
.ms-skin-default .ms-nav-prev,
.ms-skin-default .ms-bullet{
background-image:url(//www.jslawfirm.ca/wp-content/themes/jslaw/script/masterslider/skins/default/light-skin-1-retina.png);
background-size: 152px 225px;
}
}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,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
outline: none;
vertical-align: baseline
}
*:focus {
outline: 0
}
main {
padding-bottom: 50px
}
p {
margin-bottom: .5em
}
strong,
b {
font-weight: 700
}
html {
margin-top: 0 !important;
position: relative;
height: 100%;
background-color: #f0f0f0
}
body {
height: 100%;
background-color: #f0f0f0;
font-family: 'Open Sans', "Myriad Pro", "Gill Sans", "Gill Sans MT", Calibri, sans-serif;
color: #000;
line-height: 1.6em;
font-weight: 400;
position: relative;
font-size: 16px
}
a:link,
a:visited {
text-decoration: none;
color: #000
}
p {
margin-bottom: 1.5em
}
ol p {
margin-bottom: 4px !important
}
* {
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased;
text-rendering: optimizeLegibility;
-webkit-appearance: none
}
::-webkit-input-placeholder {
color: #000
}
::-moz-placeholder {
color: #000
}
:-ms-input-placeholder {
color: #000
}
:-moz-placeholder {
color: #000
}
#topheader {
background-color: #000;
color: #fff;
padding: 5px 16px;
overflow: auto;
text-align: center
}
#topheader div {
margin: 0 26px;
display: inline-block;
font-size: 14px;
text-transform: uppercase
}
.quick-contact {
margin-top: 5px;
position: absolute;
top: 0;
right: 0;
height: 35px
}
.quick-contact .quick-portal::before {
margin-right: 5px;
width: 28px;
height: 28px;
content: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/icon_mouse.png);
position: absolute;
left: -32px;
top: 2px
}
.quick-contact .quick-phone::before {
margin-right: 5px;
width: 28px;
height: 28px;
content: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/icon_phone.png);
position: absolute;
left: -32px;
top: 2px
}
.quick-contact .quick-item {
display: inline-block;
margin-right: 8px;
height: 35px;
line-height: 35px;
vertical-align: top;
position: relative
}
.quick-contact .quick-item:last-child {
margin-right: 0
}
.header_social a {
display: block;
color: #000;
text-decoration: none;
font-weight: 400;
font-size: 17px;
text-align: center;
line-height: 25px
}
.header_social a:hover {
-moz-opacity: .9;
-webkit-opacity: .9;
opacity: .9;
filter: alpha(opacity=90)
}
ul.header_social {
margin: 0;
text-align: right;
list-style-type: none;
display: inline-block;
height: 30px;
margin-top: 3px
}
ul.header_social li {
margin-right: 4px;
width: 28px;
height: 28px;
float: right;
background-size: contain;
list-style-type: none !important;
background-color: #eee;
border-radius: 63px;
border: 1px solid #9a9abf
}
.header-contactbar {
height: 25px;
background-color: #000;
color: #fff;
line-height: 25px;
padding: 0 15px
}
.header-contactbar a {
color: #fff;
font-weight: 700
}
.header-main-wrap {
display: table;
width: 100%;
padding: 0;
table-layout: fixed;
height: 100%
}
.header-main-row {
display: table-row;
height: 100%
}
.searchbar {
position: absolute;
bottom: -40px;
right: -5px;
padding: 0 10px 10px 10px;
display: block;
width: 400px;
display: none;
background: #fff;
color: #000;
border-radius: 0 0 5px 5px
}
.searchbar div {
text-align: center
}
.searchbar #s {
width: 96%;
background-color: transparent;
height: 100%;
margin: 0 auto;
border: 0;
color: #000;
border-bottom: 1px solid #000;
-webkit-transition: all ease 200ms;
transition: all ease 200ms;
float: right;
font-size: 14px;
font-family: 'Myriad Pro', 'Open Sans', 'Gill Sans', 'Gill Sans MT', Calibri;
text-align: right;
padding-right: 5px
}
.mobile-searchbar {
display: block;
width: 100%;
padding: 10px;
color: #000;
border-radius: 4px;
background-color: #000;
overflow: hidden;
height: auto;
margin: 25px 0;
border: 3px solid #000
}
.mobile-searchbar #searchform {
margin-right: 30px
}
.mobile-searchbar div {
text-align: center
}
.mobile-searchbar #s {
width: 96%;
background-color: transparent;
height: 100%;
margin: 0 auto;
border: 0;
color: #fff;
-webkit-transition: all ease 200ms;
transition: all ease 200ms;
font-size: 16px;
text-transform: uppercase;
font-family: 'Myriad Pro', 'Open Sans', 'Gill Sans', 'Gill Sans MT', Calibri;
text-align: Left;
padding-right: 5px
}
.mobile-searchbar i {
position: absolute;
right: 10px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
color: #fff;
font-size: 22px
}
#menu-topnav {
margin-top: 0
}
#search_icon {
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/search_icon.png) no-repeat;
width: 30px;
height: 30px;
float: right;
cursor: pointer
}
.topNav {
float: right;
list-style: none;
float: right;
width: 700px;
margin: 4px 0 0
}
.headerbar_wrap {
width: 100%;
background-color: #2662ab;
height: 30px
}
.topNav>li:not(:last-child) {
margin-left: 10px
}
.topNav li {
float: right;
padding: 0;
position: relative;
display: inline;
padding: 0 5px;
text-align: left
}
.topNav li a {
display: block;
padding: 5px;
color: #fff;
text-decoration: none
}
.topNav>li:not(:last-child):before {
content: "|";
position: absolute;
left: -5px;
top: 4px
}
.toplogo {
width: 150px;
height: 102px;
border-radius: 15px;
display: table-cell;
padding-bottom: 10px;
vertical-align: middle;
text-align: left;
-webkit-transition: height .3s;
transition: height .3s
}
.toplogo img {
-webkit-transition: height .3s;
transition: height .3s;
width: 150px;
height: 102px
}
.header_right {
display: table-cell;
width: 100%;
vertical-align: bottom;
height: 100%
}
.mobile_logo {
display: none
}
#banner {
position: relative;
z-index: 0;
padding-top: 60px
}
.mobilebanner {
display: none
}
#home_banner img {
width: 100%
}
.header {
padding-top: 0
}
.header_phone {
color: #fff;
font-weight: 700;
-webkit-transition: all .3s;
transition: all .3s;
text-align: center;
font-weight: 18px;
display: block;
top: 10px;
right: 0;
position: absolute;
font-size: 15px
}
.header_phone a {
color: #000
}
.blue {
color: #000
}
.header_phone a span {
line-height: 16px;
text-transform: uppercase
}
.header_phone:hover {
opacity: .9;
color: #2662ab
}
.header {
width: 100%;
margin: 0 auto;
display: block;
overflow: visible;
position: fixed;
background-color: #fff;
z-index: 20;
top: 0;
-webkit-transition: height .3s;
transition: height .3s;
-webkit-transition: background-color .6s;
transition: background-color .6s;
border-bottom: 1px solid #ebebeb;
text-align: right
}
.headerbar {
color: #fff;
vertical-align: middle;
text-align: right;
width: 960px;
margin: 0 auto;
font-weight: 700;
font-size: 16px;
margin-top: 0;
position: relative
}
header .header-inner {
width: 1140px;
position: relative;
margin: 0 auto;
height: 75px;
text-align: center
}
header .header-inner .menu {
height: 50px;
padding-left: 0;
margin: 0;
float: right;
margin-top: 50px
}
header .header-inner .menu>.menu-item {
font-size: 14px;
background-color: transparent;
display: inline;
float: left;
font-weight: 200;
margin-left: -2px;
text-decoration: none;
cursor: pointer;
text-transform: uppercase;
font-weight: 700
}
header .header-inner .menu>.menu-item:hover,
header .header-inner .menu>.menu-item.active,
header .header-inner .menu>.menu-item:focus {
background-color: transparent;
outline: none
}
header .header-inner .menu>.menu-item a:after,
header .header-inner .menu>.menu-item span:after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-style: solid;
border-width: 0 10px 12px;
border-color: transparent transparent #dfdfdf;
bottom: 0;
left: 50%;
margin-left: -10px;
opacity: 0;
bottom: -16px
}
header .header-inner .menu>.menu-item.menu-item-has-children:hover a:after,
header .header-inner .menu>.menu-item.menu-item-has-children:hover span:after {
opacity: 1;
border-color: transparent transparent #dfdfdf
}
header .header-inner .menu>.menu-item.menu-item-has-children.active a:after,
header .header-inner .menu>.menu-item.menu-item-has-children.active span:after {
opacity: 1;
border-color: transparent transparent #dfdfdf
}
header .header-inner .menu>.menu-item.menu-item-has-children:focus a:after,
header .header-inner .menu>.menu-item.menu-item-has-children:focus span:after {
opacity: 1;
border-color: transparent transparent #dfdfdf
}
header .header-inner .menu>.menu-item>span {
padding: 0 15px;
line-height: 50px;
display: block;
color: #fff;
position: relative;
font-weight: 800
}
.blue span {
color: #000 !important
}
header .header-inner:after {
clear: both;
height: 0;
visibility: hidden;
display: block;
content: ''
}
header .inner-wrapper {
position: relative
}
header .sub-menu-container {
display: block;
position: absolute;
z-index: 10;
left: 0;
width: 100%;
overflow: hidden;
max-height: 0;
top: 116px
}
header .sub-menu-container.visible {
max-height: 600px
}
header .sub-menu-container .sub-menu-wrapper {
display: none;
background-color: #e9e9e9;
border-top: 2px solid #dfdfdf
}
header .sub-menu-container .sub-menu-wrapper.active {
display: block
}
header .sub-menu-container .sub-menu-wrapper .row {
display: block;
padding-left: 0;
margin: 0;
background-image: url(data:image/pngbase64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAAUCAAAAACCUrN+AAAADklEQVQIW2P4/5+BXAQAq8gn2Qr8MncAAAAASUVORK5CYII=), url(data:image/pngbase64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAAUCAAAAACCUrN+AAAADklEQVQIW2P4/5+BXAQAq8gn2Qr8MncAAAAASUVORK5CYII=);
background-position: 33.333% 0, 66.666% 0;
background-repeat: repeat-y, repeat-y;
background-size: 1px 10px;
width: 1140px;
margin: 0 auto
}
header .sub-menu-wrapper {
width: 1140px;
margin: 0 auto
}
header .sub-menu-container .sub-menu-wrapper .row li {
display: inline-block;
float: left;
width: 33.33%;
padding: 20px;
position: relative
}
header .sub-menu-container .sub-menu-wrapper .row li a {
text-decoration: none;
display: block;
margin-left: 20px;
text-align: left
}
header .sub-menu-container .sub-menu-wrapper .row li a .title {
display: block;
margin-bottom: 10px;
color: #000;
font-size: 16px;
font-weight: 200;
text-align: left
}
header .sub-menu-container .sub-menu-wrapper .row li a .description {
font-size: 12px;
color: #000;
line-height: 16px;
display: block
}
header .sub-menu-container .sub-menu-wrapper .row li a:before {
content: '';
display: block;
position: absolute;
top: 26px;
left: 18px;
width: 0;
height: 0;
border-style: solid;
border-width: 6px 0 6px 10.4px;
border-color: transparent transparent transparent #000
}
header .sub-menu-container .sub-menu-wrapper .row li a:hover,
header .sub-menu-container .sub-menu-wrapper .row li a:focus {
outline: none
}
header .sub-menu-container .sub-menu-wrapper .row li a:hover .title,
header .sub-menu-container .sub-menu-wrapper .row li a:focus .title {
text-decoration: underline;
color: #000
}
header .sub-menu-container .sub-menu-wrapper .row li a:hover:before,
header .sub-menu-container .sub-menu-wrapper .row li a:focus:before {
border-color: transparent transparent transparent #113157
}
header .sub-menu-container .sub-menu-wrapper .row:after {
clear: both;
display: block;
height: 0;
visibility: hidden;
content: ''
}
#navigation {
-moz-opacity: 1;
-webkit-opacity: 1;
opacity: 1;
filter: alpha(opacity=100);
text-transform: uppercase;
color: #6c6963;
width: 100%;
display: block;
visibility: visible;
-moz-opacity: 1;
-webkit-opacity: 1;
opacity: 1;
filter: alpha(opacity=100);
font-size: 14px;
text-transform: uppercase;
text-align: center;
height: 48px
}
#navigation>ul>li>a:hover {
color: #2662ab
}
#navigation ul {
font-weight: 600;
list-style: none;
margin: 0;
transition: all .3s;
-moz-transition: all .3s;
-webkit-transition: all .3s;
height: 100%;
text-align: right
}
#navigation ul li {
display: inline-block
}
#navigation ul li:last-child {
padding-right: 0
}
#navigation ul li:hover {
background-color: #fff
}
#navigation ul li ul li:hover {
background-color: #cacbcc
}
#navigation ul li:hover>a {
color: #6c6963;
background-color: #fff;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23)
}
#navigation ul li:hover>a:only-child {
box-shadow: none
}
#navigation ul li:hover ul {
-moz-opacity: 1;
-webkit-opacity: 1;
display: block;
filter: alpha(opacity=100);
height: auto;
margin: 0;
opacity: 1;
position: absolute;
text-align: left;
visibility: visible
}
#navigation ul ul li:hover ul,
#navigation ul li:hover ul li:hover ul {
display: block;
filter: alpha(opacity=100);
height: auto;
left: 100%;
nowhitespace: afterproperty;
opacity: 1;
top: 0;
visibility: visible
}
#navigation ul ul {
-moz-opacity: 1;
-moz-transition: 200ms ease;
-o-transition: 200ms ease;
-webkit-opacity: 1;
-webkit-transition: 200ms ease;
display: none;
filter: alpha(opacity=100);
height: 0;
nowhitespace: afterproperty;
opacity: 1;
position: absolute;
transition: 200ms ease;
visibility: hidden
}
#navigation ul li:hover ul ul {
-moz-opacity: 1;
-moz-transition: 200ms ease;
-o-transition: 200ms ease;
-webkit-opacity: 1;
-webkit-transition: 200ms ease;
display: none;
filter: alpha(opacity=100);
height: 0;
nowhitespace: afterproperty;
opacity: 1;
position: absolute;
transition: 200ms ease;
visibility: hidden
}
#navigation ul li ul {
transition: all .3s;
-moz-transition: all .3s;
-webkit-transition: all .3s;
background-color: #fff;
display: none;
visibility: hidden;
z-index: 25;
color: #6c6963;
transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-webkit-transition: all .3s ease-in-out;
padding-bottom: 0;
padding-top: 0;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23)
}
#navigation ul li a {
color: #6c6963;
display: block;
padding: 0;
padding-left: 10px;
padding-right: 10px;
position: static;
text-decoration: none;
line-height: 40px
}
#navigation ul ul {
transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-webkit-transition: all .3s ease-in-out;
background: #fff;
text-align: left;
width: 200%
}
#navigation ul li {
margin: 0;
padding: 0;
position: relative
}
#navigation ul ul ul {
transition: all .3s;
-moz-transition: all .3s;
-webkit-transition: all .3s;
background: #e4e4e4 !important;
border-color: #839086 !important;
margin-left: -14px;
-webkit-transition: 200ms ease;
transition: 200ms ease
}
#navigation ul ul ul li a {
color: #6c6963
}
#navigation ul ul li {
border: none;
display: block;
padding-right: 0;
-webkit-transition: no;
transition: no
}
#navigation ul ul li:hover>a {
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23)
}
#navigation ul ul li a {
background: none !important;
color: #6c6963;
font-weight: 500;
float: none;
padding: 10px;
line-height: normal;
text-transform: none
}
#navigation ul>li.client_forms>a span:first-child {
color: #000
}
#navigation ul>li.client_forms:hover>a span:first-child {
color: #fff
}
#navigation ul li.searchlink:hover {
background-color: transparent
}
.searchlink i {
font-family: FontAwesome;
font-weight: 600;
font-size: 1.1em;
color: #000;
line-height: 50px
}
@media (max-width: 1175px) {
.quick-contact {
display: none
}
}
.mobile-searchbar {
display: block;
width: 100%;
color: #000;
border-radius: 5px;
background-color: #7f7f7f;
overflow: hidden;
height: auto;
margin: 25px 0;
border: 3px solid #7f7f7f;
padding: 5px 10px
}
.mobile-searchbar #s:-moz-placeholder,
.mobile-searchbar #s:-ms-input-placeholder,
.mobile-searchbar #s::-moz-placeholder,
.mobile-searchbar #s::-webkit-input-placeholder {
color: #fff
}
.mobile-searchbar #searchform {
margin-right: 30px
}
.mobile-searchbar div {
text-align: center
}
.mobile-searchbar #s {
width: 96%;
background-color: transparent;
height: 100%;
margin: 0 auto;
border: 0;
color: #fff;
-webkit-transition: all ease 200ms;
transition: all ease 200ms;
font-size: 16px;
text-transform: uppercase;
font-family: 'Myriad Pro', 'Open Sans', 'Gill Sans', 'Gill Sans MT', Calibri;
text-align: Left;
padding-right: 5px
}
.mobile-searchbar i {
position: absolute;
right: 10px;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
color: #fff;
font-size: 22px
}
body.mobile-menu-open header {
-webkit-transform: translateX(100%) translateX(-75px);
-ms-transform: translateX(100%) translateX(-75px);
transform: translateX(100%) translateX(-75px)
}
.mobile-menu-wrapper {
display: none;
position: fixed;
bottom: 0;
top: 0;
left: 0;
width: calc(100% - 75px);
overflow: hidden;
background-color: #fff;
-webkit-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
transform: translate(-100%, 0);
-webkit-transition: all 0.4s ease;
transition: all 0.4s ease
}
.mobile-menu a {
color: #000
}
body.mobile-menu-open .mobile-menu-wrapper {
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
font-size: 14px
}
body.mobile-menu-open .site-wrapper {
overflow: hidden;
pointer-events: none;
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feGaussianBlur stdDeviation="5" /></filter></svg>#filter');
-webkit-filter: blur(5px);
filter: blur(5px)
}
body.mobile-menu-open .site-wrapper:before {
content: ' ';
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: rgba(255, 255, 255, 0.8)
}
.mobile-menu-wrapper ul.mobile-menu {
-webkit-transition: all 0.2s;
transition: all 0.2s;
-webkit-transform: translate(100%, 0);
-ms-transform: translate(100%, 0);
transform: translate(100%, 0);
position: absolute;
top: 20px;
left: 0;
right: 0;
bottom: 20px;
margin-top: 0;
padding-left: 10px;
padding-right: 10px
}
.mobile-menu-wrapper ul.mobile-menu li {
list-style-type: none;
color: #666666;
position: relative;
border-bottom: 1px dashed rgba(82, 101, 140, 0.3)
}
.mobile-menu-wrapper ul.mobile-menu li.back-link {
padding: 14px 10px 14px 30px
}
.mobile-menu-wrapper ul.mobile-menu li.back-link:before {
display: block;
content: '';
position: absolute;
top: 50%;
margin-top: -12px;
left: 12px;
width: 0;
height: 0;
border-style: solid;
border-width: 12px 13px 12px 0;
border-color: transparent #000 transparent transparent
}
.mobile-menu-wrapper ul.mobile-menu li.back-link span {
display: block
}
.mobile-menu-wrapper ul.mobile-menu li.back-link span.back-title {
font-size: 1.3em;
line-height: 1em;
color: #000
}
.mobile-menu-wrapper ul.mobile-menu li.back-link span.back-sub-title {
font-size: 0.8em;
line-height: 1em;
color: #000
}
.mobile-menu-wrapper ul.mobile-menu li a {
padding: 10px 5px;
display: block;
text-decoration: none;
font-weight: bold
}
.mobile-menu-wrapper ul.mobile-menu li:last-child {
border-bottom: none
}
.mobile-menu-wrapper ul.mobile-menu li.menu-item-has-children a {
margin-right: 40px
}
.mobile-menu-wrapper ul.mobile-menu li.menu-item-has-children .sub-menu-link {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 60px
}
.mobile-menu-wrapper ul.mobile-menu li.menu-item-has-children .sub-menu-link:after {
display: block;
content: '';
position: absolute;
left: 5px;
top: 50%;
margin-top: -6px;
width: 0;
height: 0;
border-style: solid;
border-width: 6px 0 6px 10.4px;
border-color: transparent transparent transparent #000
}
.mobile-menu-wrapper ul.mobile-menu.active {
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0)
}
.mobile-menu-wrapper ul.mobile-menu.previous {
-webkit-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
transform: translate(-100%, 0)
}
body.mobile-menu-open {
overflow: hidden;
position: fixed
}
body.mobile-menu-open .site-wrapper {
overflow: hidden;
-webkit-overflow-scrolling: auto
}
body.mobile-menu-open header#site-header {
-webkit-transform: translateX(100%) translateX(-75px);
-ms-transform: translateX(100%) translateX(-75px);
transform: translateX(100%) translateX(-75px)
}
.caret_wrap {
height: 75px;
width: 75px;
background-color: #7f7f7f;
position: absolute;
top: 0;
left: 0;
display: block
}
.caret {
width: 75px;
height: 75px;
position: absolute;
cursor: pointer;
left: 0;
top: 0
}
.caret span {
display: block;
position: absolute;
height: 5px;
width: 34px;
background: #fff none repeat scroll 0% 0%;
opacity: 1;
filter: alpha(opacity=100);
-webkit-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
margin-top: 35px
}
.caret span:nth-child(1) {
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
left: 10px
}
.caret span:nth-child(2) {
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
right: 10px
}
.mobile-drop {
display: none;
height: 75px;
width: 75px;
background-color: #7f7f7f;
top: 0;
right: 0;
background-position: center center;
background-repeat: no-repeat;
background-size: 40px 40px;
position: absolute;
color: white;
font-size: 50px;
line-height: 75px;
text-align: center
}
.mobile-drop a {
display: block;
width: 100%;
height: 100%;
background-color: #7f7f7f;
color: #fff;
line-height: 75px;
font-size: 50px;
text-align: center
}
.mobile-drop ul {
list-style-type: none;
margin-left: 0;
width: 75px;
height: auto;
position: absolute;
top: 75px;
display: none
}
.mobile-drop ul li {
display: none;
height: 75px;
width: 75px;
background-color: #7f7f7f;
text-align: center
}
.mobile-drop.opened .caret span:nth-child(1) {
-webkit-transform: rotate(-405deg);
-ms-transform: rotate(-405deg);
transform: rotate(-405deg)
}
.mobile-drop.opened span:nth-child(2) {
-webkit-transform: rotate(405deg);
-ms-transform: rotate(405deg);
transform: rotate(405deg)
}
.hamburger_wrap {
height: 75px;
width: 75px;
background-color: #7f7f7f;
position: absolute;
top: 0;
left: 0;
display: none
}
.hamburger {
width: 41px;
height: 50px;
position: absolute;
cursor: pointer;
left: 50%;
margin-left: -21px;
top: 50%;
margin-top: -18.5px
}
.hamburger span {
display: block;
position: absolute;
height: 5px;
width: 100%;
background: #fff none repeat scroll 0% 0%;
opacity: 1;
filter: alpha(opacity=100);
right: 0px;
-webkit-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg)
}
.hamburger span:nth-child(1) {
margin-top: 0px
}
.hamburger span:nth-child(2) {
margin-top: 16px;
margin-right: 0px
}
.hamburger span:nth-child(3) {
margin-top: 32px
}
.hamburger.opened span:nth-child(1) {
-webkit-transform: rotate(135deg);
-ms-transform: rotate(135deg);
transform: rotate(135deg);
margin-top: 16px
}
.hamburger.opened span:nth-child(2) {
opacity: 0;
filter: alpha(opacity=0);
right: -75px
}
.hamburger.opened span:nth-child(3) {
-webkit-transform: rotate(-135deg);
-ms-transform: rotate(-135deg);
transform: rotate(-135deg);
margin-top: 16px
}
@media (max-width: 960px) {
.mobile-menu-wrapper {
display: block;
z-index: 10
}
.hamburger_wrap,
.mobile-drop {
display: block
}
}
.pill-title {
width: 100%;
text-align: center;
padding: 0 15px;
font-size: 26px;
text-align: center;
display: block;
text-transform: uppercase
}
.pill-btn-wrap {
width: 350px;
font-family: 'Open Sans', arial, sans-serif;
background-color: #cc2127;
height: 50px;
min-height: 50px;
max-height: 50px;
border-radius: 36px;
border: 3px solid #fff;
transition: all 0.3s ease !important;
margin: 24px auto 0 auto;
position: relative
}
.pill-btn-wrap a {
text-decoration: none !important;
color: inherit !important;
text-transform: uppercase !important;
font-size: 16px !important;
letter-spacing: -0.2px !important;
display: block;
font-weight: 700;
text-align: right;
float: right;
line-height: 46px !important;
transition: all 0.3s ease !important;
margin-right: 31px !important;
position: absolute;
right: 0;
top: 0;
color: #fff !important
}
.pill-btn-wrap a:hover {
color: #666 !important
}
.pill-left {
border-radius: 25px;
z-index: 1;
border: 3px solid #fff;
color: #fff;
background-color: #7f7f7f;
width: 58%;
height: 50px;
min-height: 50px;
max-height: 50px;
text-align: center;
position: relative;
margin-top: -3px !important;
margin-left: -3px !important
}
.pill-left a:after {
content: '\f04b';
position: absolute;
right: 4px;
top: 5px;
height: 36px;
width: 33px;
font-family: FontAwesome;
background-color: #a9a9a9;
color: #fff;
border-radius: 20px;
font-size: 20px;
line-height: 36px;
font-weight: bold;
transition: all 0.3s ease;
padding-left: 3px
}
.pill-left a {
font-size: 16px !important;
color: #fff !important;
text-align: center;
width: 100%;
margin-right: 0 !important;
padding-right: 28px;
line-height: 46px !important
}
.pill-left a:hover {
color: #cc2127 !important
}
.pill-left a:hover:after {
color: #cc2127 !important
}
@media (max-width: 575px) {
.pill-btn-wrap {
width: 315px
}
}
#footer {
background-color: #7f7f7f;
color: #000;
overflow: hidden;
height: auto;
text-align: left;
padding-top: 35px
}
.footer_bottom {
text-align: center;
line-height: 1.2em;
margin: 0 auto;
width: 100%;
background-color: #7f7f7f;
line-height: 59px;
border-top: 1px solid #fff;
overflow: hidden;
height: auto
}
.footer_bottom .duptronics_logo {
float: right
}
.footer ul {
list-style-type: none;
color: #000
}
.footer_block {
display: table-cell;
width: 25%;
vertical-align: top
}
.footer_block:nth-child(1) {
text-align: left
}
.footer_block:nth-child(2) {
text-align: left;
padding-left: 35px;
vertical-align: top
}
.footer_block:nth-child(2) ul {
text-align: left
}
.footer_block:nth-child(2) ul li {
text-align: left
}
.footer_block:nth-child(3) {
text-align: left;
padding-left: 30px
}
.footer_block:nth-child(3) ul {
text-align: left
}
.footer_block:nth-child(3) ul li {
text-align: left
}
.footer_block:nth-child(4) {
text-align: right;
vertical-align: middle !important
}
.footer_section {
padding: 15px 0 15px 0;
border-top: 1px solid #ccc;
background-color: #fcfcfc
}
.footer_section a {
color: #000;
text-decoration: none;
font-weight: 400;
text-align: center
}
.footer_section h3 {
font-size: 15px;
font-weight: 600;
margin-bottom: 10px;
position: relative;
color: #667e9c;
margin-top: 10px;
text-transform: uppercase
}
.footer_section ul {
list-style-type: none
}
.footer_section ul li {
text-align: center
}
.footer_section .inner {
width: 1140px;
margin: 0 auto;
display: table
}
footer {
width: 100%
}
.disclaimer {
font-size: 12px;
color: #010101;
line-height: 15px;
display: block;
margin: 10px 0
}
.copyright {
display: block;
height: auto;
overflow: hidden;
text-align: left;
color: #fff;
float: left;
line-height: 59px;
font-weight: 400
}
.copyright a {
margin-left: 15px
}
.developer {
display: block;
height: auto;
overflow: hidden;
text-align: left;
color: #fff;
float: right;
font-size: .8em
}
.footer_info li {
line-height: 38px;
height: 38px;
padding-left: 42px;
position: relative
}
.footerlogo {
float: right;
padding-right: 20px
}
.footer_info li {
line-height: 38px
}
.footer_right p {
margin: 0 0 10px
}
.footer_bottom {
color: #fff
}
.footer_bottom .inside {
width: 100%;
margin: 0;
padding: 0 10px
}
.footer_section .inner {
margin: 0 auto;
width: 1140px
}
ul.social {
margin: 0;
text-align: right;
list-style-type: none;
display: block;
margin-bottom: 5px;
height: 45px
}
ul.social li {
margin-right: 4px;
width: 45px;
height: 45px;
background-size: contain;
list-style-type: none !important;
background-color: #eee;
border-radius: 63px;
border: 1px solid #9a9abf;
float: right
}
ul.social li:hover {
-moz-opacity: .9;
-webkit-opacity: .9;
opacity: .9;
filter: alpha(opacity=90)
}
@media (max-width: 1140px) {
.footer_section .inner {
margin: 0 auto;
width: 100%
}
.footer_block {
display: block;
width: 100%;
text-align: center !important;
margin-bottom: 5px;
padding: 0
}
.contact-address {
margin-left: 0 !important;
margin: 8px 0 15px 0;
margin-bottom: 15px !important;
font-weight: bold
}
.contact-address:before {
content: '';
padding: 0;
margin: 0;
display: none
}
.footer_block:nth-child(2) {
padding-left: 0
}
.contact-item {
margin-left: -15px
}
ul.social {
text-align: center;
margin-top: 15px
}
ul.social li {
display: inline-block;
float: none
}
}
@media (max-width: 960px) {
.copyright img {
display: block;
margin: 0 auto !important
}
.footer_bottom {
padding-top: 5px
}
.footer_block:nth-child(3) {
padding-left: 0
}
}
@media (max-width: 768px) {
.copyright {
display: block;
text-align: center;
line-height: 20px;
width: 100%
}
.footer_bottom .duptronics_logo {
float: none;
margin-left: 0;
text-align: center
}
.footer_section_right img {
float: none !important;
margin: 10px 0
}
.footer_section .inner>li:last-child {
text-align: center
}
.footer_section {
position: static
}
.footer_section li {
width: 100%;
display: block;
text-align: center !important
}
.footer_section li:last-child {
padding-bottom: 15px
}
.footer h3 {
display: block
}
.footer_section li li {
text-align: center
}
}
.stars {
border: 0 !important;
width: 100% !important
}
.footer_section .contact-item {
margin-bottom: 0 !important
}
.ajax-loader {
display: none
}
.full-screen {
height: 100% !important
}
.other-listings {
margin-top: 15px !important
}
.other-listings h2 {
color: #000;
font-size: 18px;
font-weight: bold;
margin-bottom: 0
}
.prevpage {
background-color: #000;
color: #fff;
padding: 10px 24px;
text-transform: uppercase;
letter-spacing: 1px;
display: inline-block;
font-weight: 800;
border-radius: 4px;
border: 0;
border: 2px solid transparent;
margin-top: 10px
}
.contact-item {
display: block;
margin-bottom: 5px
}
.no-scroll {
overflow: hidden
}
.formpop-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 11100;
display: none;
background: rgba(0, 0, 0, 0.75)
}
.formpop-overlay .formpop {
height: 75%;
width: 50%;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
background-color: #fff
}
.formpop-overlay .formpop .formcontent {
padding: 30px 20px 20px 20px;
display: block;
width: 100%;
position: absolute;
top: 50px;
left: 0;
right: 0;
bottom: 0;
overflow-y: auto
}
.formpop-overlay .formpop .formcontent input[type="submit"] {
display: block;
margin: 0 auto;
background-color: #000 !important
}
.formpop-overlay .formpop .formtitle {
width: 100%;
background-color: #000;
text-align: center;
height: 50px;
line-height: 50px;
color: white;
font-size: 20px;
text-transform: uppercase;
position: relative
}
.formpop-overlay .formpop .formtitle .formpop-close {
position: absolute;
right: 10px;
top: 0;
width: 20px
}
body.no-scroll .site-wrapper,
body.no-scroll header {
overflow: hidden;
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feGaussianBlur stdDeviation="5" /></filter></svg>#filter');
-webkit-filter: blur(5px);
filter: blur(5px)
}
.article-body ul {
margin-left: 40px;
margin-bottom: 20px
}
.full-width {
width: 100%;
margin-top: 10px;
margin-bottom: 10px;
background-color: #fff;
padding: 10px;
border-radius: 10px;
min-height: 1000px
}
ul.gallery {
overflow: hidden;
height: auto
}
ul.gallery li {
padding: 10px;
display: inline-block
}
.tool-pagination {
display: block;
text-align: center
}
.tool-pagination ul li,
.tool-pagination a {
display: inline-block
}
.mobile-img {
display: none;
margin: 0 auto
}
.contact_features {
width: 80%;
border-spacing: 0;
border-collapse: collapse;
border: 1px solid #7898C7;
margin: 50px auto
}
.contact_features th {
width: 50%;
background-color: #7898C7;
text-align: left;
padding: 5px 10px;
border-right: 1px solid #7898C7
}
.contact_features td {
width: 50%;
padding: 5px 15px
}
.contact_features td:nth-child(1n) {
border-right: 1px solid #7898C7
}
.contact_features td:nth-child(2n) {
border-left: 1px solid #7898C7
}
.mission_image {
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/mission.jpg) no-repeat;
height: 300px;
width: 200px;
background-size: cover
}
.row {
width: 100%;
overflow: hidden;
height: auto;
display: table
}
#offices dl {
float: left;
width: 49%;
margin-top: 0;
padding-right: 10px
}
.home_locations {
width: 50%;
display: table-cell;
padding-left: 21px
}
.latest_blog ul {
display: table;
overflow: hidden
}
.hidden {
display: none
}
.latest_blog {
padding: 20px 0
}
.latest_blog ul li {
width: 49%;
display: inline-table;
margin-top: 15px;
margin-bottom: 45px;
position: relative
}
.latest_blog ul li:before {
content: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/davis_face.png);
width: 21px;
height: 20px;
position: absolute;
left: 0;
top: 3px
}
.latest_blog ul li:nth-child(odd) {
padding-right: 25px;
padding-left: 25px
}
.latest_blog ul li:nth-child(even) {
padding-left: 25px
}
.home h2,
.home h1 {
font-size: 32px;
color: #fff;
font-weight: 100;
text-align: center;
margin-bottom: 25px
}
.latest_blog h2 a {
color: #000
}
.overlay {
width: 100%;
height: 250px;
z-index: 500;
opacity: 0;
color: #fff;
vertical-align: baseline;
font-size: 50px;
text-align: center;
background-color: #fff;
position: absolute;
top: 0;
-webkit-transition: all ease 200ms;
transition: all ease 200ms;
font-weight: 700
}
.overlay:hover {
opacity: .5;
color: #000
}
ul.staff {
list-style-type: none
}
ul.staff li {
width: 32%;
border: 1px solid #ccc;
padding: 10px;
margin-right: 1%;
float: left;
border-radius: 8px;
color: #000;
text-align: center
}
ul.staff .content {
margin-top: 15px
}
ul.staff .staff-contact {
text-align: left;
padding: 8px;
border-radius: 8px;
background-color: #e8e8e8;
border: 1px solid #8e8e8e;
margin-top: 15px;
margin-right: 0
}
ul.staff a {
text-transform: uppercase;
font-size: 14px;
font-weight: 600
}
ul.staff h2 {
margin-bottom: 0px;
color: #000;
font-size: 24px;
font-weight: 600
}
ul.staff h4 {
margin-bottom: 5px;
color: #000;
font-size: 16px
}
ul.staff img {
display: block;
padding-bottom: 10px;
margin: 0 auto
}
.testimonial_widget_review a {
color: #cc2127
}
.page-template-page-testimonials blockquote {
font-size: 16px;
padding: 0 40px .25em 40px
}
.page-template-page-testimonials cite {
text-align: left;
font-size: 16px
}
.page-template-page-testimonials cite:before {
display: inline;
content: '-';
padding-right: 5px
}
.page-template-page-testimonials .testimonial_widget_content ul li {
margin-bottom: 25px
}
.testimonial_widget_content ul li {
margin-left: 0
}
.testimonial_widget_content ul {
margin-left: 0
}
.testimonial_widget_content {
margin-bottom: 10px
}
.post-type-our-team h2 {
margin-bottom: 5px;
color: #000;
font-size: 16px;
font-weight: 600
}
.post-type-our-team h3 {
margin-bottom: 5px;
color: #000;
font-size: 16px
}
.single-team .single-team-pic {
display: block
}
.single-team .single-team-image {
float: left
}
.staff-contact {
text-align: left;
padding: 8px;
border-radius: 8px;
background-color: #e8e8e8;
border: 1px solid #8e8e8e;
margin-top: 15px;
margin-right: 15px;
display: block;
padding-right: 15px
}
.staff-contact .contact-phone:before,
.staff-contact .contact-cell:before,
.staff-contact .contact-email:before {
width: 30px !important
}
.site-wrapper {
-webkit-transition: transform .2s;
-webkit-transition: -webkit-transform .2s;
transition: -webkit-transform .2s;
transition: transform .2s;
transition: transform .2s, -webkit-transform .2s;
transition: transform 0.2s, -webkit-transform .2s;
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
background-color: #fff;
margin: 0 auto;
width: 100%;
position: relative;
height: auto;
overflow: hidden;
min-width: 310px;
margin-top: 106px
}
img {
max-width: 100%;
height: auto
}
.inside_banner {
height: 80px;
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/inside-banner.jpg);
background-size: cover;
position: relative
}
.inside_banner .inner-wrapper {
position: relative;
overflow: hidden;
height: 100%
}
.inside_banner h1 {
line-height: 80px;
margin-bottom: 0;
color: #fff;
float: left
}
.inside_banner a.callout_button {
background-color: #cc2127;
color: #fff;
padding: 20px 30px;
letter-spacing: 1px;
border-radius: 4px;
cursor: pointer;
margin-left: 15px;
font-size: 22px;
width: 250px;
text-align: center;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
border-radius: 40px;
text-align: center
}
.inside_banner a.callout_button:hover {
opacity: .9
}
.page-template-page-blog main .blog_content {
float: left;
width: 100%;
box-sizing: border-box;
padding-right: 360px
}
.page-template-page-blog main .blog_content_inner {
background-color: #fff;
border-radius: 10px;
width: 100%
}
.page-template-page-our-team main article {
padding-right: 315px;
width: 100%;
float: left
}
.excerpt {
background-color: #fff;
overflow: hidden;
margin-left: 0;
padding-left: 10px
}
ul.col3 {
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
list-style-position: inside
}
main {
padding: 15px 0;
overflow: hidden;
height: auto;
position: relative
}
.blog main {
display: block;
overflow: hidden;
height: auto;
padding: 15px 20px;
border-radius: 10px;
background-color: #fff;
min-height: 1000px;
margin-bottom: 15px
}
.sy-pager li.sy-active a {
background-color: #000 !important
}
.single-doctors article {
padding-right: 0;
padding-left: 0
}
.single-doctors article table {
width: 100%
}
.single-doctors article td {
padding-right: 10px
}
.single-doctors .doc-col {
width: 69%;
display: inline-block;
height: auto;
overflow: hidden;
vertical-align: top
}
.single-doctors .slider {
padding-left: 20px;
width: 29%
}
.single-doctors article img {
float: right;
box-shadow: 1px 1px 6px #b0b0b4;
background-color: #fff;
padding: 5px;
border: 1px solid #ddd
}
.post-type-doctors h2 {
margin-bottom: 5px
}
.inner-wrapper {
width: 1140px;
margin: 0 auto;
display: block;
height: auto
}
.layout-block {
overflow: hidden;
height: auto;
clear: both;
width: 100%;
display: block
}
.ms-lightbox-btn {
position: absolute;
bottom: 14px;
right: 17px;
z-index: 20
}
.ms-lightbox {
text-indent: 9999px;
display: block;
width: 52px;
height: 54px;
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/lightbox-btn.png) no-repeat;
opacity: .5;
transition: 0.3s ease all !important
}
.ms-lightbox:hover {
opacity: .8
}
.clear {
*zoom: 1
}
.clear:before {
content: ' ';
display: table
}
.clear:after {
content: ' ';
display: table;
clear: both
}
img {
max-width: 100%;
vertical-align: bottom
}
a {
text-decoration: none
}
a:focus,
a:hover,
a:active {
outline: 0
}
input:focus {
outline: 0;
border: 1px solid #04A4CC
}
.cta_button {
background-color: #000;
color: #fff;
padding: 10px 14px;
text-transform: uppercase;
letter-spacing: 1px;
display: inline-block;
font-weight: 800;
border-radius: 4px;
border: none;
margin: 0 auto;
display: block;
margin-top: 5px;
cursor: pointer
}
.cta_button:hover {
opacity: .9
}
.wpcf7 input[type=submit],
.wpcf7 input[type=button] {
background-color: #cc2127;
color: #fff;
padding: 10px 24px;
text-transform: uppercase;
letter-spacing: 1px;
display: inline-block;
font-weight: 800;
border-radius: 40px;
border: 0;
border: 2px solid transparent
}
.wpcf7 input[type=submit]:hover,
.wpcf7 input[type=button]:hover {
opacity: .9
}
.wpcf7-radio {
margin-left: 15px
}
input[type="radio"],
input[type="checkbox"] {
height: 1.2em;
width: 1.2em;
vertical-align: middle;
margin: 0 .4em .4em 0;
border: 1px solid rgba(0, 0, 0, 0.3);
background: -webkit-linear-gradient(#FCFCFC, #DADADA);
-webkit-appearance: none;
-webkit-transition: box-shadow 200ms;
box-shadow: inset 1px 1px 0 #fff, 0 1px 1px rgba(0, 0, 0, 0.1)
}
input[type="radio"] {
border-radius: 100%
}
input[type="checkbox"] {
border-radius: 4px;
position: relative
}
input[type="radio"]:not(:disabled):hover,
input[type="checkbox"]:not(:disabled):hover {
border-color: rgba(0, 0, 0, 0.5);
box-shadow: inset 1px 1px 0 #fff, 0 0 4px rgba(0, 0, 0, 0.3)
}
input[type="radio"]:active:not(:disabled),
input[type="checkbox"]:active:not(:disabled) {
background-image: -webkit-linear-gradient(#C2C2C2, #EFEFEF);
box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.2), inset -1px -1px 0 rgba(255, 255, 255, 0.6);
border-color: rgba(0, 0, 0, 0.5)
}
input[type="radio"]:focus,
input[type="checkbox"]:focus {
outline: none;
box-shadow: none
}
input[type="radio"]:checked,
input[type="checkbox"]:checked {
border-color: rgba(0, 0, 0, 0.5)
}
input[type="radio"]:checked:before {
display: block;
height: .3em;
width: .3em;
position: relative;
left: .4em;
top: .4em;
background: rgba(0, 0, 0, 0.7);
border-radius: 100%;
content: ''
}
input[type="checkbox"]:checked:before {
font-weight: 700;
color: rgba(0, 0, 0, 0.7);
content: '';
-webkit-margin-start: 0;
font-size: .9em;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #333
}
input:disabled {
opacity: .6;
box-shadow: none;
background: rgba(0, 0, 0, 0.1);
box-shadow: none
}
input:disabled+label {
opacity: .6;
cursor: default;
-webkit-user-select: none
}
input .wpcf7 input[type=submit]:hover {
-moz-opacity: .9;
-webkit-opacity: .9;
opacity: .9;
filter: alpha(opacity=90)
}
.home .wpcf7-form p {
margin-bottom: 0 !important
}
.contact_info .table {
width: 100%;
margin-bottom: 20px;
max-width: 100%;
background-color: transparent;
border-collapse: collapse;
border-spacing: 0
}
.contact_info thead {
display: table-header-group;
vertical-align: middle;
border-color: inherit
}
.contact_info tr {
display: table-row;
vertical-align: inherit;
border-color: inherit
}
.error404 .site-wrapper {
background-color: #fff
}
.page-template-page-contact .article-content {
display: none
}
.callnow {
position: absolute;
top: 10px;
right: 8px;
color: #000;
font-weight: bold
}
.callnow span {
color: #cc2127
}
a.contact-item {
color: #000 !important
}
.contact-phone:before {
padding-right: 5px;
font-family: FontAwesome;
color: #8e8e8e;
content: '\f095';
text-align: center;
display: inline-block;
width: 35px
}
.contact-fax:before {
padding-right: 5px;
font-family: FontAwesome;
color: #8e8e8e;
content: '\f1ac';
text-align: center;
display: inline-block;
width: 35px
}
.contact-cell:before {
padding-right: 5px;
font-family: FontAwesome;
color: #8e8e8e;
content: '\f10b';
text-align: center;
display: inline-block;
width: 35px;
font-size: 20px !important
}
.contact-email:before {
padding-right: 5px;
width: 35px;
font-family: FontAwesome;
color: #8e8e8e;
content: '\f003';
text-align: center;
display: inline-block
}
.contact-address {
margin-left: 40px;
position: relative
}
.contact-address p {
margin-bottom: 0 !important
}
.contact-address:before {
padding-right: 5px;
width: 35px;
font-family: FontAwesome;
color: #8e8e8e;
content: '\f278';
text-align: center;
position: absolute;
left: -38px
}
.contact_info .table thead>tr>th {
vertical-align: bottom;
border-bottom: 2px solid #ddd;
padding: 8px;
line-height: 1.428571429;
vertical-align: top;
border-top: 1px solid #ddd;
text-align: left
}
.contact_info .table tbody>tr>th,
.contact_info .table tfoot>tr>th,
.contact_info .table thead>tr>td,
.contact_info .table tbody>tr>td,
.contact_info .table tfoot>tr>td {
padding: 8px;
line-height: 1.428571429;
vertical-align: top;
border-top: 1px solid #ddd;
text-align: left
}
.contact_info tbody {
display: table-row-group;
vertical-align: middle;
border-color: inherit
}
.contact_info .table>thead>tr>td.success,
.contact_info .table>tbody>tr>td.success,
.contact_info .table>tfoot>tr>td.success,
.contact_info .table>thead>tr>th.success,
.contact_info .table>tbody>tr>th.success,
.contact_info .table>tfoot>tr>th.success,
.contact_info .table>thead>tr.success>td,
.contact_info .table>tbody>tr.success>td,
.contact_info .table>tfoot>tr.success>td,
.contact_info .table>thead>tr.success>th,
.contact_info .table>tbody>tr.success>th,
.contact_info .table>tfoot>tr.success>th {
background-color: #ececec;
border-color: #d6e9c6
}
ul.hdr_gallery {
list-style-type: none;
margin-left: 0;
margin-top: 25px;
text-align: left
}
ul.hdr_gallery li {
width: 49%;
margin-right: 1%;
float: left;
border-radius: 8px;
margin-bottom: 1%
}
ul.hdr_gallery li img {
border-radius: 10px
}
.thumbnail {
position: relative;
overflow: hidden;
height: auto;
transition: 0.3s ease all
}
.thumbnail .flag {
background-color: #cc2127;
width: 40%;
color: #fff;
text-transform: uppercase;
z-index: 20;
position: absolute;
top: 0;
left: 0;
font-size: 12px
}
.thumbnail:before {
content: 'View Listing';
font-size: 13px;
position: absolute;
width: 100%;
top: 50%;
transform: translateY(-50%);
opacity: 0;
transition: 0.3s ease all;
display: table-cell;
text-align: center;
vertical-align: middle;
color: white;
z-index: 50;
text-transform: uppercase
}
.thumbnail:after {
content: '\A';
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.4);
opacity: 0;
transition: 0.3s ease all
}
.thumbnail:hover:before {
opacity: 1
}
.thumbnail:hover:after {
opacity: 1
}
.book-appointment {
height: 100px;
background-color: #BABB4C
}
.book-appointment a.callout_button {
background-color: #cc2127;
color: #fff;
padding: 15px 20px;
letter-spacing: 1px;
border-radius: 4px;
cursor: pointer;
margin-left: 15px;
font-size: 22px;
float: right;
border-radius: 4px;
line-height: 15px;
width: 250px;
float: none;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
border-radius: 40px;
letter-spacing: 1px
}
.book-appointment a.callout_button span {
line-height: 35px;
height: 35px;
display: inline
}
.book-appointment a.callout_button:hover {
opacity: .9
}
.book-appointment h3 {
color: #fff !important;
font-weight: normal;
padding-bottom: 0;
font-size: 32px !important;
position: absolute;
left: 0;
top: 50%;
letter-spacing: -1px;
transform: translateY(-50%)
}
.book-appointment .inner-wrapper {
height: 100px;
position: relative
}
h1,
h2,
h3,
h4,
h5 {
color: #000;
line-height: 1.2em;
margin-bottom: 10px
}
h1 {
font-size: 30px;
font-weight: 400;
margin-bottom: 15px;
position: relative;
margin-left: auto;
margin-right: auto
}
h2 {
font-size: 24px;
font-weight: 400;
margin-bottom: 5px;
position: relative
}
ol {
margin-left: 50px;
margin-bottom: 15px
}
#search_field {
position: absolute;
height: 30px;
width: 250px;
background-color: #2662ab;
display: none;
right: 0;
top: 30px;
border-radius: 0 0 4px 4px;
padding: 2px;
box-shadow: 3px 3px 7px #969696;
-webkit-transition: all 5s linear;
transition: all 5s linear;
text-align: left
}
#search_field input[type=text] {
width: 201px;
float: left;
font-size: 16px
}
#search_field input[type=submit] {
width: 60px;
float: left;
font-size: 16px
}
#s {
width: 135px;
padding: 5px 0
}
#searchsubmit {
text-decoration: none;
font-size: 12px;
border-radius: none;
display: table-cell;
width: 90px;
color: #fff;
text-align: center;
display: block;
background-color: #0eaee6;
border: 0;
color: #e3e7eb;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 800;
border-radius: 10px;
float: right;
padding: 5px 0;
font-weight: 400
}
#searchsubmit:hover {
color: #444
}
.cta_button {
background-color: #000;
color: #fff;
padding: 10px 14px;
text-transform: uppercase;
letter-spacing: 1px;
display: inline-block;
font-weight: 800;
border-radius: 4px;
border: none;
margin: 0 auto;
display: block;
margin-top: 5px;
cursor: pointer
}
.cta_button:hover {
opacity: .9
}
a.read-more {
background-color: #7f7f7f;
color: #fff;
padding: 10px 14px;
text-transform: uppercase;
letter-spacing: 1px;
display: inline-block;
font-weight: 500;
border-radius: 2px;
border: none;
margin: 5px 0;
display: block;
margin-top: 5px;
cursor: pointer;
width: 150px;
text-align: center
}
a.read-more:hover {
opacity: .9
}
.back-blog {
background-color: #000;
color: #fff !important;
padding: 0 14px;
letter-spacing: 1px;
display: inline-block;
font-weight: 500;
border-radius: 4px;
border: none;
display: block;
margin-top: 20px;
cursor: pointer;
width: 30%;
text-align: center;
height: 50px;
line-height: 50px;
margin-bottom: 15px
}
.back-blog:hover {
opacity: .9
}
#featured-post {
height: auto;
clear: both;
overflow: hidden;
border-bottom: 1px dotted #ddd;
margin: 0 0 15px;
padding: 0 0 15px;
line-height: 1.4em
}
.sidebar {
float: right;
width: 300px;
margin-left: -300px;
z-index: 20
}
.widget {
background-color: #dde2e4
}
.widget ul {
margin-left: 30px
}
.widget .alignnone {
margin: 0 !important
}
.widget.testimonials {
padding-bottom: 40px
}
.widget {
display: block;
overflow: hidden;
height: auto;
padding: 15px;
border-radius: 8px;
border: 1px solid #a5a5a5;
background-color: #fff;
margin-bottom: 20px;
position: relative
}
.widget h2 {
color: #000;
font-size: 15px;
padding: 0;
text-align: left;
margin-bottom: 5px;
font-weight: bold;
padding: 4px 0;
text-transform: uppercase
}
.widget.testimonials h2 {
color: #000;
font-size: 15px;
padding: 0;
text-align: center;
margin-bottom: 5px;
font-weight: bold;
text-transform: uppercase
}
.left_sidebar .widget {
padding: 0;
border: 0;
border-radius: 0
}
.widget img {
width: 100%;
height: auto
}
.sidebar p {
margin-bottom: 2px
}
main article {
float: left;
padding-right: 315px;
width: 100%;
box-sizing: border-box
}
.page-template-page-full main article {
float: none;
padding-right: 0;
padding-left: 0;
width: 100%;
box-sizing: border-box
}
.left_sidebar .textwidget ul {
padding-left: 0;
list-style-type: none
}
.left_sidebar .textwidget ul li {
text-align: left;
text-justify: auto
}
main article .article-content {
display: block;
overflow: hidden;
height: auto;
padding: 0;
background-color: #fff
}
.left_sidebar .textwidget {
padding: 5px;
font-size: 14px
}
.left_sidebar .textwidget a {
color: #000;
text-align: left;
text-justify: normal
}
.screen-reader-text {
display: none
}
#home_cta {
overflow: hidden;
height: auto;
text-align: center;
color: #000;
background-color: #fff;
font-weight: normal
}
#home_cta h3 {
font-size: 27px;
font-weight: 300;
margin-bottom: 10px;
margin-top: 10px;
color: #000
}
#home_cta .inner-wrapper {
padding: 20px 0 10px
}
#home_cta b {
font-weight: 500
}
#home_cta h2 {
margin: 15px 0
}
#home_cta a {
display: block;
height: 100%
}
#home_cta span {
font-size: 25px;
font-weight: 300;
color: #fff;
text-align: center;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
width: 100%;
padding: 0 25px;
line-height: 30px;
z-index: 20;
text-transform: uppercase;
cursor: pointer
}
#home_cta ul {
width: 100%;
list-style: none;
padding: 0;
text-align: center;
margin: 0
}
#home_cta ul li {
width: 25%;
padding: 0 10px;
text-align: center;
display: table-cell;
margin-top: 15px;
position: relative;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out
}
#home_cta ul li:hover {
-webkit-transform: scale(0.95);
transform: scale(0.95)
}
.container {
text-align: center
}
#content {
padding-top: 88px
}
.homelink a:before {
content: "\f015";
font-family: FontAwesome;
font-weight: normal;
font-size: 1.6em;
position: absolute;
left: -32px;
color: #000;
top: -2px
}
.homelink .tool-pagination {
border-top: 1px solid #e8e8e8;
border-bottom: 1px solid #e8e8e8;
width: 99%;
padding: 5px 1% 5px 0;
font-weight: normal
}
.homelink .tool-pagination ul.pages {
display: inline
}
.homelink .tool-pagination ul.pages li {
width: auto;
height: auto;
float: none;
border: 0;
padding: 0;
font-size: 14px;
margin-bottom: 0;
margin-right: 5px
}
.homelink .tool-pagination ul.pages li span {
color: #cc2127
}
.homelink .tool-pagination a {
display: inline-block;
padding: 0;
color: #999;
transition: 0.3s ease all;
font-size: 14px
}
.homelink .tool-pagination a:hover {
color: #999
}
.homelink .tool-pagination .next:after {
font-family: FontAwesome;
content: '\f101';
color: #cc2127;
font-size: 14px;
display: inline-block;
padding-left: 6px
}
.homelink .tool-pagination .prev:before {
font-family: FontAwesome;
content: '\f100';
color: #cc2127;
font-size: 14px;
display: inline-block;
padding-right: 6px
}
.post-filters {
width: 99%;
padding: 2px 4px 2px 0;
margin-bottom: 10px;
margin-right: 1%;
text-align: right;
position: relative;
border-top: 1px solid #e8e8e8;
border-bottom: 1px solid #e8e8e8
}
.post-filters label {
font-size: 12px;
color: #999
}
.post-filters input[type=submit] {
background-color: #fff;
color: #999;
border: 1px solid #ccc;
padding: 0 10px;
letter-spacing: 1px;
border-radius: 4px;
cursor: pointer;
font-size: 12px;
height: 25px;
line-height: 24px;
transition: 0.3s ease all
}
.post-filters input[type=submit]:hover {
background-color: #ccc
}
.post-filters select {
height: 30px;
line-height: 20px;
padding: 0 6px 0 15px;
font-size: 12px;
position: relative;
color: #999;
border: 0px;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
text-align: right
}
.post-filters .styled-select {
height: auto;
overflow: hidden;
position: relative;
display: inline
}
.post-filters .styled-select.float {
position: absolute;
left: 0
}
.post-filters .styled-select.float:before {
top: 3px
}
.post-filters .styled-select:before {
font-family: FontAwesome;
content: '\f103';
color: #999;
font-size: 14px;
pointer-events: none;
position: absolute;
left: 0;
z-index: 20;
top: 1px
}
.banner_text {
font-size: 40px;
line-height: 42px;
font-weight: 300;
color: #fff;
text-shadow: 1px 1px 1px #000
}
.box_button_wrap {
display: block;
text-align: right;
margin-top: 5px
}
a.box_button {
background-color: #cc2127;
color: #fff;
padding: 3px 6px;
letter-spacing: 1px;
cursor: pointer;
font-size: 14px
}
.drawer-style.style-2 .awsm-grid-padding {
padding: 35px 0 50px
}
.home #content {
margin-top: -85px;
position: relative
}
.social a {
display: block;
color: #000;
text-decoration: none;
font-weight: 400;
font-size: 25px;
text-align: center;
line-height: 45px
}
.social a:hover {
-moz-opacity: .9;
-webkit-opacity: .9;
opacity: .9;
filter: alpha(opacity=90)
}
.facebook {
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/facebook.png) no-repeat
}
.twitter {
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/twitter.png) no-repeat
}
.gplus {
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/gplus.png) no-repeat
}
.pinterest {
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/pinterest.png) no-repeat
}
.instagram {
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/instagram.png) no-repeat
}
.twitter {
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/twitter.png) no-repeat
}
.blog {
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/blog.png) no-repeat
}
#home_banner {
background-color: transparent;
overflow: hidden;
height: auto;
clear: both;
width: 100%;
display: block
}
.home_logo {
background-color: #fff;
width: 100%;
overflow: hidden;
height: auto;
display: table;
padding: 15px;
border: 1px solid #f0f0f0;
min-height: 75px;
display: table
}
.home_logo .inner-wrapper {
min-height: 75px;
display: table
}
.page_logo {
margin: 50px 0;
padding: 15px;
border: 1px solid #f0f0f0
}
.page_logo ul {
text-align: center;
display: table-row
}
.home_logo ul {
text-align: center;
display: table-row
}
.home_logo ul li {
display: table-cell;
width: 33%;
text-align: center;
position: relative;
padding-bottom: 7%;
transition: .3s ease all;
min-height: 75px
}
div#preload {
display: none
}
.home #content {
padding-top: 0
}
.mission_content {
width: 50%;
float: left;
padding-right: 15px;
font-size: 15px;
line-height: 20px;
color: #fff
}
#home_mission {
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/missionbg.jpg) no-repeat;
background-size: cover;
padding: 20px 0
}
#home_mission ul {
list-style-image: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/bullet.png);
margin-top: 15px;
margin-left: 20px
}
#home_mission li {
padding-bottom: 10px
}
#home_mission .mission_content_left {
width: 40%;
float: left;
padding-left: 20px
}
#home_mission .mission_content_right {
width: 40%;
float: right
}
#home_mission .inner-wrapper {
position: relative;
overflow: hidden;
height: auto
}
#home_mission img {
width: 50%
}
#home_map {
padding: 0;
position: relative
}
.banner_content {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
overflow: hidden;
height: auto
}
.cc_module_title {
margin: 25px 0 0;
font-weight: 700;
text-transform: uppercase;
text-align: center
}
.current_page_item>a {
color: #000 !important
}
.menu_right {
position: absolute;
top: 50px;
width: 100%;
display: none;
padding: 0;
margin: 0;
background-color: #fff;
right: auto;
padding-top: 10px;
padding-bottom: 10px;
height: auto;
z-index: 40;
box-shadow: inset 0 -8px 8px -8px #696868
}
.menu_right ul {
display: block
}
.menu_right ul li a {
color: #2662ab;
letter-spacing: 2px
}
.menu_right ul li a:hover {
color: #3e61a0
}
.menu_right li {
display: block;
margin-right: 0;
font-weight: 400;
font-size: 17px;
width: 100%;
height: auto;
line-height: 1.3em;
text-align: center;
margin-bottom: 4px
}
.menu_right .page-item-7 {
position: static
}
.menu_right ul li:last-child:after {
content: '';
margin: 0
}
blockquote {
font-family: Georgia, serif;
font-size: 12px;
font-style: italic;
width: 100%;
margin: 10px 0 0 0;
padding: 0 15px .25em 15px;
line-height: 1.45;
position: relative;
color: #383838;
text-align: justify
}
blockquote:before {
display: block;
content: "\f10d";
font-size: 37px;
position: absolute;
font-family: FontAwesome;
font-weight: 400;
left: -2px;
top: -17px;
color: #383838;
opacity: .1
}
blockquote:after {
display: block;
content: "\f10e";
font-size: 37px;
position: absolute;
font-family: FontAwesome;
font-weight: 400;
right: 4px;
bottom: -10px;
color: #383838;
opacity: .1;
width: 42px
}
cite {
display: block;
font-style: normal;
color: #000;
font-size: 14px;
line-height: 14px;
font-weight: 700;
position: relative;
font-style: italic;
margin-top: 10px;
padding-right: 15px;
padding-left: 15px;
text-align: center
}
@media print {
* {
background: transparent !important;
color: #000 !important;
text-shadow: none !important;
-webkit-filter: none !important;
filter: none !important;
-ms-filter: none !important
}
a {
text-decoration: underline
}
a:visited {
text-decoration: underline
}
a[href]:after {
content: " (" attr(href) ")"
}
abbr[title]:after {
content: " (" attr(title) ")"
}
.ir a:after {
content: ""
}
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: ""
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid
}
thead {
display: table-header-group
}
tr {
page-break-inside: avoid
}
img {
page-break-inside: avoid;
max-width: 100% !important
}
@page {
size: auto;
margin: 25mm 5mm
}
body {
margin: 0
}
p,
h2,
h3 {
orphans: 3;
widows: 3
}
h2,
h3 {
page-break-after: avoid;
page-break-inside: avoid
}
.breaker {
page-break-before: always !important
}
h2,
h3,
.datalabel,
.datafield,
li {
page-break-inside: avoid
}
header,
footer {
display: none !important
}
.business-form li {
margin: 2px 0;
display: block;
overflow: hidden;
height: auto
}
.business-form br {
display: none
}
#fancybox-wrap,
.output_filter,
#Button1 {
display: none !important
}
.inside_banner {
display: none
}
}
.business-form {
background-color: #fff;
padding: 25px;
border-radius: 10px;
position: relative
}
.business-form br {
display: none
}
.business-form ul {
list-style-type: none
}
.business-form li {
margin: 2px 0;
display: block;
overflow: hidden;
height: auto
}
.business-form img {
-webkit-transform: scale(0.7);
transform: scale(0.7)
}
.business-form li.indent {
padding-left: 5px
}
.business-form .datafield {
width: 75%;
text-align: left;
padding: 2px 5px;
border: 1px solid #ccc;
float: left;
background-color: #ededed
}
.business-form .datafield:empty {
height: 30px
}
.output_filter {
padding: 20px;
background-color: #fff;
border-radius: 10px;
margin-top: 15px;
text-align: center;
border: 1px solid #999
}
.output_filter h3 {
font-weight: 700;
margin-bottom: 15px
}
.output_filter ul {
width: 100%;
list-style-type: none;
text-align: center
}
.output_filter ul li {
width: 32%;
display: inline;
padding-left: 10px
}
.output_filter span {
font-size: .8em;
line-height: 1em;
font-style: italic;
display: block
}
.output_filter label {
text-transform: uppercase
}
.output_filter input[type="submit"] {
background-color: #000;
color: #fff;
padding: 10px 24px;
text-transform: uppercase;
letter-spacing: 1px;
display: inline-block;
font-weight: 800;
border-radius: 4px;
border: 0;
border: 2px solid transparent
}
.business-form li.group_title {
margin-top: 15px;
margin-bottom: 5px;
text-decoration: underline
}
.business-form li.data_sep {
margin-top: 5px;
margin-bottom: 5px;
border-bottom: 1px solid #ccc
}
.business-form .datalabel {
width: 25%;
text-align: right;
padding-right: 10px;
float: left;
line-height: 30px
}
select:focus {
outline: none !important
}
.wpcf7 p {
margin-bottom: .5em
}
.wpcf7 input[type=email],
.wpcf7 input[type=tel],
.wpcf7 input[type=text] {
width: 100%;
height: 2.6em;
border-radius: 4px;
box-shadow: none;
box-sizing: border-box;
color: #000;
background-color: #ececec;
border: none;
padding: .8rem;
height: 40px;
width: 100%;
font-family: inherit;
border: 1px solid #ccc;
font-size: .9em !important
}
.wpcf7 textarea,
.wpcf7 select {
width: 100%;
height: 2.6em;
border-radius: 4px;
box-shadow: none;
box-sizing: border-box;
color: #000;
background-color: #ececec;
border: none;
padding: .8rem;
height: 50px;
width: 100%;
font-family: inherit;
border: 1px solid #ccc;
font-size: .9em !important
}
.wpcf7 input[type=date] {
height: 40px;
width: 100%;
font-family: inherit;
border: 1px solid #ccc;
background-color: #ececec;
font-size: .9em !important
}
.collapsed {
display: none
}
.business-form input[type=button] {
margin-right: 5px;
background-color: #fff;
color: #000;
padding: 10px 24px;
text-transform: uppercase;
letter-spacing: 1px;
display: inline-block;
font-weight: 800;
border-radius: 4px;
float: left;
border: 2px solid #000
}
.business-form input[type=email],
.business-form input[type=tel],
.business-form input[type=text],
.business-form input[type=date] {
height: 30px;
padding: 0 10px;
border-radius: 0
}
.business-form select {
height: 30px;
padding: 0 10px;
border-radius: 0
}
.business-form label {
margin-top: 10px;
color: #888;
display: block
}
.business-form .form-nav {
display: block;
width: 100%;
overflow: hidden;
height: auto;
margin-top: 25px
}
.business-form .panel-body {
padding-bottom: 50px
}
.business-form textarea {
border-radius: 0
}
.fine-print {
font-size: .6em;
display: block;
line-height: 1.5em
}
.wpcf7 {
width: 100%
}
.wpcf7 select {
position: relative;
background: #ececec url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/arrow.png) no-repeat;
background-position: 98%;
-moz-appearance: none !important
}
.wpcf7 textarea {
height: 125px
}
.wpcf7-validation-errors {
font-size: 16px
}
.Asterix {
float: left;
font-size: 22px;
margin-left: -14px;
color: #bf0000;
line-height: 28px
}
#responsive-form {
max-width: 960px;
margin: 0 auto;
width: 100%;
float: none;
font-weight: 400 !important;
color: #000;
font-size: 16px;
width: 100% !important
}
.page-template-page-treatment_co .read-more {
background-color: #000;
color: #fff;
padding: 10px 24px;
text-transform: uppercase;
letter-spacing: 1px;
display: inline-block;
font-weight: 800;
border-radius: 4px;
border: 0;
border: 2px solid transparent;
display: block;
width: 175px;
margin-top: 15px
}
.form-row {
width: 100%;
width: 100%;
display: block;
overflow: hidden
}
.column-half,
.column-full {
float: left;
position: relative;
padding: 5px 15px;
width: 100%;
box-sizing: border-box
}
#contact_left {
width: 33.333333333333%;
padding-right: 15px
}
#contact_left p {
margin-top: 0
}
#contact_right {
width: 66.666666666667%
}
#contact_left,
#contact_right {
float: left
}
#map {
float: left;
width: 490px;
height: 300px;
display: block;
overflow: hidden
}
.contact_info ul {
list-style-type: none
}
.contact_ad {
text-align: center
}
.panel {
margin-bottom: 20px;
background-color: #fff;
border: 1px solid #ddd;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
margin-top: 15px;
border-radius: 4px
}
.panel .panel-heading {
padding: 5px 10px;
background-color: #342556;
border-bottom: 1px solid #ddd;
color: #2662ab;
position: relative;
border-radius: 4px 2px 0 0
}
.panel .panel-heading .toggle:hover>i {
-webkit-transform: scale(1.2);
transform: scale(1.2)
}
.panel .panel-heading i {
color: #fff;
-webkit-transition: all .1s;
transition: all .1s;
border-radius: 4px 2px 0 0;
padding-right: 5px
}
.panel .panel-heading .toggle i {
font-size: 20px;
padding-right: 0
}
.panel .panel-heading h3 {
font-size: 24px;
margin-top: 0;
margin-bottom: 0;
color: #fff;
font-weight: 200
}
.panel .panel-heading .toggle,
.panel .panel-heading .close {
font-family: FontAwesome;
font-weight: 400;
position: absolute;
line-height: 6px;
-moz-opacity: .5;
-webkit-opacity: .5;
opacity: .5;
-webkit-transition: .3s all ease;
transition: .3s all ease
}
.panel .panel-heading .toggle i,
.panel .panel-heading .close i {
color: #fff
}
.panel .panel-heading .toggle {
font-size: 1.3em;
right: 15px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
position: absolute
}
.panel .panel-heading .close {
font-size: 1em;
right: 15px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%)
}
.panel .panel-heading .close:hover>i {
-webkit-transform: scale(1.2);
transform: scale(1.2)
}
.rotate-180 {
-webkit-transform: rotate(180deg) translateY(25%) !important;
transform: rotate(180deg) translateY(25%) !important
}
.panel-body {
padding: 16px;
font-weight: 400
}
.panel-body:before,
.panel-body:after {
display: table;
content: " "
}
.package {
width: 100%;
overflow: hidden;
height: auto
}
.package .panel {
width: 100%;
overflow: hidden;
height: auto;
border-radius: 4px
}
.package .panel-subhead {
text-align: center;
width: 100%;
overflow: hidden;
height: auto;
padding: 50px 20px;
background-color: #000
}
.package .panel-heading {
background: -webkit-linear-gradient(top, #0d9de8 0%, #0576b0 75%, #036ca2 100%);
background: linear-gradient(to bottom, #0d9de8 0%, #0576b0 75%, #036ca2 100%);
color: #fff;
border-bottom: none;
text-align: center
}
.package .panel-heading h3 {
color: #fff
}
.panel-subhead h3 {
color: #fff;
font-size: 36px;
text-align: center
}
.panel-footer {
height: 20px;
background: #000;
display: block
}
#map {
width: 100%;
height: 300px;
display: block
}
.panel-body:after {
clear: both
}
.cta_panel_right-content .wpcf7 input[type=email],
.cta_panel_right-content .wpcf7 input[type=tel],
.cta_panel_right-content .wpcf7 input[type=text] {
height: 28px;
margin-bottom: 0;
right: 7px
}
.cta_panel_right-content .wpcf7 textarea,
.cta_panel_right-content .wpcf7 select {
height: 28px;
margin-bottom: 0;
right: 7px
}
.cta_panel_right .wpcf7-form textarea {
height: 125px
}
.cta_panel_right-container .column-full {
padding: 5px;
position: relative
}
.cta_panel_right-container .Asterix {
font-size: 12px;
color: #bf0000;
z-index: 1000;
line-height: 16px;
float: right
}
.cta_panel_right-content .wpcf7 textarea {
height: 40px
}
.cta_panel_right-content p {
margin-top: 2px
}
.google-maps {
position: relative;
height: 250px;
overflow: hidden
}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important
}
.contact_hours .table {
width: 100%;
margin-bottom: 20px;
max-width: 100%;
background-color: transparent;
border-collapse: collapse;
border-spacing: 0
}
.contact_hours thead {
display: table-header-group;
vertical-align: middle;
border-color: inherit
}
.contact_hours tr {
display: table-row;
vertical-align: inherit;
border-color: inherit
}
.contact_hours .table thead>tr>th {
vertical-align: bottom;
border-bottom: 2px solid #ddd;
padding: 8px;
line-height: 1.428571429;
vertical-align: top;
border-top: 1px solid #ddd;
text-align: left
}
.contact_hours .table tbody>tr>th,
.contact_hours .table tfoot>tr>th,
.contact_hours .table thead>tr>td,
.contact_hours .table tbody>tr>td,
.contact_hours .table tfoot>tr>td {
padding: 8px;
line-height: 1.428571429;
vertical-align: top;
border-top: 1px solid #ddd;
text-align: left
}
.contact_hours tbody {
display: table-row-group;
vertical-align: middle;
border-color: inherit
}
.contact_hours .table>thead>tr>td.success,
.contact_hours .table>tbody>tr>td.success,
.contact_hours .table>tfoot>tr>td.success,
.contact_hours .table>thead>tr>th.success,
.contact_hours .table>tbody>tr>th.success,
.contact_hours .table>tfoot>tr>th.success,
.contact_hours .table>thead>tr.success>td,
.contact_hours .table>tbody>tr.success>td,
.contact_hours .table>tfoot>tr.success>td,
.contact_hours .table>thead>tr.success>th,
.contact_hours .table>tbody>tr.success>th,
.contact_hours .table>tfoot>tr.success>th {
background-color: #ececec;
border-color: #d6e9c6
}
.col_4,
.width_4 {
width: 250px
}
.col {
margin: 0 10px;
display: inline;
overflow: visible;
float: left;
position: relative
}
.page-template-page-videos h2 {
float: left;
margin-bottom: 10px
}
.youtubewrap {
float: right;
margin-right: 16px;
margin-bottom: 20px
}
.page-template-page-videos {
font-size: 105%;
line-height: 1.2em;
margin-bottom: 10px
}
.page-template-page-videos .col {
margin: 0 10px 10px
}
ul.jaw_widget {
list-style-type: none
}
ul.jaw_widget li {
margin-left: 10px
}
.page-template-page-videos .read-more {
background-color: transparent;
color: #000 !important;
padding: 0;
width: auto;
display: inline;
text-decoration: underline
}
.nivo-lightbox-theme-default .nivo-lightbox-nav:hover {
background-color: transparent !important
}
.page-template-page-videos .row {
padding-bottom: 0
}
.textbox {
font-size: .8em;
line-height: 1em
}
.instagram_banner {
width: 100%;
height: auto;
overflow: hidden;
margin-top: 175px
}
.instagram_banner .widgettitle {
display: none
}
#cta {
overflow: hidden;
height: auto
}
#cta ul {
width: 100%;
list-style: none;
padding: 0;
text-align: center;
width: 100%;
list-style: none;
padding: 0;
text-align: center
}
#cta img {
width: 100%;
height: auto
}
#cta ul li {
width: 25%;
margin: 10px 6% 0;
display: inline-block;
text-align: center
}
#cta ul li:first-child,
#cta ul li:last-child {
margin: 0
}
.wrapper {
width: 100%;
height: auto;
overflow: hidden;
display: block;
position: relative;
height: 100%
}
#fancybox-outer {
border: 1px solid #00a6e5
}
#contact_form_pop {
padding: 5px;
padding-bottom: 100px;
overflow-x: hidden
}
#contact_form_pop .wpcf7-validation-errors {
font-size: 16px
}
.Asterix {
float: left;
font-size: 22px;
margin-left: -14px;
color: #bf0000
}
#fancybox-wrap div {
box-sizing: border-box !important
}
.clearfix:after {
content: "";
display: table;
clear: both
}
.column-half {
width: 50%
}
#contact_form_pop .wpcf7 {
width: 100%
}
#contact_form_pop .wpcf7 textarea {
height: 100px
}
.article-body a {
color: #000;
text-decoration: underline
}
#contact_form_pop .wpcf7 .submit_wrap {
height: 128px;
position: relative
}
#contact_form_pop .wpcf7 .submit_wrap .wpcf7-submit {
position: relative;
position: absolute;
bottom: 0;
right: 0;
margin-right: 15px
}
@font-face {
font-family: 'Font-Name';
src: url(//www.jslawfirm.ca/wp-content/themes/jslaw/css/fonts/font-name.eot);
src: url(//www.jslawfirm.ca/wp-content/themes/jslaw/css/fonts/font-name.eot?#iefix) format("embedded-opentype"), url(//www.jslawfirm.ca/wp-content/themes/jslaw/css/fonts/font-name.woff) format("woff"), url(//www.jslawfirm.ca/wp-content/themes/jslaw/css/fonts/font-name.ttf) format("truetype"), url(//www.jslawfirm.ca/wp-content/themes/jslaw/css/fonts/font-name.svg#font-name) format("svg");
font-weight: 400;
font-style: normal
}
::-moz-selection,
::selection,
::-webkit-selection,
::-moz-selection {
background: #04A4CC;
color: #FFF;
text-shadow: none
}
#right_nav .fa {
line-height: 52px !important
}
.envirabox-opened .envirabox-title {
display: none !important
}
.alignnone {
margin: 5px 20px 20px 0
}
.aligncenter,
div.aligncenter {
display: block;
margin: 5px auto
}
.alignright {
float: right;
margin: 5px 0 20px 20px
}
.alignleft {
float: left;
margin: 5px 20px 20px 0
}
a img.alignright {
float: right;
margin: 5px 0 20px 20px
}
a img.alignnone {
margin: 5px 20px 20px 0
}
a img.alignleft {
float: left;
margin: 5px 20px 20px 0
}
a img.aligncenter {
display: block;
margin-left: auto;
margin-right: auto
}
.wp-caption {
background: #FFF;
border: 1px solid #F0F0F0;
max-width: 96%;
padding: 5px 3px 10px;
text-align: center
}
.wp-caption.alignnone,
.wp-caption.alignleft {
margin: 5px 20px 20px 0
}
.wp-caption.alignright {
margin: 5px 0 20px 20px
}
.wp-caption img {
border: 0 none;
height: auto;
margin: 0;
max-width: 98.5%;
padding: 0;
width: auto
}
.wp-caption .wp-caption-text {
font-size: 11px;
line-height: 17px;
margin: 0;
padding: 0 4px 5px
}
.gallery-caption {
font-size: 11px;
line-height: 17px;
margin: 0;
padding: 0 4px 5px
}
.excerpt {
background-color: #fff;
overflow: hidden;
margin-left: 0;
padding-left: 10px
}
.nomargin {
margin-left: 0;
padding-left: 0
}
#featured-post h2 {
margin-bottom: 8px;
font-size: 24px;
padding-top: 10px;
font-weight: 400;
font-family: 'Raleway', sans-serif
}
#featured-post h2:before {
border: 0
}
#featured-post h2 a {
margin-bottom: 8px;
color: #000
}
#featured-post img {
margin-top: 0;
margin-left: 0;
margin-right: 0
}
.blog_wrapper {
overflow: hidden
}
.blog_wrapper div {
min-height: 286px
}
#recent-blog {
float: left;
width: 100%
}
#featured-post {
height: auto;
clear: both;
overflow: hidden;
border-bottom: 1px dotted #ddd;
margin: 0 0 15px;
padding: 0 0 15px;
line-height: 1.4em
}
.styledlogolist p {
display: none
}
ul.styledlogolist {
margin: 0 0 1.5em !important;
padding: 0;
list-style: none;
text-align: center
}
ul.styledlogolist li {
padding: 0;
width: 24%;
margin: 0 1% 1% 0;
list-style: none !important;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px 10px 10px 10px;
box-shadow: 0 0 10px #aeaeae;
background: #fff;
text-align: center;
display: inline-block
}
.view-article {
text-decoration: none;
font-size: 13px;
padding: 10px;
background-color: #2662ab;
border-radius: 4px;
display: table-cell;
width: 105px;
color: #fff;
text-align: center;
margin-top: 10px;
display: block
}
.view-article:hover {
-moz-opacity: .9;
-webkit-opacity: .9;
opacity: .9;
filter: alpha(opacity=90)
}
#featured-post img {
float: left;
margin-right: 0;
border: 0;
max-width: 100%;
height: auto
}
#blog-siderbar {
float: right;
width: 240px
}
.frame {
width: 400px;
height: 282px;
float: left
}
.address-panel img {
width: 100%;
height: auto;
margin-bottom: 10px
}
.quick-phone-text {
line-height: 35px;
margin-right: 35px;
font-weight: bold;
}
@media (max-width: 1140px) {
.formpop-overlay .formpop {
width: 75%
}
.inside_banner {
padding: 15px 0
}
.inside_banner h1 {
margin-left: 10px
}
.inside_banner a.callout_button {
margin-right: 10px
}
.page-template-page-our-team main {
padding: 15px 0 50px 0
}
.page-template-page-our-team main article {
padding-right: 0;
width: 100%;
float: none
}
.inner-wrapper {
padding: 0 10px
}
.book-appointment {
height: auto;
overflow: hidden;
background-color: #BABB4C;
padding: 15px 0
}
.book-appointment h3 {
font-size: 24px;
display: block;
position: static;
text-align: center;
transform: none
}
.book-appointment .inner-wrapper {
height: auto;
overflow: hidden
}
.book-appointment a.callout_button {
display: block;
margin: 0 auto;
float: none;
position: static;
width: 200px;
transform: none;
text-align: center;
font-size: 16px;
-webkit-transform: none
}
.book-appointment a.callout_button span {
line-height: 35px;
height: 35px;
display: inline
}
.full-width {
padding: 0
}
#topheader div {
margin: 0 8px;
display: inline-block;
font-size: 14px;
text-transform: uppercase
}
main {
margin-top: 0
}
.site-wrapper {
margin-top: 106px
}
.latest_blog ul li:nth-child(odd) {
padding-right: 10px
}
#home_banner {
margin-top: 0;
margin-bottom: 10px
}
.home .inner-wrapper {
padding: 0 10px
}
.home_mission {
padding-right: 10px
}
.home_locations {
padding-left: 10px
}
.sidebar {
display: none
}
.page-template-page-blog main .blog_content,
.page-template-page-blog main .blog_content_inner {
width: 100%;
padding: 15px
}
.page-template-page-blog main .blog_content {
padding: 15px 0 0;
float: none
}
main article {
float: none;
padding-right: 0;
display: block
}
.mission_content {
width: 100%;
float: none;
padding-right: 0;
margin-bottom: 50px
}
#home_mission img {
width: auto;
margin: 0 auto;
display: block
}
header .header-inner,
.wrapper,
.inner-wrapper {
width: 100%
}
header .header-inner .menu>.menu-item>span {
padding: 0 10px
}
header .inner-wrapper {
width: 100%
}
.mobile-menu-wrapper {
display: block;
z-index: 10
}
.logo-img {
display: none !important
}
.mobile-img {
display: block
}
.toplogo {
padding-left: 10px
}
.toplogo img {
margin-left: 0
}
.header_right {
padding-right: 10px
}
}
@media (max-width: 960px) {
.callnow {
display: none
}
.bottom_sidebar {
float: none;
width: 250px;
z-index: 20;
margin-top: 46px;
margin: 0 auto
}
h2 {
font-size: 24px
}
.inside_banner {
height: auto;
overflow: hidden
}
.header-contactbar {
display: none
}
.inside_banner h1 {
margin-left: 10px;
display: block;
line-height: 26px;
text-align: center;
margin-bottom: 10px;
float: none
}
.inside_banner a.callout_button {
padding: 10px 15px
}
main article .article-content {
margin-top: 15px
}
.developer a img {
margin-top: 10px
}
ul.social {
text-align: center
}
ul.social li {
display: inline-block;
float: none
}
.mobile_logo {
display: initial
}
#topheader {
display: none
}
.site-wrapper {
margin-top: 75px
}
.page-template-page-blog .excerpt {
padding-left: 0;
padding-top: 10px
}
#navigation,
.logo-img {
display: none
}
.mobile-img {
display: block
}
.searchlink {
display: none
}
.header {
height: 75px;
background: #fff
}
.desktop-main-menu {
display: none
}
.toplogo {
text-align: center;
margin: 0 auto;
padding: 0;
display: block;
width: 100%;
position: absolute;
height: 75px;
left: 0
}
.toplogo img {
margin: 10px auto 0 auto;
width: auto;
height: 80%
}
.searchbar {
background: #fff
}
#content {
padding-top: 60px
}
.home #content {
padding-top: 0;
margin-top: 0
}
.home main {
border: none
}
.left {
padding-left: 15px
}
#contact_left,
#contact_right {
width: 100%;
padding-right: 0
}
main {
padding: 0 0 50px
}
.banner-head {
font-size: 36px;
font-weight: 700
}
.banner-sub {
font-size: 36px;
font-weight: 300
}
#inside_banner {
background: none
}
#banner {
position: relative;
margin-top: 50px;
height: 240px;
background-size: auto;
background-position: 50% 50%
}
#banner img {
display: none
}
.banner_content {
position: static
}
#featured-post {
width: 100%
}
#featured-post img {
float: none;
margin-right: 0;
border: 0;
border-bottom: 2px solid #000;
max-width: 100%;
height: auto
}
#recent-blog {
width: 100%
}
.inside_banner a.callout_button {
display: block;
margin: 0 auto;
float: none;
position: static;
width: 200px;
transform: none;
text-align: center;
font-size: 16px;
-webkit-transform: none;
-moz-transform: none
}
.page-template-page-our-team main {
padding: 15px 0 50px 0
}
.page-template-page-our-team main article {
padding-right: 0;
width: 100%;
float: none
}
ul.staff {
text-align: center
}
ul.staff li {
width: 48%;
border: 1px solid #ccc;
padding: 10px;
margin-right: 1%;
float: none;
border-radius: 8px;
color: #000;
text-align: center;
margin-top: 10px;
display: inline-block
}
.banner_text {
font-size: 30px;
line-height: 32px
}
}
@media (max-width: 768px) {
.banner_text {
font-size: 26px;
line-height: 24px
}
.contact-address:before {
content: '';
padding: 0;
margin: 0
}
.contact-address {
padding-left: 0;
margin: 0;
margin-top: 10px
}
.book-appointment {
padding: 15px
}
.book-appointment {
padding: 15px
}
ul.social {
height: auto !important
}
.designer {
position: static;
display: block;
width: 100%;
text-align: center
}
#home_cta {
width: 100%;
height: auto;
margin-top: 0
}
#home_cta span {
font-size: 18px;
line-height: 20px
}
#home_cta ul li {
width: 49%;
display: inline-block;
text-align: center
}
.home #content {
margin-top: 0
}
ul.col3 {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
list-style-position: inside
}
}
@media (max-width: 690px) {
.column-half {
width: 100% !important
}
.formpop-overlay {
display: none
}
.formpop-overlay .formpop {
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: 0;
transform: none
}
.latest_blog ul {
display: block
}
.doc-col {
width: 100% !important
}
.gallery {
margin-top: 15px
}
.doc-col:last-child {
padding-left: 0 !important
}
.home h2 {
font-size: 22px;
text-align: center !important
}
.latest_blog h2 {
text-align: left !important
}
.home_locations {
text-align: center
}
.left_sidebar {
display: none
}
main article {
padding-right: 0;
padding-left: 0
}
.latest_blog ul li {
width: 100%;
display: block;
margin: 15px 0
}
#offices dl {
float: none;
width: 100%;
display: block;
text-align: center;
margin-bottom: 8px
}
.home_mission {
width: 100%
}
.home_locations {
width: 100%;
display: block;
padding-left: 0
}
.home_mission {
display: block;
padding-right: 0;
margin-bottom: 10px;
text-align: center;
background-color: #f0f1f2
}
.home_mission h2 {
text-align: center
}
.wpcf7 input[type=email],
.wpcf7 input[type=tel],
.wpcf7 input[type=text] {
width: 100% !important;
border-radius: 0;
box-shadow: none;
box-sizing: border-box;
color: #000;
background-color: #ececec;
border: 1px solid #ccc;
padding: .8rem;
width: 100%;
font-family: inherit
}
.wpcf7 textarea,
.wpcf7 select {
width: 100% !important;
border-radius: 0;
box-shadow: none;
box-sizing: border-box;
color: #000;
background-color: #ececec;
border: 1px solid #ccc;
padding: .8rem;
width: 100%;
font-family: inherit
}
.wpcf7 textarea {
height: 122px;
background-color: #ececec
}
#fancybox-wrap {
left: 0 !important;
width: 100% !important;
padding: 0 !important
}
#fancybox-content {
width: 100% !important
}
}
@media (max-width: 575px) {
.toplogo img {
height: 65%
}
#home_cta ul li {
width: 100%;
display: block;
text-align: center;
padding: 0 25px
}
#home_cta h2 {
font-size: 22px;
padding: 0 10px
}
#home_cta h3 {
font-size: 18px
}
span.wpcf7-list-item {
margin-left: 0.5em;
width: 100%;
display: block
}
.page-template-page-our-team main {
padding: 15px 0
}
ul.staff {
text-align: center
}
ul.staff li {
width: 100%;
border: 1px solid #ccc;
padding: 10px;
margin-right: 0;
float: none;
border-radius: 8px;
color: #000;
text-align: center;
margin-top: 10px;
display: block
}
#home_banner {
margin-bottom: 0
}
#home_cta .inner-wrapper {
padding: 20px 0 10px
}
#home_cta .inner-wrapper h2 {
margin-bottom: 0
}
#home_mission {
background-color: #f0f1f2;
padding: 20px 0
}
#home_mission .mission_content_left {
width: 100%;
float: none;
display: block;
padding-left: 0
}
#home_mission .mission_content_right {
width: 100%;
float: none;
display: block
}
#home_mission .inner-wrapper {
position: relative;
overflow: hidden;
height: auto;
padding: 15px
}
#home_mission img {
width: 90%
}
.page_logo ul,
.home_logo ul {
text-align: center;
display: block
}
main {
min-height: inherit
}
.page_logo ul li,
.home_logo ul li {
display: block;
width: 100%;
padding: 0 10px 31%;
text-align: center
}
.offices dl {
float: none;
width: 100%;
padding-right: 0;
display: block;
margin-bottom: 5px
}
.header-inner {
text-align: center
}
.staff li {
width: 100%;
float: none;
display: block;
height: auto
}
#banner {
display: none
}
.mobilebanner {
display: block
}
.mobilebanner>img {
margin-top: 50px
}
#banner>a {
display: block
}
#banner>a>img {
width: 100%;
height: auto;
display: block;
position: absolute
}
.page-template-page-blog #banner,
.search-results #banner,
.archive #banner {
background: none;
height: 0
}
.page-template-page-blog #inside_banner,
.search-results #inside_banner,
.archive #inside_banner {
display: none
}
.page-template-page-home .banner_content {
display: table-cell;
vertical-align: middle;
text-align: center
}
.video-btn {
display: block;
margin: 0 auto;
width: 66px;
height: 67px;
background: url(//www.jslawfirm.ca/wp-content/themes/jslaw/images/mobile-playbtn.png) no-repeat
}
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%
}
#circles ul li {
display: block;
width: 100%;
margin-bottom: 10px
}
#circles ul li:first-child,
#circles ul li:last-child {
display: block;
width: 100%;
margin-bottom: 10px
}
.banner-head {
font-size: 24px;
font-weight: 700
}
.banner-sub {
font-size: 24px;
font-weight: 300
}
#cta ul li {
display: block;
width: 100%;
padding: 25px;
width: 75%;
margin: 0 auto
}
#cta ul li:first-child,
#cta ul li:last-child {
display: block;
width: 100%;
padding: 25px;
width: 75%;
margin: 0 auto
}
.socialInner {
text-align: right;
padding-right: 15px
}
.row {
padding-bottom: 0
}
#fancybox-wrap {
position: fixed !important;
left: 0 !important;
top: 0 !important;
right: 0 !important;
bottom: 0 !important
}
#fancybox-close {
top: 5px !important;
right: 5px !important
}
#ask_question_pop img {
width: 150px;
height: auto
}
#fancybox-content {
overflow: scroll !important;
height: 100% !important
}
#banner {
padding-top: 0
}
.excerpt {
margin-left: 0;
padding-left: 0 !important;
padding-top: 10px
}
.page-template-page-blog main {
width: 100%
}
#featured-post img {
float: none;
margin-right: 0;
border: 0;
max-width: 100%;
height: auto;
width: 100%
}
#home_cta span {
font-size: 16px;
line-height: 18px
}
.formpop-overlay .formpop .formtitle {
font-size: 16px
}
.banner_text {
font-size: 28px;
line-height: 30px
}
}
@media (max-width: 650px) {
.awsm-content-scrollbar {
padding-right: 0
}
}
@media (max-width: 400px) {
.banner_text {
font-size: 24px;
line-height: 26px
}
#home_cta {
width: 100%;
height: auto;
margin-top: 0
}
}
@media (max-width: 330px) {
.left {
float: none;
text-align: right;
overflow: hidden;
padding: 0;
text-align: center;
width: 100%
}
.banner-head {
font-size: 16px;
font-weight: 700
}
.banner-sub {
font-size: 16px;
font-weight: 300
}
}.unslider {
overflow: auto;
margin: 0;
padding: 0
}
.unslider-wrap {
position: relative
}
.unslider-wrap.unslider-carousel>li {
float: left
}
.unslider-vertical>ul {
height: 100%
}
.unslider-vertical li {
float: none;
width: 100%
}
.unslider-fade {
position: relative
}
.unslider-fade .unslider-wrap li {
position: absolute;
left: 0;
top: 0;
right: 0;
z-index: 8
}
.unslider-fade .unslider-wrap li.unslider-active {
z-index: 10
}
.unslider li, .unslider ol, .unslider ul {
list-style: none;
margin: 0;
padding: 0;
border: none
}
.unslider-nav
{
position: absolute;
bottom: 19px;
left: 0;
right: 0;
top: auto;
margin: 0;
opacity: .6;
}
.unslider-arrow {
display: block;
width: 32px;
height: 32px;
bottom: 15px;
left: 15px;
overflow: hidden;
text-indent: -999em;
transition: opacity .2s;
position: absolute;
z-index: 1;
opacity: .3;
transition: 0.3s ease all;
}
.unslider-arrow:hover {
opacity: 1;
}
.unslider-arrow.next {
background: #7a7a7a url(//www.jslawfirm.ca/wp-content/themes/jslaw/script/right.png) no-repeat 12px 7px;
left: auto;
right: 15px;
}
.unslider-arrow.prev {
background: #7a7a7a url(//www.jslawfirm.ca/wp-content/themes/jslaw/script/left.png) no-repeat 8px 7px;
}.unslider-nav ol {
list-style: none;
text-align: center;
}
.unslider-nav ol li {
display: inline-block;
width: 8px;
height: 8px;
margin: 0 4px;
background: transparent;
border-radius: 5px;
overflow: hidden;
text-indent: -999em;
border: 2px solid #333;
cursor: pointer;
}
.unslider-nav ol li.unslider-active {
background: #333;
cursor: default;
}