/*-----------------------------------------------------------------
[Legal Notice]

Copyright (c) HighHay/Mivfx
Before using this template, you should agree with themeforest licenses terms.
http://themeforest.net/licenses
-------------------------------------------------------------------*/

/** CSS-AddOn for Large screen First responsiveness approch */

/* Screen small than 1024px */

@media (max-width: 1024px) {
    #fp-nav,
    #fp-nav.right {
        margin-right: 0px;
    }
    .section {
        padding-left: 16px;
        padding-right: 16px;
    }
    .section .content {
        padding: 0 32px;
    }
    .section .content .c-right {
        padding-left: 56px;
    }
    .section .content .c-left {
        padding-right: 56px;
    }
    .section .content.with-clock .c-left .c-clock .img-top,
    .section .content .c-illustr .img-top {
        margin-bottom: 0;
    }
    /* Clock */
    .section .content.with-clock .c-right {
        margin-top: 0;
    }
    .section .content.with-clock .c-left .c-clock {
        padding-top: 0;
        margin-top: 32px;
        padding-bottom: 112px;
        padding-right: 112px;
    }
    .section .content.with-clock .c-left .c-clock .img-middle {
        width: 112px;
        height: 112px;
    }
    .section .content.with-clock .c-left .c-clock .tile-days {
        padding-top: 36px;
    }
    .section .content.with-clock .c-left .c-clock .tile-days .days {
        font-size: 36px;
    }
    .section .content.with-clock .c-left .c-clock .img-top {
        margin-top: 0;
        float: right;
        margin-bottom: 0;
        margin-right: -112px;
    }
    .section .content.with-clock .c-left .c-clock .tile-minutes {
        top: 112px;
        left: 0;
    }
    .section .content.with-clock .c-left .c-clock .tile-seconds {
        left: 112px;
    }
    /* Other section */
    .section .content .c-illustr .img-top {
        margin-bottom: 112px;
    }
    .section .content .c-illustr .img-middle {
        margin-left: 0;
    }
    .section .content .c-illustr .img-bottom {
        display: none;
    }
}

/* Screen Small than 800px */

@media (max-width: 800px) {
    .section .content .c-illustr .img-top {
        margin-bottom: 0;
    }
    .section .content .c-illustr .img-middle {
        margin-left: 112px;
        width: 144px;
        height: 144px;
    }
    .section .content .header h3 {
        font-size: 18px;
    }
}

/* Screen Small than 720px */

@media (max-width: 720px) {
    /* disable animations on mobile : comment below if you want to enable them */
    /*	.section .c-right *,
	.section .c-left *,
	.section .clock *{
		-webkit-transition: 0s !important;
		-webkit-transition: 0s !important;
		-webkit-transition-delay: 0s !important;
		transition-delay: 0s !important;
	}
	
	.section .anim-zoomin,
	.section .anim-rotate,
	.section .anim-slideleft,
	.section .anim-slideright{
		-webkit-transform: none;
		transform: none;
		opacity: 1;
		-webkit-transition: 0s !important;
		transition: 0s !important;
		-webkit-transition-delay: 0s !important;
		transition-delay: 0s !important;
	}*/
    .site-footer {
        display: none;
    }
}

/* Screen small than 600 */

/* Screen small than 600 Nexus 7, iPhone 6 plus : 412px*/

@media (max-width: 600px) {}

/* Screen small than 480px */

@media (max-width: 481px) {
    .header-top .logo-wrapper {
        margin-left: 16px;
        margin-top: 8px;
    }
    .header-top .logo-wrapper .logo {
        font-size: 18px;
    }
    .header-top .logo-wrapper .logo img {
        max-height: 40px;
        margin-right: 8px;
    }
    .header-top .site-nav {
        float: right;
        margin-top: 64px;
        /*		background: rgba(0,0,0,0.2);*/
        margin-right: -100%;
        opacity: 0;
        height: 0;
        visibility: hidden;
        -webkit-transition: 0.3s;
        transition: 0.3s;
    }
    .header-top .site-nav li {
        float: none;
        text-align: right;
    }
    .header-top .site-nav li.separator {
        display: none;
    }
    .header-top .site-nav li a {
        margin: 0;
        padding: 16px 32px;
        padding-right: 8px;
    }
    .header-top .site-nav li a:after {
        display: none;
    }
    /* Menu visible */
    .header-top .menu-icon {
        display: block;
    }
    .header-top.menu-visible .site-nav {
        margin-right: 16px;
        opacity: 1;
        visibility: visible;
        height: auto;
    }
    .page-nav {
        top: 76px;
        left: -120px;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: 0.3s;
        transition: 0.3s;
    }
    .page-nav.menu-visible {
        top: 76px;
        left: 16px;
        opacity: 1;
        visibility: visible;
    }
    #fp-nav {
        display: none;
    }
    .section {
        padding-left: 24px;
        padding-right: 24px;
        min-height: 320px;
    }
    .section .content {
        padding: 0;
    }
    .section .content .c-left {
        float: none;
        width: 100%;
        text-align: left;
        padding-right: 0px;
        padding-left: 0px;
    }
    .section .content .c-right {
        float: right;
        width: 100%;
        text-align: right;
        padding-left: 0px;
        /*		position: absolute;*/
        padding-top: 24px;
        padding-bottom: 24px;
        top: 0;
    }
    .section .content .c-right:before {
        display: none;
    }
    .section .content.with-clock .c-right {
        margin-top: 0px;
    }
    .section .content.with-clock .c-left .c-clock {
        padding-top: 0;
        margin-top: 56px;
        padding-bottom: 112px;
        padding-right: 112px;
    }
    .section .content.with-clock .c-left .c-clock .img-middle {
        width: 112px;
        height: 112px;
    }
    .section .content.with-clock .c-left .c-clock .tile-days {
        padding-top: 36px;
    }
    .section .content.with-clock .c-left .c-clock .tile-days .days {
        font-size: 36px;
    }
    .section .content.with-clock .c-left .c-clock .img-top {
        margin-top: 0;
        float: right;
        margin-bottom: 0;
        margin-right: -112px;
    }
    .section .content.with-clock .c-left .c-clock .tile-minutes {
        top: 112px;
        left: 0;
    }
    .section .content.with-clock .c-left .c-clock .tile-seconds {
        left: 112px;
    }
    /*other sections*/
    .section .content .c-illustr .img-middle {
        width: 112px;
        height: 112px;
        display: block;
    }
    .section .content .c-left .c-logo {
        margin-bottom: 72px;
    }
}

/* Screen small than 360px */

@media (max-width: 360px) {}

/* Screen small than 320px */

@media (max-width: 320px) {}

/* Responsive height */

@media (max-height: 640px) and (max-width: 600px) {
    #fp-nav {
        display: none;
    }
}

/* Responsive height */

@media (max-height: 420px) and (max-width: 480px) {}