Difference between revisions of "Team:NJU-China/css/homestyle.css"

(Created page with "========================================================================== style.css =========================================================================: ...")
 
(Blanked the page)
 
Line 1: Line 1:
/* ==========================================================================
 
  style.css
 
    ========================================================================= */
 
    @font-face {
 
    font-family: "Montserrat-UltraLight";
 
    src: url(../fonts/Montserrat-UltraLight.otf);
 
}
 
  
/* ==========================================================================
 
    1. CSS RESET
 
    ========================================================================= */
 
a,
 
abbr,
 
acronym,
 
address,
 
applet,
 
article,
 
aside,
 
audio,
 
b,
 
big,
 
blockquote,
 
body,
 
canvas,
 
caption,
 
center,
 
cite,
 
code,
 
dd,
 
del,
 
details,
 
dfn,
 
div,
 
dl,
 
dt,
 
em,
 
embed,
 
fieldset,
 
figcaption,
 
figure,
 
footer,
 
form,
 
h1,
 
h2,
 
h3,
 
h4,
 
h5,
 
h6,
 
header,
 
hgroup,
 
html,
 
i,
 
iframe,
 
img,
 
ins,
 
kbd,
 
label,
 
legend,
 
li,
 
mark,
 
menu,
 
nav,
 
object,
 
ol,
 
output,
 
p,
 
pre,
 
q,
 
ruby,
 
s,
 
samp,
 
section,
 
small,
 
span,
 
strike,
 
strong,
 
sub,
 
summary,
 
sup,
 
table,
 
tbody,
 
td,
 
tfoot,
 
th,
 
thead,
 
time,
 
tr,
 
tt,
 
u,
 
ul,
 
var,
 
video {
 
    margin: 0;
 
    padding: 0;
 
    border: 0;
 
    font: inherit;
 
    vertical-align: baseline;
 
}
 
article,
 
aside,
 
details,
 
figcaption,
 
figure,
 
footer,
 
header,
 
hgroup,
 
menu,
 
nav,
 
section {
 
    display: block;
 
}
 
body {
 
    line-height: 1;
 
}
 
blockquote,
 
q {
 
    quotes: none;
 
}
 
blockquote:after,
 
blockquote:before,
 
q:after,
 
q:before {
 
    content: '';
 
    content: none;
 
}
 
table {
 
    border-collapse: collapse;
 
    border-spacing: 0;
 
}
 
*:focus {
 
    outline: 0;
 
    text-decoration: none;
 
}
 
a:focus,
 
a:active {
 
    text-decoration: none;
 
    outline: 0;
 
}
 
 
/* ==========================================================================
 
    2. DOCUMENT STYLES
 
    ========================================================================= */
 
body {
 
    font-family: 'Montserrat-UltraLight', Arial, sans-serif;
 
    font-size: 15px;
 
    line-height: 23px;
 
    color: #777777;
 
    background-color: #fff;
 
}
 
.row {
 
    margin-bottom: 100px;
 
}
 
 
.centered {
 
    text-align: center;
 
}
 
img {
 
    max-width: 100%;
 
    height: auto;
 
    display: block;
 
}
 
 
 
/* ==========================================================================
 
    3. TYPOGRAPHY
 
    ========================================================================= */
 
 
p,
 
a {
 
    color: #777777;
 
}
 
p,
 
a,
 
span {
 
    font-family: 'Montserrat-UltraLight', Arial, sans-serif;
 
    line-height: 25px;
 
}
 
p {
 
    padding-bottom: 15px;
 
}
 
a {
 
    -webkit-transition: all 0.2s ease 0s;
 
    -moz-transition: all 0.2s ease 0s;
 
    -o-transition: all 0.2s ease 0s;
 
    -ms-transition: all 0.2s ease 0s;
 
    transition: all 0.2s ease 0s;
 
    text-decoration: none;
 
}
 
a:hover {
 
    text-decoration: none;
 
}
 
h1,
 
h2,
 
h3,
 
h4{
 
    font-family: 'Suranna', serif;
 
    color: #161d27;
 
    margin-top: 0;
 
    margin-bottom: 15px;
 
    text-transform: uppercase;
 
}
 
 
h5,
 
h6 {
 
    font-family: 'Montserrat', Arial, sans-serif;
 
    color: #161d27;
 
    margin-top: 0;
 
    margin-bottom: 0;
 
    text-transform: uppercase;
 
}
 
h1 {
 
    font-size: 60px;
 
    line-height: 60px;
 
}
 
h2 {
 
    font-size: 44px;
 
    line-height: 44px;
 
}
 
h3 {
 
    font-size: 36px;
 
    line-height: 36px;
 
}
 
h4 {
 
    font-size: 27px;
 
    line-height: 28px;
 
}
 
h5 {
 
    font-size: 18px;
 
    line-height: 24px;
 
    margin-bottom: 3px;
 
}
 
h6 {
 
    font-size: 15px;
 
    line-height: 15px;
 
}
 
h5 .sans-serif {
 
    font-family: 'Montserrat', Arial, sans-serif !important;
 
    font-size: 21px;
 
}
 
.dark h5 .sans-serif {
 
    color: #fff;
 
}
 
strong {
 
    font-weight: 600;
 
}
 
strong a:hover {
 
    text-decoration: underline;
 
}
 
 
.custom-col-padding {
 
    padding: 275px 0 195px 0!important;
 
}
 
.padding-0 {
 
    padding-top: 0 !important;
 
    padding-bottom: 0 !important;
 
    padding-left: 0 !important;
 
    padding-right: 0 !important;
 
}
 
a.more-details{
 
    font-family: 'Suranna', serif;
 
    text-transform: uppercase;
 
    font-size: 21px;
 
    border-bottom: 1px solid;
 
    color: #161d27;
 
    display: inline-block;
 
    padding-bottom: 3px;
 
    margin-top: 10px;
 
 
    -webkit-transition: all 0.2s ease 0s;
 
    -moz-transition: all 0.2s ease 0s;
 
    -o-transition: all 0.2s ease 0s;
 
    -ms-transition: all 0.2s ease 0s;
 
    transition: all 0.2s ease 0s;
 
}
 
