@charset "utf-8";
/* CSS Document */

*{
	padding:0;
	margin:0;
}

.bg{
	background-image:url(../images/background1.png);
    height:100%;
    width:100%;
    background-position:center;
    background-repeat:no-repeat;
    background-size:cover;
    position:absolute;
}

.header {
    width: 100%;
    display: inline-block;
}

.logo{
	display: inline-block;
    float: left;
    width: 105px;
    padding-top: 20px;
    padding-left: 20px;
    padding-bottom: 20px;
}

.summit{
	display: inline-block;
    float: left;
    width: 500px;
    padding-left: 20px;
    padding-bottom: 20px;
}

.summit img{
	width:100%
}

.live{
	color:#7dba31;
	font-size:30px;
	font-weight:bold;
	letter-spacing:2px;
}

#clockdiv{
	font-family: sans-serif;
	color: #fff;
	display: inline-block;
	font-weight: 100;
	text-align: left;
	font-size: 10px;
	width:40%;
	margin:0 -10px;
}

#clockdiv > div{
	padding: 10px;
	border-radius: 3px;
	display: inline-block;
	width: 25%;
    float: left;
	text-align:center;
}

#clockdiv div > span{
	padding: 10px 8px;
	border-radius: 3px;
	font-family: Arial, helvetica, "sans-serif";
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#2f4b8a+-1,2fb3cc+50,2f4b8a+100 */
background: #2f4b8a; /* Old browsers */
background: -moz-linear-gradient(top,  #2f4b8a -1%, #2fb3cc 50%, #2f4b8a 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #2f4b8a -1%,#2fb3cc 50%,#2f4b8a 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #2f4b8a -1%,#2fb3cc 50%,#2f4b8a 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2f4b8a', endColorstr='#2f4b8a',GradientType=0 ); /* IE6-9 */

	display: inline-block;
	width:100%;
    font-weight: bold;
    font-size:40px;
}
.smalltext{
    color: #000000;
    padding-top: 10px;
    font-size: 15px;
}

.sp-box {
    width: 100%;
    display: inline-block;
    position: relative;
}

.sp-box .present {
    padding: 0px 0px 0px 0px;
    width: 100%;
    position: absolute;
    top: 38%;
}


.counter-Speaker-box {
	margin:0 auto;
    width: 41%;
}

.counterSpeaker {
    color: #000000;
}

.counterbox-detail{
    font-size: 14px;
}

.bia-logo {
    /*position: absolute;*/
    width: 250px;
    height: 250px;
    display: inline-block;
	float: right;
	/*margin-left:70%;*/
	margin-top: 20px;
	
}



@media screen and (max-width: 768px){
    
    .bg{
        background: center;
    }

    .summit{
        width: 80%;
        padding-left: 20px;

    }

    .live{
        padding-top: 30px;
        font-size: 50px;
        padding-left: -12px;
        /* text-align: center; */
        /*margin-right: 256px;*/
    }

    #clockdiv{
        width: 61%;
        /*margin-right: 231px;*/
    }

    .counter-Speaker-box{
        padding-top: 10px;
        width: 100%;
        /*padding-left: 25px;*/
    }

    .counterbox-detail{
        width: 100%;
    /* padding-left: 25px; */
    font-size: 22px;
    }

    .counterbox-detail h6{
        width: 58%;
    /*margin-left: 39px;*/
    /* padding-left: 25px; */
    font-size: 25px;
}


.sp-box{
    padding-top: 20px;
}
    /*.bia-logo{
        margin-top: 450px;
    }*/

} 

@media screen and (max-width: 600px){
    .bg{
        background: none;
    }

    .summit{
        /*width: 115%;*/
        /*padding-left: 20px;*/

    }

    .live{
        padding-top: 30px;
        font-size: 30px;
       /* padding-left:20px;*/
    }

    #clockdiv{
        width: 100%;
        /*margin-left: 5px;*/
        
    }

    .counter-Speaker-box{
        padding-top: 10px;
        /*margin-left: -40px;*/
    }

    .counterbox-detail{
        padding-top: 10px;
        /*margin-left: -5px;*/
    }

    .counterbox-detail p{
        padding-top: 5px;
        /*margin-left: -59px;*/
        font-size: 18px;
    }

    /*.bia-logo{
        margin-top: 630px;
    }

    .bia-logo img{
       width: 50%;
    }*/
} 


@media screen and (max-width: 412px){
    .bg{
        background: none;
    }

    .summit{
        /*width: 115%;*/
        /*padding-left: 20px;*/

    }

    .live{
        padding-top: 30px;
        font-size: 27px;
        /*padding-left: 10px;*/
}

    #clockdiv{
        width: 100%;
        
    }

    .counter-Speaker-box{
        padding-top: 10px;
        /*margin-left: -40px;*/
    }

    .counterbox-detail{
        padding-top: 10px;
        /*margin-left: -5px;*/
    }

    .counterbox-detail h6{
        padding-top: 10px;
        text-align: center;
        width: 100%;
    }

    .counterbox-detail p{
        padding-top: 5px;
        /*margin-left: -59px;*/
        font-size: 18px;
    }

    /*.bia-logo{
        margin-top: 630px;
    }

    .bia-logo img{
       width: 50%;
    }*/
} 

@media screen and (max-width: 360px){
    .bg{
        background: none;
    }

    /*.summit{
        width: 100%;
        padding-left: 20px;
    }*/

    .live{
        padding-left: 10px;
        padding-top: 20px;
        font-size: 25px;
    }

    #clockdiv{
        width: 100%;
        margin-left: -5px;
        
    }

    .counter-Speaker-box{
        padding-top: 10px;
        /*margin-left: -40px;
    }

    .counterbox-detail{
        padding-top: 10px;
        /*margin-left: -5px;*/
    }

    .counterbox-detail p{
        padding-top: 5px;
        /*margin-left: -59px;*/
        font-size: 18px;
    }

    .smalltext{
        color: #000000;
        padding-top: 10px;
        font-size: 10px;
    }

    /*.bia-logo img{
        margin-top: 750px;
    }*/

    .bia-logo{
        position: relative;
    }

    .bia-logo img{
        position: absolute;
    }
} 

@media screen and (max-width: 320px){
    .bg{
        background: none;
    }

    .summit{
        width: 100%;
        /*padding-left: 20px;*/

    }

    .live{
        padding-left: 2px;
        padding-top: 20px;
        font-size: 20px;
}
    

    #clockdiv{
        width: 120%;
        /*margin-left: -7px;*/
        
    }

    .counter-Speaker-box{
        padding-top: 10px;
    }

    /*.bia-logo{
        margin-top: 630px;
    }*/

  
}