/**************************
  RAMFOGO for DOFASA
  Stylesheet v.1  
**************************/

body {
    background: #1F193C;
    transition: all 0.3s ease-in-out;
}

.wrapper.alt {
    background-color: #323e73;
}

#sidebar {
    background: #1F193C;
}

    #sidebar nav a:after {
        background-image: -moz-linear-gradient(to right, #f86c42, #fdb32e);
        background-image: -webkit-linear-gradient(to right, #f86c42, #fdb32e);
        background-image: -ms-linear-gradient(to right, #f86c42, #fdb32e);
        background-image: linear-gradient(to right, #f86c42, #fdb32e);
    }

    #sidebar nav a:before {
        background: #3d4d63;
    }

.wrapper.style1 {
    background-color: #e2e2e2;
}

.wrapper.style2 {
    background-color: #3358aa;
}

.wrapper.style3 {
    background-color: #ff6a35;
}

.wrapper.style4 {
    background-color: #274383;
}

.wrapper.style5 {
    background-color: #3358aa;
}

.wrapper.style1-alt {
    background-color: #323e73;
}

#four input[type="submit"], #four input[type="reset"], #four input[type="button"], #four button, #four .button {
    width: 100%;
}

ul.actions li {
    flex-grow: 0;
}

#four label {
    text-align: center;
}

#intro {
    color: #1F193C
}

    #intro input[type="submit"], #intro input[type="reset"], #intro input[type="button"], #intro button, #intro .button {
        border-color: rgb(252, 108, 57) !important;
        color: #1F193C !important;
    }

#intro {
    background-position: top right;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url(../../images/banners/banner_principal.jpg);
    background-repeat: no-repeat;
    background-size: cover !important;
    background-attachment: fixed;
}

#header {
    background-color: #ffffff;
}

    #header > nav > ul > li a {
        color: rgb(0, 0, 0);
    }

        #header > nav > ul > li a.active {
            color: #cecece;
        }

#headerlogo {
    width: 6em;
}

#mainlogo {
    width: 23em;
}

.homeAnimatedLogos {
    width: 10em;
}

.features {
    text-align: center;
}

.spotlights > section > .image:before {
    background: rgba(145, 145, 145, 0.9);
    background: rgb(50, 88, 170);
}

/* tab */

.tab {
    margin-left: 50px;
}

/* Parallaxed Quienes Somos */

.init {
    opacity: 0;
}

.bannerSomos1 {
    background-image: url(../../images/banners/oficina_01.jpg);
    background: linear-gradient(rgba(255, 138, 4, 0.20), rgba(255, 138, 4, 0.20)),url(../../images/banners/oficina_01.jpg);
    height: 50vh;
    background-repeat: no-repeat;
    background-position: top;
    background-attachment: fixed;
    background-size: cover;
}

.bannerSomos2 {
    background-image: url(../../images/banners/oficina_02.jpg);
    background: linear-gradient(rgba(255, 138, 4, 0.20), rgba(255, 138, 4, 0.20)),url(../../images/banners/oficina_02.jpg);
    height: 50vh;
    background-repeat: no-repeat;
    background-position: top;
    background-attachment: fixed;
    background-size: cover;
}

.bannerSomos3 {
    background-image: url(../../images/banners/oficina_03.jpg);
    background: linear-gradient(rgba(255, 138, 4, 0.20), rgba(255, 138, 4, 0.20)),url(../../images/banners/oficina_03.jpg);
    height: 50vh;
    background-repeat: no-repeat;
    background-position: top;
    background-attachment: fixed;
    background-size: cover;
}

    .bannerSomos1 h1, .bannerSomos2 h1, .bannerSomos3 h1 {
        font-size: 3em;
        font-weight: 100;
    }

.heroSomos {
    text-align: center;
    line-height: 1em;
    position: relative;
    top: 50%;
    transform: translate(0%, -50%);
    text-transform: uppercase;
}

h1.major:after {
    background-image: -moz-linear-gradient(to right, #f86c42, #fdb32e);
    background-image: -webkit-linear-gradient(to right, #f86c42, #fdb32e);
    background-image: -ms-linear-gradient(to right, #f86c42, #fdb32e);
    background-image: linear-gradient(to right, #f86c42, #fdb32e);
}

.bloqueCentro {
    width: 20em;
    margin: auto;
}

/* Media Queries */

/* fix ipad */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    .bannerSomos1, .bannerSomos2, .bannerSomos3, #intro {
        background-attachment: scroll;
    }
}

@media screen and (max-width: 736px) {

    #mainlogo {
        width: 20em;
    }

    #sidebar {
        -webkit-transition: all 1s ease-in-out;
        -moz-transition: all 1s ease-in-out;
        -o-transition: all 1s ease-in-out;
        transition: all 1s ease-in-out;
        display: hide;
    }

    #headerlogo {
        width: 5em;
    }

    #hamburger {
        position: fixed;
        top: 0px;
        right: 0px;
        display: block;
        z-index: 2;
        text-align: center;
        box-sizing: border-box;
        padding: 10px;
        padding-left: 20px;
        padding-right: 20px;
        color: #dadada;
        font-size: 1.5em;
    }

        #hamburger a:hover {
            border-bottom-color: transparent;
            color: #dadada;
        }

    .bannerSomos1 h1, .bannerSomos2 h1, .bannerSomos3 h1 {
        font-size: 2em;
    }

    /* fix para IOS */

    .bannerSomos1, .bannerSomos2, .bannerSomos3 {
        background-attachment: scroll;
    }

    #intro {
        background-attachment: scroll;
        background: -moz-linear-gradient(top, rgba(254,255,255,0) 100%, rgba(255,255,255,1) 100%), url(../../images/banners/banner_principal.jpg) no-repeat;
        background: -webkit-linear-gradient(top, rgba(254,255,255,0) 100%,rgba(255,255,255,1) 100%), url(../../images/banners/banner_principal.jpg) no-repeat;
        background: linear-gradient(to bottom, rgba(254,255,255,0) 100%,rgba(255,255,255,1) 100%), url(../../images/banners/banner_principal.jpg) no-repeat;
        background-repeat: no-repeat;
        background-size: cover !important;
    }
}