/* CSS Document */
@charset "utf-8";
html,  body,  div,  p,  form,  ul,  li,  p,  label,  span,  img,  h1,  h2,  h3,  h4,  table {
    margin: 0;
    padding: 0;
    border: none;
}
html, body{
    height:100%;
    font-family:Arial, Helvetica, sans-serif;
}
ul.listnone, ol.listnone  {list-style: none;}
ul.list{
    margin:10px 0 0 15px;
    display:inline-block;
}
ul.list.half li{
    width:47%;
    height:auto;
    float:left;
    margin-left:3%;
}
a.ttip{
    border-bottom:#999 dashed 1px;
    text-decoration:none;
    cursor:help;
}
.float-right{
    float:right;
}
.float-left{
    float:left;
}
.clear-left{
    clear:left;
}
.voffset-1 { margin-top:1% !important;}
.voffset-2 { margin-top:2% !important;}
.voffset-3 { margin-top:3% !important;}
.voffset-4 { margin-top:4% !important;}
.voffset-5 { margin-top:5% !important;}
.voffset-6 { margin-top:6% !important;}
.voffset-8 { margin-top:8% !important;}
.voffset-10 { margin-top:10% !important;}
.voffset-25 { margin-top:25% !important;}
.voffset-b-1 { margin-bottom:1% !important;}
.voffset-b-2 { margin-bottom:2% !important;}
.voffset-b-3 { margin-bottom:3% !important;}
.voffset-b-4 { margin-bottom:4% !important;}
.voffset-b-5 { margin-bottom:5% !important;}
.voffset-b-6 { margin-bottom:6% !important;}
.voffset-b-8 { margin-bottom:8% !important;}
.voffset-b-10 { margin-bottom:10% !important;}

.offset-al-1{ margin:1% !important;}
.offset-al-2{ margin:2% !important;}
.offset-r-1 { margin-right:1% !important;}
.offset-r-2 { margin-right:2% !important;}
.offset-l-1 { margin-left:1% !important;}
.offset-l-2 { margin-left:2% !important;}

.col-pdn-left-0{
    padding-left:0 !important;
}
.col-pdn-right-0{
    padding-right:0 !important;
}
.col-pdn-both-0{
    padding-left:0 !important;
    padding-right:0 !important;
}
#toTop{
    display: none;
    position: fixed;
    bottom: 100px;
    right: 10px;
    z-index: 9999;
}
body, html{
    min-width:630px !important;
}
body {
    background: #fff;
    text-align: left;
    font-family: Arial, Helvetica, sans-serif;
}
.text-smallcaps{
    font-variant: small-caps;
}
.btn-warning.dark{
    background:#e48600;
}
.btn-primary{
    background:#00376a;
}
.btn-danger{
    background:#ba2020;
}
.text-info{
    color:#0555a0;
    font-size: 17px;
    line-height: 24px;
}
.text-primary{
    color:#013d75;
}

.text-primary2{
    color:#013d75;
     font-size:22px;
}


.text-muted{
    color:#444;
}

.thumbnail .caption{
    overflow:hidden;
}
#wrapper{
    max-width:1400px;
    min-width:630px;
    height:auto;
    overflow:hidden;
    margin:0 auto;
    background:#fff;
}
#wrapper.brown{
    background:#203447;
}
#wrapper #header{
    width:100%;
    height: auto;
    display:block;
    overflow: visible;
}

