/* ====================
   Home styles
   ==================== */

section { position: relative; padding: 80px 0; }
ul { padding: 0; }


/* -0 Herobanner */
    #herobanner { position: relative; padding: 0;  overflow: hidden; }   
    
        #herobanner .gradient, header.entry-header .gradient {
            position: absolute; top: 0; left: 0; width: 100%; height: 100%;
            /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#13355b+10,13355b+100&1+10,0.1+100 */
            background: -moz-linear-gradient(-45deg,  rgba(19,53,91,1) 10%, rgba(19,53,91,0.1) 100%); /* FF3.6-15 */
            background: -webkit-linear-gradient(-45deg,  rgba(19,53,91,1) 10%,rgba(19,53,91,0.1) 100%); /* Chrome10-25,Safari5.1-6 */
            background: linear-gradient(135deg,  rgba(19,53,91,1) 10%,rgba(19,53,91,0.1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#13355b', endColorstr='#1a13355b',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
        }

        #herobanner .caption h1 { font-size: 3.5em; color: #fff; }

            @media (max-width: 991px) { #herobanner .caption h1 { font-size: 3em; } }
            @media (max-width: 767px) { #herobanner .caption h1 { font-size: 2em; } }


/* -1 About */
    #about { overflow: hidden; }
        #about .right { position: relative; }
        #about .right img { 
            position: absolute; top: -100px; right: -100px; 
            opacity: .1; z-index: -1;
        }   

/* -2 Services */
    #services { 
        position: relative;
        background-position: center;
        background-size: cover;
    }
    /* + gradient */
        #services .gradient, #featured .gradient {
            position: absolute; bottom: 0; left: 0; width: 100%; height: 100%;
            /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#13355b+20,13355b+100&0.1+20,1+95 */
            background: -moz-linear-gradient(top,  rgba(19,53,91,0.1) 20%,rgba(19,53,91,.3) 30%,rgba(19,53,91,.8) 70%,rgba(19,53,91,1) 100%); /* FF3.6-15 */
            background: -webkit-linear-gradient(top,  rgba(19,53,91,0.1) 20%,rgba(19,53,91,.3) 30%,rgba(19,53,91,.8) 70%,rgba(19,53,91,1) 100%); /* Chrome10-25,Safari5.1-6 */
            background: linear-gradient(top,  rgba(19,53,91,0.1) 20%,rgba(19,53,91,.3) 30%,rgba(19,53,91,.8) 70%,rgba(19,53,91,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a13355b', endColorstr='#13355b',GradientType=0 ); /* IE6-9 */
        }

        #services ul { padding: 30px 0; }
        #services ul li { list-style: none; }

        #services ul li .box { 
            position: relative; display: block;
            text-align: center; padding: 0 20px;
            background-color: rgba(255,255,255,.1);
            height: 450px;
            transition: all .5s ease; 
        }

        #services ul li .box .absolute-center { width: 85%; z-index: 1; }
        #services ul li .box .absolute-center h3 { margin-bottom: 30px; }
            #services ul li .box .btn-readmore { opacity: .0; margin-top: 30px; }
            #services ul li .box:hover .btn-readmore { opacity: .9; transition: all .5s ease; }
            
            #services ul li .box:after {
                content: "";
                position: absolute; top: 50%; left: 0;
                -webkit-transform: translate(0,-50%);
                -moz-transform: translate(-0%,-50%);
                -o-transform: translate(-0%,-50%);
                transform: translate(-0%,-50%);
                width: 100%; height: 100%;
                background-color: rgba(255,255,255,.6);
                z-index: 0;
            }
            #services ul li .box:hover:after { background-color: rgba(255,255,255,1); height: 120%; transition: all .5s ease; }

            @media (max-width: 991px) {
                #services ul li .box { 
                    height: auto; background-color: rgba(255,255,255,.7); 
                    margin-bottom: 30px; padding: 50px 30px 30px;
                }
                #services ul li .box .absolute-center { 
                    position: relative; top: initial; left: initial;
                    width: 100%;
                    -webkit-transform: none; 
                    -moz-transform: none; 
                    -o-transform: none; 
                    transform: none; 
                }
                #services ul li .box:after { position: relative; }
            }


/* -3 Market */
    #marketstats { padding: 50px 0 100px; }

        #marketstats ul li { list-style: none; }
        #marketstats ul li h2.figures { font-size: 4em; }

        @media (max-width: 767px) {
            #marketstats ul li h2.figures { font-size: 3em; }
            #marketstats ul li h4.figures-text { font-size: 14px; }
        }