@charset "utf-8";

/* ===================================
     Google Fonts
 ====================================== */

@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);


/* ===================================
     Reset and Setup 
 ====================================== */

html,
body {
    height:100%;
    min-height:100%;
    -webkit-text-size-adjust:100%;
    -webkit-tap-highlight-color:transparent;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}

/* Reset Default Margin */
a, abbr, acronym, address, applet, 
big, blockquote, body, caption, 
cite, code, dd, del, dfn, div, dl,
dt, em, fieldset, form, h1, h2, h3,
h4, h5, h6, html, iframe, img, ins, 
kbd, label, legend, li, object, ol, 
p, pre, q, s, samp, section, small, span, 
strike, strong, sub, sup, table, 
tbody, td, tfoot, th, thead, tr, tt, ul, var {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-weight:inherit;
    font-style:inherit;
    font-family:inherit;
    font-size:100%;
    vertical-align:baseline;
}

body {
    font-family:'Montserrat', sans-serif;
    font-size:16px;
    line-height:1.4;
    font-weight:400;
    color:#191919;
    background:#FFFFFF;
    overflow:hidden;
    z-index:1;
}

/* Link Setup */
a,
a:active {
    color:#191919;
    text-decoration:none;
}

a:hover,
a:focus {
    cursor:pointer;
    color:#626262;
    text-decoration:none;
}

a:focus {
    outline:none !important;
}

/* Image Setup */
img {
    max-width:100%;
    max-height: 120px;
    height:auto;
    line-height:1 !important;
    -webkit-backface-visibility: hidden;
}


/* Video Setup */
video {
    background-size:cover;
    display:table-cell;
    vertical-align:middle;
    width:100%;
}


/* Form Elements Setup */
input,
textarea {
    display:block;
    width:100%;
    max-width:100%;
    padding:8px 15px;
    font-family:'Montserrat', sans-serif;
    font-size:14px;
    letter-spacing:1px;
    color:#191919;
    background-color:transparent;
    border:0;
    border-bottom:2px dashed #626262;
    margin:0 0 30px 0;
    resize:none;
}

input[type="submit"] {
    width:auto;
}

input[type="button"],
input[type="text"],
input[type="email"],
textarea,
input[type="submit"] {
    -webkit-appearance:none;
    border-radius:0;
}

input:focus,
textarea:focus {
    border:0;
    border-bottom:2px solid #191919;
    outline:none;
}

input[type="submit"]:focus {
    border:none !important;
    outline:none;
}

iframe {
    border:0;
}

/* List Setup */
ul {
    list-style:none outside none;
}

ul,
ol,
dl {
    list-style-position:outside;
}

/* Section Setup */
section {
    position:absolute;
    display:block;
    width:100%;
    height:auto;
}

/* SVG Setup */
svg:not(:root) {
    overflow:hidden;
}

/* ===================================
    Typography
====================================== */

/* ======= Style For Heading And Paragraph Tag ======= */
h1,h2,h3,h4 {
    font-weight:inherit;
    line-height:1.2;
}

h1 {
    margin-top:0;
    font-size:1em;
}

p {
    margin-bottom:1.3em;
}

small, .copy {
    font-size:0.750em;
}

/* ======= Main Font  ======= */
.main-font {
    font-family:'Montserrat', sans-serif !important;
}

/* ======= Helper Class For Text (Font-weight) ======= */
.font-weight-300 {
    font-weight:300 !important;
}

.font-weight-400 {
    font-weight:400 !important;
}

.font-weight-500 {
    font-weight:500 !important;
}

.font-weight-600 {
    font-weight:600 !important;
}

.font-weight-700 {
    font-weight:700 !important;
}

.italic{
    font-style:italic !important;
}

/* ===================================
    Container
====================================== */

/*======= Bootstrap Container ======= */
.container {
    padding-right:15px;
    padding-left:15px;
    margin-right:auto;
    margin-left:auto;
}

.container:before, .container:after {
    content:" ";
    display:table; 
}

.container:after {
    clear:both; 
}

@media (min-width:768px) {
    .container {
        width:732px;
    }
}
 
@media (min-width:992px) {
    .container {
        width:952px;
    }
}

@media (min-width:1200px) {
    .container {
        width:1152px;
    }
}


/* ===================================
    Header Section
====================================== */

.header{
    position:absolute;
    display:block;
    width:100%;
    height:60px;
    z-index:9999;
}

.header .logo-container {
    position:relative;
    display:block;
    line-height:0;
    margin:20px 0;
    float:left;
}

.header .logo-container .logo {
    width:150px;
    height:100%;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
}

/* ===================================
    Footer & Social
====================================== */
.footer {
    position:absolute;
    display:block;
    bottom:0;
    width:100%;
    height:auto;
}

