body{
    padding:0;
    margin:0;
    text-align:center;
    overflow:hidden;
    color:#fff;
    font-family: "Comic Sans MS", cursive; 
}
body,
label,
input,
textarea{
    background:#ffffff;
}
.header{
    height:100px;
}
.header,
.alertms,
.formhead,
.tabs,
textarea{
    width:100%;
}
.logtab,
.tabs,
.log,
.reg,
.mes,
.inf,
.content{
    background:rgb(10, 94, 150);
}
.buttonsub,
.tabs{
    background:rgb(240, 90, 40);
}
.inf span,
.alertms{
    color:#E85664;
}
.tabs{
    height:60px;
    overflow:hidden;
}
.tabs div{
    width:100px;
    height:60px;
    cursor:pointer;
    font:20px/60px arial;
}
.log,
.reg,
.mes,
.inf,
.content{
    max-width:400px;
    min-height:200px;
    box-sizing:border-box;
}
.content,
.formhead,
form,
.alertms,
.about1,
.about2,
.map{
    margin:auto;
}
.reg,
.mes,
.inf{
    display:none;
}
#check,
.log span,
.tabs div,
.icons,
.forgot a{
    float:left;
}
.content{
    padding-bottom:30px;
}
.buttonsub,
.content{
    -webkit-box-shadow:0px 2px 5px 0px rgba(0,0,0,0.1);
    -moz-box-shadow:0px 2px 5px 0px rgba(0,0,0,0.1);
    box-shadow:0px 2px 5px 0px rgba(0,0,0,0.1);
	margin-top:20px;
}
label,
.content,
.buttonsub,
textarea{
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
    overflow:hidden;
	border-bottom-right-radius:100px;
}
form,
.formhead,
.about1,
.about2{
    max-width:280px;
}
.formhead{
    height:45px;
    margin-bottom:20px;
    text-align:left;
    line-height:66px;
    font-size:14px;   
}
label,
.buttonsub{
    width:100%;
    display:block;
}
input{
    float:left;
    width:84%;
    border:none;
    outline:none;
    color:#A3A9A9;
    box-sizing:border-box;
    font:12px 'Droid Arabic Kufi', serif; 
    padding-right:11px;
    direction:ltr;
}
.icons{
    width:40px;
    color:#A3A9A9;
    line-height:40px;
}
.icons,
input,
label,
.buttonsub{
    height:40px;
}
.alertms{
    height:20px;
    text-align:left;
    font:11px/30px 'Droid Arabic Kufi', serif;
}
.buttonsub{
    border:none;
    outline:none;
    color:#fff;
    cursor:pointer;
    font:bold 13px 'Droid Arabic Kufi', serif;
}
textarea{
    height:130px;
    padding:10px;
    box-sizing:border-box;
    border:none;
    outline:none;
    color:#A3A9A9;
    direction:ltr;
}
#check{
    width:14px;
    margin-top:20px;
    background:none;
}
.rem{
    font-size:13px;
    margin-top:26px;
}
.forgot{
    float:left;
}
.forgot a{
    color:#fff;
    line-height:74px;
    font-size:12px;
    text-decoration:none;
}
.forgot a:hover{
    color:#ccc;
}
.about1,
.about2{
    height:30px;
    text-align:left;
}
.about2{
    font-size:12px;
}
.inf span{
    margin-left:10px;
}
.map{
    width:90%;
    height:300px;
    margin-top:10px;
}
::-webkit-input-placeholder{
    font:12px/13px 'Droid Arabic Kufi', serif;
}
::-moz-placeholder{
    font:12px/13px 'Droid Arabic Kufi', serif;
}
:-ms-input-placeholder{
    font:12px/13px 'Droid Arabic Kufi', serif;
}
@media screen and (max-width: 500px){
.log,
.reg,
.mes,
.inf,
.content{
    max-width:250px;
}
body{
    padding-left:10px;
    padding-left:10px;
}
.tabs div{
    width:62.5px;
}
.img{
 width:300px;height:100px;	
}
form,
.formhead,
.about1,
.about2{
    max-width:220px;
}
input{
    width:70%;
}
}


















/* SETTING BOX STYLE START */
.toolbox{
    width:auto;
    height:200px;
    position:absolute;
    top:100px;
    right:0;
}
.toolicon{
    float:left;
    width:65px;
    height:65px;
    font-size:25px;
    cursor:pointer;
    line-height:65px;
    margin-top:65px;
    background:#292E2E;
}
.toolcontent{
    float:left;
    width:200px;
    height:200px;
    font-size:13px;
    padding-top:15px;
    box-sizing:border-box;
    display:none;
}
.toolcontent div,
.toolcontent p{
    width:100%;
}
.toolcontent div{
    height:30px;
}
.toolcontent span{
    display:inline-block;
    margin:auto;
    width:30px;
    height:30px;
    margin:3px;
    cursor:pointer;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
}
.toolcontent,
.toolicon{
    background:rgb(10, 94, 150);
    -webkit-border-top-left-radius:4px;
    -webkit-border-bottom-left-radius:4px;
    -moz-border-top-left-radius:4px;
    -moz-border-bottom-left-radius:4px;
    border-top-left-radius:4px;
    border-bottom-left-radius:4px;
    -webkit-box-shadow:0px 2px 5px 0px rgba(0,0,0,0.1);
    -moz-box-shadow:0px 2px 5px 0px rgba(0,0,0,0.1);
    box-shadow:0px 2px 5px 0px rgba(0,0,0,0.1);
}
.color1{background:#D4995B;}
.color2{background:#50C28C;}
.color3{background:#57ABD9;}
.color4{background:#E85664;}
.color5{background:#FFFFFF;}
.color6{background:#383B3B;}
/* SETTING BOX STYLE END */