.sitename{
    color:#0f2a59;
    text-transform:uppercase;
    text-shadow: 0 0 1px rgba(13, 30, 60, .6);
    font-size:24px;
    font-weight:bold;
}
.label-danger.hotline{
    font-size:17px;
    font-weight:normal;
    text-shadow: 0 0 1px rgba(175, 4, 0, .3);
    padding:6px 15px 6px 15px;
    border-radius:0 0 5px 5px; 
    -moz-border-radius:0 0 5px 5px; 
    -webkit-border-radius:0 0 5px 5px; 
    background:#da2e2a;
    position:absolute;
    right:10px;
    top:0;
}
#header #menu-top{
    width:100%;
    min-height:50px;
    float:left;
    background:#2c2121;
    display:inline-block;
    text-transform: uppercase;
}
.navbar {
    position: relative;
    min-height: 50px;
    margin-bottom: 0;
    border: none;
    font-size: 13px;
}
.navbar-inverse {
    background-color: #2c2121;
    border-color: #0f1624;
}
.navbar-inverse .navbar-brand {
    color: #fff;
}
.navbar-inverse .navbar-brand:hover,
.navbar-inverse .navbar-brand:focus {
    color: #fff;
    background-color: transparent;
}
.navbar-inverse .navbar-text {
    color: #fff;
}
.navbar-inverse .navbar-nav > li > a {
    color: #fff;
    border-right: #190b0b 1px solid;
}
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
    color: #fff;
    background-color:#0688eb;
}
.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus {
    color: #fff;
    background-color: #0688eb;
}
.navbar-inverse .navbar-nav > .disabled > a,
.navbar-inverse .navbar-nav > .disabled > a:hover,
.navbar-inverse .navbar-nav > .disabled > a:focus {
    color: #444;
    background-color: transparent;
}
.navbar-inverse .navbar-toggle {
    border-color: #fff;
}
.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
    background-color: #0688eb;
}
.navbar-inverse .navbar-toggle .icon-bar {
    background-color: #fff;
}
.navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-form {
    border-color: #101010;
}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
    color: #fff;
    background-color: #080808;
}
#header .media-icn, #contact-us .media-icn{
    width:32px;
    height:32px;
    float:right;
    overflow:hidden;
    display:inline-block;    
}
#contact-us .media-icn{
    float: left;
    margin: 4px 3px 4px 3px;
}
#header .media-icn.top{
    margin: 9px 2px 9px 6px;
}

#header .media-icn.fb, #contact-us .media-icn.fb{
    background:url(../images/social_icon_32x32.png) 0 -32px no-repeat;
}
#header .media-icn.fb:hover, #contact-us .media-icn.fb:hover{
    background-position:0 0;
}

#header .media-icn.li, #contact-us .media-icn.li{
    background:url(../images/social_icon_32x32.png) -32px -32px no-repeat;
}
#header .media-icn.li:hover, #contact-us .media-icn.li:hover{
    background-position:-32px 0;
}

#header .media-icn.x, #contact-us .media-icn.x{
    background:url(../images/social_icon_32x32.png) -64px -32px no-repeat;
}
#header .media-icn.x:hover, #contact-us .media-icn.x:hover{
    background-position:-64px 0;
}

#header .media-icn.tiktok, #contact-us .media-icn.tiktok{
    background:url(../images/social_icon_32x32.png) -96px -32px no-repeat;
}
#header .media-icn.tiktok:hover, #contact-us .media-icn.tiktok:hover{
    background-position:-96px 0;
}

#header .media-icn.insta, #contact-us .media-icn.insta{
    background:url(../images/social_icon_32x32.png) -128px -32px no-repeat;
}
#header .media-icn.insta:hover, #contact-us .media-icn.insta:hover{
    background-position:-128px 0;
}

#header .media-icn.yt, #contact-us .media-icn.yt{
    background:url(../images/social_icon_32x32.png) -160px -32px no-repeat;
}
#header .media-icn.yt:hover, #contact-us .media-icn.yt:hover{
    background-position:-160px 0;
}




