/* *******************************************************
J  a  v  a  c  a  t  z
Project:    Asia Global Fellow
Filename:   devices.css
Purpose:    This file is created to hold CSS styles of
            the project for any device.
            Please do not put other styles in this file.
******************************************************* */
/*1200++*/
@media only screen and (max-width: 1300px){
	.container {
		width:1150px;
	}
	.content{
		width:928px;
	}
	.news-post li {
		width:339px;
	}
	.inner-banner:after{
		height:650px;
	}
	.subpage-banner{
		height:200px;
	}
	.fellow-details .fd-right,
	.leader-details .fd-right{
		width:700px;
	}
	.fellow-list ul li .photo-id .name{
		width:160px;
	}
	.news-list {
		margin-left:-20px;
	}
	.news-list .item/*-parent*/{
		margin-left: 20px;
	}

	.album-item{
		margin-right:18px;
	}

}


/*1024+*/
@media only screen and (max-width: 1200px){
    h3 {
        font-size: 18px;
	}
	#sidebar{
		width: 225px;
	}
	.content{
		width:700px;
	}
	.agf-wrapper .agf-pager, .container, .container02 {
		width:960px;
	}
	.container02, .news-post .container, .news-carousel .container{
		padding-left:20px;
		padding-right:20px;
	}
	.after-slider .container{
		padding-left:20px;
	}
	.news-post li {
		width:293px;
	}
	.nav > ul > li{
		padding:0px 20px;
	}
	.news-post li > a, .news-carousel .owl-item .item > a{
		height:190px;
		line-height:190px;
	}
	.who-are-we{
		padding:40px 0 20px 0;
	}	
	.who-are-we ul{
		margin:0 0px;
	} 
	.who-are-we ul li {
		margin-bottom: 17px;
		margin-top: 17px;
	}
	.who-are-we ul li h4{
		font-size:20px;
	}

	.inner-banner:after{
		height:550px;
	}
	.video-box > div iframe{
		height:175px;
	}
	
	.video-box .youtube-embed-wrapper{
		height:175px !important;
	}
	.video-box:nth-of-type(even) > div:last-child,
	.video-box:nth-of-type(odd) > div:last-child{
		padding-top:0;
		padding-bottom:0;
	}
	
	.fellow-details .fd-right,
	.leader-details .fd-right{
		width:490px;
	}
	.fellow-list ul li .photo-id, .leader-list ul li .photo-text .name{
		font-size: 18px;
	}
	.fellow-list ul li .photo-id .photo-img{
		margin-bottom:20px;
	}
	.fellow-list ul li .photo-id .photo-img,
	.fellow-list ul li .photo-id .name{
		width:auto;
		display:block;
	}
	.fellow-list ul li .photo-text{
		margin-top: 10px;
	}

	.agf-wrapper .agf-pager.agf-default-pager a:hover{
		background:transparent;
		border-color:#d3d3d3;
	}
	
	.news-list .item/*-parent*/{
		width:47%;
		margin-left:3%;
	}
	.news-list {
		margin-left:-3%;
	}
	.float_right_img{
		width: 48%;
	}

	.albums-list .item > a{
		height: 125px;
		line-height: 125px;
	}
	.album-items{
		margin-right: -16px;
	}
	.album-item {
		margin-right: 16px;
		width:160px;
	}
	.album-item:nth-child(4n){
		margin-right: 0px;
	}
	.album-item:nth-child(5n){
		margin-right: 16px;
	}
}

@media only screen and (min-width: 1024px) and (max-width:1200px){
	.leader-list ul li .photo-text,
	.leader-list ul li .photo-id .photo-img{
		width:auto;
		display:block;
	}
}

