/*  --------------------------------------------------------------------------  */
/*  ------------------------------------ IN BETWEEN LANDSCAPE & PORTRAIT TABLET */
/*  --------------------------------------------------------------------------  */





@media only screen 
and (max-width: 1100px) {


h1:after {
    content: " 4a";
}

.content-bc {
    height: 340px;
}

a#bannerlogo {
    top: 10px;
    width: 300px;
    height: 130px;
}

#banner {
    top:  30px;    
    width: 60%;
}

form.smart nav {
    padding: 0 0 0 10px;
}
form.smart nav li a {
    padding: 0 10px;
    font-size: 10pt;
}







/*  ---end---  */
}



/*  --------------------------------------------------------------------------  */
/*  ---------------------------------------------- For tablets in portrait mode */
/*  --------------------------------------------------------------------------  */





@media only screen 
and (max-width: 810px) {


h1:after {
    content: " 4b";
}

.content-bc {
    height: 260px;
}

a#logo {
    width: 69px;
    height: 30px;
}

.navigation {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    z-index: 100;
    background: transparent;
    width: 100%;
}

form.smart .tab input, 
form.smart .tab label  {
    display: block;
}

form.smart .tab { 
    position: relative; 
    width: 100%;
    overflow: hidden;
}



form.smart input { 
    position: absolute; 
    opacity: 0; 
    z-index: -1; 
}

form.smart label { 
    position: relative; 
    display: inline-block; 
    padding: 0 35px 0 0;
    width: 100%;    
    font-size: 13pt;
    font-weight: 700;
    line-height: 40px;
    text-transform: uppercase;
    color: #ccc6b8;
    cursor: pointer; 
    text-align: right;
    -webkit-transition: all .35s; 
    -o-transition: all .35s; 
    transition: all .35s; 
}
form.smart label:hover {
    color: #ccc6b8;    
}

form.smart .tab-content { 
    max-height: 0; 
    overflow: hidden; 
}

form.smart input:checked ~ .tab-content { 
    max-height: 1000px; 
}

form.smart input:checked ~ label { 
    color: #fff; 
    background-color: transparent; !important;     
} 



/* + Icon */

form.smart label::after { 
    position: absolute; 
    right: 0; 
    top: 0; 
    display: block; 
    width: 50px; 
    height: 40px; line-height: 40px; 
    text-align: center; 
    -webkit-transition: all .35s; 
    -o-transition: all .35s; 
    transition: all .35s; 
    } 
form.smart input[type=checkbox] + label::after { 
    font-size: 17pt;   
    content: "+"; 
    }
form.smart input[type=checkbox]:checked + label::after { 
    transform: rotate(315deg); 
}

form.smart nav {
    margin: 0;
    padding: 0;
    }
form.smart nav ul {
    margin: 0;
}
form.smart nav li {
    display: block;
    margin: 0;
    padding: 0;
    }
form.smart nav li a {
    margin: 0;
    padding: 0 20px;
    width: 100%;
    line-height: 40px;
    color: #ccc6b8;
    background-color: #c16130;
    border-top: 1px dotted #ccc6b8;
    font-size: 10pt;
    text-align: right;
    }
form.smart nav li a:hover {
    background-color: #d4591a;
    color: #fff;
}

body.pg-home form.smart nav ul li.btn-home a,
body.pg-id form.smart nav ul li.btn-id a,
body.pg-pls form.smart nav ul li.btn-pls a,
body.pg-ttfo form.smart nav ul li.btn-ttfo a {
    background-color: #c16130;
    color: #ccc6b8;
    /* --cursor: default; */
}


body.pg-home form.smart nav ul li.btn-home a:before,
body.pg-id form.smart nav ul li.btn-id a:before,
body.pg-pls form.smart nav ul li.btn-pls a:before,
body.pg-ttfo form.smart nav ul li.btn-ttfo a:before {
    content: 'You Are Here:  ';
    color: #010101;
    font-weight: 300;
}

#idgrid1 {/* -- Grid Container  */
    grid-template-columns: 250px auto;
}

#idgrid2 {/* -- Grid Container  */
    grid-template-columns: auto 250px;
}

#plsgrid1 {
    grid-template-columns: 20% auto;


.footergrid { /* -- Grid Container   */
    grid-template-columns: 1fr;
}

footer ul.sign li {
    display: block;
}



/*  ---end---  */
}