#header .contact{
    height: auto;
    float:right;
    text-align: right;
    display: block;
    margin:8px 0 0 0;
    overflow:hidden;
    display:inline-block;
    font-size:16px;
    text-shadow: 0 0 1px rgba(20, 20, 20, .3);
    color:#3d5682;
    line-height:26px;
}
#header .contact span{
    font-size: 24px !important;
    line-height: 26px;
    color:#224586;
}
#midlayer #mid-right{
    width:100%;
    display:block;
    float:right;
    margin:35px 0 10px 0;
}
#short-links{
    min-height:15px;
    float:right;
    display:inline-block;
}
#wrapper #front-slider{
    width:100%;
    height:auto;
    overflow:hidden;
    display:block;
    margin:0 auto;
    position: relative;
}
#front-slider .newsouter{
    width:38%;
    height:96% !important;
    overflow:hidden;
    display:block;
    position:absolute;
    z-index:3;
    top:2%;
    right:0;
    padding:1%;
    background:url(../images/news_back.png) 0 0 repeat;
    border:#bfddf0 1px solid;
    -webkit-border-radius: 3px 0 0 3px;
    -moz-border-radius: 3px 0 0 3px; 
    border-radius: 3px 0 0 3px;
    padding-left:40px;
}
.newsouter .news-close{
    width:40px;
    height:40px;
    position:absolute;
    z-index:4;
    left:0;
    top:50%;
    margin-top:-20px;
    display:block;
}
.news-open{
    width:40px;
    height:40px;
    position:absolute;
    z-index:2;
    right:-6px;
    top:50%;
    margin-top:-20px;
    display:none;
}
.news-close .btn-primary, .news-open .btn-primary{
    -webkit-border-radius: 0 3px 3px 0;
    -moz-border-radius: 0 3px 3px 0; 
    border-radius: 0 3px 3px 0;
    background:#143656;
    border-color:#143656;
    float:left;
}
.news-open .btn-primary{
    -webkit-border-radius: 3px 0 0 3px;
    -moz-border-radius: 3px 0 0 3px; 
    border-radius: 3px 0 0 3px;
}
.news-close .btn-primary:hover, .news-open .btn-primary:hover{
    background:#0a4a84;
    border-color:#0a4a84;
}

#wrapper #container{
    width:100%;
    height:auto;
    min-height:200px;
    overflow:hidden;
    display:block;
}
#wrapper #container.white, .white{
    background:#fff !important;
}
#wrapper #container.blue, .blue{
    background:#c5d7ee !important;
}
#wrapper #container.tp-padding{
    padding-top:35px;
}
#container h1{
    width:100%;
    height:auto;
    overflow:hidden;
    margin:15px auto 0 auto;
    padding-left:10px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:24px;
    line-height:28px;
    color:#131929;
    text-shadow:0px 0px 1px rgba(34, 34,34, 0.6);
    display:inline-block;
}
#vidwrap{
    cursor: pointer;
}
.front-about{
    font-size: 15px;
    color: #485359;
    line-height: 22px;
    text-align: justify;
}
.panel-prd-box{
    width:100%;
    height:auto;
    overflow:hidden;
    position:relative;
    display:block;
    border:#b9c7de 1px solid;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px; 
    border-radius: 3px;
    padding: 0 5px 10px 5px;
}
.img-border{
    border: #eee 1px solid; 
}
.panel-prd-box h5.label-primary{
    background: #335a9a;
    text-align: center;
    color: #fff;
    padding: 12px 0 12px 0;
}

.panel-prd-box h5.text-muted{
    color: #666;
    font-size: 12px;
    line-height: 18px;

}
.panel-prd-box .imgbox{
    width: 100%;
    height: auto;
    overflow: hidden;
    display: block;
}	
.panel-prd-box .imgbox img{
    margin: 0 auto;
}

.cart{
    width:96%;
    height:auto;
    overflow:hidden;
    display:inline-block;
}

/** itmdetails ----------------------------------------- */
#container #itmdetails{
    width:100%;
    height:auto;
    overflow:hidden;
    margin:0 auto;
    position:relative;
}
#itmdetails h1, #itmdetails #itmright h1{
    font-size:22px;
    color:#10387a;
    margin: 0;
    padding: 0;
}
#itmdetails #itm-extra-descp{
    color:#444;
    line-height:20px;
    font-size:13px;
    display:inline-block;
}
#itmdetails table #itm-extra-descp table{
    border-collapse:collapse;
}
#itmdetails img #itm-extra-descp img{
    padding:3px;
    display:inline;
}
#itmdetails a, #itm-extra-descp a{
    color:#143779;
}
#itmdetails #itmleft{
    display:block;
    overflow:hidden;
}
#itmleft #itmimgbox{
    max-width:250px;
    max-height:250px;
    display:block;
    overflow:hidden;
}
#itmleft #itmimgbox img{
    width:100%;
}
#itmleft #otherimg{
    width:250px;
    height:60px;
    display:block;
    overflow:hidden;
    float:left;
    margin:5px 0 5px 0;
}
#itmleft #otherimgbox{
    width:60px;
    height:60px;
    display:block;
    overflow:hidden;
    float:left;
    margin-right:2px;
}
#itmdetails #itmright{
    display:block;
    overflow:hidden;
}

