﻿@media (max-width:767px) {

*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

.row    {width:100%; margin:0px auto; padding:0px 3%; float:none; display:block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.clear2 {height:0px;}
.clear1 {height:0px;}

/*-- Logo Area --*/
.logo-area  {width:100%; text-align:center; margin:10px auto;}

/*-- login Area --*/
.login-area {width:100%; padding:0px; margin:0px; float:right; display:block; margin-top:0px; text-align:center}
ul.loglist  {list-style:none; margin:0px; padding:0px; text-align:center; width:100%; float:left;}
ul.loglist li   {margin-left:0px; margin-bottom:5px; width:100%; text-align:left}
ul.loglist li:nth-child(2)   {margin-left:0px; margin-bottom:5px; width:80%;}
ul.loglist li:nth-child(3)   {margin-left:0px; margin-bottom:5px; width:18%; margin-left:2%}

.tb-username,.tb-username:hover, .tb-username:focus     {width:100%;}
.tb-password, .tb-password:hover, .tb-password:focus    {width:100%;}

.login-area input[type="submit"], .login-area input[type="submit"]:hover    {width:100% !important;}

ul.lognavlist li    {display:block; float:none; border-right:0px solid #fff; padding:0px 0px 6px; text-align:left}
ul.lognavlist li:before {content: "» ";}

.logedin-area   {float:left; margin-top:0px;}

.logedin-area ul.editlist       {list-style:none; margin:0px; padding:0px; float:left; margin-top:10px;}
.logedin-area ul.editlist li    {list-style:none; margin:0px; padding:0px; display:inline-block; float:none; padding:0px 0px; color:#000; width:auto; display:block; line-height:19px;}


.logedin-area ul.editlist a         {color:#fff; text-decoration:none;}
.logedin-area ul.editlist a:hover   {color:#fff; text-decoration:underline;}

.welcome {margin:0px; padding:0px; font-family: 'RobotoBold'; color:#fff}

.logedin-area ul.editlist li.editprofile    {padding:5px 5px 15px; padding-left:30px; background-position:top left}
.logedin-area ul.editlist li.changepassword {padding:5px 5px 15px; padding-left:30px; background-position:top left}
.logedin-area ul.editlist li.logout         {padding:5px 5px 15px; padding-left:30px; background-position:top left}




/*-- Top Menu Area --*/
.headerpan .menu-area   {width:auto; padding:0px; margin:0px;  display:block; background:transparent; margin-top:0px; right:0px;}
.headerpan .menu-area  {border-radius:0px 5px 0px 0px; -webkit-border-radius:0px 5px 0px 0px; -moz-border-radius:0px 5px 0px 0px;}

.menu-area-inside       {width:auto; padding:0px; margin:0px; float:right; display:block; height:auto;}

/******************************************************************************
Visual
******************************************************************************/
.visual-area    {margin:0px auto; position:relative; top:-22px;}
.visual-bg      {display:none}


/******************************************************************************
Responsive Grids
******************************************************************************/
.col    {display:block; float:left; margin:0px;}

/*-- Two Columns --*/
.two-cols_1 {width: 100%; display:block; margin-bottom:40px}
.two-cols_2 {width: 100%; display:block;}

/*-- Three Columns --*/
.Three-cols {width:100%; display:block; margin-bottom:20px;}

/*-- Home Three Panels --*/

/*-- Blue Panels --*/
.blue-line-bottom   {margin-bottom:20px}

/*-- Green Panels --*/
.green-line-bottom  {margin-bottom:20px}


/*-- Home featured News --*/
.news-group {display:table;}

.news-group .news-date    {width:100px; display:table-cell; vertical-align:top}
.news-group .news-detail  {width:100%; padding-left:15px; display:table-cell; float:none; vertical-align:top}

/*-- Home Blog posts --*/
.blog-group     {width:100%; display:table}

.blog-date      {width:60px; display:table-cell; vertical-align:top}
.blog-detail    {width:100%; float:none; display:table-cell; vertical-align:top}


/*-- Home Networking Widget --*/
.networking-widget {width:96%; padding:0px; margin:0px; background:#f8f7f6; min-height:350px; float:left; padding:2%;}


/*========== Inside Style ==========*/
.bodycontainer {display:block; width:100%;}
.bodycontainer .left-pan {width:100% !important; margin:0px; padding:0px; float:left; margin-bottom:20px; display:block}
.bodycontainer .right-pan {width:100%; margin:0px; padding:0px; float:right; margin-bottom:20px}

.registry-left      {width:100%; margin:0px; padding:0px 20px 0px 0px; display:table-row; vertical-align:top}
.registry-middle    {width:10%; height:80px; padding:10px 0px; display:block; text-align:center; background: url(images/bg-line.gif) repeat-y center; vertical-align:top; width:100%;}
.registry-right     {width:100%; margin:0px; padding:0px; display:table-row; text-align:center; vertical-align:top; padding-left:10px;}

.registry-left .form-box li {width: 100%;}


/*========== Left Style ==========*/
.pic-left   {display:none}
.left-nav   {width:100% !important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-bottom:20px; display:none}

.lftsearch  {width:100%; margin:0px; padding:0px; margin-bottom:10px; float:left}


/*========== News section ==========*/
.hrnews-group   {width:100%; padding:5px 0px; float:none; margin:0px; margin-bottom:15px; display:table}

.hrnews-date    {width:100px; text-align:center; float:left; display:table-cell; vertical-align:top}
.hrnews-detail  {width:100%; float:none; display:table-cell; border-left:2px solid #ccc; padding-left:15px; padding-right:0px; line-height:14pt; vertical-align:top}

.hrnews-head        {font-size:14px; color:#000; text-transform:uppercase; display:block;}
.hricon-readmore    {margin:0px auto; padding:0px; float:right; display: list-item; margin-top:15px; font-size:11px; text-transform:uppercase}

.hrnews-group a         {color:#000; text-decoration:none}
.hrnews-group a:hover   {color:#000; text-decoration:underline}

.hricon-readmore a          {color:#00aaeb; text-decoration:none}
.hricon-readmore a:hover    {color:#00aaeb; text-decoration:underline}

.hrnews-group:hover {background:#f9f9f9}
.hrnews-group:hover .hrnews-date h2 {color:#000;}

.hrnewsdetail-group {width:100%; padding:5px 0px; margin:0px; float:left; margin-bottom:15px}
.hrnewsdetail-group ul {list-style:none; padding:0px; margin:0px;}
.hrnewsdetail-group ul li {list-style-image:url(images/listbullet.png); padding:0px; margin:0px 0px 3px 20px;}


/*========== Members Directory Style ==========*/
.dir-col    {display: block; float: left; margin: 0% 0 0% 0%;}

.directory-cols_4_1   {width:45%; display:block;}
.directory-cols_4_2   {width:18%; display:block; display:none}
.directory-cols_4_3   {width:50%; display:table-cell;}
.directory-cols_4_4   {width:20%; display:table-cell; display:none}
.directory-cols_4_5   {width:100%; display:block; padding:0px;}

.mem-dctry-group .view-more  {width:auto; padding:2px 0px 0px 0px; margin:0px; float:right; text-transform:uppercase; font-size:11px; font-family: 'RobotoBoldCondensed'; color:#009beb}




/******************************************************************************
FORM STYLE
******************************************************************************/

input, textarea, select {-webkit-appearance: none;}

ul.form-box li  {list-style:none; padding:0px; margin:1px 0% 15px 0px; float:left; width:100%;}
ul.form-box1 li {width:100% !important; float:left}

input[type="submit"]        {width:45%; padding:10px 0px 9px; background:#009beb; color:#fff; border:0px; cursor:pointer; text-transform:uppercase; font-size:12px; display:inline-block}
input[type="submit"]:hover  {background:#005987; color:#fff;}

input[type="button"]        {width:45%; padding:10px 0px 9px; background:#009beb; color:#fff; border:0px; cursor:pointer; text-transform:uppercase; font-size:12px; display:inline-block}
input[type="button"]:hover  {background:#005987; color:#fff;}

input[type="image"]        {width:16px; padding:9px 0px 9px; background:#fff; color:#fff; border:0px; cursor:pointer; text-transform:uppercase; font-size:12px; display:inline-block}

.input_date         {width:12% !important; padding:9px 2% 8px !important; color:#999; outline:none; background:#fff url(images/icon-eve-date.png) no-repeat right center !important; border:1px solid #dddddd !important; font-family:'Robotoregular'; border-left:none !important; cursor:pointer; float:left;}
.input_date:hover   {background:#fcfcfc url(images/icon-eve-date-mo.png) no-repeat right center !important;}

ul.form-box-popup li.name {width:100%; padding:5px 0px 0px; margin:0px; float:left; line-height:15pt; margin-right:10px;}
ul.form-box-popup li.width_200  {width:100% !important; float:left}


/*========== Left Form ==========*/
.left-form      {background:#f8f8f8; -moz-box-shadow: inset 0 0 5px #ddd; -webkit-box-shadow: inset 0 0 5px #ddd; box-shadow: inner 0 0 5px #ddd; float:left; padding:5% 5%; width:90%; border:1px solid #e2e2e2}
.left-form p    {line-height:14pt;}

.left-form h3   {text-transform:uppercase; margin-bottom:05px; font-size:15px; color:#006aa1}

ul.lftsearch-box .drop-sm  {width:80%; margin-right:2%}
ul.lftsearch-box .btn-sm   {width:18%;}

ul.lftsearch-box .drop-arc  {width:42.5%; margin:0px 3px 0px 0px;}

ul.form-box li.fullspan         {width:100%; margin:0px; padding:0px;}



/*========== Left Search ==========*/
ul.lftsearch-box     {list-style:none; padding:0px; margin:1px 3px 4px 0px; width:100%; float:left; display:block}
ul.lftsearch-box li  {list-style:none; padding:0px; margin:0px; float:left; width:100%; margin-right:4px}
ul.lftsearch-box li:last-child  {margin-right:0px;}

ul.lftsearch-box .drop-sm  {width:91%; float:left; padding:0px; margin-right:1%;}
ul.lftsearch-box .btn-sm   {width:8%; float:left; padding:0px; margin:0px;}

ul.lftsearch-box .drop-arc  {width:45.5%; margin:0px .5% 0px 0px;}
ul.lftsearch-box .drop-arc:nth-child(2n)  {width:44.5%; margin:0px 1% 0px .5%;}




/******************************************************************************
FOOETR STYLE
******************************************************************************/
.footerpan h4 {margin-bottom:0px;}

.help-desk {width:50%; padding:0px; margin:0px; float:left;}
.mailinglist {width:50%; padding:0px; margin:0px; float:right;}

.ftrnav     {width:75%;}
ul.ftrlist  {margin-right:0px; width:43%}

.ftr-networking {width:25%;}


/******************************************************************************
HEADER STYLE
******************************************************************************/
h1, h2, h3, h4, h5, h6 {font-family: 'RobotoCondensed'; font-style:normal; font-weight:normal;  margin:0px; padding:0px;}
h1 {font-size:20px; color:#006aa1; text-transform:uppercase; margin-bottom:10px}
h2 {font-size:18px; color:#009beb; text-transform:uppercase; line-height:14px;}
h3 {font-size:15px; color:#e75b0f; text-transform:uppercase; line-height:14px;}

h2.icon-news {background:url('images/icon-news.png') no-repeat left; padding:5px; padding-left:23px;}
h2.icon-hr-blog {background:url('images/icon-hr-blog.png') no-repeat left; padding:5px; padding-left:23px;}
h2.icon-forthcoming-news {background:url('images/icon-forthcoming-event.png') no-repeat left center; padding:5px; padding-left:23px;}

.left-pan h3    {text-transform:uppercase; margin-bottom:05px; font-size:15px; color:#006aa1}
h3.site         {font-size:13px; color:#000; text-transform:uppercase; margin-bottom:5px}


/******************************************************************************
BREADCRUMB
******************************************************************************/
#crumbs     {font-size:12px}
#crumbs li  {padding-right:10px; margin-right:05px;}
}


@media (max-width:560px) {
body {overflow-x:no-display}

.help-desk   {width:98%; padding:10px 10px; margin:0px 0px 10px 0px; float:left;}
.mailinglist {width:100%;}

.ftrnav         {width:98%; padding:0px 10px; margin:0px; float:left;}
.ftr-networking {width:98%; padding:0px 10px; margin:0px; float:left; margin-top:20px;}
}
