/* New Bootstrap 4 Styles*/

html {font-size:0.9rem;}

@media (min-width: 576px) { 
    html {font-size:90%} 
}

@media (min-width: 768px) { 
    html {font-size:100%;} 
}


p, a, ul, li, table, td, th, label, .btn {
    font-family: 'Open Sans', sans-serif;
}

/* color font awesome icons*/
.c_red {color:#f44336}
.c_green {color:#43a047}
.c_blue {color:#2196f3}
.c_blue_02 {color:#0288d1}
.c_dark_blue {color:#01579b}
.c_navy {color:#3f51b5}
.c_orange {color:#ffc107}
.c_purple {color:#673ab7}
.c_cyan {color:#0097a7}
.c_lightgreen {color:#009688}
.c_deeporange {color:#ff5722}
.c_lime {color:#a4c400}
.c_emerald {color:#008a00}
.c_teal {color:#00aba9}
.c_cobalt {color:#0050ef}
.c_indigo {color:#6a00ff}
.c_violet {color:#aa00ff}
.c_pink {color:#f472d0}
.c_magenta {color:#d80073}
.c_crimson {color:#a20025}
.c_amber {color:#f0a30a}
.c_brown {color:#825a2c}
.c_olive {color:#6d8764}
.c_steel {color:#647687}
.c_mauve{color:#76608a}
.c_sienna {color:#a0522d}

.btn-orange {color: #fff;background-color: #FFC100; border-color: #FFC100; font-weight:600}
.btn-orange:hover, .btn-orange:active {color: #fff; background-color: #FFC100; border-color: #FFC100}

.btn-orange-2 {color: #fff;background-color: #ffb62e; border-color: #ffb62e; font-weight:600; padding: 8px 20px;}
.btn-orange-2:hover, .btn-orange:active {color: #fff; background-color: #ffb62e; border-color: #ffb62e; padding: 8px 20px;}


/*Bootstrap Styles*/
.font-weight-bold {font-weight:600!important}

/*background colours*/
.bg-blue-02 {background-color:#0288d1}
.bg-blue-03 {background: rgba(2,136,209,.10);} /*Transparent Blue, Light Blue*/

.divider_blue {background: #136cbf; width:200px; height:2px}
.divider_triangle{
      width: 0;
      height: 0;
      border-left: 100px solid transparent;
      border-right: 100px solid transparent;
      border-top: 15px solid #ADD5F7;
}
/******************/
/* Shared         */
/******************/

.signup_now h1{font-size:48px;font-family: 'Open Sans Condensed',sans-serif;font-weight: 300;color: #5c6e86;}
.signup_now p{font-size:20px;color: #5c6e86;}
.signup_now .btn-primary{padding: 12px 25px;}

.get_ascora_menu {background-color: #f5f5f5 !important;}
.get_ascora_menu .logo {height: 50px;width: auto;}
.get_ascora_menu.sticky {position: fixed;top: 0;left: 0;right: 0;z-index: 1030;}

.btn-primary{
    font-family: "Open Sans",sans-serif;
    font-size: 16px;
    font-weight: 600;
    background-color: #0288d1!important;
    color: #ffffff!important;
    text-decoration: none;
    text-align: center;
    border: 0px;
    display: inline-block;
    padding: 8px 20px;
}

.btn-primary:hover {background-color: #03a9f4!important;}

.img-fluid {width:100%; height:auto}
.img-cover {
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.w-10pc {width:10%}
.w-20pc {width:20%}
.w-30pc {width:30%}
.w-40pc {width:40%}
.w-50pc {width:50%}
.w-60pc {width:60%}
.w-70pc {width:70%}
.w-80pc {width:80%}
.w-90pc {width:90%}
.w-100pc {width:100%}

.rounded {border-radius: .5rem !important;}

.img_filter_blur_1 {-webkit-filter: blur(1px);filter: blur(1px);}
.img_filter_blur_2 {-webkit-filter: blur(2px);filter: blur(2px);}
.img_filter_blur_3 {-webkit-filter: blur(3px);filter: blur(3px);}
.img_filter_blur_4 {-webkit-filter: blur(4px);filter: blur(4px);}
.img_filter_blur_5 {-webkit-filter: blur(5px);filter: blur(5px);}

.img_filter_saturate_1 {-webkit-filter: saturate(1);filter: saturate(1);}
.img_filter_saturate_2 {-webkit-filter: saturate(2);filter: saturate(2);}
.img_filter_saturate_3 {-webkit-filter: saturate(3);filter: saturate(3);}
.img_filter_saturate_4 {-webkit-filter: saturate(4);filter: saturate(4);}
.img_filter_saturate_5 {-webkit-filter: saturate(5);filter: saturate(5);}

/*.hue {-webkit-animation: hue 5s infinite;}
.blur {-webkit-animation: blur 5s infinite;}

@-webkit-keyframes blur {
  0%, 100%  { -webkit-filter: blur(0px); }
  50% { -webkit-filter: blur(10px); }
}
@-webkit-keyframes hue {
  0%, 100%  { -webkit-filter: hue-rotate(0deg); }
  50% { -webkit-filter: hue-rotate(180deg); }
}*/

.img_overlay_laptop {position:relative;}
.img_overlay_laptop .image{display:block; width:100%; height:auto}
.img_overlay_laptop .overlay{position:absolute; top:5.5%; right:15.5%; bottom:12.8%; left:15.8%}

.img_overlay_card {position:relative;}
.img_overlay_card .image{display:block; width:100%; height:auto}
.img_overlay_card .overlay{position:absolute; top:0; right:0; bottom:0; left:0}

.position-relative {position:relative}
.position-absolute {position:absolute}

/*******************/
/* Main Layout     */
/*******************/

.main_layout .section_footer_bottom h3{font-family: "Open Sans",sans-serif;font-size: 22px;font-weight: 400;text-align: center;margin-bottom: 0px;color: #5c6e86;}
.main_layout .section_footer_bottom p {font-size: 16px;color: #5c6e86;margin:0px;}
.main_layout .section_footer_bottom .address {font-size: 12px;}
.main_layout .section_footer_bottom .img_ascora {width:70%; height:auto}
.main_layout .section_footer_bottom .asc_logo_512 {width:80%}
.main_layout .section_footer_bottom .footer_copyright {font-size: 12px;color: #595959;text-align: center;}

.main_layout .section_footer_top h4{color: #01579b;font-family: "Open Sans",sans-serif;font-size: 22px;font-weight: 600;margin-bottom: 5px;}
.main_layout .section_footer_top ul{margin-left: 0px;padding-left: 0px;}
.main_layout .section_footer_top ul li {list-style: none;color: #607d8b;font-family: "Open Sans",sans-serif;font-size: 18px;line-height: 30px;font-weight: 300;}

/*******************/
/* Business Growth */
/*******************/

.business_growth_layout {}
.business_growth_layout p{font-size:1.2em; line-height:1.6em;}

.business_growth_layout .title-1 {font-size:28px; margin-bottom:20px; font-weight:400!important;}
.business_growth_layout .lead-1 {font-size:1rem; font-weight:300; line-height:1.6em}

/*.business_growth_layout .icon_right {
    color: #60a3d7;
    opacity:0.2;
    position: absolute;
    right: 10%;
    bottom: 12%;
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
    font-size:15em
}

.business_growth_layout .icon_left {
    color: #60a3d7;
    opacity:0.2;
    position: absolute;
    right: auto;
    bottom: 12%;
    left: 10%;
    font-size:15em;
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
}*/

.business_growth_layout .icon_right {
    color: #60a3d7;
    opacity:0.1;
    position: absolute;
    top: calc(50% - 75px);
    right:10%;
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
    font-size:150px;
}

.business_growth_layout .icon_left {
    color: #60a3d7;
    opacity:0.1;
    position: absolute;
    top: calc(50% - 100px);
    left:10%;
    font-size:200px;
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
}


.business_growth_layout .btn-primary{
    font-family: "Open Sans",sans-serif;
    font-size: 16px;
    font-weight: 600;
    background-color: #0288d1!important;
    color: #ffffff!important;
    text-decoration: none;
    text-align: center;
    border: 0px;
    display: inline-block;
    padding: 8px 20px;
}

.business_growth_layout .btn-primary:hover {background-color: #03a9f4!important;} 
.business_growth_layout .offset_sticky {margin-top: 65px;}
.business_growth_layout .marketing .featurette {min-height:300px}

.business_growth_layout .marketing .list_themed li{font-size:1.1em;}
.business_growth_layout .marketing .list_themed li i{color:#03a9f4;font-size:2em;}

.business_growth_layout .marketing .feature_set {}
.business_growth_layout .marketing .feature_set h3 {
    font-family: 'Open Sans', sans-serif;
    font-size: 1.4em;
    font-weight: 400;
    line-height: 26px;
    color: #01579b;
}

.business_growth_layout .marketing .card {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    color: #6c7e8e;
}

.business_growth_layout .marketing .card h3 {
    font-size: 1.8em;
    line-height: 26px;
    color: #01579b;
}

.business_growth_layout .marketing .card p {
    font-size: 1.1em;
    line-height: 1.6em;
}

.business_growth_layout .marketing .card a {
}

.business_growth_layout .media .icon{
    padding: .66667rem;
    border-radius: .35rem;
    background: #0288d1 !important;
    text-align: center;
    display: inline-block;
    color: #fff;
    font-size: 2rem;
    line-height: 1;
    min-width: 53px;
}

/**********************/
/* Overlay for Banner */
/**********************/

.bg-overlay-primary:after {
    content: " ";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(18,131,218,.85);
    z-index: 2;
}

.bg-overlay-white:after {
    content: " ";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(255,255,255,.85);
    z-index: 2;
}

.bg-overlay:after {content: " "; position:absolute; width:100%; height:100%; top:0; left:0; bottom:0; right:0; z-index: 2;}

.fade-white:after {background: linear-gradient(-90deg,#f8f9fa 25%,rgba(255,255,255,0) 100%);}
.fade-white-50pc:after {background: linear-gradient(-90deg,#f8f9fa 50%,rgba(255,255,255,0) 200%);}

.intro-content {position:relative;z-index:100;color:#343a40; font-weight:600}
.intro-content p {font-size:1.8em;line-height:1.5em; font-weight:400; color:#5c6e86}
.intro-content h1 {font-size:2.8em; font-weight:600;}

/************************/
/* Banner Custom Styles */
/************************/

.banner-01 .img-cover {object-position: -400px -310px;}
.banner-02 .img-cover {object-position: -1000px center; max-width:2000px; min-width:1400px}
.banner-03 .img-cover {}

.banner-01 .intro-content {}
.banner-01 .intro-content p{}
.banner-01 .intro-content h1{}

/*Business Growth*/
.banner-02 .intro-content {}
.banner-02 .intro-content p {font-size:1.7em;line-height:1.5em; font-weight:400; color:#5c6e86}
.banner-02 .intro-content h1 {font-size:2.8em; font-weight:600;}

/*Case Studies Richards Lock n Safe*/
.banner-03 img{width:50%}
.banner-03 .intro-content {color:#343a40; font-weight:600}
.banner-03 .intro-content p {font-size:1.8em;line-height:1.5em; font-weight:400; color:#5c6e86}
.banner-03 .intro-content h1 {font-size:2.8em; font-weight:600;}

/****************/
/* Case Studies */
/****************/
.case_studies_layout h3 {}
.case_studies_layout p{font-size:1.2em; line-height:1.6em;}
.case_studies_layout .offset_sticky {margin-top: 65px;}

.case_studies_layout .cases {}
.case_studies_layout .cases h1{color:#0288d1}
.case_studies_layout .cases h3{color:#0288d1}

/******************/
/* Landing Short  */
/******************/

.landing_short .offset_sticky {margin-top: 65px;}
.landing_short .marketing p{
    font-family: "Open Sans",sans-serif;
    font-weight: 300;
    font-size:1.2rem; 
    line-height:1.6em
}

.landing_short .marketing_list {
    font-family: "Open Sans",sans-serif;
    font-weight: 400;
    font-size:1.2rem; 
    line-height:2em
}

.landing_short .marketing_list .fas{
    color:#0288d1!important;
}

/******************/
/*  Tracking      */
/******************/
.tracking_layout h1, h2, h3, h4 {
    font-weight: 600;
}

.tracking_layout h3 {
    font-size: 1.8em;
    line-height: 26px;
    color: #01579b;
    font-weight: 600;
}

.tracking_layout h1 {
    font-size: 2.8em;
    font-weight: 600;
}

.tracking_layout p {
    font-size: 1.1em;
    line-height: 1.6em;
    font-weight: 400;
    color: #6c7e8e;
}

.tracking_layout ul {
    font-size: 1.1em;
    line-height: 1.6em;
    font-weight: 400;
    color: #6c7e8e;
}

.tracking_layout ul li{
    margin-bottom:5px;
}

/******************/
/* Video Player  */
/******************/

.video_container {
    display:inline-block;
    position: relative;
    text-align: center;
    color: white;
    cursor:pointer;
    padding:8px;
}

/* Bottom left text */
.video_container .bottom-left {
    position: absolute;
    bottom: 8px;
    left: 16px;
}

/* Top left text */
.video_container .top-left {
    position: absolute;
    top: 8px;
    left: 16px;
}

/* Top right text */
.video_container .top-right {
    position: absolute;
    top: 8px;
    right: 16px;
}

/* Bottom right text */
.video_container .bottom-right {
    position: absolute;
    bottom: 8px;
    right: 16px;
}

/* Centered text */
.video_container .centered {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.video_container p.overlay_text {
    color:#ffffff; 
    font-size:20px;
    font-weight:bold;
}

.video_container .tint {
    background-color:#1c1c1c;
    opacity:0.2;
    position: absolute;
    top:0; right:0; bottom:0; left:0
}

.video_container:hover .tint {
    opacity:0.3;
}

.video_container .overlay_playbtn {
    font-size:100px;
    color:#ffffff;
    z-index:1000;
}

.video_container img {
    max-width:500px; width:100%; height:auto; padding:0px;
}


/* Video Thumbnails  */
.tutorial_content .section_video {}
.tutorial_content .section_video .video_header h2{color: #01579b;font-family: "Open Sans",sans-serif;font-size: 30px;font-weight: 400;line-height: 36px;margin-bottom: 20px;margin-top: 20px;}
.tutorial_content .section_video .video_header p{color: #607d8b;font-family: "Open Sans",sans-serif;font-size: 20px;font-weight: 400;line-height: 30px;}
.tutorial_content .section_video [class^=col] {padding-left:10px; padding-right:10px;}
.tutorial_content .section_video .video_thumbnail{position:relative; width:100%; height:auto; border-radius:6px; overflow:hidden}
.tutorial_content .section_video .video_thumbnail::after {background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;content: "";height: 100%;left: 0;position: absolute;top: 0;width: 100%;}
.tutorial_content .section_video .video_thumbnail .video_title {position:absolute; top:0px; padding:10px; width:100%; background: rgba(33, 150, 243, 0.8) none repeat scroll 0 0; text-align:center; color:#ffffff; font-size:26px; z-index:20}
.tutorial_content .section_video .video_thumbnail .thumb_img {display: block; height: auto; width: 100%;}
.tutorial_content .section_video .video_thumbnail .play_button {position:absolute; left:50%; top:50%; font-size:80px; color:#ffffff; margin-left: -30px; margin-top: -40px; z-index:10; cursor:pointer}

.zoom_play_button:hover .play_button{
  animation: zoomAnimFrames linear 0.4s;
  animation-iteration-count: 1;
  transform-origin: 50% 50%;
  -webkit-animation: zoomAnimFrames linear 0.4s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: zoomAnimFrames linear 0.4s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -o-animation: zoomAnimFrames linear 0.4s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -ms-animation: zoomAnimFrames linear 0.4s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
}

@keyframes zoomAnimFrames{
  0% {
    transform:  scaleX(1.00) scaleY(1.00) ;
  }
  50% {
    transform:  scaleX(1.20) scaleY(1.20) ;
  }
  100% {
    transform:  scaleX(1.00) scaleY(1.00) ;
  }
  100% {
    transform:  scaleX(1.00) scaleY(1.00) ;
  }
}

@-moz-keyframes zoomAnimFrames{
  0% {
    -moz-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  50% {
    -moz-transform:  scaleX(1.20) scaleY(1.20) ;
  }
  100% {
    -moz-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  100% {
    -moz-transform:  scaleX(1.00) scaleY(1.00) ;
  }
}

@-webkit-keyframes zoomAnimFrames {
  0% {
    -webkit-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  50% {
    -webkit-transform:  scaleX(1.20) scaleY(1.20) ;
  }
  100% {
    -webkit-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  100% {
    -webkit-transform:  scaleX(1.00) scaleY(1.00) ;
  }
}

@-o-keyframes zoomAnimFrames {
  0% {
    -o-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  50% {
    -o-transform:  scaleX(1.20) scaleY(1.20) ;
  }
  100% {
    -o-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  100% {
    -o-transform:  scaleX(1.00) scaleY(1.00) ;
  }
}

@-ms-keyframes zoomAnimFrames {
  0% {
    -ms-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  50% {
    -ms-transform:  scaleX(1.20) scaleY(1.20) ;
  }
  100% {
    -ms-transform:  scaleX(1.00) scaleY(1.00) ;
  }
  100% {
    -ms-transform:  scaleX(1.00) scaleY(1.00) ;
  }
}