/* Style For Footer Copy-Rights Text */
.footer .copy{
    position:relative;
    display: inline-block;
    line-height:56px;
    color:#ffffff;
    visibility:visible;
    opacity:1; 
}

/* Style For Copy-Rights Text Animation When Menu Open */

.footer .social {
    position:relative;
    display:inline-block;
    float:right;
    padding:15px 0;
}

.footer .social a {
    position:relative;
    display:inline-block;
    padding:0 10px;
    visibility:visible;
    opacity:1;
    -webkit-transition:opacity .5s ease;
            transition:opacity .5s ease;
}

/* Style For Social-Icon On Hover */
.footer .social a:hover i {
    opacity:1;
    -webkit-transition:opacity .2s ease;
            transition:opacity .2s ease;
} 

.footer .social:hover i {
    opacity:.5;
    -webkit-transition:opacity .2s ease;
            transition:opacity .2s ease;
}

.footer .social i {
    color:#ffffff;
    font-size:18px;
}

/* ===================================
    Content Section
====================================== */

.main_content {
    display:block;
    text-align:center;
    overflow-y: scroll;
}

.error-big-text {
    position:relative;
    font-size:1.000em;
    color:#FFFFFF;
    text-align: center;
    margin-top: 20px;
}

.error-sub-text {
    position:relative;
    font-size:1.000em;
    color:#FFFFFF;
    text-align:center;
    max-width: 600px;
    margin:auto;
    margin-bottom:50px;
}


/* ===================================
  Hero Background, Scene, Layer Setting
====================================== */

/* ======= Style For Background ======= */
.hero-background {
    position:absolute;
    display:block;
    bottom:-50px;
    width:120%;
    left:-10%;
    top:-10%;
    background:#202020;
    background-position:center center;
    -ms-background-size:cover;
    background-size:cover;
}

/* ======= Style For Scene ======= */
.scene {
    position:relative;
    overflow:hidden;
    display:block;
    height:100%;
    width:100%;
    padding:0;
    margin:0;
}

/*======= Style For Layer ======= */
.layer {
    position:absolute;
    display:block;
    height:100%;
    width:100%;
    padding:0;
    margin:0;
    -webkit-backface-visibility:hidden;
    -khtml-backface-visibility:hidden;
    -moz-backface-visibility:hidden;
    -ms-backface-visibility:hidden;
    -o-backface-visibility:hidden;
    -webkit-transform:translate3d(0, 0, 0);
    -khtml-transform:translate3d(0, 0, 0);
    -moz-transform:translate3d(0, 0, 0);
    -ms-transform:translate3d(0, 0, 0);
    -o-transform:translate3d(0, 0, 0);
    transform:translate3d(0, 0, 0);
}

/* ===================================
    Responsive Media Query // Non-Mobile First Method
====================================== */

/*==========  Extra Large Desktop ==========*/

@media only screen and (min-width:1920px) {

/* ===================================
    Content Section
====================================== */
    .error-big-text {
        font-size:1.250em;
        font-weight:bold;
        margin-top:50px;
    }   
    .error-sub-text {
        font-size:1.250em;
    }
}


/*==========  Extra Large Desktop ==========*/

@media only screen and (min-width:1400px) and (max-width:1919px) {

/* ===================================
    Content Section
====================================== */
    .error-big-text {
        font-size:1.750em;
        font-weight:bold;
        margin-top:50px;
        margin-bottom:20px;
    }   
    .error-sub-text {
        font-size:1.250em;
    }
}

/*==========  Mobile  ==========*/

@media (min-width:640px) and (max-width:767px) {

/* ===================================
    Content Section
====================================== */
    .error-big-text {
        font-size:1.750em;
        font-weight:bold;
        margin-top:50px;
        margin-bottom:20px;
    } 
}


 @media (min-width:480px) and (max-width:639px) {

/* ===================================
    Content Section
====================================== */
    .error-big-text {
        font-size:1.750em;
        font-weight:bold;
        margin-top:50px;
        margin-bottom:20px;
    }  
 }


/*==========  Mobile  ==========*/

@media (min-width:360px) and (max-width:479px) {

/* ===================================
    Content Section
====================================== */
    .error-big-text {
        font-size:1.750em;
        font-weight:bold;
        margin-top:50px;
        margin-bottom:20px;
    }  
}

/*==========  Mobile  ==========*/

@media (min-width:320px) and (max-width:359px) {

/* ===================================
    Content Section
====================================== */
    .error-big-text {
        font-size:1.750em;
        font-weight:bold;
        margin-top:50px;
        margin-bottom:20px;
    }
}

@media (max-width:319px) {

/* ===================================
    Content Section
====================================== */
    .error-big-text {
        font-size:1.750em;
        font-weight:bold;
        margin-top:50px;
        margin-bottom:20px;
    }
}