a.more-details .fa{
 
    position: relative;
 
    top: -2px;
 
    margin-left: 7px;
 
    font-size: 14px;
 
}
 
 
.mb-0 {
 
    margin-bottom: 0 !important;
 
}
 
.mb-20 {
 
    margin-bottom: 20px !important;
 
}
 
.mb-40 {
 
    margin-bottom: 40px !important;
 
}
 
.mb-60 {
 
    margin-bottom: 60px !important;
 
}
 
.mb-80 {
 
    margin-bottom: 80px !important;
 
}
 
.mb-100 {
 
    margin-bottom: 100px !important;
 
}
 
.pt-0 {
 
    padding-top: 0 !important;
 
}
 
.pt-20 {
 
    padding-top: 20px !important;
 
}
 
.pt-40 {
 
    padding-top: 40px !important;
 
}
 
.pt-60 {
 
    padding-top: 60px !important;
 
}
 
.pt-80 {
 
    padding-top: 80px !important;
 
}
 
.pt-100 {
 
    padding-top: 100px !important;
 
}
 
.pt-120 {
 
    padding-top: 100px !important;
 
}
 
.pt-150 {
 
    padding-top: 150px !important;
 
}
 
.pt-160 {
 
    padding-top: 160px !important;
 
}
 
 
.pb-80 {
 
    padding-bottom: 80px !important;
 
}
 
 
.custom-heading.style-1 span,
 
.custom-heading.style-2 span,
 
.menu-item-price p{
 
    font-family: 'Montez', cursive;
 
    text-transform: none;
 
}
 
 
 
/* ==========================================================================
 
    4. HEADER
 
    ========================================================================= */
 
#header-wrapper {
 
    width: 100%;
 
    position: fixed;
 
    top: 0;
 
    z-index: 1000;
 
}
 
.resize-header {
 
    background-color: rgba(0,0,0,0.90);
 
    -webkit-animation: headerFadeIn 0.4s forwards;
 
    animation: headerFadeIn 0.4s forwards;
 
}
 
@-webkit-keyframes headerFadeIn {
 
    from { background-color: rgba(0,0,0,0.0); }
 
    to { background-color: rgba(0,0,0,0.90); }
 
}
 
@keyframes headerFadeIn {
 
    from { background-color: rgba(0,0,0,0.0); }
 
    to { background-color: rgba(0,0,0,0.90); }
 
}
 
.resize-header .logo {
 
    margin: 10px 0;
 
}
 
.resize-header .logo img {
 
    max-width: 100%;
 
    -webkit-animation: reduceLogo 0.1s forwards;
 
    animation: reduceLogo 0.1s forwards;
 
}
 
@-webkit-keyframes reduceLogo {
 
    from { max-width: 100%;}
 
    to { max-width: 60%; }
 
}
 
@keyframes reduceLogo {
 
    from { max-width: 100%;}
 
    to { max-width: 60%; }
 
}
 
.resize-header #header .nav-left .pi-nav {
 
    margin-top: 50px;
 
    -webkit-animation: reduceTopMargin 0.2s forwards;
 
    animation: reduceTopMargin 0.2s forwards;
 
}
 
@-webkit-keyframes reduceTopMargin {
 
    from { margin-top: 50px;}
 
    to { margin-top: 12px; }
 
}
 
@keyframes reduceTopMargin {
 
    from { margin-top: 50px;}
 
    to { margin-top: 12px; }
 
}
 
.resize-header .navbar {
 
    margin-bottom: 0;
 
}
 
.header-inner .row,
 
.main-nav .row {
 
    margin-bottom: 0;
 
}
 
.logo {
 
    margin: 30px 0;
 
}
 
#header .nav-left .navbar-header {
 
    float: left;
 
}
 
#header .nav-left .pi-nav {
 
    float: left;
 
    margin-top: 50px;
 
}
 
#header .navbar-default .navbar-collapse,
 
#header .navbar-default .navbar-form {
 
    border: 0px solid transparent;
 
}
 
#header .navbar-default .navbar-nav > .open > a,
 
#header .navbar-default .navbar-nav > .open > a:hover,
 
#header .navbar-default .navbar-nav > .open > a:focus {
 
    background-color: transparent;
 
}
 
#header .navbar-collapse {
 
    padding: 0;
 
    float: right;
 
}
 
#header .navbar-default{
 
    background: none;
 
    border: 0px solid transparent;
 
    -webkit-box-shadow: none;
 
    box-shadow: none;
 
}
 
#header .navbar-nav.pi-nav > li > a {
 
    line-height: 25px;
 
}
 
#header .navbar-default .navbar-nav > li > a {
 
    border: none;
 
    font-family: 'Montserrat', Arial, sans-serif;
 
    font-size: 15px;
 
    text-transform: uppercase;
 
    color: #fff;
 
    margin: 0 4px;
 
}
 
#header .navbar-default .navbar-nav > .current-menu-item > a:before,
 
#header .navbar-default .navbar-nav > li>a:hover:before {
 
    position: absolute;
 
    font-family: 'FontAwesome';
 
    font-size: 6px;
 
    content: "\f111";
 
    display: block;
 
    top: 16px;
 
    left: 0px;
 
}
 
#header .navbar-default .navbar-nav > li>a:hover:before {
 
    -webkit-animation: navItemMove 0.1s forwards;
 
    animation: navItemMove 0.1s forwards;
 
}
 
@keyframes navItemMove {
 
    from { opacity: 0; transform: translateX(20px); }
 
    to { opacity: 1; transform: translateX(0px); }
 
}
 
@-webkit-keyframes navItemMove {
 
    from { opacity: 0; -moz-transform: translateX(20px); }
 
    to { opacity: 1; -moz-transform: translateX(0px); }
 
}
 
#header .dropdown-menu > li > a {
 
    font-size: 14px;
 
    font-weight: 400;
 
    padding: 15px 40px 15px 25px;
 
    color: #A0A0A0;
 
    border-bottom: 1px solid #3C3C3C;
 
}
 
#header .dropdown-menu > li > a:hover,
 
#header .dropdown-menu > li > a:focus {
 
    background: #363636;
 
    background-color: #363636 !important;
 
    background-image: none;
 
    filter: none;
 
}
 