/*768+*/
@media only screen and (max-width: 1023px){
	p, td {
		line-height: 1.5em;
	}
	body.type02a .inner-banner,
	body.type02a .inner-banner .page-header .container02 {
		height: 150px;
		min-height: 150px;
	}
	#header{
		padding:10px 0;
	}
	.top-left{
		margin-top:3px;
	}
	#logo{
		margin-top:0;
		width:120px;
	}
	.container, .container02, .agf-wrapper .agf-pager {
		width: auto;
		padding: 0 20px;
	}
	.agf-wrapper .agf-pager{
		display:table;
		margin:20px auto 0;
	}
	.bottom-header, .logo02{
		display:none;
	}
	.search-section .searchbox{
		display:none;
	}
	.search-section{
		width:auto;
		border:0;
	}
	.search-section{
		margin-right:6px;
	}
	.banner-img > .container{
		padding:0;
	}
	.agfslider li, .fallback-img{
		background-position:center center;
		background-size:auto 100%;
	}
	
	.banner-text{
		/*padding-bottom:70px;*/
		text-align:center;
	}
	.banner-text h2{
		margin-bottom:0px;
		font-size:32px;
	} 
	.banner-text p{
		padding-top:5px;
		margin-bottom:10px;
		font-size:16px;
		margin-bottom:0;
		line-height:normal;
	} 
	
	.app-button{
		display:none;
		bottom:20px;
		top:auto;
	}
	.app-button .btn{
		    float: none;
    margin: 0 auto;
    display: table;
    border-radius: 0px;
    font-size: 14px;
	}
	.inner-banner .app-button{
		display:none;
	}
	.after-slider {
		font-size:16px;
	}
	.after-slider .container{
		padding-right:150px;
	}
	.news-post li{
		width:auto;
		float:none;
		margin:0;
		position:relative;
		margin-bottom:20px;
	}
	.news-post li > a{
		height:auto;
		line-height:normal;
		width:27%;
		float:left;
	}
	.news-post li:after{
		clear:both;
		content:'';
		display:block;
	}
	.news-post li h3{
		margin-top:0;
	}
	.news-post li > .npTxt{
		float:right;
		width:70%;
		display:block;
	}
	
	.owl-carousel{
		padding:0 40px;
	}
	.owl-nav .owl-prev{
		left:0;
	}
	.owl-nav .owl-next{
		right:0;
	}
	.who-are-we{
		background-size:cover;
	}
	.who-are-we ul li{
		display:inline-block;
		vertical-align:top;
		float:none;
		width:50%;
		margin-left:-4px;
	}
	#footer-logo2 .mobile-logo{
		display:inline-block;
		float:left;
		margin-top:10px;
		margin-right:20px;
	}
	.mobile-menu-list #logo{
		width:120px;
	}
	.mobile-menu-list .close-btn, .fixed-search .close-btn{
		width:18px;
	}
	.news-post{
		padding-top:36px;
	}
	.fellow-news, .highlights{
		padding-top:40px;
	}
	body{
		padding-top:54px;
	}
	#header{
		border-bottom:1px solid #ccc;
		z-index:999;
		position:fixed;
		top:0;
		width:100%;
	}
	.banner-img .app-button{
		display:none;
	}
	.after-slider{
		padding-bottom:30px;
	}
	.after-slider .app-button{
		display:block;
		position:static;
		
	}
	
	
	
	#sidebar,
	.content{
		margin:0;
		width:auto;
		float:none;
	}
	#sidebar{
		margin-bottom:50px;
		margin-top:20px;
		margin-left:-20px;
		margin-right:-20px;
	}	
	#inner-main-menu ul li{
		padding:12px 20px 12px 20px;
	}
	
	#inner-main-menu .subnav > .inner-nav {
		display: none;
		margin-left: -10px;
		margin-right: -20px;
	}
	#inner-main-menu > ul{
		border-top-width:1px;
	}
	.inner-banner .container{
		padding:0;
	}
	.banner-text{
		padding-bottom:30px;
	}
	.subpage-banner {
		height: auto;
	}
	
	.inner-banner{
		min-height:auto;
	}
	.subpage-banner img{
		width:100%;
		height:auto;
		display:block;
	}
	.subpage-banner{
		background-position:top center;
		background-size:100% auto;
		background:none;
	}
	.inner-banner:after{
		height:700px;
		background-position: center left 60px;
		background-size: 1200px 100%;
	}
	#inner-main-menu ul > li.active > a + .arrow,
	#inner-main-menu > ul > li > a + .arrow{
		background-position: center right 20px;
	}
	#inner-main-menu > ul > li > a + .arrow{
		background-position: center right 20px;
	}
	
	.inner-banner .container02 h1{
		padding:0;
	}
	.inner-banner .page-header .container02{
		width:100%;
	}
	.fellow-details .fd-right,
	.leader-details .fd-right{
		width:70%;
		float:left;
	}
	.reachout-layer{
		width:90%;
		margin-left:-45%;
	}
	.formSet.col-2{
		display:block !important;
		width:auto;
	}
	textarea.tall{
		height:6em;
	}
	.reachout-layer h2{
		font-size:20px;
	}
	.reachout-layer .close-btn{
		height:18px;
		width:18px;
	}
	.reachout-layer{
		padding:25px 25px 10px;
	}
	.reachout-layer .close-btn{
		top:25px;
		right:25px;
	}
	.table-format .formSet.btns{
		padding-top:20px;
	}
	.formReach .table-format{
		margin-bottom:10px;
	}
	.table-format .formSet.btns .btn{
		font-size:18px;
	}
	.formSet span.error, span.error{
		padding:5px 0 15px 0;
	}
	.error + .no-error .formSet{
		border-top: 1px solid #dddddd !important;
	}
	
	.mobile-menu-list{
		padding-top:20px;
	}
	.mobile-menu-list .logo-tab{
		padding-bottom:20px;
	}


	.program-list .item > a {
		width:41%;
	}
	.program-list .item > a img{
		/*width: 100%;*/
	}
	.program-list .item > .program-info{
		width: 55%;
		padding-top: 0;
	}

	.news-list .item .news-info a {
		font-size: 15px;
	}
	
	.album-items{
		margin-right: -14px;
	}
	.album-item {
		margin-right: 14px;
	}
	.album-item:nth-child(5n),
	.album-item:nth-child(4n) {
		margin-right: 14px;
	}
	.album-item {
		width: 168px;
	}

	.lb-nav a{
		width: 35px;
		height: 35px;
		background-size: 10px 16px;
	}
	.lightbox{
		padding-left: 40px;
		padding-right: 40px;
	}
	.lb-nav{
		height: 35px;
		margin-top: -17.5px;
	}
	.lb-dataContainer{
		
	}
	.leader-list ul li .photo-text{
		padding-top:0;
		width:224px;
	}
	
	
	.error-page.container.top-padding{
		padding:0px 0 20px;
	}
	.error-page.container {
		width: auto;
		padding: 0 20px;
	}
	.error-page.container2{
		width:auto;
		display:table;
		margin:0 auto;
	}
	.error-page .left-section .for-img{
		float:none;
		display:table;
		width:120px;
		margin:0 auto;
	}
	.error-page.container2.top-padding{
		padding:0px 0 20px;
	}
	.error-page .left-section, .error-page .right-section{
		display:block;
		float:none;
		margin:0;
		padding: 0 20px;
		width:auto;
		text-align:center;
	}
	.error-page .right-section{
		margin-top:25px;
	}
	.error-page .errorlogo{
		margin:50px auto 15px auto;
	}
	
	.error-page .left-section .errorlogo{
		display:block;
	}
	.error-page .right-section .errorlogo{
		display:none;
	}
	
	.error-page .errorlogo #logo{
		margin:0 auto;
	}
}

