/* Footer slide in/out */



div.panelz,p.flip



{



margin:0px;



width: 10px;



float:right;



cursor:pointer;



}



div.panelz



{



height:20px;



display:none;



width: 90px;



float:right;



text-align: right;



cursor:pointer;



padding-left: 20px;



}



/* END */







/* Tabs */



/******* MENU *******/  



#tabstitle {padding: 30px 0 12px 3px; font-size:16px; color:#fff;}



#container{  



    margin: 0 auto 10px;



    width: 200px;  



    -moz-border-radius: 6px; 



  -webkit-border-radius: 6px; 



  border-radius: 6px; 



}  



#container ul{  



    list-style: none;  



    list-style-position: outside;



  margin: 0 0 0 9px;







}  



#container ul.menutabs li{  



    float: left;  



    margin-right: 5px;  



    margin-bottom: -1px;  



}  



#container ul.menutabs li{  



    font-weight: 700;  



    display: block;  



    padding: 5px 5px 5px 5px;  



    background: #4688ed;  



    margin-bottom: -1px;  



    border: 1px solid #d0ccc9;  



    border-width: 1px 1px 1px 1px;  



    position: relative;  



    color: #fff;  



    cursor: pointer;  



  margin-top: -25px;



  border-radius:5px;



}  



#container ul.menutabs li.active {



    background: none repeat scroll 0 0 #346796;



    border-bottom: 0 none;



    color: #fff;



    margin-top: -25px;



    top: 1px;



  border-radius:5px;  



} 







.content{  



    margin: 0pt auto;   



    background: #4688ed;  



    border: 1px solid #d0ccc9;  



    text-align: left;  



    padding: 10px;  



  color:#fff;



    padding-bottom: 10px;  



    font-size: 12px;  



    -moz-border-radius: 6px; 



  -webkit-border-radius: 6px; 



  border-radius: 6px; 



}  



.content h3{  



    padding: 10px 10px 10px 0px;



  margin-top:15px;



  text-align: left;



}  







.content.news{  



    display: block;  



  -moz-border-radius: 6px; 



  -webkit-border-radius: 6px; 



  border-radius: 6px; 



  padding-top: 15px;



}  







.content.tutorials{  



    display: none;  



  padding-top: 15px;



}  







.content.links{  



    display: none;  



  padding-top: 43px;



}  



 



/* TABS END */



/*To Top*/



.nav_up{



  padding:7px;



  background-color:white;



  border:1px solid #555;



  position:fixed;



  background:transparent url(../images/arrow_up.png) no-repeat top left;



  background-position:50% 50%;



  width:20px;



  height:20px;



  bottom:10px;



  opacity:0.7;



  right:30px;



  white-space:nowrap;



  cursor: pointer;



  -moz-border-radius: 3px 3px 3px 3px;



    -webkit-border-top-left-radius:3px;



  -webkit-border-top-right-radius:3px;



    -khtml-border-top-left-radius:3px;



  -khtml-border-top-right-radius:3px;



  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);



}







