/*body, h1, h2, h3, h4, h5, h6 {
    font-family: "Lato", sans-serif;
}
    Banner image sizes 1800 x 820
    Sub pictures size 882 x 500

*/

body, html {
    height: 100%;
    color: #777;
    line-height: 1.8;
}

html, body {
    font-family: aerial,sans-serif;
    font-size: 15px;
    line-height: 1.5
}

html {
    overflow-x: hidden
}

footer a:hover{
    color:cyan;
    text-decoration:underline
}

/* Create a Parallax Effect */
.bgimg-1 {
    opacity: 0.7;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.bgimg-10 {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.bgimg-11 {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.bgimg-2, .bgimg-3, .bgimg-4, .bgimg-5, .bgimg-6, .bgimg-7, .bgimg-8, .bgimg-contact {
    opacity: 0.7;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.bgimg-premsub {
    /*background-attachment: fixed;*/
    background-position: center;
    background-repeat: no-repeat;
    /*background-size: cover;*/
}

.bgimg-premsub {
    background-image: url('../images/promethean-sub.jpg');
    min-height: 500px;
}

.bgimg-mtouch {
    /*background-attachment: fixed;*/
    background-position: center;
    background-repeat: no-repeat;
    /*background-size: cover;*/
}

.bgimg-mtouch {
    background-image: url('../images/M-Touch-Screen.png');
    
    min-height: 500px;
}

.bgimg-ctsub {
    /*background-attachment: fixed;*/
    background-position: center;
    background-repeat: no-repeat;
    /*background-size: cover;*/
}

.bgimg-ctsub {
    background-image: url('../images/Pro-Series-Front-On.jpg');
    min-height: 500px;
}

/*Entry systems*/
.bgimg-entry {
    /*background-attachment: fixedn*/
    background-position: center;
    background-repeat: no-repeat;
    /*background-size: cover;*/
}

.bgimg-entry {
    background-image: url('../images/inventry-main.jpg');
    min-height: 680px;
}

.bgimg-entrysign {
    /*background-attachment: fixed;*/
    background-position: center;
    background-repeat: no-repeat;
    /*background-size: cover;*/
}

.bgimg-entrysign {
    background-image: url('../images/entry-subpic.jpg');
    
    min-height: 680px;
}


.bgimg-ctsubsch {
    /*background-attachment: fixed;*/
    background-position: center;
    background-repeat: no-repeat;
    /*background-size: cover;*/
}

.bgimg-ctsubsch {
    background-image: url('../images/clevertouch-schools.jpg');
    min-height: 500px;
}

/* First image (Logo. Full height) */
.bgimg-1 {
    background-image: url('../images/banner-v1.jpg');
    min-height: 900px;
    opacity: 0.7;
}

.bgimg-10 {
    background-image: url('../images/promethean-sub.jpg');
    min-height: 400px;
}

.bgimg-11 {
    background-image: url('../images/banner-v1.jpg');
    min-height: 900px;
}


/* Second image (Portfolio) */
.bgimg-2 {
    background-image: url('../images/display-1.jpg');
    min-height: 600px;
}

/* Third image (Contact) */
.bgimg-3 {
    background-image: url('../images/crowd.jpg');
    min-height: 600px;
    /*background-size: 100%;*/
}
.bgimg-4 {
    background-image: url('../images/flex-1.jpg');
    min-height: 600px;
}
.bgimg-5 {
    min-height: 600px;
    background-image: url('../images/education-1.jpg');
}
.bgimg-6 {
    min-height: 600px;
    background-image: url('../images/support-1.jpg');
    background-repeat: no-repeat;
    /*background-size: 100%;*/
}
.bgimg-7 {
    min-height: 600px;
    background-image: url('../images/Home-entertainment.jpg');
}
.bgimg-8 {
    min-height: 600px;
    background-image: url('../images/flex-3.jpg');
}

.bgimg-contact {
    min-height: 600px;
    background-image: url('../images/Service_bell_banner.jpg');
}


.emailtext {
    text-decoration: underline;
    color: #670E36;
}

.w3-wide {
    letter-spacing: 10px;
}

.w3-hover-opacity {
    cursor: pointer;
}

.inner-div {
    margin: auto;
    width: 100px;
    height: 100px;
}


#googleMap {
    width: 100%;
    height: 400px;
    -webkit-filter: grayscale(90%);
    filter: grayscale(90%);
}

a[name]:before {
    content: "";
    display: block;
    height: 58px;
    margin: -30px 0 0;
}

.ah-xxxlarge {
    font-size: 48px !important;
    color:white;
}

/* Turn off parallax scrolling for tablets and mobiles */
@media only screen and (max-width: 1024px) {
    .bgimg-1, .bgimg-2, .bgimg-3, .bgimg-4, .bgimg-5, .bgimg-6, .bgimg-7, .bgimg-8, .bgimg-contact {
        background-attachment: scroll;
        min-height: 200px;
        font-size: 18px !important;
    }
    .no-mobile {
        display: none;
        
    }
    .ah-img-mobile {
        min-height: 200px;
        background-repeat: no-repeat;
        background-size: contain;
    } 
    a[name]:before {
        content: "";
        display: block;
        height: 90px;
        margin: -30px 0 0;
    }

    .ah-xxxlarge {
        font-size: 18px !important;
        color: white;
        text-align:left
    }
}

/* Navbar

    /* Dropdown Button */

.dropbtn {
    background: none;
    color: #3a3a3a;
    padding: 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
    min-width: 160px;
}

    .dropbtn:hover {
        background-color: black;
        /*border-bottom: 3px solid transparent;
                -webkit-transition: border-bottom .3s;
                transition: border-bottom .3s;*/
    }

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
    min-width: 160px;
}

.dropdown1 {
    position: relative;
    display: inline-block;
    width: 100%;
    background-color: white;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    background-color: dimgray;
}

    /* Links inside the dropdown */
    .dropdown-content a {
        color: white;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }

        /* Change color of dropdown links on hover */
        .dropdown-content a:hover {
            background-color: rgba(0,0,0,0.2);
        }

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
    width: 100%;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
    background-color: #f1f1f1;
}

#telno {
    float: right;
    padding-right: 30px;
    padding-top: 20px;
    font-size: 14px;
    color: #fff;
}

    #telno span {
        font-size: 16px;
        font-weight: bold;
        color:#fff;
    }

a {
    text-decoration: none;
    text-align: left;
}

.app-content a {
    color: #333333;
    
}

.app-content a:hover {
    color: #670E36;
    text-decoration:underline;
}
.headl {
    width: auto;
}
.filler{

    height: 60px;
}

.filler1 {
    height: 40px;
}
.filler2 {
    height: 80px;
}


h1 {
    font-size: 48px;
    font-weight:bolder;
}

h2 {
    font-size: 30px;
    color: #670E36;
}

h3 {
    font-size: 24px;
    color: #670E36;
}

h4 {
    font-size: 20px;
    color: #670E36;
}

h5 {
    font-size: 18px;
    color: #670E36;
}

h6 {
    font-size: 16px
}

.w3-serif {
    font-family: "Times New Roman",Times,serif
}



.w3-wide {
    letter-spacing: 4px
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    font-weight: inherit
}

hr {
    height: 0;
    border: 0;
    border-top: 1px solid #eee;
    margin: 20px 0
}

.bulleted {
    list-style-position: inside;
}

.bulleted-large {
    list-style-position: inside;
    font-size:20px;
    color:#333333;
}

.white{
    color:white;
}

@media
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5){

  html,
  body{
    width:100%;
    overflow-x:hidden;
  }

}