#itmdetails #itmright #itm-tags{
    width:60%;
    height:auto;
    overflow:hidden;
    float:left;
    margin-left:1%;
}
#itmdetails #itmright #itm-tags h2{
    width:100%;
    height:auto;
    overflow:hidden;
    margin:5px auto;
    padding:0 0 5px 0;
    font-size:14px;
    text-align:left;
    color:#444;
}
#itmdetails #itmright #itm-tags h2 b{
    font-size:16px;
    text-shadow: 0 1px 1px rgba(150,150,150,.3);
    font-weight:normal;
    color:#333;
}
#itmdetails #itmright #itm-tags h2 strong{
    color:#993300;
    font-size:15px;
    text-shadow: 0 1px 1px rgba(150,150,150,.3);
    text-decoration:line-through;
    font-weight:500;
}
#itmdetails #itmright #itm-tags h3{
    width:100%;
    height:auto;
    overflow:hidden;
    margin:15px auto;
    padding:5px 0 20px 0;
    font-size:15px;
    text-transform:uppercase;
    text-align:left;
    color:#333;
}
#itmdetails #itmright #itm-tags h3 strong{
    color:#76ab19;
    font-size:13px;
}
#itmright #itm-tags .qty{
    float:left;
    width:auto;
    height:16px;
    padding-top:5px;
    margin-right:5px;
}
#itmright #itm-tags .tbox{
    float:left;
    width:30px;
    height:22px;
    margin:2px 2px 0 5px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px; 
    border-radius: 2px;
    border:#CCC 1px solid;
    background:#EEE;
    font-weight:bold;
    color:#444;
}
#itmright #itm-tags .tbox:hover{
    border:#999 1px solid;
}
.addthis_default_style{
    clear:left;
    width:auto;
    float:left;
    display:block;
    margin:40px 0 0 0;
}
#itmright #itm-descp{
    width:36%;
    height:auto;
    overflow:hidden;
    float:left;
    margin-left:2%;
    text-overflow:ellipsis;
}
#itmright #itm-descp.full-width{
    width:100%;
    margin-left:0;
}
#itmright #itm-descp h2{
    width:100%;
    height:30px;
    clear:inherit;
    display:block;
    overflow:hidden;
    float:left;
    font-size:14px;
    color:#444;
    text-transform:uppercase;
    font-weight:bold;
}
#itmright #itm-descp h3{
    width:96%;
    height:auto;
    display:block;
    overflow:hidden;
    float:left;
    font-size:12px;
    line-height:18px;
    font-weight:500;
    color:#555;
    margin-bottom:5px;
}
#itmright #itm-descp p, #itmright #itm-descp br{
    margin-bottom: 15px;
}
#itmright #itm-descp img{
    float:left;
    display:inline-block;
    margin:10px;
    max-width:30%;
}
#itmright #itm-descp ul, #itmright #itm-descp ol{
    width:96%;
    margin:0 0 2% 4%;
}
/*  --------------------------------------- */
/** about-us ------------------- */
#container .about-us, #container .tos{
    width:98%;
    height:auto;
    overflow:hidden;
    display:block;
    margin:5px auto;
    font-size:14px;
    line-height:22px;
    font-weight:500;
    color:#444;
    text-align:justify;
}
.about-us br, .about-us p{
    margin-bottom:10px;
}
#container .about-us.home{
    width:98%;
    float:left;
    padding:2%;
    border-radius: 5px; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
}
#container .about-us.home ul, .about-us ul{
    width:96%;
    padding-left:2%;
    margin-left:2%;
    color:#555;
    font-weight:bold;
    font-size:13px;
}
.about-us h4{
    font-size: 16px;
    margin-top: 15px;
}
#container .about-us.full-width, #container .tos.full-width{
    width:100%;
}
/** news-events ------------------- */
/** news-events ------------------- */
.container #news-events{
    width:98%;
    height:auto;
    overflow:hidden;
    display:block;
    margin:5px auto;
}
#news-events .newsbox{
    width:100%;
    height:auto;
    overflow:hidden;
    display:block;
    margin:0 auto;
    margin-bottom:20px;
    padding-bottom:25px;
    border-bottom:#ccc 1px dashed;
}
#news-events .newsbox h1{
    width:100%;
    height:30px;
    display:block;
    font-size:16px;
    text-align:left;
    margin:15px auto 0 auto;
}
.newsbox .news-content{
    width:98%;
    height:auto;
    overflow:hidden;
    display:block;
    font-size:14px;
    line-height:24px;
    font-weight:500;
    color:#444;
    text-align:justify;
    margin:10px auto 0 auto;
}
.newsbox .news-content br{
    margin-bottom:5px;
}
.newsbox .news-content .datetag{
    font-size:11px;
    color:#999;
    font-style:italic;
    display:inline;
}
#news-events .newsbox .gallery{ 
    display:block;
    width: auto;
    max-height: 140px;
    overflow: hidden;
}