.nav_up:hover { border:1px solid #ccc;}



/* END */







.refer01 {width: 430px; height: auto; min-height: 240px; float: left; border: 1px solid #555; border-radius: 5px; margin: 1px; padding: 4px; overflow:hidden;}

.refer02 {width: 150px; height: auto; border: 0px solid #555; border-radius: 5px; margin: 0px; padding: 4px; padding-bottom: 10px; }



tr, th, td { padding: 2px; }



@media (max-width: 767px) { 

body.mobile body { background:#ff00ff; margin: 10px; padding: 0px; }

}





body.mobile { background:#fff url() no-repeat; background-attachment:fixed; margin: 5px; padding: 0px;}

body.mobile #main { width: 100%; max-width: 300px; height:0%; min-height:1px; max-height:5px; }

  body.tablet #main { display: none; }

  body.mobile .item-page {background:transparent; }

 

  body.mobile #headerperson { display: none; }

  body.mobile #headerperson2 { display: none; }

  body.mobile #rightbar-w { display: none; }

  body.mobile #sidebar { display: block; }

  body.mobile .slogan { display: none; }

  body.mobile #main { margin: 0px; }

  body.mobile #swift { margin: 0px;}

  body.mobile #navr { height: auto; float: left; border-radius: 5px; background:#fff; }

  body.mobile #nav ul li, body.mobile .topmenu ul li { float: none; border: 1px solid #4a3931; border-radius: 3px; margin: 3px; min-width: 259px; max-width: 260px;}

body.mobile #sidebar .module ul.menu { background: transparent;}

  body.mobile .logo {display: block; position:absolute; top:15px; left:75px; width:220px; height:auto; border:0px solid #000; border-radius: 4px; z-index: +9999; }

  body.mobile #logo2 {display: none; background:#ff000f; position:absolute; top:15px; left:0px; width:220px; height:46px; border:0px solid #000; border-radius: 4px; }

body.mobile .topmenu {background:#fff; width: auto; min-width: 219px; max-width: 280px; border:0px solid #000; border-radius: 5px; float:left; 

  margin-top: 10px; margin-left: 10px; margin-bottom: 40px; padding-top:0px; z-index:+9999; position: relative; left:0px; top:220px;}

body.mobile #header { display: block; position:relative; height:0px; width:300px;margin: 0px auto 0; background:#E0E0CC url(../images/bannerHP.png) no-repeat left top; background-size: auto 0px; border: 0px solid #4a3931; border-radius: 5px;}

  body.mobile .topmenu ul li a { display: block;  padding: 0 10px 0 10px;  margin: 0px; height: 24px;  line-height: 20px;  -moz-transition: color 0.3s ease 0s, background 0.3s ease 0s; -webkit-transition: 0.3s ease 0s;  -o-transition: 0.3s ease 0s; background: none;  color: #555;  display: block;  position: relative;  text-align: left;  text-transform: uppercase; font-size: 12px;  font-weight: normal;  font-family: 'Vollkorn', serif; }

  body.mobile #nav ul li a {  font-family: 'Ubuntu', sans-serif;  display: block;  text-transform: none;  padding: 0 15px 0 15px; line-height: 25px;  color: #4a3931; text-shadow: 0 1px #fff;  text-decoration: none;  font-size: 15px;  font-weight: normal;}

  body.mobile #nav ul li.active a, body.mobile #nav ul li a:hover {  color: #000;  text-shadow: 2px 2px #fff;  border-bottom: 2px solid #fff;  padding-bottom: 2px; background: url(../images/sidehover.jpg) 100% -50px no-repeat #fff;}

body.mobile #sidebar .module ul.menu li a { background-color: transparent; border: 1px solid #6e99c2; border-right: 1px solid #6e99c2; border-left: 0px solid #6e99c2; border-top: 0px solid #6e99c2; color: #575757; border-radius: 5px 5px 5px 5px; }

  body.mobile #sidebar .module ul.menu li.active ul li a { color: #575757; background: url(../images/sidehover.jpgX) 100% -50px no-repeat #fff; }

    body.mobile #sidebar .module ul.menu li ul li.active a, #sidebar .module ul.menu li.active ul li a:hover {color: #640000; background: url(../images/sidehover.jpg) 100% -50px no-repeat #fff;}

  body.mobile #sidebar .module ul.menu li.active ul li a:hover { color: #575757; background: url(../images/sidehover.jpg) 100% -50px no-repeat #fff000; }

  body.mobile #sidebar .module ul.menu li.active a { color: #640000; background: url(../images/sidehover.jpg) 100% -50px no-repeat #fff; }

body.mobile #wrapper {background:#fff; margin:0px 0px; width:300px; padding:0;position: relative; margin-top:10px; padding-top:400px; border: 1px solid #4a3931; border-radius: 5px; }

  body.mobile #main-content {width:280px; margin-top: 0px; }

  body.mobile #centercontent_bg { width: 270px; float: left; margin: 10px 5px 0px 5px; padding: 0px; overflow: hidden; border: 1px solid #640000; border-radius: 3px; }

  body.mobile #centercontent_md { width: 270px; padding: 5px; border: 1px solid #640000; border-radius: 3px; }

body.mobile #swift2 { border-collapse: collapse; border-spacing: 0; width: 200px; border: 0px solid #4a3931; border-radius: 5px; padding: 10px; background:transparent; }

body.mobile #leftbar-w { width: 260px; float: left; padding-top: 7px; background-color: transparent; border: 0px solid #e1e1e1; border-radius: 7px; }

  body.mobile #bottom {width:300px; padding:0; margin: auto;}

  body.mobile .breadcrumbs {display: none; }

  body.mobile #centercontent { width: 220px; height:auto; float: left; margin: 0px; padding: 0px 0px 30px 0px; z-index:+9999; }

  body.mobile div.clearpad { padding: 3px; }

  body.mobile #bottomwide {width: 99%; height:auto; margin: 0px; padding: 0px 0px 30px 0px; display:none;}

  body.mobile .user1, .user2, .user3 { display: none;  background:#1b1b1b; border:0px solid #000; border-radius:10px;  color: #fff; text-shadow: 0 1px #fff000; padding: 0px 10px 6px 30px; float: left; width: 180px; margin: 10px; z-index:+9999; }

  body.mobile .user1 { margin-left: 10px;}

  body.mobile html {width: 99%; height:100%; }

  body.mobile2 {width: 300px; max-width: 311px; height:100%; overflow-y: scroll; margin: 20px; }

  body.mobile .background {width: 99%; height:100%; }

  body.mobile .refer01 {width: 240px; height: auto; min-height: 240px; float: left; border: 1px solid #555; border-radius: 5px; margin: 1px; padding: 4px; overflow:hidden;}

  body.mobile .refer02 {width: 100px; height: auto; border: 0px solid #555; border-radius: 5px; margin: 0px; padding: 4px; }

  body.mobile tr, body.mobile th, body.mobile td { padding: 2px; width: 120px; overflow:hidden; vertical-align: bottom; }

  body.mobile .fc_table, body.mobile table { border: none !important; padding: 2px; width: 220px; }

  body.mobile .fc_form input, body.mobile .fc_form textarea {max-width: 140px; }

  body.mobile td.fc_prompt { min-width: 80px; }














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

@media (max-width: 767px) { 
body.mobile body { background:#ff00ff; margin: 10px; padding: 0px; }
}
*/

body.tablet .refer01 {width: 400px; height: auto; min-height: 240px; float: left; border: 1px solid #555; border-radius: 5px; margin: 1px; padding: 4px; overflow:hidden;}
body.tablet .refer02 {width: 150px; height: auto; border: 0px solid #555; border-radius: 5px; margin: 0px; padding: 4px; padding-bottom: 10px; }


body.tablet { background:#fff url(../images/stripe.png) repeat; margin: 5px; padding: 0px;}
body.tablet #main { width: 85%; max-width: 900px; height:101%; min-height:1px; max-height:5000px; margin: 0px auto; }
body.tablet #main { display: block; }
body.tablet .item-page {background:transparent; }
 
body.tablet #headerperson { display: none; }
body.tablet #headerperson2 { display: none; }
body.tablet #rightbar-w { display: none; }
body.tablet #sidebar { display: block; }
body.tablet #swift { margin: 0px;}
body.tablet #navr { background: #fff; height: auto; float: left; border-radius: 5px; width: 95%; }
/**/	body.tablet #nav ul { background: #fff; float: left; border: 0px solid #4a3931; border-radius: 3px; margin: 3px; margin-left: 5px; width: 95%;}
/**/ 	body.tablet #nav ul li, body.tablet .topmenu ul li { float: none; border: 1px solid #4a3931; border-radius: 3px; margin: 3px; width: 100%; list-style: none; }
body.tablet #sidebar .module ul.menu { background: transparent;}

/**/	body.tablet .logo {display: block; float:right; position:relative; top:5px; left:-10px; width: 180px; height:180px; border:0px solid #000; border-radius: 4px; }
/**/	body.tablet .slogan {display: block; float:left; position:relative; top:-285px; left:10px; width: 150px; height:5px; border:0px solid #000; border-radius: 4px; }
/**/	body.tablet .slogan img {width: 350px; height:auto; border:0px solid #000; border-radius: 4px; }

	body.tablet #logo2 {display: none; background:#ff000f; position:absolute; top:15px; left:0px; width:220px; height:46px; border:0px solid #000; border-radius: 4px; }


/**/	body.tablet #header { height:195px; width: 95%; margin: 0px; background:rgba(224,224,204,0.01); border: 1px solid #4a3931; border-radius: 5px; margin: 0px; padding: 0px;}
	body.tablet .topmenu {background: #fff; width: 100%; border:0px solid #000; border-radius: 5px; float:left; margin-top: 35px; margin-left: 10px; margin-bottom: 20px; padding-top:0px; margin-left: 0px; z-index:+9999; }



body.tablet .topmenu ul li a { display: block;  padding: 0 10px 0 10px;  margin: 0px; height: 24px;  line-height: 20px;  -moz-transition: color 0.3s ease 0s, background 0.3s ease 0s; -webkit-transition: 0.3s ease 0s;  -o-transition: 0.3s ease 0s; background: none;  color: #555;  display: block;  position: relative;  text-align: left;  text-transform: uppercase; font-size: 12px;  font-weight: normal;  font-family: 'Vollkorn', serif; }
body.tablet #nav ul li a {  font-family: 'Ubuntu', sans-serif;  display: block;  text-transform: none;  padding: 0 15px 0 15px; line-height: 25px;  color: #4a3931; text-shadow: 0 1px #fff;  text-decoration: none;  font-size: 15px;  font-weight: normal;}
body.tablet #nav ul li.active a, body.tablet #nav ul li a:hover {  color: #000;  text-shadow: 2px 2px #fff;  border-bottom: 2px solid #fff; }
body.tablet #sidebar .module ul.menu li a { margin-bottom: 4px; background-color: transparent; border: 1px solid #6e99c2; border-right: 1px solid #6e99c2; border-left: 0px solid #6e99c2; border-top: 0px solid #6e99c2; color: #575757; border-radius: 2px 5px 5px 5px; }
body.tablet #sidebar .module ul.menu li.active ul li a { color: #575757; background: url(../images/sidehover.jpg) 100% -50px repeat-x #fff; }
body.tablet #sidebar .module ul.menu li ul li.active a, body.tablet #sidebar .module ul.menu li.active ul li a:hover {color: #640000; background: url(../images/sidehover.jpg) 100% -50px repeat-x #fff000;}
body.tablet #sidebar .module ul.menu li.active ul li a:hover { color: #575757; background: url(../images/sidehover.jpg) 100% -50px repeat-x #fff000; }


	body.tablet #sidebar .module ul.menu li.active a { color: #640064; background: url(../images/sidehover.jpg) 100% -50px repeat-x #fff; }
	body.tablet #wrapper {float:left; background:#fff; margin:0px auto; width:95%; max-width: 900px; padding:0; border: 1px solid #4a3931; border-radius: 5px; }
	body.tablet #main-content {width:auto; margin-top: 0px; }
	body.tablet #centercontent_bg { width: 95%; margin: 10px auto; padding: 0px; overflow: hidden; border: 0px solid #640ff0; border-radius: 3px; }
	body.tablet #centercontent_md { width: 95%; padding: 5px; border: 1px solid #640000; border-radius: 3px; }

	body.tablet #swift2 { border-collapse: collapse; border-spacing: 0; width: 95%; border: 0px solid #4a3931; border-radius: 5px; padding: 10px; background:transparent; }
	body.tablet #leftbar-w { width: 95%; float: left; padding: 5px; padding-top: 7px; background-color: transparent; border: 0px solid #e1e1e1; border-radius: 7px; }

	body.tablet #bottom {width:95%; padding:0; margin: auto;}
body.tablet .breadcrumbs {display: none; }
	body.tablet #centercontent { width: 95%; height:auto; float: left; margin: 0px; padding: 0px 0px 30px 0px; z-index:+9999; }
body.tablet div.clearpad { padding: 3px; }
body.tablet #bottomwide {width: 95%; height:auto; margin: 0px; padding: 0px 0px 30px 0px; display:none;}
body.tablet .user1, body.tablet .user2, body.tablet .user3 { background:#1b1b1b; border:0px solid #000; border-radius:10px;  color: #fff; text-shadow: 0 1px #fff000; padding: 0px 10px 6px 30px; float: left; width: 180px; margin: 10px; z-index:+9999; }
body.tablet .user1 { margin-left: 10px;}

body.tablet html {width: 99%; height:auto; }
body.tablet2 {width: 300px; max-width: 311px; height:100%; overflow-y: scroll; margin: 20px; }
body.tablet .background {width: 99%; height:auto; }

body.tablet #sidebar .module ul.menu { background: transparent;}
body.tablet #sidebar .module ul.menu li a { background-color: transparent; }
body.tablet #sidebar .module ul.menu li.active ul li a { color: #575757; background: url(../images/sidehover.jpgX) 100% -50px repeat-x #fff; }
	body.tablet #sidebar .module ul.menu li ul li.active a, body.tablet #sidebar .module ul.menu li.active ul li a:hover {color: #640000; background: url(../images/sidehover.jpg) 100% -50px repeat-x #fff000; width: auto;}
body.tablet #sidebar .module ul.menu li.active ul li a:hover { color: #575757; background: url(../images/sidehover.jpg) 100% -50px repeat-x #fff000; }
	body.tablet #sidebar .module ul.menu li.active a { color: #640000; background: url(../images/sidehover.jpg) 100% -50px repeat-x #fff000; }
	body.tablet #nav ul li.active, body.tablet #nav ul li:hover { color: #640000; background: url(../images/sidehover.jpg) 100% -48px repeat-x #fff000;}
body.tablet #leftbar-w { background-color: transparent; }
body.tablet .user1, .user2, .user3 { background:#1b1b1b; }

body.tablet #nav ul li.active a, body.tablet #nav ul li a:hover { border-bottom: 2px solid #531329; border-radius: 3px;}
body.tablet #sidebar .module ul.menu li a { border: 1px solid #6e99c2; border-right: 1px solid #6e99c2; border-left: 0px solid #6e99c2; border-top: 0px solid #6e99c2; }
body.tablet #centercontent_md { border: 1px solid #640000; border-radius: 3px; }
body.tablet #swift2 { border: 0px solid #4a3931; border-radius: 5px; }
body.tablet #leftbar-w { border: 0px solid #e1e1e1; border-radius: 7px; }
body.tablet .user1, .user2, .user3 { border:0px solid #000; border-radius:10px; }



#ds00, #ds01, #ds02, #ds03, #ds04, #ds05, #ds06, #ds07, #ds08, #ds09, #ds10, #ds11, #ds12, #ds13, #ds14, #ds15, #ds16, #ds17, #ds18, #ds19, #ds20, #ds21, #ds22, #ds23, #ds24, #ds25, #ds26, #ds27 {margin: 5px 0px 30px 0px; clear: both; border: 0px solid rgba(230,228,226,1); border-right: 1px solid rgba(230,228,226,1); border-bottom: 1px solid rgba(230,228,226,1); border-radius: 0px 0px 5px 0px; }
#ds99 {margin: 5px 0px 30px 0px; clear: both; border: 0px solid rgba(230,228,226,1);}






/**/