/*-------------------------------------------------
GLOBALS CLASSES
-------------------------------------------------*/
*{ margin:0; padding:0; font-family: 'Pontano Sans', sans-serif;}
body { background:#3B3C3C;}

p {font-family: 'Pontano Sans', sans-serif; color:#939191; font-size:14px;}
a { text-decoration:none; color:#00c0ff;}
a:hover { text-decoration:none; color:#dd31ae;}
ul li { list-style:none; outline:none;}
img { border:none; }
img { border:none;}
h1 { font-family: 'Oswald', sans-serif; color:#45303f; font-size:22px; font-weight:normal;text-transform:uppercase;}

/*-------------------------------------------------
CSS TWEAKS
-------------------------------------------------*/
.clearing { clear:both;}
.fltLeft { float:left;}
.flrRight { float:right;}
.marLeft30 { margin-left:30px;}
.marRight30 { margin-right:30px;}
.marginTop { margin-top:30px;}
.marginBottom { margin-bottom:60px;}
.padTop { padding-top:20px;}
.padBottom { padding-bottom:20px;}
.wid960{ width:960px !important; }

/*-------------------------------------------------

/*-------------------------------------------------
SIDEBAR CLASSS
-------------------------------------------------*/

.sidebar .panel { width:298px; padding-bottom:30px;}
.sidebar .title h1 { padding:30px; border-bottom:1px solid; color:steelblue; }
.sidebar .content ul li { display:block; border-bottom:1px solid steelblue; height:40px; line-height:40px; background:url(../images/round-arrow.gif) no-repeat 260px 10px;}
.sidebar .content ul li a { padding-left:30px; color:#939191; font-size:14px;}
.sidebar .content ul li a:hover {color:antiquewhite;}
.sidebar .content ul li a.active {color:#dd31ae;}
.sidebar .content ul li.borderNone { border-bottom:none;}

.subscribe {}
.subscribe .button-link a { display:block; width:90px; height:36px; line-height:36px; text-align:center; background:darkcyan; color:#ffffff; font-size:12px; margin-left:30px; margin-top:20px;}
.subscribe .button-link a:hover { background:grey;} 
.sidebar-text-field { width:230px; height:40px; line-height:40px; border:0px solid; background:black; padding-left:10px; color:white; margin-left:30px; margin-top:30px;}

.sidebar .call { background:darkcyan; padding:30px; border}
.sidebar .call h1 { color:#ffffff; text-transform:uppercase; font-size:22px; font-weight:normal;}
.sidebar .call h1 span { font-size:18px; padding-left:15px;}

GENERAL CLASSES
-------------------------------------------------*/

.panel { background:#ffffff; border:1px solid #ebebeb; overflow:hidden;}
.title {}
.content { overflow:hidden; font-size:14px;}
.button-link{ }
.button-link a{ font-family: 'Oswald', sans-serif; text-transform:uppercase;}

/*-------------------------------------------------

/*-------------------------------------------------
HEADER CLASSES
-------------------------------------------------*/

.header-wrap { width:100%; overflow:hidden; background:darkcyan;}
.header { width:960px; overflow:hidden; margin:0 auto;}

.menu { float:left; width:505px;}
.menu ul li { float:left; width:100px; margin-right:1px;font-family:-webkit-pictograph;}
.menu ul li a { display:block; width:100px; height:80px; line-height:80px; text-align:center; color:#ffffff; background:darkcyan;font-family:-webkit-pictograph;}
.menu ul li a:hover { background:#3B3C3C;} 
.menu ul li a.active { background:#3B3C3C;} 

.social-media { float:right; height:80px;}
.social-media ul li { float:left; margin-right:10px; padding-top:25px;}
.logo-sarch-wrap { width:100%; overflow:hidden; background:steelblue;}
.logo-search-container { width:960px; margin:0 auto; height:140px;}
.logo { float:left; width:500px; height:140px; line-height:140px;}
.logo h1 { color:#ffffff; font-size:36px; text-transform:uppercase; font-weight:normal; font-family:-webkit-pictograph;}

.search { float:right; width:280px; margin-top:50px;}
.search-input { float:left; width:200px;}
.search-button { float:right; color:#3B3C3C}
.search-text-field { width:220px; border:0px solid ; background:#3B3C3C; color:#ffffff; height:40px; line-height:40px; padding-left:10px;}

/*-------------------------------------------------

/*-------------------------------------------------
BANNER CLASSES
-------------------------------------------------*/

.banner-wrap { width:1000px; margin:0 auto; overflow:hidden; height:auto; margin-top:30px;}
.banner-left { float:left; width:20px;}
.bannre-right { float:left; width:20px;}
.banner { float:left; width:920px; padding:20px; overflow:hidden; background:#ffffff;}
.banner-image { margin:0 auto; background:url(../img/banner-bg.gif) no-repeat; height:381px; text-align:right;}
.banner-data { margin-top:100px; float:right; position:relative; width:500px;}
.caption1  h1 { padding:10px; background:#00c0ff; font-size:22px; font-weight:normal; color:#ffffff;text-transform:uppercase; display:inline-block;}
.caption2  h2 { padding:10px; background:#dd31ae; font-size:18px; font-weight:normal; color:#ffffff;  text-transform:uppercase;display:inline-block;  font-family: 'Oswald', sans-serif; }
.caption3 { padding:10px; background:#45303f; font-size:16px; font-weight:normal; color:#ffffff; display:inline-block;}

/*-------------------------------------------------
CONTACT FORM CLASSS
-------------------------------------------------*/
h2 { font-family: 'Oswald', sans-serif; color:white; font-size:30px; font-weight:normal;text-transform:uppercase; padding-top:10px;margin-top: 10px; color:steelblue; width: 500px}
h3 { font-family: 'Oswald', sans-serif; color:cornflowerblue; font-size:22px; font-weight:normal;text-transform:uppercase; padding-left:30px;}

.contact-form { background:grey; padding:30px; width:440px; margin-top: 10px}
.contact-form label {display: block; padding:10px 0 10px 0;}
.contact-form label span {display: block; color:white;font-size:14px; float:left; width:80px; text-align:left; padding:5px 20px 0 0;}
.contact-form .input_text {padding:10px 10px;width:320px;background:#ffffff;border:0px solid; color:darkcyan;}
.contact-form .message{padding:10px 10px;width:320px; background:#ffffff; border:0px solid;overflow:hidden;height:150px; color:darkcyan; font-size:14px;}

.contact-form .button-link a { display:block; width:90px; height:36px; line-height:36px; text-align:center; background:darkcyan; color:#ffffff; font-size:12px; margin-left:30px; margin-top:20px;}
.contact-form .button-link a:hover { background:steelblue;}
 
/*-------------------------------------------------
4 PANELS CLASSS
-------------------------------------------------*/

.panel-wrapper { width:960px; margin:0 auto; overflow:hidden; margin-top:30px;}
.panel-wrapper .panel { float:left; width:403px; padding:30px; margin-bottom:30px;}
.panel-wrapper .title { padding-bottom:20px;}
.panel-wrapper .title img { float:left; margin-right:20px;}
.panel-wrapper .content p { padding-left:60px;}
.panel-wrapper .content a { background:#dd31ae; color:#ffffff; }
.panel-wrapper .content a:hover { background:#00c0ff; color:#ffffff;}
.panel-wrapper .button-link{padding-left:60px; padding-top:20px;}

/*-------------------------------------------------

/*-------------------------------------------------
PRIMARY CONTENT CLASSS
-------------------------------------------------*/

.primary-content .panel {  padding:30px;}
.primary-content .title { width:100%;}
.primary-content .title h1 { padding-bottom:10px; color:steelblue}
.primary-content .title h2{ background:steelblue; height:40px; line-height:40px; color:#ffffff; font-weight:normal; font-size:20px; padding-left:10px;  margin-bottom:20px;}
.primary-content .content img{ float:left; margin-right:30px; }
.primary-content .content p{ padding-bottom:20px;}
.primary-content .content h3 { font-size:16px; color:steelblue; padding-bottom:10px;}
.primary-content .button-link{padding-top:20px;}

.generic-content { overflow:hidden; width:900px; padding:30px; background:#ffffff; margin-top:30px;}
.generic-content { overflow:hidden; width:900px; padding:30px; background:#ffffff; margin-top:30px;}
.generic-content .title h2{ font-size:16px; font-weight:normal; color:#b6b6b6; padding-bottom:20px; border-bottom:1px solid #ebebeb; margin-bottom:30px; padding-top:10px;}

.portfolio { overflow:hidden; width:900px; padding:30px; background:#3B3C3C; margin-top:30px;}
.portfolio .title h2{ font-size:16px; font-weight:normal; color:white; padding-bottom:20px; border-bottom:1px solid #ebebeb; margin-bottom:30px; padding-top:10px; background-color: steelblue;width:800px}
.portfolio h1 {color: steelblue; padding-bottom: 10px}
.portfolio .panel { width:280px; border:none;  background:#f5f5f5; float:left; margin-bottom:30px;}
.portfolio .panel .content { padding:10px; padding-bottom:20px;}
.portfolio .panel .content p{ padding-bottom:10px;}
.portfolio .panel .content p span{ padding-bottom:10px; border-bottom: 1px solid #dddddd;  color:steelblue; display:block;}
.portfolio .panel .content a { color:#ffffff; background:#00c0ff; padding: 0px 6px 0px 6px;  text-transform:uppercase; font-family:'Oswald', sans-serif; font-size:12px;}
.portfolio .panel .content a:hover { background:grey;}
.portfolio .panel .content img{ padding-bottom:10px;}

.footer-wrapper { width:100%; background:steelblue; overflow:hidden;}
.footer { width:960px; height:100px; line-height:100px; text-align:center; margin:0 auto; color:#ffffff; font-size:14px;}
.footer a { color:#45303f;}
.footer a:hover { color:#ffffff;}

    
        /* jssor slider bullet navigator skin 05 css */
        /*
        .jssorb05 div           (normal)
        .jssorb05 div:hover     (normal mouseover)
        .jssorb05 .av           (active)
        .jssorb05 .av:hover     (active mouseover)
        .jssorb05 .dn           (mousedown)
        */
        .jssorb05 {
            position: absolute;
        }
        .jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
            position: absolute;
            /* size of bullet elment */
            width: 16px;
            height: 16px;
            background: url('../img/b05.png') no-repeat;
            overflow: hidden;
            cursor: pointer;
        }
        .jssorb05 div { background-position: -7px -7px; }
        .jssorb05 div:hover, .jssorb05 .av:hover { background-position: -37px -7px; }
        .jssorb05 .av { background-position: -67px -7px; }
        .jssorb05 .dn, .jssorb05 .dn:hover { background-position: -97px -7px; }

        /* jssor slider arrow navigator skin 12 css */
        /*
        .jssora12l                  (normal)
        .jssora12r                  (normal)
        .jssora12l:hover            (normal mouseover)
        .jssora12r:hover            (normal mouseover)
        .jssora12l.jssora12ldn      (mousedown)
        .jssora12r.jssora12rdn      (mousedown)
        */
        .jssora12l, .jssora12r {
            display: block;
            position: absolute;
            /* size of arrow element */
            width: 30px;
            height: 46px;
            cursor: pointer;
            background: url('../img/a12.png') no-repeat;
            overflow: hidden;
        }
        .jssora12l { background-position: -16px -37px; }
        .jssora12r { background-position: -75px -37px; }
        .jssora12l:hover { background-position: -136px -37px; }
        .jssora12r:hover { background-position: -195px -37px; }
        .jssora12l.jssora12ldn { background-position: -256px -37px; }
        .jssora12r.jssora12rdn { background-position: -315px -37px; }