﻿@import url(https://fonts.google.com/specimen/Economica?safe=active&query=econ#standard-styles);

/* menu control */
#menuToggle {
    display: none;
}

/* Main container layout */
.ui.menu .item img.logo {
    margin-right: 1.5em;
    width: 1em;
}

/* fixed top menu */
.main.container {
    margin-top: 5em;
    margin-bottom: 5em;
}

/*.wireframe {
    margin-top: 2em;
}*/

.ui.segment {
    background-color: #fff !important;
}

/*.ui.footer.segment {
    margin: 0em 0em 0em;
    padding: 5em 0em;
}*/

/* Company Logos */
.img-header {
    padding: 1em;
}

.mainimage {
    width: 100%;
}

.ui.positive.button, .ui.positive.button:hover, .ui.positive.button:focus {
    background-color: #F2A81D;
    opacity: 1;
}

.ui.positive.button:hover {
    background-color: #F2A81D;
    opacity: 0.8;
}
.ui.black.button, .ui.black.button:hover, .ui.black.button:focus {
    background-color: #325A73;
    opacity: 1;
}

.ui.black.button:hover {
    background-color: #325A73;
    opacity: 0.8;
}

body, html {
    /*height: 100%;*/
    font-family: 'Economica' !important;
    font-size: 1.2rem;
}
/* Parallax */
/*.parallax-top {*/
    /* The image used */
    /*background-image: url("../images/gif/Hard-Drive-960px.gif");*/
    /* Set a specific height */
    /*height: 50%;*/
    /* Create the parallax scrolling effect */
    /*background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

}

.parallax-bottom {
    background-image: url("../images/jpg/macbook-1920.jpg");
    height: 50%;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

}*/


/* wide screen, spread the main text area more than the default */
@media only screen and (min-width: 1152px) {

    .ui.text.container {
        max-width: 1000px !important;
    }
}

@media only screen and (max-width: 1024px) {

/*    .parallax-top {
        background-image: url("../images/gif/Hard-Drive-768px.gif");
        height: 40%;
        margin-top: 3em;
        background-attachment: inherit;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .parallax-bottom {
        background-image: url("../images/jpg/macbook-768.jpg");
        height: 40%;
        background-attachment: inherit;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    
    }*/

}

@media only screen and (max-width: 768px) {
    #menu {
        display: none !important;
    }

    #menuToggle {
        display: block;
    }

    body, html {
        font-size: 1.1rem;
    }
    
    /* add photos to within the body pusher class */
/*    .body-top {
        background-image: url("../images/gif/Hard-Drive-768px.gif");
        height: 25em;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .body-bottom {
        background-image: url("../images/jpg/macbook-768.jpg");
        height: 25em;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
*/
    /* switch off parallax */
/*    .parallax-top {
        background-image: none;
        height: 0;
    }

    .parallax-bottom {
        background-image: none;
        height: 0;
    }*/
}

@media only screen and (max-width: 500px) {

    body, html {
        font-size: 1rem;
    }
    /* add photos to within the body pusher class */
/*    .body-top {
        background-image: url("../images/gif/Hard-Drive-375px.gif");
        height: 10em;
        margin-top: 3em;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .body-bottom {
        background-image: url("../images/jpg/macbook-375.jpg");
        height: 10em;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }*/
}