/* ----------------------------------------------------------------
    Responsive CSS
-----------------------------------------------------------------*/


@media (max-width: 1199px) {
canvas {
    max-width: 100%;
    height: auto !important;
}
.promo h3 {
    font-size: 20px;
}
.promo > span,  .promo > .container > span {
    font-size: 15px;
}
.promo-uppercase h3 {
    font-size: 19px;
}
.promo-uppercase > span,  .promo-uppercase > .container > span {
    font-size: 14px;
}
}

@media (min-width: 992px) and (max-width: 1199px) {
#wrapper {
    width: 1000px;
}
#header.transparent-header.floating-header .container {
    width: 1030px;
    padding: 0 30px;
}
#header.transparent-header.floating-header.sticky-header .container {
    width: 970px;
    padding: 0 15px;
}
#primary-menu.sub-title ul > li > a {
    padding-left: 15px;
    padding-right: 15px;
}
.testi-image,  .testi-image a,  .testi-image img,  .testi-image i {
    display: block;
    width: 36px;
    height: 36px;
}
.testi-image i {
    line-height: 36px;
    font-size: 20px;
}
}

@media (max-width: 991px) {
#wrapper {
    width: 100%;
    margin: 0;
    box-shadow: none;
}
#header.full-header .container,  .container-fullwidth {
    padding: 0 15px !important;
    margin: 0 auto;
    width: 750px !important;
}
.container.vertical-middle {
    width: 100% !important;
}
.full-screen:not(.force-full-screen) .container.vertical-middle {
    width: 750px !important;
}
#header,  #header-wrap,  #header.sticky-style-2,  #header.sticky-style-3,  #header.sticky-style-2 #header-wrap,  #header.sticky-style-3 #header-wrap {
    height: auto !important;
}
#header.sticky-style-2 #header-wrap,  #header.sticky-style-3 #header-wrap {
    min-height: 60px;
}
#header.sticky-header #header-wrap {
    position: relative;
}
#header.transparent-header,  #header.semi-transparent {
    background: #FFF;
    border-bottom: 1px solid #F5F5F5;
    z-index: auto;
}
#header.dark.transparent-header,  #header.dark.semi-transparent {
    background-color: #333;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
#header.transparent-header.floating-header {
    margin-top: 0;
}
#header.transparent-header.floating-header .container {
    width: 750px;
    padding: 0 15px;
    border-radius: 0;
}
#header.transparent-header + #slider,  #header.transparent-header + #page-title.page-title-parallax,  #slider + #header.transparent-header,  #header.transparent-header.floating-header + #slider {
    top: 0;
    margin-bottom: 0;
}
#header.transparent-header + #page-title.page-title-parallax .container {
    padding-top: 0;
}
#header-trigger,  .header-extras {
    display: none;
}
#logo {
    display: block;
    height: 100px;
    float: none;
    margin: 0 auto 0 !important;
    max-width: none;
    text-align: center;
    border: 0 !important;
    padding: 0 !important;
}
#logo a.standard-logo {
    display: inline-block;
}
#primary-menu {
    display: block;
    float: none;
    height: auto !important;
}
#primary-menu-trigger {
    opacity: 1;
    pointer-events: auto;
    top: 25px;
    margin-top: 0;
    left: 0;
    z-index: 1;
}
#primary-menu .container #primary-menu-trigger {
    top: 5px;
    left: 0;
}
#primary-menu > ul,  #primary-menu > div > ul {
    float: none !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
}
#primary-menu > div > ul {
    margin-top: 60px !important;
}
#primary-menu ul {
    height: auto !important;
}
#primary-menu.style-5 > ul {
    padding-right: 0;
    margin-right: 0;
    border-right: 0;
}
#primary-menu ul li {
    float: none;
    margin: 0 !important;
    text-align: left !important;
    border-top: 1px solid #EEE;
}
#primary-menu ul li:first-child {
    border-top: 0;
}
#primary-menu ul li a,  #primary-menu.style-2 > div > ul > li > a {
    height: 50px !important;
    line-height: 50px !important;
    padding: 0 5px !important;
    border: none !important;
    margin: 0 !important;
}
#primary-menu.style-5 > ul > li > a > div {
    padding: 0;
    line-height: 50px;
}
#primary-menu.sub-title > ul > li,  #primary-menu.sub-title.style-2 > div > ul > li {
    background: none !important;
    margin-left: 0;
}
#primary-menu.sub-title ul li a {
    text-transform: none;
    font-size: 14px;
}
#primary-menu.sub-title ul li span {
    display: none !important;
}
#primary-menu.sub-title > ul > li:hover > a,  #primary-menu.sub-title > ul > li.current > a,  #primary-menu.sub-title > div > ul > li:hover > a,  #primary-menu.sub-title > div > ul > li.current > a,  #primary-menu.style-3 > ul > li:hover > a,  #primary-menu.style-3 > ul > li.current > a {
    background-color: transparent !important;
    color: #444;
    text-shadow: none;
}
#primary-menu ul li i,  #primary-menu.style-2 > div > ul > li i,  #primary-menu.sub-title ul li i,  #primary-menu.style-3 > ul > li > a i,  #primary-menu.style-5 > ul > li > a i {
    line-height: 49px;
}
#primary-menu.style-5 > ul > li > a i {
    display: inline-block;
    top: 1px;
    width: 14px;
    margin: 0 6px 0 0;
    font-size: 14px !important;
}
#primary-menu > ul > li.sub-menu > a,  #primary-menu > .container > ul > li.sub-menu > a {
    background-image: url("../images/icons/submenu.png");
    background-position: right center;
    background-repeat: no-repeat;
}
#page-menu #page-menu-wrap {
    position: relative !important;
    top: 0 !important;
}
#page-submenu-trigger {
    opacity: 1;
    pointer-events: auto;
    color: #FFF;
}
#page-menu.pagemenu-active #page-submenu-trigger {
    background-color: rgba(0,0,0,0.2);
}
#page-menu nav {
    display: none;
    position: absolute;
    float: none;
    width: 200px;
    top: 43px;
    left: auto;
    right: 15px;
    height: auto;
    background-color: #1ABC9C;
    z-index: 11;
}
#page-menu.pagemenu-active nav {
    display: block;
}
#page-menu nav ul {
    height: auto;
    background-color: rgba(0,0,0,0.2);
}
#page-menu nav li {
    float: none;
}
#page-menu nav li a {
    height: 40px;
    line-height: 40px;
    padding: 0 15px;
}
/* Responsive Sticky Header
    -----------------------------------------------------------------*/