#header .dropdown-menu > li:last-child > a {
 
    border-bottom: none;
 
}
 
#header .dropdown.dropdown-submenu > a:after {
 
    position: absolute;
 
    font-family: 'FontAwesome';
 
    font-size: 12px;
 
    content: "\f0da";
 
    display: block;
 
    top: 50%;
 
    right: 25px;
 
    color: #A0A0A0;
 
    margin-top: -8px;
 
    -webkit-transition: all 0.2s ease 0s;
 
    -moz-transition: all 0.2s ease 0s;
 
    -o-transition: all 0.2s ease 0s;
 
    -ms-transition: all 0.2s ease 0s;
 
    transition: all 0.2s ease 0s;
 
}
 
#header .dropdown-menu {
 
    background: #252525;
 
    border: none;
 
    border-radius: 0;
 
    -webkit-border-radius: 0;
 
    -moz-border-radius: 0;
 
    min-width: 270px;
 
    padding: 0;
 
    -webkit-box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.1);
 
    -moz-box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.1);
 
    box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.1);
 
}
 
#header .dropdown-menu > li > a .fa {
 
    margin-right: 15px;
 
}
 
 
/* ==========================================================================
 
    4.1. MAIN NAVIGATION
 
    ========================================================================= */
 
.navbar-nav > li {
 
    padding-bottom: 0;
 
}
 
 
.dropdown-submenu {
 
    position: relative;
 
}
 
#header .dropdown-submenu > .dropdown-menu{
 
    top: -2px;
 
    left: 100%;
 
    -webkit-box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.1);
 
    -moz-box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.1);
 
    box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.1);
 
}
 
#header .dropdown-submenu > .dropdown-menu {
 
    background-color: #363636 !important;
 
}
 
 
#header .dropdown-submenu > .dropdown-menu > li > a:hover {
 
    background-color: #252525 !important;
 
}
 
.dropdown-submenu:hover > .dropdown-menu {
 
    display: block;
 
}
 
.dropdown.dropdown-submenu > a {
 
    position: relative;
 
}
 
 
 
/* ==========================================================================
 
    5. PAGE TITLE
 
    ========================================================================= */
 
.page-title.custom-img-background {
 
    padding-top: 275px;
 
}
 
.page-title {
 
    padding-top: 275px;
 
    padding-bottom: 275px;
 
}
 
.page-title .row {
 
    margin-bottom: 0;
 
}
 
 
 
 
/* ==========================================================================
 
    6. CUSTOM SECTION BACKGROUNDS
 
    ========================================================================= */
 
 
.custom-img-background {
 
    background-repeat: no-repeat;
 
    background-size: cover;
 
    padding-top: 100px;
 
}
 
.custom-background.bkg-grey {
 
    background-color: #fdfdfc !important;
 
}
 
.full-screen.custom-img-background {
 
    padding-top: 0;
 
}
 
.full-screen-content-wrapper {
 
    display: table;
 
    width: 100%;
 
    padding: 0 30px;
 
    background-repeat: no-repeat;
 
}
 
.full-screen-cell {
 
    display: table-cell;
 
    vertical-align: middle;
 
}
 
 
.bkg-img1 {
 
    background-image: url('../img/pics/bkg-img1.jpg'); 
 
}
 
.bkg-img2 {
 
    background-image: url('../img/pics/bkg-img2.png'); 
 
}
 
 
 
.frame-box {
 
    background-color: #fff;
 
    border: 17px solid #131822;
 
    padding: 125px 80px;
 
    box-shadow: 0 0 18px 7px rgba(0,0,0,0.3);
 
    -moz-box-shadow: 0 0 18px 7px rgba(0,0,0,0.3);
 
    -webkit-box-shadow: 0 0 18px 7px rgba(0,0,0,0.3);
 
}
 
.custom-img-background.frame-box {
 
    background-size: 100%;
 
    background-position: center;
 
}
 
.frame-box .custom-heading {
 
    padding-left: 0 !important;
 
}
 
.frame-box.custom-img-background .custom-heading {
 
    margin-bottom: 50px;
 
}
 
 
 
.custom-heading,
 
.custom-img-background .open-table-widget-style-1 .custom-heading{
 
    position: relative;
 
    margin-bottom: 50px;
 
}
 
.custom-img-background .open-table-widget-style-1 {
 
    padding-left: 30px;
 
    padding-right: 30px;
 
}
 
.custom-img-background .custom-heading {
 
    margin-bottom: 0;
 
}
 
.custom-heading h3 {
 
    margin-bottom: 10px;
 
}
 
.custom-heading h4 {
 
    margin-bottom: 15px;
 
}
 
.page-content.dark .custom-heading h1,
 
.page-content.dark .custom-heading h3 {
 
    color: #fff;
 
}
 
.custom-heading.style-1 h3 span {
 
    font-size: 36px;
 
}
 
.custom-heading.style-1 h2 span {
 
    font-size: 50px;
 
}
 
.custom-heading.style-1 h1 span {
 
    font-size: 60px;
 
}
 
 
.master-slider .pi-caption01 {
 
    font-family: 'Suranna', serif;
 
    color: #fff;
 
    font-size: 78px;
 
    line-height: 78px;
 
}
 
.master-slider .pi-caption02 {
 
    font-family: 'Montez', cursive;
 
    font-size: 72px;
 
    text-transform: none;
 
}
 
.master-slider .pi-text01 {
 
    font-family: 'Montserrat', Arial, sans-serif;
 
    color: #fff;
 
    font-size: 21px;
 
}
 
.master-slider .pi-text02,
 
.master-slider .pi-text02 span {
 
    font-family: 'Montserrat-UltraLight', Arial, sans-serif;
 
}
 
.master-slider .pi-text02 {
 
    color: #fff;
 
    font-size: 18px;
 
}
 
.master-slider .pi-text02 span {
 
    color: #acb8c4;
 
}
 
.master-slider .divider {
 
    width: 29.5em;
 
    text-align: center;
 
}
 
.master-slider .divider .hr-double.left:before {
 
    position:absolute;
 
    content: "";
 
    width: 10em;
 
    height: 1px;
 
    left: 2em;
 
    top: 1.8em;
 
}
 