#news-events .newsbox img{
    max-width:18%;
    height:auto;
    overflow:hidden;
    float:left;
    text-align:center;
    display:inline;
    border:#ccc 2px solid;
    border-radius:2px;
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    margin:5px;
    padding:1px;
}
/*  --------------------------------------- */
/** Contact Start */

#contact-us h1, #contact-us h2{
    color: #372219;
    text-shadow:0px 0px 1px rgba(51, 30,21, 0.6);
}
#contact-us .contact-info ul{}
#contact-us .contact-info ul li{
    margin-bottom: 2%;
}
#contact-us .contact-info ul li label {
    width: 100%;
    height: auto;
    display: block;
    font-size: 14px;
    color: #444;
    font-weight: bold;
}
#contact-us .contact-info ul li.h1{
    font-size: 16px;
    color: #875126;
}
#contact-us .contact-info ul li label>span {
    width: 20px;
    display: inline-block;
    margin:0 0 0 12px;
}
#contact-us .contact-info ul li>span {
    width: 100%;
    height: auto;
    display: block;
    font-size: 14px;
    display: inline-block;
    color: #5f5f5f;
    font-size: 14px;
    margin:0 0 0 32px;
}
#contact-us .contact-info ul li>span>a {
    text-decoration: none;
    color: #5f5f5f;
    font-weight: 500;
}
#contact-us .contact-info ul li>span>a:hover {color: #333;}

#contact-us .contact-info ul#medias {
    width: 98%;
    height: auto;
    overflow: hidden;
    float: left;
    display: block;
    padding: 10px 0 10px 2%;
}
#contact-us .contact-info ul#medias li {
    width: 48%;
    height: auto;
    float: left;
    display: block;
    margin-bottom: 8px;
    text-shadow: 0 1px 1px rgba(32, 35, 37, .2);
    text-align: left;
    font-size: 13px;
}
#contact-us .contact-info ul#medias li label {
    width: auto;
    float: left;
    color: #999;
    font-weight: bold;
}
#contact-us .contact-info ul#medias li a,  #contact-us .contact-info ul#medias li img {float: left;}

#contact-us .contact-info #map, #contact-us #map {
    width: 98%;
    height: auto;
    overflow: hidden;
    display: block;
    border: #EEE 2px solid;
}

#contact-us textarea{
    min-height:140px;
    /* resize:none;*/
}
p#SkypeButton_Call_paraElement{
    width: 100% !important;
    height: 40px;
    position: relative;
}
#SkypeButton_Call img{
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: 0 !important;
}

