@media(max-width:400px){
.topnav{
background-color:#ED008C;
color:#FFFFFF;
}
.topnav .container ul {
    list-style: none;
    color: rgb(218, 201, 201);
    margin: 0;
    margin: 0;
    padding: 5px;
	/*color: #fff;*/
	/*width:50%;*/

}
.topnav .container ul > li {
    float: left;
    /*line-height: 10px;*/
	margin-right: 10px;
}
.topnav .container ul > li a{
color:#FFFFFF;
}

.topnav .container ul > li a i {
    border-radius: 10px;
    font-size: 12px;
    margin-top: -5px;
    width: 30px;
    height: 30px;
    color: #fff;
	text-align: center;
}
.content-activity h1 {
    color: #eb008b;
    font-size: 2.8em !important;
    padding: 0 15px;
	font-weight: 600;
}
.navbar-default .navbar-toggle {
    border-color: #eb008b;
}
.navbar-toggle {
    position: relative;
    float: right;
    padding: 9px 10px;
    margin-top: 8px;
    margin-right: 15px;
    margin-bottom: 8px;
    background-color: #eb008b!important;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff!important;
}
}
@media(min-width:400px) { /*ถ้าหน้าจอใหญ่กว่า 400px หน้าจอใหญ่*/
.container {
	/*width: 100%;*/
    margin-left: auto;
    margin-right: auto;
	/*height: 100px;*/
	}
.topnav {
    top: 0;
    left: 0;
    /*height: 30px;*/
/*    background: #09612E;  */ 

 
	
   /* position: fixed;*/
    width: 100%;
    padding-top: 4px;
    /*z-index: 9999;*/
    /*border-bottom: 1px solid #ED008C;
		*/
    background-color: #0056b3;
    border-bottom: 1px solid #0056b3;
	/*background-color: #2e3537;
    border-bottom: 1px solid #252a2c;
    */
    color: #fff;
	/*font-size: 12px;*/
    color: #777;
    font-weight: 300;
	
}


.topnav .container ul {
    list-style: none;
    color: rgb(218, 201, 201);
    margin: 0;
    margin: 0;
    padding: 5px;
	color: #fff;
	/*width:100%;*/

}
.topnav .container ul > li {
    float: left;
    /*line-height: 10px;*/
	margin-right: 10px;
}
.topnav .container ul > li a i {
    border-radius: 10px;
    font-size: 18px;
    margin-top: 3px;
    width: 20px;
    height: 20px;
    color: #fff;
	text-align: center;
    padding: 0 4px 0 4px;
}
.topnav .container .pull-right a {
    font-size: 20px;
    margin-top: -10px;
    width: 30px;
    height: 30px;
    color: #fff;
}
.navbar-form .input-group {
    margin-top: -18px;
	width: 100px;
}
.row_slede {
    margin-right: -15px;
    margin-left: -15px;
}
/*****************youtube*********************************/
.video-container {
 position: relative;
 padding-bottom: 50%;
 padding-top: 30px; 
height: 0; 
overflow: hidden;
 }
 .video-container iframe,
 .video-container object,
 .video-container embed {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 }
/**************************************************/
/**************************************************/
.center-block {
    display: block;
    margin-right: auto;
    margin-left: auto;
	margin: auto;
    width: 70%;
    padding: 20px;
}
.center-block ul {
    list-style: none;
    /*color: rgb(218, 201, 201);*/
    margin: 0;
    margin: 0;
    /*padding: 5px;*/
}

.center-block ul > li {
    float: left;
	margin-left: 15px;
    margin-right: 15px;
	/*	    width: 60%;

width : 12.5%;*/
}
.center-block ul > li a i {
    list-style: none;
    /*color: rgb(218, 201, 201);*/
    margin: 0;
    margin: 0;
    padding: 5px;
}


.center {
		/*margin-top:50px;*/

    margin: 60px 10px 10px 40%;
    width: 60%;
    padding: 10px;
	
	
}
.center ul > li {
    float: left;
}

.topnav2{
	margin-top:50px;
	margin-left: auto;
	margin-right: auto;
	height:100px;
}
.topnav2 .container {
    /*color: rgb(218, 201, 201);*/
    margin-left: auto;
	margin-right:auto;
    padding: 5px;
	
}

.topnav2 .container ul {
    list-style: none;
    /*color: rgb(218, 201, 201);*/
    margin: 0;
    margin: 0;
    padding: 5px;
}
.topnav2 .container ul > li {
    float: left;
	width:12.5%;
    line-height: 10px;
}
.topnav2 .container ul > li a i {
    font-size: 18px;
    margin-top: -10px;
    width: 30px;
    height: 30px;
    color: #FFF;
}
/**************************************************/




.navbar-default .navbar-toggle {
    border-color: #eb008b;
}
.navbar-toggle {
    position: relative;
    float: right;
    padding: 9px 10px;
    margin-top: 8px;
    margin-right: 15px;
    margin-bottom: 8px;
    background-color: #eb008b!important;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff!important;
}

            .navbar-default {
                /* background-color: #f8f8f8;*/
                border-color: #FFFFFF;
            }
			.navbar-nav {
   			 margin: 7.5px -15px;
			/* color:#999999;
			 z-index:2000001;
			 */
			}
			.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    		border-color: #FFF;
			}
			.nav>li a{
			color:#777 !important;
			z-index:10000000;
			padding:10px;
			
			}
			.nav>li a:hover{
			color: #de45a0 !important;
			background-color: #f5f5f5 !important;
			border-radius: 5px;	
			}


}


@media(min-width:768px) { /*ถ้าหน้าจอใหญ่กว่า 768 หน้าจอใหญ่*/
/*.container {
    width: 1170px;
    margin-left: auto;
    margin-right: auto;
	
	}*/
/*****************youtube*********************************/
/*.video-container {
 position: relative;
 padding-bottom: 50%;
 padding-top: 30px; 
height: 0; 
overflow: hidden;
 width:100%;
 }
 .video-container iframe,
 .video-container object,
 .video-container embed {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 }
*/ /***********************************************************/
navbar {
    margin-bottom: -80px;
    overflow: visible;
}

 .navbar-nav>li>a {
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 20px;
}
 .navbar-default .navbar-nav>li>a {
 color: #000;
 }
 .navbar-default .navbar-nav>li>a:hover{
 	color: #CA2042;
    
 }
 .navbar-default .navbar-nav>.active>a:hover{
 color: #CA2042;
    font-weight: bold;
 }

.nav>li>a {
    position: relative;
    display: block;
    padding: 7px 7px;
}
.col-md-12 .center-block {
width: 80%;
height: 100px;
}
.container_slider{
    width: 1170px;
    margin-left: auto;
    margin-right: auto;
	height: 90px;
margin-bottom : 15px;
}
.container_slider .row_slide{
    width: 1170px;
    margin-left: auto;
    margin-right: auto;
	height: 90px;

}
.row_slide .col-md-6{
	margin-left: -15px;
	margin-right: -15px;
	background-color:#CA2042;
	
}
#bg_banner{background: #999999}

#wrapper {
    /*float: left;*/
	padding:10px;
    width: 100%; 
	/*background: #CA2042;*/
}
#wrap{ 
    position: relative;
    /*width: 1170px; */
	margin-left: auto;
    margin-right: auto
}
#wrapper_footer {
    float: left;
    width: 100%; 
	background: #21272D;
}
#wrap_footer{ 
    position: relative;
    width: 1170px; 
	margin-left: auto;
    margin-right: auto
}

/**************************************************/

}