.sticky-responsive-menu #header {
    min-height: 100px;
    -webkit-transition: min-height .4s ease;
    -o-transition: min-height .4s ease;
    transition: min-height .4s ease;
}
.sticky-responsive-menu #header.sticky-style-2,  .sticky-responsive-menu #header.sticky-style-3 {
    min-height: 160px;
}
.sticky-responsive-menu.device-touch #header,  .sticky-responsive-menu.device-touch #header-wrap,  .sticky-responsive-menu.device-touch #logo,  .sticky-responsive-menu.device-touch #logo img,  .sticky-responsive-menu.device-touch #primary-menu-trigger {
    -webkit-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
}
#header.responsive-sticky-header:not(.sticky-style-2):not(.sticky-style-3) {
    min-height: 60px;
}
.responsive-sticky-header #header-wrap {
    z-index: 199;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #FFF;
    border-bottom: 1px solid #EEE;
    -webkit-backface-visibility: hidden;
}
.responsive-sticky-header #logo,  .responsive-sticky-header #logo img {
    height: 60px;
}
.responsive-sticky-header #primary-menu-trigger {
    top: 5px;
}
.responsive-sticky-header #primary-menu > ul,  .responsive-sticky-header #primary-menu > .container > ul {
    max-height: 300px;
    overflow-y: scroll;
    margin-bottom: 20px;
}
.responsive-sticky-header #primary-menu > ul,  .responsive-sticky-header #primary-menu > .container > ul {
    margin-bottom: 20px !important;
}
}

@media (min-width: 768px) and (max-width: 991px) {
.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid),  .swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide {
    height: 400px !important;
}
.sidebar-widgets-wrap {
    position: relative;
    margin: 0 -38px -40px 0;
}
.sidebar-widgets-wrap .widget {
    display: inline-block;
    vertical-align: top;
    float: none;
    width: 340px;
    margin: 0 37px 40px 0;
    padding-top: 0;
    border-top: 0;
}
}