/** Contact End */
/* Footer --------------------------------------- */
#footer{
    width:100%;
    height:auto;
    overflow:hidden;
    display:block;
    margin:0 auto;
    border-top:#000e26 2px solid;
    background:#07152b;
}
#footer #side-menu ul{
    width:100%;
    height:auto;
    overflow:hidden;
    float:left;
    display:inline;
    margin:10px 0 10px 0;
    padding:0;
}
#footer #side-menu ul.last{
    border-right:none;
    margin:10px 0 10px 0.5%;
}
#footer #side-menu ul li{
    width:96%;
    height:auto;
    margin-bottom:7px;
    padding-left:4%;
    float:left;
    font-family:Arial, Helvetica, sans-serif;
    font-size:12px;
    line-height:13px;
    font-weight:500;
    color:#fff;
    text-shadow:0px 1px 2px rgba(40,40,40,.2);
}
#footer #side-menu ul li a{
    color:#fff;
    display:inline-block;
}
#footer #side-menu ul li.media{
    width:100%;
    padding-left:0;
    display:block;
}	
#footer #side-menu ul li.h1{
    width:100%;
    height:auto;
    padding-left:0;
    font-size:13px;
    font-weight:bold;
    line-height:15px;
    margin-bottom:10px;
    color:#fff;
    text-shadow:0px 1px 3px rgba(30,30,30,.4);
    text-transform:uppercase;
}
#footer #side-menu ul li.more-margin{
    margin-top:40px;
}
#footer #side-menu ul li.hotline{
    color:#fffcd2;
    font-weight:bold;
    font-size:14px;
}
#footer .media-icn{
    width:24px;
    height:24px;
    float:left;
    overflow:hidden;
    display:block;
    margin:0 0 0 4px;
}
#footer .media-icn.fb, .media-icn.fb{
    background:url(../images/fb-icon24x24.png) 0 -24px no-repeat;
}
#footer .media-icn.fb:hover{
    background-position:0 0;
}

/*
#footer .media-icn.tw{
    background:url(../images/tw-icon24x24.png) 0 -24px no-repeat;
}
#footer .media-icn.tw:hover{
    background-position:0 0;
}

#footer .media-icn.gp{
    background:url(../images/gp-icon24x24.png) 0 -24px no-repeat;
}
#footer .media-icn.gp:hover{
    background-position:0 0;
}


#footer .media-icn.ut{
    background:url(../images/fb-icon24x24.png) 0 -24px no-repeat;
}
#footer .media-icn.ut:hover{
    background-position:0 0;
}
*/

/* 2024/06/07...*/
#footer .media-icn.li{
    background:url(../images/li-icon24x24.png) 0 -24px no-repeat;
}
#footer .media-icn.li:hover{
    background-position:0 0;
}

#footer .media-icn.x{
    background:url(../images/x-icon24x24.png) 0 -24px no-repeat;
}
#footer .media-icn.x:hover{
    background-position:0 0;
}


#footer .media-icn.tiktok{
    background:url(../images/tiktok-icon24x24.png) 0 -24px no-repeat;
}
#footer .media-icn.tiktok:hover{
    background-position:0 0;
}


#footer .media-icn.insta{
    background:url(../images/insta-icon24x24.png) 0 -24px no-repeat;
}
#footer .media-icn.insta:hover{
    background-position:0 0;
}

#footer .media-icn.yt{
    background:url(../images/yt-icon24x24.png) 0 -24px no-repeat;
}
#footer .media-icn.yt:hover{
    background-position:0 0;
}






/*----------2024/06/07end---------------------*/

#footer #copyright{
    width:100%;
    height:40px;
    float:left;
    display:inline-block;
    overflow:hidden;
    font-size:11px;
    color:#fff;
    text-shadow: 0 1px 1px rgba(50,50,50,.2);
    text-align:left;
    line-height:16px;
    background:#080f1a;
}
#copyright #c-left{
    width:49%;
    height:auto;
    overflow:hidden;
    display:block;
    float:left;
    margin:10px 0 0 1%;
}
#copyright #c-right{
    width:49%;
    height:auto;
    overflow:hidden;
    display:block;
    float:right;
    margin:10px 0 0 1%;
    text-align:right;
    padding-right:10px;
}
/* --------------------------------------- */

@media (min-width: 1200px) {

}
@media (min-width: 992px) and (max-width: 1199px) {

}
@media (min-width: 768px) and (max-width: 991px) {
    .sitename{
        font-size:20px;
    }
    .front-about{
        font-size: 14px;
    }
}
@media (min-width: 768px) and (max-width: 820px) {

}
@media (max-width: 767px) {
    .sitename{
        font-size:20px;
    }
    .navbar-inverse .navbar-nav > li > a {
        border-right: none;
    }
    #header .contact{
        margin:10px 0 0 10px;
    }
}
@media (max-width: 480px) {

}

/* code for bootstrap level 2 and 3 menu --------------------------- */
.dropdown-submenu {
    position: relative;
}
.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}
.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}
.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}
.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}
.dropdown-submenu.pull-left {
    float: none;
}
.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}
/* ---------------------- --------------------------- */