@media only screen and (min-width:768px) and (max-width: 1200px)
{
/*
=====================================================================================================================================================
HEADER STYLE
=====================================================================================================================================================
*/
.headerpan                  {position:fixed; width:100%; background:#fff url(images/bg-line.gif) repeat-x top; z-index:999;  -webkit-transition:height 0.3s; -moz-transition: height 0.3s; transition: height 0.3s; border-bottom:1px solid #fff}
/*------------------------------------------
Logo, banner and Navigation Area
------------------------------------------*/
.logo       {max-width:80px; width:100%; height:auto; margin:0px; padding:20.5px 0px; float:left}
.caption    {width:27%; height:auto; margin:0px; padding:38px 10px 0px; float:left; text-transform:uppercase; line-height:20px; font-size:18px;}

.top-banner {float:right; width:57%; padding:10px 0px;}
.top-banner img {float:right; max-width:100%; padding:24px 0px;}





/*
=====================================================================================================================================================
HOME BODY STYLE
=====================================================================================================================================================
*/

/*------------------------------------------
Visual Panel
------------------------------------------*/
.visualpanel        {width:100%; padding:0px; margin:175px 0px 0px 0px; float:left; position:relative; background:url(images/bg-visual.png); margin-bottom:1px;}
.visualpanel .wrap  {max-width:1200px; width:94%; float:none;}

.home-banners   {float:left; max-width:100%; width:100%;}
.home-visual    {float:right; max-width:100%; width:100%; position:relative}

ul.bnrlist li               {margin-bottom:7px; width:49.5%}
ul.bnrlist li:last-child    {margin-bottom:7px; float:right}

ul.bnrlist li img           {width:100%;}



/*------------------------------------------
Colum Style
------------------------------------------*/
.row   {width:100%; padding:0px; margin:0px; display:table}
.col   {display:table-row; width:100%; vertical-align:top}
.col1  {display:table-row; width:100%; vertical-align:top;}
.col2  {display:table-row; width:100%; vertical-align:top}

.col2_1  {display:block; width:25%; vertical-align:top; float:left}
.col2_2  {display:block; width:75%; vertical-align:top; float:right;}

.col a.btnlink:link {position:relative; bottom:0px}


/*------------------------------------------
Rubber India Magazine
------------------------------------------*/
.rubber_india_mag   {width:100%; padding:0px; margin:0px; float:left}
.mag_row            {padding:0; margin:0; width:100%;}

ul.mag_list             {padding:0; margin:0; width:100%; float:left;}
ul.mag_list li          {padding:0px; margin:0px; list-style:none; width:100%;}
ul.mag_list li a        {text-decoration:none;} 
ul.mag_list li a:hover  {color:#fff; text-decoration:none;}

ul.mag_list li h3   {font-size:1.1em; text-decoration:none; margin:0px 0px 5px 0px;}
ul.mag_list .fa     {margin-right:5px;} 

.slide_row              {display:table; text-align:left; width:100%;}
.slide_row .slide_pic   {display:table-cell; text-align:left; width:150px; vertical-align:top;}

.rubber_india_mag ul.list       {list-style:none; padding:0px; margin:0px;}
.rubber_india_mag ul.list li    { list-style-image:url(images/listbullet.png); padding:0px; margin:0px 0px 8px 15px;}


/*------------------------------------------
Rubber Prices
------------------------------------------*/
.rubber_price       {width:100%; float:right;}
.price-table    {width:100%; float:left; margin:0px; overflow:auto}


/*------------------------------------------
Event Style
------------------------------------------*/
ul.event_list .event_pic        {display:table-row;}
ul.event_list .event_pic img    {max-width:50%; width:initial;}
ul.event_list .event_details    {display:table-row;}


/*------------------------------------------
News Media and Events
------------------------------------------*/
.media     {width:100%; padding:0px; margin:0px; margin-bottom:20px;}
.news      {width:100%; padding:0px; margin:0px;  margin-bottom:20px;}
.forthcoming_event  {width:100%; padding:0px; margin:0px; position:inherit}

ul.news_list-hm        {padding:0; margin:0; padding-bottom:0px}
ul.news_list-hm li     {padding:0 0 0px 15px; margin:0 0 20px 0px; list-style:none; border-left:2px dotted #ccc;}
ul.news_list-hm li h3  {font-size:1.1em; text-decoration:none; color:#404040; margin:0px 0px 5px 0px;}
ul.news_list-hm li a   {text-decoration:none; color:#404040;} 

ul.news_list-hm li a:hover {color:#00c0ac; text-decoration:underline;}
ul.news_list-hm .fa        {margin-right:5px;}

.date                   {color:#999;}

.hm-eve-detail          {width:100%; padding:0px; margin:0px; text-align:left}
.hm-eve-detail h3       {color:#c80000; margin:0px 0px 10px 0px; font-weight:300; font-size:1.7em;}
.hm-eve-pic             {width:auto; padding:0px 0px 5px 0px; margin:0px auto; float:none}
.hm-eve-detail .date    {font-size:inherit; color:inherit; font-weight:600; text-transform:uppercase}

.hm-eve-detail ul.details_list      {text-align:left}
.hm-eve-detail ul.details_list li   {margin-bottom:5px;}

ul#forthcoming-events  li {list-style:none; width:100% !important}

#forthcoming-events .item        {margin:0px; padding:0px; margin-right:5px; width:100% !important}
#forthcoming-events .item img    {display:block; max-width:100%; width:initial; height:auto;}


/*------------------------------------------
Members Directory Style
------------------------------------------*/
ul.memberlist       {list-style:none; width:100%; padding:0px; margin:0px; float:left;}
ul.memberlist li    {list-style:none; width:100%; padding:10px 0%; margin:0px; border-bottom:0px dotted #6ed5e7;}
ul.memberlist li:first-child    {padding-top:0%}
ul.memberlist li.th             {background:#f2f2f2}

ul.list     {list-style:none; padding:0px; margin:0px; display:block; width:100%; margin-bottom:10px; float:left}
ul.list li  {width:100%; border-right:0px solid #ddd; padding-right:0%;}
ul.list li:last-child  {width:100%; padding-left:0%; border-left:0px solid #ddd;}

.membership ul.list li .details {padding-bottom:0px;}
.membership .spacer1            {height:0px}


/*------------------------------------------
Membership Style
------------------------------------------*/
ul.mag-list li {margin:10px 5px 20px;}



/*------------------------------------------
Home About
------------------------------------------*/
.about          {width:100%; padding:0px; margin:0px;}
.about-video    {width:100%; padding:0px; margin:0px; margin-top:20px;}

.form-menu ul li a              {color:#fff; text-decoration:none; padding:12px 15px; margin:0px; display:block; cursor:pointer; font-weight:600; background:#04869c;}
.form-menu    .login-content       {display:none; position:absolute; top:45px; z-index:999; background:#fff; border:1px solid #bfbfbf; padding:10px;}
.form-menu li .login-content    {right:0; width:240px; padding:0px; margin:0px;}



/*------------------------------------------
Member Login Area
------------------------------------------*/
nav .members-login { position:absolute; top:0px;}


/*------------------------------------------
Managing Committee
------------------------------------------*/
.glance {list-style:none; margin:15px 0%; padding:10px; display:inline-block; width:100%; text-align:center; vertical-align:top; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear; border:1px solid transparent; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

.managing-committee{ display:block;  float:left; width:100%; padding-bottom:0px; margin-bottom:0px; word-wrap:break-word !important;}


.managing-committee .table  {display:table; width:100%; border-spacing:20px 10px;}
.managing-committee .lft-pan   {width:100%; padding:10px;  margin:0px 0px 20px 0px; background:#f4f4f4; display:block; }
.managing-committee .rgt-pan   {width:100%; padding:10px; margin:0px; background:#f4f4f4;  display:block;}


/*
=====================================================================================================================================================
BODY STYLE / OTHER PANELS
=====================================================================================================================================================
*/
.body-container-inside  {margin:173px 0px 0px 0px;}

.panel-left     {max-width:30%;}
.panel-right    {max-width:67%; width:100%; float:right;}

.body-container-inside .panel-left {display:none}
.body-container-inside .panel-right {max-width:100%;}

.body-container-inside .panel-left img {display:none}
.panel-left img {max-width:100%; width:initial}


/*
=====================================================================================================================================================
FOOTER STYLE
=====================================================================================================================================================
*/
.ftr-bg     {background-image:url(images/bg-bottom.png); padding:20px 0px; margin-top:0px; float:left; width:100%; color:#fff;}
.ftr-bg2    {background-image:url(images/bg-bottom1.png); padding:5px 0px; float:left; width:100%; color:#fff}

.ftrlist    {list-style:none; padding:0px; margin:0px; float:left; width:100%; text-align:left; color:#ccc}

.ftr-link   {width:100%; padding:0px 0px 10px 0px; margin:0px; display:table; border-bottom:1px dotted #ccc;}
.ftr-col    {display:table-cell; width:33%; vertical-align:top; margin-right:1%}

.ftr-col:nth-of-type(4) {height:auto; margin-bottom:5px; width:34%; margin-right:0%; display:none}




/*
=====================================================================================================================================================
BACKGROUND SHADES STYLE
=====================================================================================================================================================
*/
.grey       {background:#f1f1f1; -webkit-box-shadow:inset 0 1px 5px 1px #D5D9E0; box-shadow:inset 0 1px 5px 1px #D5D9E0;}
.grey-grad  {padding:25px 0px 30px;}




/*
=====================================================================================================================================================
BREADCRUMB STYLE
=====================================================================================================================================================
*/
.crumb-area {padding:0px 0px; margin-bottom:0px; position:relative; z-index:99; float:left; width:100%; display:table}
#breadcrumb {width:100%; margin:0px; padding:10px 0px 0px; float:left; margin-top:5px; position:relative; z-index:1;}

#crumbs                 {margin:0px; padding:0px 0px; float:left; text-align:left; width:100%;}
#crumbs ul			    {list-style:none; padding:0px; margin:0px;}
#crumbs li			    {list-style:none; color:inherit; padding:0px 5px; margin:0px; font-weight:normal; padding-bottom:0px; display:inline-block}
#crumbs li:first-child  {padding-left:0px;}
#crumbs li:last-child   {text-transform:uppercase}

#crumbs li a		{color:inherit; text-decoration:none;}	
#crumbs li a:hover  {color:#c80000;}

}