/*0 to 640 + */


@media only screen and (max-width: 767px){
	.lb-data .lb-title,
	.lb-data .lb-description{
		width: 100%;
		margin-bottom: 10px;
	}
	.lb-number{
		position: static;
		display: block !important;
	}
		/*For iphone issue zoom screen becuase font size less than 16px*/
	select, input.text, textarea.text{
		font-size: 16px;

	}
	select:focus,
	input.text:focus, 
	textarea.text:focus{
		font-size: 16px;
	  }
	#footer .social-media, .foot-left{
		float:none;
	}
	#footer .social-media ul{
		margin:0 0 15px -5px;
	}
	#footer .social-media li img{
		width:35px;
	}
	/*
	#footer .social-media li.last img {
		width: 38px;
	}*/
    .news-carousel .owl-item .item > a{
		height:150px;
		line-height:150px;
	}
	.video-box {
		margin:0 0 40px 0;
	}
	.video-box > div{
		float:none !important;
		width:auto !important;
		padding:0 !important;
	}
	
	.video-box > div iframe{
		height:230px;
		vertical-align:top;
		margin-bottom:20px;
	}
	.video-box .youtube-embed-wrapper{
		height:230px !important;
		vertical-align:top !important;
		margin-bottom:20px !important;
	}
	.fellow-details .fd-left,
	.fellow-details .fd-right,
	
	.leader-details .fd-left,
	.leader-details .fd-right{
		float:none;
		width:auto;
		margin:0;
		margin-bottom:20px;
	}
	.fellow-details .fd-left .fd-image,
	.leader-details .fd-left .fd-image{
		width:30%;
		float:left;
		margin-right:4%;
	}	
	.fellow-details .fd-left .fd-info,
	.leader-details .fd-left .fd-info{
		width:66%;
		float:right;
	}
	.fellow-list ul li{
		width:47.5%;
		margin-right:3%;
	}
	.fellow-list ul li:nth-child(3n+3){
		margin-right:2%;
	}
	.fellow-list ul li:nth-child(2n+2){
		margin-right:0%;
	}
	.fellow-list ul li .photo-id .name,
	.fellow-list ul li .photo-id .photo-img{
		display:block;
		width:auto;
		margin-bottom:20px;
	}
	.fellow-list ul li .photo-id .name{
		margin-bottom:0;
	}

	.leader-list ul li{
		width:46%;
		margin-right: 4%;
	}
	.leader-list ul li .photo-id,
	.leader-list ul li .photo-text{
		display: block;
		width: auto;
	}
	.leader-details .fd-right h3{
		display: none
	}
	.leader-details .fd-left h3{
		display: block;
	}
	.albums-list .item{
		width: 30.8%;
	}
	.albums-list .item:nth-child(4n){
		margin-right: 3%;
	}
	.albums-list .item:nth-child(3n){
		margin-right: 0%;
	}
	.albums-list + .more-btn{
		display: table;
	}

	.album-items{
		margin-right: -3%;
	}
	.album-item{
		width: 29.90%;
		margin-right: 3%;
	}
	
	.album-item:nth-child(4n),
	.album-item:nth-child(5n){		
		margin-right: 3%;
	}
	.album-item:nth-child(3n){
		margin-right: 0;
	}
	.lightbox1{
		margin: 0 auto;
		display: table;
	}
	.search-div2{
		padding-right: 100px;
		width: auto;
	}
	.search-div2 .btn{
		width: 100px;
		padding-left: 10px;
		font-size: 18px;
		padding-right: 10px;
	}
	.paging{
		display: table;
		margin: 0 auto;
	}
	.leader-list ul li .photo-text{
		padding-top:20px;
	}
	.leader-list ul li .photo-text,
	.leader-list ul li .photo-id .photo-img{
		width:auto;
		display:block;
	}
	
	.special-announcement{
		width:90%;
		margin-left:-45%;
	}
}