@media (max-width: 767px) {
body {
    padding: 0 !important;
}
#wrapper {
    width: 100% !important;
}
.container-fullwidth {
    margin: 0 auto;
    padding: 0 15px !important;
}
h1 {
    font-size: 28px;
}
h2 {
    font-size: 24px;
}
h3 {
    font-size: 20px;
}
h4 {
    font-size: 16px;
}
#gotoTop,  .one-page-arrow {
    display: none !important;
}
#page-title {
    padding: 20px 0 25px;
    text-align: center;
}
#page-title h1 {
    line-height: 1.5;
    font-size: 24px;
}
.button.button-desc {
    padding: 20px 17px;
    font-size: 15px;
    max-width: 100%;
}
.process-steps li {
    float: none;
    margin-top: 20px;
    width: auto !important;
}
.process-steps li:first-child {
    margin-top: 0;
}
.process-steps li h5 {
    margin: 10px 0 0;
}
.button.button-desc span {
    font-size: 11px;
}
#top-bar .col_half {
    width: 100%;
}
.top-links, .top-links > ul > li {
    float: none !important;
}
.top-links > ul {
    text-align: center;
}
.top-links > ul > li {
    display: inline-block;
}
.title-block {
    padding: 2px 0 3px 15px;
    border-left-width: 5px;
}
.title-block-right {
    padding: 2px 15px 3px 0;
    border-right-width: 5px;
}
.title-block h1 + span {
    font-size: 18px;
}
.title-block h2 + span {
    font-size: 17px;
}
.title-block h3 + span {
    font-size: 15px;
}
.title-block h4 + span {
    font-size: 13px;
}
.heading-block h1 {
    font-size: 30px;
}
.heading-block h2 {
    font-size: 26px;
}
.heading-block h3 {
    font-size: 22px;
}
.heading-block h4 {
    font-size: 19px;
}
.heading-block h1 + span {
    font-size: 20px;
}
.heading-block h2 + span {
    font-size: 18px;
}
.heading-block h3 + span,  .heading-block h4 + span {
    font-size: 17px;
}
.heading-block ~ p:not(.lead) {
    font-size: 15px;
}
.emphasis-title h1,  .emphasis-title h2 {
    font-size: 44px !important;
}
/* Copyrights
    -----------------------------------------------------------------*/

#copyrights .col_half {
    text-align: center;
}
#copyrights .col_half:last-child {
    display: none;
}
#copyrights .footer-logo {
    margin-left: auto;
    margin-right: auto;
}
}

@media (min-width: 480px) and (max-width: 767px) {
.container,  #header.full-header .container,  .container-fullwidth {
    width: 100% !important;
}
.container.vertical-middle {
    width: 100% !important;
}
.full-screen:not(.force-full-screen) .container.vertical-middle {
    width: 100% !important;
}
#header.transparent-header.floating-header .container {
    width: 100%;
    padding: 0 15px;
}
.button.button-full {
    font-size: 18px;
}
.button.button-full i {
    top: 2px !important;
    margin-left: 3px !important;
}
}

@media (max-width: 479px) {
.container,  #header.full-header .container,  .container-fullwidth {
    width: 100% !important;
}
.container.vertical-middle {
    width: 100% !important;
}
.full-screen:not(.force-full-screen) .container.vertical-middle {
    width: 100% !important;
}
#header.transparent-header.floating-header .container {
    width: 100%;
    padding: 0 15px;
}
.parallax .entry-overlay-meta,  .parallax .entry-overlay {
    left: 50% !important;
    right: 0 !important;
    margin: 0 0 0 -140px !important;
    width: 280px !important;
}
.parallax .entry-overlay {
    width: 288px !important;
}
.parallax .countdown-section {
    width: 64px;
    height: 64px;
    margin: 0 8px 0 0;
    font-size: 11px;
    padding: 0;
    padding-top: 12px;
}
.parallax .countdown-amount {
    font-size: 20px;
}
.countdown-large .countdown-section {
    display: block;
    width: auto;
    margin: 30px 0 0;
    border: 0;
}
.countdown-large .countdown-section:first-child {
    margin-top: 0;
}
.testi-image,  .testi-image a,  .testi-image img,  .testi-image i {
    width: 36px;
    height: 36px;
}
.testi-image i {
    line-height: 36px;
    font-size: 20px;
}
.button.button-full {
    font-size: 16px;
}
.button.button-full i {
    top: 2px !important;
    margin-left: 3px !important;
}
.emphasis-title h1,  .emphasis-title h2 {
    font-size: 40px !important;
}
.button.button-desc {
    padding: 20px 17px;
    font-size: 15px;
    max-width: 100%;
}
.button.button-desc span {
    font-size: 11px;
}
#section-slider .col-padding {
    padding: 20px;
}
#section-slider .button,  .panel-default .button {
    width: 100%;
    text-align: center;
}
.panel-default .fright {
    text-align: center;
    width: 100%;
    float: none;
}
}