body{font-family: 'Open Sans', sans-serif; background-color: #fafafa; font-size: 16px; color: #4d4d4d;}
/*
*******************************************************
				Menu
*******************************************************
*/

header{	background-color: rgba(10,47,88,1);position: fixed;width: 100%;height: 68px; z-index: 9999;}
.logo{width: 20%;float: left;text-align: right; padding: 13px 0 0;}
.logo h1{font-size: 40px;color: #ffffff;padding: 20px 0 0;}
.menu_bar{display: none;}
nav.menu{float: left;width: 77%;}
nav.menu ul{text-align: right;list-style: none;overflow: hidden;}
nav.menu ul li{	display: inline-block;}
nav.menu ul li a{display: inline-block; padding: 26px 20px;font-size: 16px; font-weight: bold; color: #ffffff;	text-transform: uppercase;	text-decoration: none;}
nav.menu ul li a:hover{	background-color: #00dcdc;	color: #ffffff;}
.active{text-decoration: underline; color: #ffffff;}
.clear{clear: both;} 

@media screen and (max-width: 800px){
header{	background-color: rgba(10,47,88,1);position: fixed;width: 100%;}
.logo{position: fixed;right: 0;left: 0;	margin-right: auto;	margin-left: auto;	width: 60%;	float: none;text-align: center;}
.logo h1{font-size: 40px;color: #ffffff;padding: 20px 0 0;}
.menu_bar{text-align: right;z-index: 9999;	display:block;}
.bt-menu {display:block;padding:20px;color:#ffffff;	text-decoration:none;font-weight: bold;	font-size:25px;}
nav.menu{background-color: rgba(51,51,51,0.9);position: fixed;right: -100%;float: none;width: 60%;height: 100%;overflow-y: scroll;}
nav.menu ul{text-align: left;list-style: none;overflow: hidden;}
nav.menu ul li{display:block;padding: 0px 0;}
nav.menu ul li a{display: block;padding: 20px 20px;	font-size: 16px;color: #ffffff;text-transform: uppercase;text-decoration: none;}
nav.menu ul li a:hover{background-color: #00dcdc;color: #ffffff;}
.active{ text-decoration: underline; color: #ffffff;}
.menu_bar span {font-size:30px;}
}

/*
*******************************************************
				Content
*******************************************************
*/
.container{
	padding: 100px 0 0;
	margin: 0 auto;
	max-width: 1100px;
	width: 100%;
}
.top{padding: 120px 0 0;}
.top2{padding: 40px 0 90px;}
.top3{padding: 0px 0 90px;}
.cont{width: 100%;}
.cont h4{padding: 30px 0; font-size: 20px;}

@media screen and (max-width: 1090px){
	.container{width: 100%; margin: 0 auto; overflow: hidden;}
	.cont{width: 90%; margin: 0 auto;}
	.cont h4{padding: 30px 0; text-align: center; font-size: 20px;}
}

@media screen and (max-width: 650px){
	.container{width: 100%; margin: 0 auto; overflow: hidden;}
	.cont{width: 100%; margin: 0 auto;}
	.cont h4{padding: 30px 0; text-align: center; font-size: 20px;}
}

/*
*******************************************************
				articles-home
*******************************************************
*/
.first-articles{padding-bottom: 30px;}
.secondary-articles{padding: 0px 0 30px;}
.first-articles a, .secondary-articles a{color: #4d4d4d;}
.first-articles a:hover, .secondary-articles a:hover{color: #00dcdc;}


.first-articles .articles{width: 100%; position: relative; border: 1px solid #cccccc; height: 300px; box-sizing: border-box; background-position: top center;  -webkit-background-size:cover; -moz-background-size:cover; background-size:cover; }
.secondary-articles .articles{width: 100%; margin-bottom: 25px; position: relative; border: 1px solid #cccccc; height: 250px; box-sizing: border-box; background-position: top center;  -webkit-background-size:cover; -moz-background-size:cover; background-size:cover;}
.article-img{width: 100%; text-align: center; padding: 0.2% 0; height: 100%;}
.article-img img{max-width: 99.8%; height: 99.8%;}
.title-article-home{position: absolute; bottom: 0; width: 100%; background-color: rgba(255,255,255,0.9); left: 0; padding: 20px 0;}
.cont-home-article{width: 90%; margin: 0 auto;}
.cont-home-article p{ font-size: 18px; font-weight: bold; line-height: 24px; text-align: left;}
.first-articles .articles .cont-home-article p{ font-size: 22px; font-weight: bold; line-height: 28px; text-align: left;}
@media screen and (max-width:1090px){
	.first-articles{padding-bottom: 0px; width: 100%; margin: 0 auto;}
	.secondary-articles{padding: 0px 0 0px; width: 100%; margin: 0 auto;}
	.first-articles .articles{width: 100%; margin-bottom: 15px; position: relative; border: 1px solid #cccccc; height: 300px; box-sizing: border-box; background-position: top center;  -webkit-background-size:cover; -moz-background-size:cover; background-size:cover; }
	.secondary-articles .articles{width: 100%; margin-bottom: 15px; position: relative; border: 1px solid #cccccc; height: 300px; box-sizing: border-box; background-position: top center;  -webkit-background-size:cover; -moz-background-size:cover; background-size:cover;}

}

@media screen and (max-width: 650px){
	.first-articles{padding-bottom: 0px; width: 90%; margin: 0 auto;}
	.secondary-articles{padding: 0px 0 0px; width: 90%; margin: 0 auto;}
	.first-articles .articles{width: 100%; margin-bottom: 15px; position: relative; border: 1px solid #cccccc; height: 200px; box-sizing: border-box; background-position: top center;  -webkit-background-size:cover; -moz-background-size:cover; background-size:cover; }
	.secondary-articles .articles{width: 100%; margin-bottom: 15px; position: relative; border: 1px solid #cccccc; height: 200px; box-sizing: border-box; background-position: top center;  -webkit-background-size:cover; -moz-background-size:cover; background-size:cover;}

}
/*
*******************************************************
				Content-article
*******************************************************
*/
.Content-article{width: 100%; margin-top: -260px;}
.category-article{width: 100%; padding: 0 0 30px; display: none;}
.category-article h5{font-weight: bold; font-size: 18px; letter-spacing: 2px;}
.title-article{width: 100%;}
.title-article h1{font-size: 30px; padding: 10px 0!important; line-height: 34px!important;}
.title-article h5{font-size: 24px!important; line-height: 34px!important;}

.author{width: 100%;}
.name-author{width: 100%;}
.name-author p{font-size: 14px;}

.pic-author{width: 100%;}
.description-author{width: 100%;}
.description-author h2{font-size: 24px!important; line-height: 26px!important; padding-bottom: 20px; font-weight: bold;}
.description-author h2 span{font-weight: lighter; font-size: 14px; font-style: italic;}
.description-author p{text-align: justify; font-size: 16px; line-height: 18px; padding-bottom: 10px;}
.description-author p a{color: #0000ff; text-decoration: underline;}
.date-article{width: 100%; padding: 0 0 20px; display: none;}
.date-article p{font-size: 16px; font-weight: lighter;}

.share{width: 100%; max-width: 60px!important; padding: 10px 0; background-color: #0a2f58;}
.share ul li{width: 100%; font-size: 20px; text-align: center; display: block; padding: 10px 0;}
.share ul li a{color: #ffffff;}
.share ul li a:hover{color: #cccccc;}

@media screen and (max-width: 1090px){
.Content-article{width: 100%; margin-top: 20px;}
.category-article{width: 100%; padding: 0 0 30px;}
.category-article h5{font-weight: bold; font-size: 18px; letter-spacing: 2px;}
.title-article{width: 100%;}
.title-article h1{font-size: 30px; line-height: 38px;}
.share{width:95%; max-width:300px!important; padding: 10px 0; margin:0 0 15px; text-align: center; background-color: #0a2f58;}
	.share ul li{width: 100%; font-size: 20px; text-align: center; display:inline; padding: 10px 20px;}
	.share ul li a{color: #ffffff;}
	.share ul li a:hover{color: #cccccc;}
}

@media screen and (max-width: 650px){
	.Content-article{width: 90%!important; margin: 0 auto; margin-top: 20px;}

	.share{width:95%; max-width: 600px!important; padding: 10px 0; margin:0 0 15px; text-align: center; background-color: #0a2f58;}
	.share ul li{width: 100%; font-size: 20px; text-align: center; display:inline; padding: 10px 20px;}
	.share ul li a{color: #ffffff;}
	.share ul li a:hover{color: #cccccc;}

	.author{width: 90%; margin: 0 auto; }
.name-author{width: 100%;}
.name-author p{font-size: 14px;}

.pic-author{width: 80%; text-align: center; margin: 0 auto;}
.pic-author img{width: 150px; height: auto;}
.description-author p{text-align: left!important; font-size: 16px; line-height: 18px; padding-bottom: 10px;}
}

.cont-article{width: 100%;}
.cont-article h1{font-size: 45px; text-align: left; line-height: 50px; padding: 15px 0;}
.cont-article h2{font-size: 40px; text-align: left; line-height: 45px; padding: 15px 0;}
.cont-article h3{font-size: 36px; text-align: left; line-height: 42px; padding: 15px 0;}
.cont-article h4{font-size: 26px; text-align: left; line-height: 30px; padding: 15px 0;}
.cont-article h5{font-size: 20px; text-align: left; line-height: 28px; padding: 15px 0;}
.cont-article p{padding: 0px 0 15px; text-align: justify; font-size: 16px; line-height: 22px;}
.cont-article ul, .cont-article ol {padding: 20px 0 0 30px; }
.cont-article ul li{padding: 0px 0 15px 10px; text-align: left; font-size: 16px; line-height: 22px; list-style-type: disc;}
.cont-article ol li{padding: 0px 0 15px 10px; text-align: left; font-size: 16px; line-height: 22px; list-style-type: decimal;}
.cont-article ul li ul, .cont-article ul li ol {padding: 20px 0 0 30px; }
.cont-article ul li ul li{padding: 0px 0 15px 10px; text-align: left; font-size: 16px; line-height: 22px; list-style-type: disc;}
.cont-article ol li ul li{padding: 0px 0 15px 10px; text-align: left; font-size: 16px; line-height: 22px; list-style-type: disc;}
.cont-article ul li ol li{padding: 0px 0 15px 10px; text-align: left; font-size: 16px; line-height: 22px; list-style-type:decimal;}
.cont-article ol li ol li{padding: 0px 0 15px 10px; text-align: left; font-size: 16px; line-height: 22px; list-style-type:decimal;}
.cont-article img{max-width: 100%; height: auto;}
.cont-article iframe , .cont-article p iframe{ max-width: 100%; height: auto;width: 100%; min-height: 400px;}

/*
*******************************************************
				sidebar
*******************************************************
*/
.add{width: 100%;}
.add img{max-width: 100%; height: auto;}

@media screen and (max-width: 650px){
	.add{width: 100%; text-align: center; padding:20px 0;}
	.add img{max-width: 100%; height: auto;}
}

.sidebar{width: 100%;}


.contributors{width: 100%; padding: 30px 0; color: #4d4d4d;}
.contributors h2{font-weight: bold; font-size: 24px; display: none;}
.contributors h2 a{color: #4d4d4d; text-decoration: none;}
.contributors h2 a:hover{color: #4d4d4d; text-decoration: none; border-bottom: 2px solid #4d4d4d;}
.contributors h3{font-weight: bold; font-size: 24px;}
.contributors h3 a{color: #4d4d4d; text-decoration: none;}
.contributors h3 a:hover{color: #4d4d4d; text-decoration: none; border-bottom: 2px solid #4d4d4d;}
.contributors ul li{width: 100%; padding: 0 0 20px; font-size: 14px; font-weight: lighter;}
.contributors ul li a{color: #4d4d4d; text-decoration: none;}
.contributors ul li a:hover{color: #4d4d4d; text-decoration: none; border-bottom: 2px solid #4d4d4d;}
.contributors ul li h4{font-size: 18px; text-align: left; padding: 0; font-weight: bold; line-height: 22px;}
.contributors .line{display: none;}
.line2{width: 100%; height: 2px; background-color: #bababa; margin: 15px 0; }

.book-box{width: 100%; padding: 30px 0; background: url(../img/BG_banner.png) no-repeat top center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; border: #e7e7e7 solid 2px;}
.cont-book{width:80%; margin: 0 auto;}
.img-book{width: 100%; text-align: center; padding-bottom: 20px;}
.info-book{width: 100%;}
.info-book p{font-weight: bold; font-size: 24px; line-height: 28px; color: #0a2f58; padding-bottom: 30px;}
.info-book a.btn-book-download{width: 100%; text-align: center; font-size: 24px; font-weight: bold; display: inline-block; padding: 15px 0; color: #ffffff; text-decoration: none; background-color: #0a2f58;}
.info-book a.btn-book-download:hover{background-color: #0e4481;}
.con-banner-lateral{width: 85%!important; margin: 0 auto;}
.con-banner-lateral .book-banner-text h5{font-size: 16px!important;}
.con-banner-lateral .book-banner-text h2{font-size: 24px!important; line-height: 32px!important;}
.con-banner-lateral .book-banner-text h2 span{font-size: 16px!important;}

@media screen and (max-width: 1090px){
.contributors{width: 100%; padding: 30px 0; color: #4d4d4d;}
.contributors h2{font-weight: bold; font-size: 24px;}
.contributors ul li{width: 100%; padding: 0 0 20px; font-size: 14px; font-weight: lighter;}
.contributors ul li h4{font-size: 18px; text-align: left; padding: 0; font-weight: bold; line-height: 22px;}
.book-box{width: 100%; padding: 30px 0; background: url(../img/BannerBG.png) no-repeat top center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; border: #e7e7e7 solid 2px;}

.info-book p{font-weight: bold; font-size: 28px; line-height: 34px; color: #0a2f58; padding: 30px 0;}
.info-book a.btn-book-download{width: 100%; text-align: center; font-size: 24px; font-weight: bold; display: inline-block; padding: 15px 0; color: #ffffff; text-decoration: none; background-color: #0a2f58;}
.info-book a.btn-book-download:hover{background-color: #0e4481;}
.empty{display: none;}
}

@media screen and (max-width: 650px){
	.sidebar{width: 90%; margin: 0 auto;}
	.empty{display: none;}
}
/*
*******************************************************
				footer
*******************************************************
*/
.footer{width: 100%; }
.cont-footer{width: 100%; max-width: 1100px; margin: 0 auto;}
.cont-footer ul li{display: inline-block; padding: 40px 20px 40px 0;}
.cont-footer ul li a{color: #656565; font-weight: lighter; font-size: 14px; text-decoration: none;}
.cont-footer ul li a:hover{text-decoration: underline;}
.cont-footer p{padding: 40px 20px 40px 0;color: #4d4d4d;font-size: 14px;line-height: 20px;}

@media screen and (max-width: 650px){
	.footer{width: 100%; }
	.cont-footer{width: 90%; max-width: 1100px; padding-bottom: 0px; margin: 0 auto;}
	.cont-footer ul li{display: block; padding: 10px 0px 10px 0;}
	.cont-footer ul li a{color: #656565; font-weight: lighter; font-size: 14px; text-decoration: none;}
	.cont-footer ul li a:hover{text-decoration: underline;}
    .cont-footer p{padding: 15px 0;}
}


/*
*******************************************************
				all button and href
*******************************************************
*/
.btn-register, a.btn-register, button.btn-register{ cursor: pointer; border: none; display: inline-block; padding: 15px 25px; font-size: 20px; text-align: center; color: #ffffff; text-decoration: none; background-color: #0a2f58;}
.btn-register:hover, a.btn-register:hover{background-color: #064387;}

.btn-Download, a.btn-Download, button.btn-Download{ cursor: pointer; border: none; display: inline-block; font-weight: bold; padding: 15px 15px; font-size: 16px; text-align: center; color: #ffffff; text-decoration: none; background-color: #0a2f58;}
.btn-Download:hover, a.btn-Download:hover{background-color: #064387;}

@media screen and (max-width: 650px){
	.btn-register, a.btn-register{ width: 80%; cursor: pointer; display: block; margin: 0 auto; padding: 15px 20px; font-size: 18px; text-align: center; color: #ffffff; text-decoration: none; background-color: #0a2f58;}
	.btn-register:hover, a.btn-register:hover{background-color: #064387;}
}

/*
*******************************************************
				modal
*******************************************************
*/

.bg-modal{width: 100%; height: 100%; background-color: rgba(0,0,0,0.9); position: fixed; top: 0; left: 0; z-index: 99999;}
.box-modal{width: 100%; margin-top: 20%; background-color: #ffffff; border-radius: 10px;}
.cont-modal{padding: 30px; position: relative; box-sizing: border-box;}
.cont-modal p{text-align: justify; font-size: 16px; line-height: 20px;}
.close-modal{position: absolute; top: -20px; right: -20px; cursor: pointer;}

@media screen and (max-width: 640px){
body{overflow-y:scroll;}
.bg-modal{width: 100%; height: auto; background-color: rgba(0,0,0,0.9); position: fixed; top: 0; left: 0; z-index: 99999;}
.box-modal{width: 100%; margin-top: 0%; overflow-y:scroll!important;  background-color: #ffffff; border-radius: 10px;}
.cont-modal{padding: 40px 15px; position: relative; box-sizing: border-box;}
.cont-modal p{text-align: justify; font-size: 12px; line-height: 16px;}
.close-modal{position: absolute; top: 0px; right: 0px; cursor: pointer;}
}
/*
*******************************************************
				about us and contact us
*******************************************************
*/
.Content-article-about{width: 100%; margin-top: 0px;}
.title-article-about {width: 80%; margin: 0 auto;}
.title-article-about h1{font-size: 40px; font-weight: bold; padding: 0 0 0px;}
.title-article-about p{font-size: 16px; line-height: 19px; text-align: justify;}
.title-article-about p a{color: #4d4d4d; text-decoration: underline;}

/*
*******************************************************
				privacy policy
*******************************************************
*/
.Content-article-policy{width: 100%;}
.title-article-policy {width: 80%; margin: 0 auto;}
.title-article-policy h1{font-size: 40px; font-weight: bold; padding: 0 0 20px;}
.title-article-policy h4{font-size: 20px; font-weight: bold; padding: 20px 0 20px;}
.title-article-policy p{font-size: 16px; padding-bottom: 15px; line-height: 22px; text-align: justify;}
.title-article-policy p a{color: #4d4d4d; text-decoration: underline;}
.title-article-policy ul{padding: 0 0 15px 20px; margin: 0;}
/*
*******************************************************
				disclaimer
*******************************************************
*/
.disclaimer{width: 100%}
.disc-cont{width: 100%;}
.disc-cont p{text-align: justify; font-size: 14px; line-height: 17px; padding: 20px 0 60px;}

@media screen and (max-width: 640px){
	.disc-cont{width: 90%!important; margin: 0 auto;}
}
/*
*******************************************************
				style general
*******************************************************
*/
.line{width: 100%; height: 2px; background-color: #bababa; margin: 15px 0; }
.line-footer{width: 100%; height: 1px; background-color: #bababa; margin: 25px 0; }
.line-section{width: 100%; height: 1px; background-color: #bababa; margin: 20px 0; }
.msg-error{font-size: 12px; padding: 0px 0 10px; color: #ff0000;}
.error{color: #ff0000; padding: 0; margin: 0;}


strong,.bold{font-weight: bold;}
em, i{font-style: italic;}
.img-left{float: left; padding: 0px 20px 0px 0px;}
.clear{clear: both;}

@media screen and (max-width: 650px){
	.img-left{float: none; padding: 0px 0px 20px 0px;}
}

.gsweb-pp,.gsweb-pp>a{ padding-top: 10px; font-size: 13px; line-height: 16px; color: #fff; }
.gsweb-btn{display: block!important;width: 100%!important}