.master-slider .divider .hr-double.left:after {
 
    position:absolute;
 
    content: "";
 
    width: 12em;
 
    height: 1px;
 
    top: 2.2em;
 
    left: 0;
 
}
 
.master-slider .divider .hr-double.right:before {
 
    position:absolute;
 
    content: "";
 
    width: 10em;
 
    height: 1px;
 
    right: 2em;
 
    top: 1.8em;
 
}
 
.master-slider .divider .hr-double.right:after {
 
    position:absolute;
 
    content: "";
 
    width: 12em;
 
    height: 1px;
 
    top: 2.2em;
 
    right: 0;
 
}
 
 
.master-slider .divider-svg {
 
    display: inline-block;
 
    width: 3em;
 
    height: 4em;
 
}
 
.master-slider .divider .divider-svg img{
 
    width: 3em;
 
    height: 4em;
 
}
 
 
/* ==========================================================================
 
  color-default.css
 
============================================================================= */
 
#header .navbar-default .navbar-nav > li > a:hover,
 
#header .navbar-default .navbar-nav > .current-menu-item > a,
 
#header .dropdown-menu > li.current-menu-item > a,
 
#header .navbar-default .navbar-nav > li>a:hover,
 
#header .navbar-default .navbar-nav > li >a:focus,
 
#header .dropdown-menu > li > a:hover,
 
#header .dropdown-menu > li > a:focus,
 
#header .dropdown.dropdown-submenu > a:hover::after,
 
#header .navbar-default .navbar-nav > .current-menu-item > a:before,
 
.dl-menuwrapper li.dl-back:after,
 
.dl-menuwrapper li > a:not(:only-child):after,
 
.dl-menuwrapper li.dl-back:after,
 
strong a,
 
.master-slider .pi-caption02,
 
.page-content.dark .custom-heading .divider .hr-circle,
 
 
span,
 
a:hover,
 
.custom-heading.style-1:before,
 
.custom-heading.style-1:after,
 
.custom-heading .divider .hr-icon,
 
.page-content ul li:before,
 
h1 span, h2 span, h3 span,
 
h4 span, h5 span, h6 span,
 
 
 
.owl-carousel .owl-controls .owl-buttons .owl-next:hover:before,
 
.owl-carousel .owl-controls .owl-buttons .owl-prev:hover:before{
 
    color: #b48c80;
 
}
 
 
 
/* ==========================================================================
 
  masterslider.css
 
============================================================================= */
 
 
.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 img, .ms-slide-bgvideocont video {max-width:none;}
 
 
 
 
/* grab cursor */
 
.ms-grab-cursor{cursor: url(grab.png), move;}
 
.ms-grabbing-cursor{cursor: url(grabbing.png), 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-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 {position:absolute;pointer-events: auto}
 
 
.ms-slide .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-scroll-parallax .ms-sl-selected .ms-scroll-parallax-cont,
 
.ms-scroll-parallax .ms-sl-selected .ms-slide-bgcont{}
 
.ms-scroll-parallax .ms-slide-bgcont{}*/
 
.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(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-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; }
 
}
 
 
/* In Android browser, using css animations over slider causes some crashes */
 
.ms-android .ms-tooltip-point .ms-point-border{
 
animation:none;
 
-moz-animation:none;
 
-webkit-animation:none;
 
-o-animation:none;
 
}
 