/*0 to 640 + */
@media only screen and (max-width: 639px){
    .news-carousel .owl-item .item > a{
		height:200px;
		line-height:200px;
	}
	/*#footer-logo2{
		width:70%;
	}*/
	#footer p{
		line-height:normal;
		font-size:14px;
	}
	#footer-logo2 {
		text-align:right;
		top:8px;
	}
	#footer-logo2 img{
		float:none;
		display:inline-block;
		margin-bottom:10px;
		/*width:170px*/
	}
	#footer-logo2 .mobile-logo{
		display:block;
		float:none;
		margin-right:0;
		margin-top:0px;
		margin-bottom:0px;
	}
	.who-are-we ul li img {
		width: 150px;
		height: 75px;
	}
	.who-are-we ul li h4{
		font-size:17px;
	}
	.news-post li h3, .news-carousel .owl-item h3{
		line-height:normal;
		font-size:20px;
	}
	.who-are-we h2, h2{
		font-size:26px;
	}
	.more-btn{
		padding:8px 20px;
		font-size:16px;
	}
	.after-slider .container{
		padding-right: 20px;
    background-size: contain;
    background-position: right 0;
	}
	/*
	.agf-wrapper .agf-viewport{
		min-height:400px;
	}*/
	.mobile-menu-list{
		width:300px;
	}
	.mobile-menu-list ul > li > a,
	.mobile-menu-list ul + .appLink .btn{
		font-size:18px;
	}
	.inner-banner .page-header .container02{
		width:100%;
	}	
	h1{
		font-size:30px;
	}
	.inner-banner .container02 {
		padding-right:20px;
		
	}

	.program-list .item > a {
		width:48%;
	}
	
	.program-list .item > .program-info{
		width: 48%;
	}
	.float_right_img,
	.float_left_txt{
		float:none;
		display: block;
		width: auto;
		text-align: left;
		margin: 0;
	}
	.float_right_img{
		margin-bottom: 20px;
	}
	iframe{
		width: 100%;
	}


	.albums-list .item{
		width: 47.8%;
	}
	
	.albums-list .item:nth-child(3n){
		margin-right: 3%;
	}
	.albums-list .item:nth-child(2n){
		margin-right: 0%;
	}
	.albums-list .item > a {
		height: 155px;
		line-height: 155px;
	}


	.sitemap .col-main{
		width: auto;
		float:none;
	}
}
@media only screen and (max-width: 590px){
	
	
	h1{
		font-size:26px;
	}
	.album-items{
		margin-right: -3%;
	}
	.album-item{
		width: 46.5%;
		margin-right: 3%;
	}
	.album-item:nth-child(3n),
	.album-item:nth-child(5n),
	.album-item:nth-child(4n){
		margin-right: 3%;
	}
	.album-item:nth-child(2n){
		margin-right: 0%;
	}
	.lightbox1 > .thumb-img{
		width: 236px;
		height: auto;
	}
	.lightbox1 > .thumb-img img{
		max-height: 157px;
	}
}
@media only screen and (max-width: 510px){
	
	
}
@media only screen and (max-width: 479px){
	.banner-text h2 {
		font-size:24px;
	}
	
	.news-post li > a{
		width:35%;
	}
	.news-post li > .npTxt{
		width:60%;
	}
	#footer-logo2{
		width:60%;
	}
	
	.owl-nav .owl-prev, .owl-nav .owl-next{
		width:15px;
		height:30px;
	}
	.owl-nav .owl-prev{
		margin-left:-10px;
	}
	.owl-nav .owl-next{
		margin-right:-10px;
	}
	.owl-carousel{
		padding:0 5px;
	}
	.lightbox1 > .thumb-img{
		width:223px;
		height: auto;
	}
	.lightbox1 > .thumb-img img {
		max-height: 150px;
	}
}
@media only screen and (max-width: 450px){
	
	.video-box > div iframe{
		height:210px;
	}
	
	.video-box .youtube-embed-wrapper{
		height:210px !important;	
	}
	
	.albums-list .item > a {
		height: 130px;
		line-height: 130px;
	}
	.albums-list .item h4{
		font-size: 15px;
		margin-top:0;
	}
	
	.lightbox1 > .thumb-img {
		width: 193px;
		/*height: 130px;*/
	}
	.lightbox1 > .thumb-img img {
		max-height: 130px;
	}
}
@media only screen and (max-width: 400px){
	/*.news-post li > a{
		width:120px;
	}*/
	.news-post li h3, .news-carousel .owl-item h3{
		font-size:18px;
	}
	h2, .who-are-we h2{
		font-size:21px;
	}
	.who-are-we ul li h4{
		font-size:15px;
	}
	.who-are-we ul li img {
		width: 110px;
		height: 75px;
	}
	#footer .footer-menu li, #footer p{
		font-size:13px;
	}
	#footer .footer-menu li{
		list-style:none;
		margin:0;
		line-height:12px;
		margin-bottom:5px;
		margin-right:5px;
		padding-left:5px;
		border-left:1px solid #666;
	}
	#footer .footer-menu li.first{
		border-left:0;
		padding-left:0;

	}
	.mobile-menu-list, .fixed-search{
		width:290px;
	}
	.fixedSearch .searchbutton{
		width:45px;
	}
	.search-section .fixedSearch .searchbox{
		padding-right:50px;
	}
	.banner-text h2 {
		font-size: 20px;
	}
	.banner-text p{
		font-size:14px;
		line-height:normal;
		/*margin-bottom:5px;*/
	}
	
	h1{
		font-size:25px;
	}
	
	.video-box > div iframe{
		height:190px;
	}
	
	.video-box .youtube-embed-wrapper{
		height:190px !important;
	}
	.program-list .item{
		padding-bottom: 10px;
	}
	.program-list .item > a {
		margin-bottom: 20px;
	}
	.program-list .item > a ,
	.program-list .item > .program-info{
		width:auto;
		float:none;

	}
	.albums-list .item > a{
		height: 123px;
		line-height: 123px;
	}
	
	.lightbox1 > .thumb-img {
		width: 164px;
		height: auto;
	}
	.lightbox1 > .thumb-img img {
		max-height: 110px;
	}

}
@media only screen and (max-width: 360px){
	#footer-logo img{
		width:100px;
	}/*
	#footer-logo2 .mobile-logo{
		min-width:160px;
	}	*/
	.banner-text .container02{
		padding:0 10px;
	}
	.banner-text h2 {
		font-size: 19px;
	}
	
	h1{
		font-size:22px;
	}
	
	
	.video-box > div iframe{
		height:170px;
	}
	
	.video-box .youtube-embed-wrapper{
		height:170px !important;
	}
	
	
	.news-list .item .news-info a{
		font-size:16px;
	}
	.news-list .item .news-info{
		padding:5px;
	}
	
	.news-list .item/*-parent*/{
		width:46%;
		margin-left:4%;
	}
	.news-list {
		margin-left:-4%;
	}
	/*
	.news-list .item-parent{
		width:100%;
		float:none;
		margin-left:0%;
	}
	.news-list {
		margin-left:0%;
	}*/
	.albums-list .item > a {
		height: 100px;
		line-height: 100px;
	}

	
	.lightbox1 > .thumb-img {
		width: 148px;
		height: auto;
	}
	.lightbox1 > .thumb-img img {
		max-height: 100px;
	}
}