@import url(https://fonts.googleapis.com/css?family=PT+Sans:400,700);
* { margin: 0; padding: 0px; color: #666; outline: none;}
a, a:hover{ text-decoration: none;}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figure, figcaption, .footer, header, hgroup, menu, nav, output, section, summary, time, mark, audio, video {
    margin: 0px;
    padding: 0px;
    border: 0px none;
}
body, p, table, tr, td, th, a, div, span, i, ol, li, ul, b, input, select, textarea, h1, h2, h3, h4, h5, h6 {
    /*font-family: "Myriad Pro", "Gill Sans", "Gill Sans MT", Calibri, sans-serif;
*/  font-family: 'PT Sans';
    font-size: 14px;
    line-height: 1.60em;
}
.container {max-width: 1040px !important;}
h1, h2, h3, h4{ font-size: 26px;}
h1 {
    font-size: 30px;
    padding-top: 0px;
    display: block;
    text-align: center;
}
/*common properties*/
.main-wrapper, .logo-wrap, .wrapper, .form-group, .form-wrapper{
	width: 100%;
	float: left;
}
.light-blue h5, .light-blue h3, ul.list-options > li span, .blue-btn, .features h3, .light-blueColor h6, .light-blueColor span{ font-weight: 600;}
.blue-color, .frm-wrap input, .blue-btn:hover, .light-blueColor p, .frm-wrap input, .frm-wrap select, .light-blueColor h6, .light-blueColor span{ color: #0084c4;}
.light-blue, .features, .light-blueColor{ padding: 40px 0;}
.banner, .features{ box-shadow: 5px 5px 5px #999;}
.light-blue{box-shadow: 0px 0px 15px #666 inset;}
.banner h1, .banner h1 span, .footer h4, .footer p, .icons i{ color: #fff;}
.logo-wrap{ padding-top: 15px;}
.banner{ 
    height: 150px; 
    background: url(../images/banner.jpg); 
    margin-top: 15px; 
    border-top: 5px solid #FFC000; 
    position: relative;
    z-index: 1;
    background-size: cover;
}
.banner h1{ 
    font-size: 52px; 
    text-shadow: 2px 2px 2px #555; 
    line-height: 0em; 
    padding-top: 30px;
    font-weight: 800;
    text-align: left;
}
.banner h1 span{ font-size: 30px; font-weight: 400;}
.light-blue{ 
    background: url(../images/Retail-POS-Header.jpg) no-repeat right center #d7eafb; 
    background-size: cover;
    position: relative;
    min-height: 600px;
}
.light-blue p{ font-size: 18px;}
.form-wrapper{ border-bottom: 1px solid #ccc; margin-bottom: 20px; padding-bottom: 20px;}
ul.list-options { float: left;}
ul.list-options > li {
    list-style-image: url("../images/tick-mark.png");
    margin-left: 22px;
    line-height: 2em;
    font-size: 18px;
}
ul.list-options > li span{ color: #333; font-size: 18px;}
.light-blue h5{ font-size: 22px}
.frm-wrap{ margin-top: 20px;}
.frm-wrap input, .frm-wrap select{
    border: 1px solid #ccc;
    height: 31px;
    padding: 5px;
    width: 100%;
    font-size: 16px;
}
.frm-wrap input::-webkit-input-placeholder {  color: #0084c4;}
.frm-wrap input:-moz-placeholder { color: #0084c4; }/* Firefox 18- */
.frm-wrap input::-moz-placeholder {  color: #0084c4 ;  }/* Firefox 19+ */ 
.frm-wrap input:-ms-input-placeholder {  color: #2e75b6; }
.frm-wrap a.blue-btn{ width: 100%;}
.blue-btn{ background: #0084c4; border: 2px solid #0084c4; color: #fff; font-size: 16px;}
.feature-btn .blue-btn{ font-size: 26px; padding: 6px 50px;}
.blue-btn:hover{ background: transparent}
.retail-icons{ 
    position: absolute; 
    right: 20px; 
    list-style: none; 
    top: 5%;
    z-index: 999;
    width: 80px;
}
.retail-icons span{ padding: 5px 0; display: block;}
.retail-icons span img{ 
    filter: drop-shadow(2px 2px 5px #666);
    -moz-filter: drop-shadow(2px 2px 5px #666);
    -webkit-filter: drop-shadow(2px 2px 5px #666);
}
.features{ position: relative;}
.feature-ico{ width: 130px; height: 130px; margin: 0 auto;}
.feature-ico > img{ max-width: 100%; max-height: 100%;}
.features h3{ font-size: 42px; text-align: center; margin-bottom: 20px;}
.features p{ font-size: 20px; margin-top: 10px; margin-bottom: 20px;}
.feature-btn{ margin-top: 20px;}
.light-blueColor{ background: #DEEBF7;}
.light-blueColor h6, .light-blueColor span{ font-size: 60px; line-height: 1.3em; display: inline-block;}
.light-blueColor p{ font-size: 30px;}
.footer{ background: #222629; padding: 20px 0;}
.footer h4{ font-size: 15px; border-bottom: 1px solid #fff; margin-bottom: 10px; text-transform: uppercase}
.footer h5{ font-size: 14px; color: #FFC000}
.footer p{ font-size: 13px;}
.footer ul{ list-style: none;}
.footer ul li{ float: left;}
.icons{ 
    width: 40px; 
    height: 40px; 
    float: left;
    border-radius: 50px; 
    display: inline-block; 
    text-align: center; 
    margin-right: 10px;
    cursor: pointer;
}
.icons i{ margin-top: 10px; font-size: 18px;}
.fb-ico{ background: #3B5998;}
.twitter-ico{ background: #00aced;}
.in-ico{ background: #007bb5;}
.google-ico{ background: #dd4b39;}
.yt-ico{ background: #bb0000;}
.slide-ico{ background: #35829c;}
.form-msg p span{ color: #000; font-weight: 600; font-size: 18px;}

/*media query*/
@media (min-width: 1680px){
    .light-blue{ background: url(../images/Retail-POS-Header-large.jpg)}
}
@media (max-width: 1366px){
    .light-blue{ background-size: cover;    }
}
@media (max-width: 999px){
    .light-blue{ background: #d7eafb;    }
}
@media (max-width: 767px){
    .banner h1{ font-size: 42px; padding-top: 20px;}
    .feature-btn .blue-btn {
        font-size: 20px;
        padding: 6px 40px;
    }
}
@media (max-width: 639px){
    .banner h1 span{ font-size: 28px;}
    .retail-icons{ 
        position: relative; 
        left: 5px; 
        top: 20px;
        width: 100%;
        text-align: center;
    }
    .mob-retailIcons{margin: 0 auto;  width: 63%;}
    .retail-icons span { width: 70px; height: 70px; display: inline-block;    }
    .retail-icons span img{ max-width: 100%; max-height: 100%;}
    .mob-full{ width: 100% !important;}

}
@media (max-width: 450px){
    .banner h1{ font-size: 30px;}
    .banner h1 span{ font-size: 22px;}
}