/****************************************************************
 *  Powered by GongKia.com
 *  Author : Ivan Yew           Email    : ivaneyew@gmail.com
 *  URL    : ivan.gongkia.com   Facebook : fb.me/ivan8i
 ****************************************************************/
@import url(https://fonts.googleapis.com/css?family=Gochi+Hand);
@import url(https://fonts.googleapis.com/css?family=Droid+Sans);
@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,500,700);
@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:400,300,700);
@import url(graphy.css);

html, body { height: 100%; }
body { font-size: 15px; font-family: 'Droid Sans', sans-serif; }
img { image-rendering: optimizeQuality; -ms-interpolation-mode: bicubic; }

/* Button */
.btn:hover,
.btn:focus,
.btn:active,
.btn:active:focus { outline: none; }
.btn-frame { background-color: transparent; border-width: 2px; border-color: #fff; color: #fff; }
.btn-frame:hover,
.btn-frame:hover:focus,
.btn-frame:active { background-color: #07a; border-color: #07a; color: #fff; }
.btn-frame:focus { color: #fff; }
.btn-dark { border-color: #232323; color: #232323; font-weight: 600; }
.btn-dark:focus { color: #232323; }
.btn-dark:hover:focus { color: #fff; }
  /* Button Group */
  .btn-group>.btn+.dropdown-toggle { margin-left: -2px; }

/* iModal */
.iModal .modal-backdrop.in { opacity: .7; }
.iModal .modal-content { box-shadow: none; }
.iModal .modal-content .close:hover,
.iModal .modal-content .close:focus,
.iModal .modal-content .close:active { outline: none; }
.iModal .modal-content > .close { position: absolute; top: -10px; right: -10px; z-index: 3; background-color: #000; border: 4px solid #fff; color: #fff; opacity: 1; outline: none;
  -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; }
.iModal .modal-content > .close > span { display: block; width: 25px; height: 25px; font: normal 22px/24px serif; }
.iModal .modal-content > .close:hover,
.iModal .modal-content > .close:focus,
.iModal .modal-content > .close:active { background-color: #d44; }
  .modal-open,
  .modal-open .iModal { padding-right: 0 !important; }
  /* Centerized */
  .iModal .modal-dialog-center { margin: 0; position: absolute; top: 50%; left: 50%; }
  .iModal .modal-body { overflow-x: hidden; overflow-y: auto; }
  .iModal .modal-footer { margin-top: 0; }
  /* Modal:Browser */
  .modal-mac .close,
  .modal-mac .modal-content > .close { position: absolute; left: 10px; right: auto; top: 50%; margin-top: -7px; float: none; background-color: #fc5254; border: 0; opacity: 1;
    -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; }
  .modal-mac .close > span,
  .modal-mac .modal-content > .close > span { display: block; width: 14px; height: 14px; font: normal 14px/1.1em serif; text-align: center; text-shadow: none; color: transparent; }
  .modal-mac .close:hover > span { color: #fff; }
  .modal-mac .modal-content { background-color: transparent; }
  .modal-mac .modal-header { padding: 8px 50px 8px 75px; background-color: #f2f3f5; position: relative; text-align: center;
    -webkit-border-radius: 6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; }
  .modal-mac .modal-header:before,
  .modal-mac .modal-header:after { position: absolute; top: 50%; margin-top: -7px; display: block; width: 14px; height: 14px; color: transparent; font-size: 14px; line-height: 13px;
    -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; }
  .modal-mac .modal-header:before { content: '-'; left: 30px; background-color: #fcae52; }
  .modal-mac .modal-header:after { content: '+'; left: 50px; background-color: #66b34e; }
  .modal-mac .modal-title { padding: 0 10px; font-size: 14px; line-height: 25px; background-color: #fff; border: 1px solid #eee;
    -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
  .modal-mac .modal-body { padding: 15px; background-color: #fff;
    -webkit-border-radius: 0 0 6px 6px; -moz-border-radius: 0 0 6px 6px; border-radius: 0 0 6px 6px; }
  .modal-mac .modal-footer { padding: 8px 15px; background-color: #f2f3f5;
    -webkit-border-radius: 0 0 6px 6px; -moz-border-radius: 0 0 6px 6px; border-radius: 0 0 6px 6px; }
    /* No Header*/
    .modal-mac .no-header { padding-top: 32px; }
    .modal-mac .no-header:before { content: ''; display: block; position: absolute; top: 0; width: 100%; height: 32px; background-color: #f2f3f5; border-bottom: 1px solid #ddd;
      -webkit-border-radius: 6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; }
    .modal-mac .no-header > .close { top: 9px; margin-top: 0; }
    .modal-mac .no-header .modal-body { border-radius: 0 0 6px 6px; }
   /* Modal:Windows */
  .modal-windows .close,
  .modal-windows .modal-content > .close { position: absolute; right: 0; top: 2px; float: none; background-color: #c75050; border: 0; opacity: 1;
    -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
  .modal-windows .close:hover,
  .modal-windows .modal-content > .close:hover { background-color: #E44C4C; }
  .modal-windows .modal-content > .close { top: -5px; right: 1px; }
  .modal-windows .close > span,
  .modal-windows .modal-content > .close > span { display: block; width: 45px; height: 20px; font: normal 20px/18px serif; text-align: center; text-shadow: none; color: #fff; }
  .modal-windows .modal-dialog { border: 1px solid #6c99c0;
    -webkit-box-shadow: 0 2px 5px -2px rgba(0,0,0,0.25); -moz-box-shadow: 0 2px 5px -2px rgba(0,0,0,0.25); box-shadow: 0 2px 5px -2px rgba(0,0,0,0.25); }
  .modal-windows .modal-content { background-color: #8dc8fb; border: 5px solid #8dc8fb; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
  .modal-windows .modal-header { margin-top: -5px; padding: 5px 100px 5px 30px; background-color: #8dc8fb; border-bottom: 0; position: relative; text-align: center; }
  .modal-windows .modal-header:before,
  .modal-windows .modal-header:after { position: absolute; top: 0; display: block; width: 25px; height: 20px; font-size: 14px; font-family: 'fontAwesome'; line-height: 22px; color: #000; }
  .modal-windows .modal-header:before { content: '\f096'; right: 46px; font-weight: 700; }
  .modal-windows .modal-header:after { content: '\f068'; right: 72px; line-height: 24px; }
  .modal-windows .modal-title { font-size: 14px; color: #282828; }
  .modal-windows .modal-body { padding: 15px; background-color: #fff; border: 1px solid #78aad6; }
  .modal-windows .modal-footer { padding: 8px 15px; background-color: #f2f3f5; }
  .modal-windows .modal-body + .modal-footer { margin-top: -1px; border: 1px solid #78aad6; border-top: 0; position: relative;
    -webkit-box-shadow: 0 1px 0 0 rgba(0,0,0,0.1) inset; -moz-box-shadow: 0 1px 0 0 rgba(0,0,0,0.1) inset; box-shadow: 0 1px 0 0 rgba(0,0,0,0.1) inset; }
    /* No Header */
    .modal-windows .no-header { padding-top: 21px; }
  /* Modal:Image */
  .modal-image .modal-body { padding: 5px; }
  .modal-image img { margin: 0 auto; }
  /* Modal:Iframe */
  .modal-iframe .modal-body { padding: 0; }

/* iTab */
.iTab {}
  .iTab .nav-tabs { padding: 5px 5px 0; }
  .iTab .tab-content { padding-top: 10px; padding-bottom: 10px; }
  .it-frame { border: 1px solid #ddd; }
    .it-frame .tab-content { padding-top: 20px; padding-left: 20px; padding-right: 20px; }
  .it-noborder .nav-tabs { border-bottom: 0; }
    .it-noborder .nav-tabs>li { margin-bottom: 0; }
    .it-noborder .nav-tabs>li>a,
    .it-noborder .nav-tabs>li.active>a,
    .it-noborder .nav-tabs>li.active>a:focus,
    .it-noborder .nav-tabs>li.active>a:hover { border: 0; }
  .it-nobg {}
    .it-nobg .nav-tabs>li { margin-bottom: 0; }
    .it-nobg .nav-tabs>li>a { border-radius: 4px; }
  .it-whitelink {}
    .it-whitelink .nav-tabs>li>a { color: #fff; }
    .it-whitelink .nav-tabs>li>a:focus,
    .it-whitelink .nav-tabs>li>a:hover,
    .it-whitelink .nav-tabs>li.active>a { color: #555; }
  .it-greylink {}
    .it-greylink .nav-tabs>li>a,
    .it-greylink .nav-tabs>li>a:focus,
    .it-greylink .nav-tabs>li>a:hover { color: #777; }
    .it-greylink .nav-tabs>li.active>a { color: #555; }

/*===============================================
    Home / Main / Front
  ===============================================*/
.gc-title { margin-top: 0; margin-bottom: 20px; }
.gc-title small { display: block; margin-top: 0.2em; font-size: 0.5em; }
.gc-title + .gc-body { margin-top: 2em; }
.gc-body .btn { margin-top: 0.6em; }

.gc-section { background-color: #fff; }

.isFront { height: 100% !important; }
.front { background-color: #07a; }
.front .gong-main { height: 100%; }
.front .gong-logo { position: absolute; top: 70px; left: 7.14286%; z-index: 2; font-size: 3.4em; font-family: 'Gochi Hand'; font-style: normal; font-weight: 400; color: #fff; }
.front .gong-logo:hover { text-decoration: none; }
.front .gong-header { position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 0; }
.front .gong-header .gh-content { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; }
  .front .gong-header .gh-text { position: absolute; top: 0; left: 0; bottom: 0; width: 100%; height: 100%; display: table; }
    .front .gong-header .gh-text-wrap { display: table-cell; vertical-align: bottom; padding-bottom: 50px; }
    .front .gong-header .gh-text-wrap h3,
    .front .gong-header .gh-text-wrap h5,
    .front .gong-header .gh-text-wrap .ght-buttons,
    .front .gong-header .gh-text-wrap .ght-login { margin-left: 7.14286%; }
    .front .gong-header .gh-text-wrap h3 { margin-top: 0; margin-bottom: 0; font-family: 'Roboto Condensed', sans-serif; font-size: 4em; font-weight: 500; line-height: 1.224em; color: #fff; }
    .front .gong-header .gh-text-wrap h5 { margin-top: 1.4em; margin-bottom: 0; font-size: 1.5em; line-height: 1.4em; color: rgba(255,255,255,0.6); }
    .front .gong-header .gh-text-wrap .ght-buttons { margin-top: 24px; }
    .front .gong-header .gh-text-wrap .ght-buttons .fa + span { margin-left: 7px; }
    .front .gong-header .gh-text-wrap .ght-buttons .btn-frame:hover { background-color: #333; border-color: #333; }
    .front .gong-header .gh-text-wrap .ght-login { margin-top: 16px; padding-left: 0; list-style: none; }
    .front .gong-header .gh-text-wrap .ght-login li { position: relative; display: inline-block; }
    .front .gong-header .gh-text-wrap .ght-login li + li { margin-left: 5px; }
    .front .gong-header .gh-text-wrap .ght-login li + li:before { content: '.'; display: block; float: left; font-size: 20px; line-height: .5em; margin-right: 10px; color: #fff; }
    .front .gong-header .gh-text-wrap .ght-login a { display: inline-block; color: #fff; }
    .front .gong-header .gh-text-wrap .ght-login a:hover { text-decoration: none; color: #c6edfd; }
    .front .gong-header .gh-text-wrap .ght-login a:focus { text-decoration: none; outline: 0; }
    .front .gong-header .gh-text-wrap .ght-login a + a { margin-left: 10px; position: relative; }
    .front .gong-header .gh-text-wrap .ght-login span { }
    .front .gong-header .gh-text-wrap .ght-login em { font-style: normal; }
.front .gong-header .gh-background { width: 100%; height: 80%; position: relative; }
  .front .gong-header .gh-bg-parallax { position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; margin: 0; padding: 0; }
  .front .gong-header .gh-bg-parallax .layer { width: 100%; height: 100%; }
  .front .gong-header .gh-bg-parallax .layer > div { width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center;
    -webkit-transform: translate3d(0,0,0);
       -moz-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
    -webkit-transform-style: preserve-3d;
       -moz-transform-style: preserve-3d;
            transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
            backface-visibility: hidden; }

.front .gong-content { position: relative; top: 100.5%; z-index: 2; overflow-x: hidden; margin-top: -1px; }
  .front .gong-content .gc-section { padding: 4em 0; }
    .front .gong-content .gc-section .gc-wrap { margin: 0 7.14286%; }
    .front .gong-content .gc-footer { padding-top: 3em; padding-bottom: 3em; }

.front .coming-soon { background-color: #eee; position: relative; }
.front .coming-soon img { margin: 0 auto;
  -webkit-filter: grayscale(1);
     -moz-filter: grayscale(1);
      -ms-filter: grayscale(1);
          filter: grayscale(1); }
  .front .coming-soon:after { content: 'Coming Soon'; display: block; position: absolute; top: 50%; left: 50%; width: 500px; height: 100px; margin-top: -50px; margin-left: -250px;
    font-size: 75px; font-weight: 500; font-family: 'Gochi Hand', cursive; text-align: center; color: #fff; text-shadow: 0 0 1px rgba(0,0,0,1), 0 0 1px rgba(0,0,0,1);
    -webkit-transform: rotate(-35deg);
       -moz-transform: rotate(-35deg);
        -ms-transform: rotate(-35deg);
            transform: rotate(-35deg); }

.usr-login-form .form-wrap { max-width: 70%; padding: 30px; margin: 0 auto; }
  .usr-login-form .form-group { margin-bottom: 0; }
  .usr-login-form .form-group + .form-group { margin-top: 10px; }


/*===============================================
    Header
  ===============================================*/
.navbar-header .logo { display: block; padding-top: 9px; padding-bottom: 9px; }


/*===============================================
    Contents
  ===============================================*/
.contents { padding-top: 4em; padding-bottom: 4em; }


/*===============================================
    Footer
  ===============================================*/
.footer { padding-top: 2.4em; padding-bottom: 2.4em; background-color: #2a2a2a; color: #fff; }
.footer a { color: #bbb; text-decoration: none; }
.footer a:hover { color: #fff; }
  .copyright p { margin-bottom: 0; color: #94989a; font-size: 14px; }
  .copyright i.txt-white { font-size: 20px; }
  .ft-link { text-align: right; font-size: 14px; }
  .ft-link .list-inline { margin-bottom: 0; margin-right: -5px; }


/*===============================================
    Misc
  ===============================================*/
@media (max-width: 767px){
  .col-item + .col-item { margin-top: 50px; padding: 50px 0 0; border-top: 1px solid #ddd; }
}
@media (min-width: 768px) and (max-width: 1199px){
  .col-item + .col-item + .col-item { margin-top: 40px; padding-top: 35px; border-top: 1px solid #ddd; }
}
.img-box,
.txt-box { margin-bottom: 30px; }
.img-center { margin-left: auto; margin-right: auto; }
.no-margin-top { margin-top: 0; }
.no-padding { padding: 0 !important; }
.no-border { border: 0 !important; }
.no-radius { -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; border-radius: 0 !important; }
.radius-5 { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.radius-6 { -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
.bg-grey    { background-color: #f5f5f5; }
.bg-dark    { background-color: #232323; }
.bg-red     { background-color: #ff3739; }
.bg-yellow  { background-color: #f5dc29; }
.bg-blue    { background-color: #109AD6; }
.bg-green   { background-color: #05DEC0; }
.bg-tgrey   { background-color: #f2f3f5; }
.bg-tr      { background-color: #d04b4c; }
.bg-ty      { background-color: #efc230; }
.bg-tb      { background-color: #0077aa; }
.bg-tg      { background-color: #00bfa5; }
.txt-white  { color: #ffffff; }
.txt-red    { color: #ff3739; }
.txt-yellow { color: #f5dc29; }
.txt-blue   { color: #109AD6; }
.txt-green  { color: #05DEC0; }
.txt-tr     { color: #d04b4c; }
.txt-ty     { color: #efc230; }
.txt-tb     { color: #0077aa; }
.txt-tg     { color: #00bfa5; }
.bd-red     { border-color: #ff3739; }
.bd-yellow  { border-color: #f5dc29; }
.bd-blue    { border-color: #109AD6; }
.bd-green   { border-color: #05DEC0; }
.bd-tr      { border-color: #d04b4c; }
.bd-ty      { border-color: #efc230; }
.bd-tb      { border-color: #0077aa; }
.bd-tg      { border-color: #00bfa5; }
/* Animate */
.typed-cursor{
    opacity: 1;
    -webkit-animation: blink 0.7s infinite;
       -moz-animation: blink 0.7s infinite;
            animation: blink 0.7s infinite;
}
@keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-webkit-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-moz-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}

/*===============================================
    GongKia Example
  ===============================================*/
.gk-component .modal { position: relative; top: 0; right: 0; left: 0; bottom: 0; z-index: 1; display: block; }
.gk-component-box { padding: 1em; }
.gk-component-box h2 { margin: 0; color: #fff; text-align: center; }
@media screen and (max-width: 991px) {
  .gk-component-box h2 { font-size: 24px; }
}
/* Embed iFrame */
.embed-iframe .contents { padding-top: 30px; }
.embed-iframe .contents header.page-header { margin-top: 0; }
.xxx { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; border: 0; }

/*===============================================
    BS Example
  ===============================================*/
.bs-component .modal { position: relative; top: 0; right: 0; left: 0; bottom: 0; z-index: 1; display: block; }


/*===============================================
    Responsive
  ===============================================*/
@media screen and (max-width: 991px) {
  .front .gong-header .gh-bg-parallax .layer > div { background-size: 180%; }
  .usr-login-form .form-wrap { max-width: none; padding: 0; }
}
@media screen and (max-width: 767px) {
  .modal-dialog-center { width: 100%; }
  /* Home / Main / Front */
  .front .gong-modal .coming-soon:after { width: 100%; height: 30%; margin-left: -50%; margin-top: -15%; font-size: 50px; }
  /* Footer */
  .copyright { text-align: center; }
  /* Misc */
  .col-img + .col-info { margin-top: 20px; }
}
@media screen and (max-width: 639px) {}
@media screen and (max-width: 479px) {
  .front .gong-logo { top: 10px; left: 50%; width: 180px; margin-left: -90px; line-height: normal; }
  .front .gong-header { position: absolute; bottom: 0; }
  .front .gong-header .gh-text-wrap { padding-bottom: 2.4em; }
  .front .gong-header .gh-text-wrap h3,
  .front .gong-header .gh-text-wrap h5,
  .front .gong-header .gh-text-wrap .ght-buttons,
  .front .gong-header .gh-text-wrap .ght-login { margin-right: 7.14286%; text-align: center; }
  .front .gong-header .gh-text-wrap h3 { width: auto; font-size: 2em; }
  .front .gong-header .gh-text-wrap h5 { margin-top: .7em; font-size: 1.2em; }
  .front .gong-header .gh-text-wrap .ght-buttons { margin-top: .8em; }
  .front .gong-header .gh-text-wrap .ght-buttons .btn-frame span { display: none; }
  .front .gong-header .gh-background { height: 65%; }
  .front .gong-content .gc-footer { padding-top: 2em; padding-bottom: 2em; }
  /* Footer */
  .copyright p { font-size: 12px; }
  .copyright i.txt-white { font-size: 15px; }
}
@media screen and (min-width: 768px) {}
@media screen and (min-width: 768px) and (max-width: 991px) {}
@media screen and (min-width: 992px) {}
@media screen and (min-width: 992px) and (max-width: 1199px) {}
@media screen and (min-width: 1200px) {
  .front .gong-header .gh-text-wrap { padding-bottom: 0; vertical-align: middle; }
  .front .gong-header .gh-text-wrap h3 { width: 9em; }
  .front .gong-header .gh-background { width: 75%; height: 100%; margin-left: auto; }
}