@charset "utf-8";
/* CSS Document */
@font-face {
    font-family:OpenSans-Regular;
    src: url(./font/Sansation_Regular.ttf);
}

@font-face {
    font-family:Sansation_Bold;
    src: url(./font/Sansation_Bold.ttf);
}

@font-face {
    font-family:OpenSans-Light;
    src: url(./font/OpenSans-Light.ttf);
}
p
{
	padding:0px;
	margin:0px;
}
body
{
	padding:0px;
	margin:0px;
	background:#dbe3e5;
	font-family:OpenSans-Regular;
}
.dialer_wrapperbg
{
	float:left;
	width:100%;
	margin-top:3%;
	height:auto
}
.dialer_wrapper
{
	margin:auto;
	width:825px;
	min-height:545px;
    background-color: #fff;
    border-radius: 10px;
}
.dialer_part1
{
	float:left;
	width:300px;
}
.dial_pad
{
	float:left;
	width:100%;
	background:url(images/dial_bg.png);
	min-height:200px;
    border-radius: 10px;	
}
.dial_logo
{
	width:209px;
	margin:auto;
    margin-top: 14px;
    margin-bottom: 10px;
}
.dial_text
{
	float:left;
    margin-left: 25px;
}
.no_title
{
	color:#fff;
	font-size:25px;
	font-family:Sansation_Bold;
}
.no_text
{
	font-size:14px;
	color:#fff;
	margin-left:2px;
}
.no_dial {
    border-top: 1px solid #343230;
    float: left;
    padding-top: 10px;
    width: 100%;
	padding-bottom: 12px;
}
.dial_close
{
	float:right;
	margin-right:20px;
    margin-top: 5px;
}
.dial_no
{
	float:left;
	width:100%;
}
.dial_no1
{
    float: left;
    text-align: center;
    width: 33%;
    border-top: 1px solid #343230;
    border-right: 1px solid #343230;
    height: 62px;
    padding-top: 11px;
}
.no1
{
	float:left;
	width:100%;
	font-size:25px;
	font-family:OpenSans-Light;
	color:#fff;
}
.no1_01
{
	float:left;
	width:100%;
	font-size:27px;
	font-family:OpenSans-Light;
	color:#fff;
    margin-top: 3px;
}
.alphabet
{
	font-size:11px;
	width:100%;
	float:left;
	font-family:OpenSans-Light;
	text-transform:uppercase;
	color:#fff;
    margin-top: -5px;
}
.dial_no2
{
    float: left;
    text-align: center;
    width: 33%;
    border-top: 1px solid #343230;
    border-right: 1px solid #343230;
    height: 52px;
    padding-top: 11px;
	
}
.dial_no3
{
    float: left;
    text-align: center;
    width: 33%;
    border-top: 1px solid #343230;
    border-right: 1px solid #343230;
    padding-bottom: 17px;
	background:url(images/on_tuch.png);
    padding-top: 11px;
	
}
.dial_no4
{
    float: left;
    text-align: center;
    width: 33%;
    border-top: 1px solid #343230;
    border-right: 1px solid #343230;
    padding-bottom: 17px;
	background:url(images/recent_bg.png);
    padding-top: 11px;
}
.call_dial
{
	background:#ce2336;
	float:left;
	width:100%;
    border-radius: 0px 0px 10px 10px;
}
.call_no {
    width: 43px;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 10px;
}
.dialer_part2 {
    float: left;
    width: 525px;
}
.dialer_name01
{
	width:100%;
	background:#f6f6f6;
    float: left;
    padding-top: 16px;
    padding-bottom: 16px;
}

.label_01
{
	float:left;
	font-size:17px;
	margin-left: 100px;
    width: 152px;
	color:#333333;
}
.name_01
{
	float:left;
	font-size:15px;
	color:#333333;
}
.dialer_name02
{
	width:100%;
	background:#fff;
    float: left;
    padding-top: 16px;
    padding-bottom: 16px;
}
p.client_mail	
{
	color:#ce2336;
	margin:0px;
	padding:0px;
}
p.client_no
{
	color:#6b6b6b;
    font-family:Sansation_Bold;
}
p.night
{
	color:#333333;
    font-family:Sansation_Bold;
}
.submit_dialer {
    width: 195px;
    margin: auto;
}
input.sb_bt_dial
{
	margin-top:25px;
	float:left;
	font-size:14px;
	background:#a8a8a8;
	color:#fff;
    font-family:Sansation_Bold;
	text-transform:uppercase;
	width:195px;
    height: 45px;
    border: none;
    border-radius: 70px;
}
.open_acco
{
	width:250px;
	float:left;
	height:auto;
    position: absolute;
    margin-top: 16%;
    margin-left: -5.7%;	
}
.main_acco {
    float: left;
    transform: rotate(90deg);
	-ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
    background: #22b9ce;
    border-radius: 7px 7px 0px 0px;
}
.acco_text
{
    font-size: 20px;
    float: left;
    color: #fff;
    font-family: Sansation_Bold;
    padding: 11px 19px 11px 6px;
    margin-left: -1px;
}
.aerrow {
    float: left;
	padding: 15px 14px;
    transform: rotate(-90deg);
}

/**********************************Responsive*******************************/
@media only screen and (max-width: 850px){
	.dialer_wrapper
	{
		width:100%;
		background-color: transparent;
	}
	.dialer_part1 {
		float: none;
		width: 300px;
		margin: auto;
	}
	.open_acco
	{
		display:none;
	}
	.call_dial
	{
		margin-bottom:25px
	}
	.dialer_part2 {
		float: none;
		width: 525px;
		margin: auto;
	}
	input.sb_bt_dial
	{
		margin-bottom:25px;
	}
}
@media only screen and (max-width: 550px){
	.dialer_part2 {
		float: left;
		width: 100%;
	}
	.label_01
	{
		margin-left:14%;
	}

}
@media only screen and (max-width: 425px){
	.label_01 {
		margin-left: 0px;
		width: 100%;
		text-align: center;
	}
	.name_01 {
		width: 100%;
		text-align: center;
		margin-top: 11px;
	}
}
@media only screen and (max-width: 321px){
	.dialer_part1 {
		float: left;
		width: 100%;
		margin: auto;
	}
}