/* ==========================================================================
 
  responsive.css
 
============================================================================= */
 
 
@media (min-width:768px){.container{width:750px}}@media (min-width:992px){.container{width:970px}}@media (min-width:1200px){.container{width:1170px}}@media (min-width:768px){.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9{float:left}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-pull-12{right:100%}.col-sm-pull-11{right:91.66666667%}.col-sm-pull-10{right:83.33333333%}.col-sm-pull-9{right:75%}.col-sm-pull-8{right:66.66666667%}.col-sm-pull-7{right:58.33333333%}.col-sm-pull-6{right:50%}.col-sm-pull-5{right:41.66666667%}.col-sm-pull-4{right:33.33333333%}.col-sm-pull-3{right:25%}.col-sm-pull-2{right:16.66666667%}.col-sm-pull-1{right:8.33333333%}.col-sm-pull-0{right:auto}.col-sm-push-12{left:100%}.col-sm-push-11{left:91.66666667%}.col-sm-push-10{left:83.33333333%}.col-sm-push-9{left:75%}.col-sm-push-8{left:66.66666667%}.col-sm-push-7{left:58.33333333%}.col-sm-push-6{left:50%}.col-sm-push-5{left:41.66666667%}.col-sm-push-4{left:33.33333333%}.col-sm-push-3{left:25%}.col-sm-push-2{left:16.66666667%}.col-sm-push-1{left:8.33333333%}.col-sm-push-0{left:auto}.col-sm-offset-12{margin-left:100%}.col-sm-offset-11{margin-left:91.66666667%}.col-sm-offset-10{margin-left:83.33333333%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-8{margin-left:66.66666667%}.col-sm-offset-7{margin-left:58.33333333%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-5{margin-left:41.66666667%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-2{margin-left:16.66666667%}.col-sm-offset-1{margin-left:8.33333333%}.col-sm-offset-0{margin-left:0}}@media (min-width:992px){.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9{float:left}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-pull-12{right:100%}.col-md-pull-11{right:91.66666667%}.col-md-pull-10{right:83.33333333%}.col-md-pull-9{right:75%}.col-md-pull-8{right:66.66666667%}.col-md-pull-7{right:58.33333333%}.col-md-pull-6{right:50%}.col-md-pull-5{right:41.66666667%}.col-md-pull-4{right:33.33333333%}.col-md-pull-3{right:25%}.col-md-pull-2{right:16.66666667%}.col-md-pull-1{right:8.33333333%}.col-md-pull-0{right:auto}.col-md-push-12{left:100%}.col-md-push-11{left:91.66666667%}.col-md-push-10{left:83.33333333%}.col-md-push-9{left:75%}.col-md-push-8{left:66.66666667%}.col-md-push-7{left:58.33333333%}.col-md-push-6{left:50%}.col-md-push-5{left:41.66666667%}.col-md-push-4{left:33.33333333%}.col-md-push-3{left:25%}.col-md-push-2{left:16.66666667%}.col-md-push-1{left:8.33333333%}.col-md-push-0{left:auto}.col-md-offset-12{margin-left:100%}.col-md-offset-11{margin-left:91.66666667%}.col-md-offset-10{margin-left:83.33333333%}.col-md-offset-9{margin-left:75%}.col-md-offset-8{margin-left:66.66666667%}.col-md-offset-7{margin-left:58.33333333%}.col-md-offset-6{margin-left:50%}.col-md-offset-5{margin-left:41.66666667%}.col-md-offset-4{margin-left:33.33333333%}.col-md-offset-3{margin-left:25%}.col-md-offset-2{margin-left:16.66666667%}.col-md-offset-1{margin-left:8.33333333%}.col-md-offset-0{margin-left:0}}@media (min-width:1200px){.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9{float:left}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-pull-12{right:100%}.col-lg-pull-11{right:91.66666667%}.col-lg-pull-10{right:83.33333333%}.col-lg-pull-9{right:75%}.col-lg-pull-8{right:66.66666667%}.col-lg-pull-7{right:58.33333333%}.col-lg-pull-6{right:50%}.col-lg-pull-5{right:41.66666667%}.col-lg-pull-4{right:33.33333333%}.col-lg-pull-3{right:25%}.col-lg-pull-2{right:16.66666667%}.col-lg-pull-1{right:8.33333333%}.col-lg-pull-0{right:auto}.col-lg-push-12{left:100%}.col-lg-push-11{left:91.66666667%}.col-lg-push-10{left:83.33333333%}.col-lg-push-9{left:75%}.col-lg-push-8{left:66.66666667%}.col-lg-push-7{left:58.33333333%}.col-lg-push-6{left:50%}.col-lg-push-5{left:41.66666667%}.col-lg-push-4{left:33.33333333%}.col-lg-push-3{left:25%}.col-lg-push-2{left:16.66666667%}.col-lg-push-1{left:8.33333333%}.col-lg-push-0{left:auto}.col-lg-offset-12{margin-left:100%}.col-lg-offset-11{margin-left:91.66666667%}.col-lg-offset-10{margin-left:83.33333333%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-8{margin-left:66.66666667%}.col-lg-offset-7{margin-left:58.33333333%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-5{margin-left:41.66666667%}.col-lg-offset-4{margin-left:33.33333333%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-2{margin-left:16.66666667%}.col-lg-offset-1{margin-left:8.33333333%}.col-lg-offset-0{margin-left:0}}@media (min-width:768px){.navbar-right .dropdown-menu{left:auto;right:0}.navbar-right .dropdown-menu-left{left:0;right:auto}}@media (min-width:768px){.nav-tabs.nav-justified>li{display:table-cell;width:1%}.nav-tabs.nav-justified>li>a{margin-bottom:0}}@media (min-width:768px){.nav-tabs.nav-justified>li>a{border-bottom:1px solid #ddd;border-radius:4px 4px 0 0}.nav-tabs.nav-justified>.active>a,.nav-tabs.nav-justified>.active>a:focus,.nav-tabs.nav-justified>.active>a:hover{border-bottom-color:#fff}}@media (min-width:768px){.nav-justified>li{display:table-cell;width:1%}.nav-justified>li>a{margin-bottom:0}}@media (min-width:768px){.nav-tabs-justified>li>a{border-bottom:1px solid #ddd;border-radius:4px 4px 0 0}.nav-tabs-justified>.active>a,.nav-tabs-justified>.active>a:focus,.nav-tabs-justified>.active>a:hover{border-bottom-color:#fff}}@media (min-width:768px){.navbar{border-radius:4px}}@media (min-width:768px){.navbar-header{float:left}}@media (min-width:768px){.navbar-collapse{width:auto;border-top:0;box-shadow:none}.navbar-collapse.collapse{display:block!important;height:auto!important;padding-bottom:0;overflow:visible!important}.navbar-collapse.in{overflow-y:visible}.navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse,.navbar-static-top .navbar-collapse{padding-left:0;padding-right:0}}@media (max-width:480px) and (orientation:landscape){.navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse{max-height:200px}}@media (min-width:768px){.container-fluid>.navbar-collapse,.container-fluid>.navbar-header,.container>.navbar-collapse,.container>.navbar-header{margin-right:0;margin-left:0}}@media (min-width:768px){.navbar-static-top{border-radius:0}}@media (min-width:768px){.navbar-fixed-bottom,.navbar-fixed-top{border-radius:0}}@media (min-width:768px){.navbar>.container .navbar-brand,.navbar>.container-fluid .navbar-brand{margin-left:-15px}}@media (min-width:768px){.navbar-toggle{display:none}}@media (max-width:767px){.navbar-nav .open .dropdown-menu{position:static;float:none;width:auto;margin-top:0;background-color:transparent;border:0;box-shadow:none}.navbar-nav .open .dropdown-menu .dropdown-header,.navbar-nav .open .dropdown-menu>li>a{padding:5px 15px 5px 25px}.navbar-nav .open .dropdown-menu>li>a{line-height:20px}.navbar-nav .open .dropdown-menu>li>a:focus,.navbar-nav .open .dropdown-menu>li>a:hover{background-image:none}}@media (min-width:768px){.navbar-nav{float:left;margin:0}.navbar-nav>li{float:left}.navbar-nav>li>a{padding-top:15px;padding-bottom:15px}.navbar-nav.navbar-right:last-child{margin-right:-15px}}@media (min-width:768px){.navbar-left{float:left!important}.navbar-right{float:right!important}}@media (min-width:768px){.navbar-form .form-group{display:inline-block;margin-bottom:0;vertical-align:middle}.navbar-form .form-control{display:inline-block;width:auto;vertical-align:middle}.navbar-form .input-group{display:inline-table;vertical-align:middle}.navbar-form .input-group .form-control,.navbar-form .input-group .input-group-addon,.navbar-form .input-group .input-group-btn{width:auto}.navbar-form .input-group>.form-control{width:100%}.navbar-form .control-label{margin-bottom:0;vertical-align:middle}.navbar-form .checkbox,.navbar-form .radio{display:inline-block;margin-top:0;margin-bottom:0;vertical-align:middle}.navbar-form .checkbox label,.navbar-form .radio label{padding-left:0}.navbar-form .checkbox input[type=checkbox],.navbar-form .radio input[type=radio]{position:relative;margin-left:0}.navbar-form .has-feedback .form-control-feedback{top:0}}@media (max-width:767px){.navbar-form .form-group{margin-bottom:5px}}@media (min-width:768px){.navbar-form{width:auto;border:0;margin-left:0;margin-right:0;padding-top:0;padding-bottom:0;-webkit-box-shadow:none;box-shadow:none}.navbar-form.navbar-right:last-child{margin-right:-15px}}@media (min-width:768px){.navbar-text{float:left;margin-left:15px;margin-right:15px}.navbar-text.navbar-right:last-child{margin-right:0}}@media (max-width:767px){.visible-xs{display:block!important}table.visible-xs{display:table}tr.visible-xs{display:table-row!important}td.visible-xs,th.visible-xs{display:table-cell!important}}@media (max-width:767px){.visible-xs-block{display:block!important}}@media (max-width:767px){.visible-xs-inline{display:inline!important}}@media (max-width:767px){.visible-xs-inline-block{display:inline-block!important}}@media (min-width:768px) and (max-width:991px){.visible-sm{display:block!important}table.visible-sm{display:table}tr.visible-sm{display:table-row!important}td.visible-sm,th.visible-sm{display:table-cell!important}}@media (min-width:768px) and (max-width:991px){.visible-sm-block{display:block!important}}@media (min-width:768px) and (max-width:991px){.visible-sm-inline{display:inline!important}}@media (min-width:768px) and (max-width:991px){.visible-sm-inline-block{display:inline-block!important}}@media (min-width:992px) and (max-width:1199px){.visible-md{display:block!important}table.visible-md{display:table}tr.visible-md{display:table-row!important}td.visible-md,th.visible-md{display:table-cell!important}}@media (min-width:992px) and (max-width:1199px){.visible-md-block{display:block!important}}@media (min-width:992px) and (max-width:1199px){.visible-md-inline{display:inline!important}}@media (min-width:992px) and (max-width:1199px){.visible-md-inline-block{display:inline-block!important}}@media (min-width:1200px){.visible-lg{display:block!important}table.visible-lg{display:table}tr.visible-lg{display:table-row!important}td.visible-lg,th.visible-lg{display:table-cell!important}}@media (min-width:1200px){.visible-lg-block{display:block!important}}@media (min-width:1200px){.visible-lg-inline{display:inline!important}}@media (min-width:1200px){.visible-lg-inline-block{display:inline-block!important}}@media (max-width:767px){.hidden-xs{display:none!important}}@media (min-width:768px) and (max-width:991px){.hidden-sm{display:none!important}}@media (min-width:992px) and (max-width:1199px){.hidden-md{display:none!important}}@media (min-width:1200px){.hidden-lg{display:none!important}}
 
 
 
#dl-menu{
 
    display: none;
 
}
 
 
.dl-menuwrapper {
 
    width: 100%;
 
    max-width: 300px;
 
    float: left;
 
    position: relative;
 
    -webkit-perspective: 1000;
 
    -moz-perspective: 1000;
 
    perspective: 1000;
 
    -webkit-perspective-origin: 50% 200%;
 
    -moz-perspective-origin: 50% 200%;
 
    perspective-origin: 50% 200%;
 
    display: none;
 
    z-index: 1002;
 
}
 
 
.dl-menuwrapper:first-child {
 
    margin-right: 100px;
 
}
 
 
.dl-menuwrapper button {
 
    background: #ccc;
 
    border: none;
 
    width: 100%;
 
    height: 45px;
 
    overflow: hidden;
 
    position: relative;
 
    cursor: pointer;
 
    outline: none;
 
    color: #fff;
 
    text-transform: uppercase;
 
    text-align: left;
 
    padding-left: 60px;
 
    font-family: 'Montserrat', Arial, sans-serif;
 
}
 
 
.dl-menuwrapper button:hover,
 
.dl-menuwrapper button.dl-active,
 
.dl-menuwrapper ul {
 
    background: #aaa;
 
}
 
 
.dl-menuwrapper button:after {
 
    content: '';
 
    position: absolute;
 
    width: 30px;
 
    height: 1px;
 
    background: #fff;
 
    top: 14px;
 
    left: 10px;
 
    box-shadow:
 
        0 8px 0 #fff,
 
        0 16px 0 #fff;
 
}
 
 
.dl-menuwrapper ul {
 
    padding: 0;
 
    list-style: none;
 
    -webkit-transform-style: preserve-3d;
 
    -moz-transform-style: preserve-3d;
 
    transform-style: preserve-3d;
 
}
 
 
.dl-menuwrapper li {
 
    position: relative;
 
}
 
 
.dl-menuwrapper li a {
 
    display: block;
 
    position: relative;
 
    padding: 12px 15px;
 
    font-size: 13px;
 
    line-height: 22px;
 
    font-weight: 400;
 
    color: #A0A0A0;
 
    border-bottom: 1px solid #3C3C3C;
 
    outline: none;
 
}
 
 
.dl-menuwrapper li:last-child a {
 
    border-bottom: none;
 
}
 
 
.no-touch .dl-menuwrapper li a:hover{
 
    background: #363636;
 
}
 
 
.dl-menuwrapper li.dl-back > a {
 
    padding-left: 30px;
 
    background: rgba(0,0,0,0.1);
 
}
 
 
.dl-menuwrapper li.dl-back:after,
 
.dl-menuwrapper li > a:not(:only-child):after {
 
    position: absolute;
 
    top: 0;
 
    speak: none;
 
    -webkit-font-smoothing: antialiased;
 
    line-height: 45px;
 
    font-size: 10px;
 
    font-family: 'FontAwesome';
 
    content: "\f054";
 
}
 
 
.dl-menuwrapper li.dl-back:after {
 
    left: 10px;
 
    -webkit-transform: rotate(180deg);
 
    -moz-transform: rotate(180deg);
 
    transform: rotate(180deg);
 
}
 
 
.dl-menuwrapper li > a:after {
 
    right: 10px;
 
    color: rgba(0,0,0,0.15);
 
}
 
 
.dl-menuwrapper .dl-menu {
 
    margin: 5px 0 0 0;
 
    position: absolute;
 
    width: 100%;
 
    opacity: 0;
 
    pointer-events: none;
 
    -webkit-transform: translateY(10px);
 
    -moz-transform: translateY(10px);
 
    transform: translateY(10px);
 
    -webkit-backface-visibility: hidden;
 
    -moz-backface-visibility: hidden;
 
    backface-visibility: hidden;
 
}
 
 
.dl-menuwrapper .dl-menu.dl-menu-toggle {
 
    -webkit-transition: all 0.3s ease;
 
    -moz-transition: all 0.3s ease;
 
    transition: all 0.3s ease;
 
}
 
 
.dl-menuwrapper .dl-menu.dl-menuopen {
 
    opacity: 1;
 
    pointer-events: auto;
 
    -webkit-transform: translateY(0px);
 
    -moz-transform: translateY(0px);
 
    transform: translateY(0px);
 
}
 
 
/* Hide the inner submenus */
 
.dl-menuwrapper li .dl-submenu {
 
    display: none;
 
}
 
 
/*
 
When a submenu is openend, we will hide all li siblings.
 
For that we give a class to the parent menu called "dl-subview".
 
We also hide the submenu link.
 
The opened submenu will get the class "dl-subviewopen".
 
All this is done for any sub-level being entered.
 
*/
 
.dl-menu.dl-subview li,
 
.dl-menu.dl-subview li.dl-subviewopen > a,
 
.dl-menu.dl-subview li.dl-subview > a {
 
    display: none;
 
}
 
 
.dl-menu.dl-subview li.dl-subview,
 
.dl-menu.dl-subview li.dl-subview .dl-submenu,
 
.dl-menu.dl-subview li.dl-subviewopen,
 
.dl-menu.dl-subview li.dl-subviewopen > .dl-submenu,
 
.dl-menu.dl-subview li.dl-subviewopen > .dl-submenu > li {
 
    display: block;
 
}
 
 
/* Dynamically added submenu outside of the menu context */
 
.dl-menuwrapper > .dl-submenu {
 
    position: absolute;
 
    width: 100%;
 
    top: 50px;
 
    left: 0;
 
    margin: 0;
 
}
 
 
/* Animation classes for moving out and in */
 
.dl-menu.dl-animate-out-2 {
 
    -webkit-animation: MenuAnimOut2 0.3s ease-in-out;
 
    -moz-animation: MenuAnimOut2 0.3s ease-in-out;
 
    animation: MenuAnimOut2 0.3s ease-in-out;
 
}
 
 
@-webkit-keyframes MenuAnimOut2 {
 
    100% {
 
        -webkit-transform: translateX(-100%);
 
        opacity: 0;
 
    }
 
}
 
 
@-moz-keyframes MenuAnimOut2 {
 
    100% {
 
        -moz-transform: translateX(-100%);
 
        opacity: 0;
 
    }
 
}
 
 
@keyframes MenuAnimOut2 {
 
    100% {
 
        transform: translateX(-100%);
 
        opacity: 0;
 
    }
 
}
 
 
.dl-menu.dl-animate-in-2 {
 
    -webkit-animation: MenuAnimIn2 0.3s ease-in-out;
 
    -moz-animation: MenuAnimIn2 0.3s ease-in-out;
 
    animation: MenuAnimIn2 0.3s ease-in-out;
 
}
 
 
@-webkit-keyframes MenuAnimIn2 {
 
    0% {
 
        -webkit-transform: translateX(-100%);
 
        opacity: 0;
 
    }
 
    100% {
 
        -webkit-transform: translateX(0px);
 
        opacity: 1;
 
    }
 
}
 
 
@-moz-keyframes MenuAnimIn2 {
 
    0% {
 
        -moz-transform: translateX(-100%);
 
        opacity: 0;
 
    }
 
    100% {
 
        -moz-transform: translateX(0px);
 
        opacity: 1;
 
    }
 
}
 
 
@keyframes MenuAnimIn2 {
 
    0% {
 
        transform: translateX(-100%);
 
        opacity: 0;
 
    }
 
    100% {
 
        transform: translateX(0px);
 
        opacity: 1;
 
    }
 
}
 
 
.dl-menuwrapper > .dl-submenu.dl-animate-in-2 {
 
    -webkit-animation: SubMenuAnimIn2 0.3s ease-in-out;
 
    -moz-animation: SubMenuAnimIn2 0.3s ease-in-out;
 
    animation: SubMenuAnimIn2 0.3s ease-in-out;
 
}
 
 
@-webkit-keyframes SubMenuAnimIn2 {
 
    0% {
 
        -webkit-transform: translateX(0%);
 
        opacity: 0;
 
    }
 
    100% {
 
        -webkit-transform: translateX(0px);
 
        opacity: 1;
 
    }
 
}
 
 
@-moz-keyframes SubMenuAnimIn2 {
 
    0% {
 
        -moz-transform: translateX(0%);
 
        opacity: 0;
 
    }
 
    100% {
 
        -moz-transform: translateX(0px);
 
        opacity: 1;
 
    }
 
}
 
 
@keyframes SubMenuAnimIn2 {
 
    0% {
 
        transform: translateX(0%);
 
        opacity: 0;
 
    }
 
    100% {
 
        transform: translateX(0px);
 
        opacity: 1;
 
    }
 
}
 
 
.dl-menuwrapper > .dl-submenu.dl-animate-out-2 {
 
    -webkit-animation: SubMenuAnimOut2 0.3s ease-in-out;
 
    -moz-animation: SubMenuAnimOut2 0.3s ease-in-out;
 
    animation: SubMenuAnimOut2 0.3s ease-in-out;
 
}
 
 
@-webkit-keyframes SubMenuAnimOut2 {
 
    0% {
 
        -webkit-transform: translateX(0%);
 
        opacity: 1;
 
    }
 
    100% {
 
        -webkit-transform: translateX(100%);
 
        opacity: 0;
 
    }
 
}
 
 
@-moz-keyframes SubMenuAnimOut2 {
 
    0% {
 
        -moz-transform: translateX(0%);
 
        opacity: 1;
 
    }
 
    100% {
 
        -moz-transform: translateX(100%);
 
        opacity: 0;
 
    }
 
}
 
 
@keyframes SubMenuAnimOut2 {
 
    0% {
 
        transform: translateX(0%);
 
        opacity: 1;
 
    }
 
    100% {
 
        transform: translateX(100%);
 
        opacity: 0;
 
    }
 
}
 
 
/* No JS Fallback */
 
.no-js .dl-menuwrapper .dl-menu {
 
    position: relative;
 
    opacity: 1;
 
    -webkit-transform: none;
 
    -moz-transform: none;
 
    transform: none;
 
}
 
 
.no-js .dl-menuwrapper li .dl-submenu {
 
    display: block;
 
}
 
 
.no-js .dl-menuwrapper li.dl-back {
 
    display: none;
 
}
 
 
.no-js .dl-menuwrapper li > a:not(:only-child) {
 
    background: rgba(0,0,0,0.1);
 
}
 
 
.no-js .dl-menuwrapper li > a:not(:only-child):after {
 
    content: '';
 
}
 
 
.dl-menuwrapper button {
 
    background: #252525;
 
}
 
 
.dl-menuwrapper button:hover {
 
    background: #363636;
 
}
 
 
.dl-menuwrapper button.dl-active,
 
.dl-menuwrapper ul {
 
    background: #252525;
 
}
 
 
@media only screen and (min-width: 320px) and (max-width: 479px){
 
 
    .page-content .row{
 
        margin-bottom: 0px;
 
    }
 
    .page-content *[class*="col-"] {
 
        margin-bottom: 80px;
 
    }
 
    *[class*="col-"] *[class*="col-"]{
 
        margin-left: 0 !important;
 
    }
 
    *[class*="col-"] img:only-child  {
 
        display: table;
 
        margin-left: auto;
 
        margin-right: auto;
 
    }
 
 
    /*  HEADER WRAPPER
 
    --------------------------------------------------------------------- */
 
 
    #header-wrapper{
 
        position: relative;
 
        background-color: rgba(0,0,0,1.0);
 
    }
 
    #header-wrapper + *{
 
        margin-top: 0 !important;
 
    }
 
 
    /*  NAVIGATION
 
    --------------------------------------------------------------------- */
 
    #header .nav-left .navbar-header {
 
        width: 100%;
 
    }
 
    .navbar-nav.pi-nav{
 
        display: none;
 
    }
 
    .dl-menuwrapper {
 
        max-width: 100%;
 
    }
 
    #dl-menu{
 
        display: block;
 
    }
 
    .collapse.navbar-collapse{
 
        width: 100%;
 
    }
 
    .navbar-header,
 
    #header.header-type-1 .nav-left .navbar-header{
 
        float: none;
 
    }
 
    .logo{
 
        display: table;
 
        margin: 20px auto;
 
    }
 
    .logo img {
 
        height: 80px;
 
    }
 
 
 
 
    .col-md-6 .blockquote.style-1 {
 
        width: 100%;
 
    }
 
 
    --------------------------------------------------------------------- */
 
 
    #header-wrapper{
 
        position: relative;
 
        background-color: rgba(0,0,0,1.0);
 
    }
 
    #header-wrapper + *{
 
        margin-top: 0 !important;
 
    }
 
 
 
    /*  NAVIGATION
 
    --------------------------------------------------------------------- */
 
    #header .nav-left .navbar-header {
 
        width: 100%;
 
    }
 
    .navbar-nav.pi-nav{
 
        display: none;
 
    }
 
    .dl-menuwrapper {
 
        max-width: 100%;
 
    }
 
    #dl-menu{
 
        display: block;
 
    }
 
    .collapse.navbar-collapse{
 
        width: 100%;
 
    }
 
    .navbar-header,
 
    #header.header-type-1 .nav-left .navbar-header{
 
        float: none;
 
    }
 
    .logo{
 
        display: table;
 
        margin: 20px auto;
 
    }
 
    .logo img {
 
        height: 80px;
 
    }
 
 
    .col-md-6 .blockquote.style-1 {
 
        width: 100%;
 
    }
 
 
 
 
 
    /*  MASTER SLIDER
 
    --------------------------------------------------------------------- */
 
 
    .master-slider .pi-text01,
 
    .master-slider .pi-text02,
 
    .master-slider .pi-text02 span,
 
    .master-slider .divider {
 
        visibility: hidden;
 
    }
 
 
    .scroll-up {
 
        bottom: 20px;
 
        right: 20px;
 
    }
 
}
 
 
@media only screen and (min-width: 768px) and (max-width: 991px){
 
 
    .page-content .row{
 
        margin-bottom: 0px;
 
    }
 
    .page-content *[class*="col-"] {
 
        margin-bottom: 80px;
 
    }
 
    *[class*="col-"] *[class*="col-"]{
 
        margin-left: 0 !important;
 
    }
 
    *[class*="col-"] img:only-child  {
 
        display: table;
 
        margin-left: auto;
 
        margin-right: auto;
 
    }
 
 
    /*  HEADER WRAPPER
 
    --------------------------------------------------------------------- */
 
 
    #header-wrapper{
 
        position: relative;
 
        background-color: rgba(0,0,0,1.0);
 
    }
 
    #header-wrapper + *{
 
        margin-top: 0 !important;
 
    }
 
 
    /*  NAVIGATION
 
    --------------------------------------------------------------------- */
 
    #header .nav-left .navbar-header {
 
        width: auto;
 
    }
 
    .navbar-nav.pi-nav{
 
        display: none;
 
    }
 
    .dl-menuwrapper {
 
        max-width: 100%;
 
    }
 
    #dl-menu{
 
        display: block;
 
    }
 
    .collapse.navbar-collapse{
 
        width: 60%;
 
        float: left;
 
        margin-top: 20px;
 
    }
 
    .navbar-header,
 
    #header.header-type-1 .nav-left .navbar-header{
 
        float: none;
 
    }
 
    .logo{
 
        display: table;
 
        margin: 10px auto;
 
    }
 
    .logo img {
 
        height: 65px;
 
    }
 
    .navbar {
 
        margin-bottom: 0;
 
    }
 

Latest revision as of 02:54, 22 September 2017