/*
Contact Form by html-form-guide.com
You can customize all the aspects of the form in this style sheet
All the style elements use form id selector(notice the #contactus). So, including this
stylesheet does not affect the other elements at all!
*

#contactus fieldset
{
   
   padding:20px;
   border:1px solid #ccc;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;   
}

#contactus legend, h2
{
   font-family : Arial, sans-serif;
   font-size: 1.3em;
   font-weight:bold;
   color:#333;
}

#contactus label
{
   font-family : Arial, sans-serif;
   font-size:0.8em;
   font-weight: bold;
}

#contactus input[type="text"],textarea
{
  font-family : Arial, Verdana, sans-serif;
  font-size: 0.8em;
  line-height:140%;
  color : #000; 
  padding : 3px; 
  border : 1px solid #999;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;

}

#contactus input[type="text"]
{
  height:18px;
  width:220px;
  
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
   border-radius: 5px;   
  
}

#contactus #scaptcha
{
  width:60px;
  height:18px;
}

#contactus input[type="submit"]
{
   width:100px;
   height:30px;
   padding-left:0px;
   
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
   border-radius: 5px;   
}

#contactus textarea
{
  height:120px;
  width:310px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
   border-radius: 8px;  
}


#contactus .content
{
   margin-top:8px;
   margin-bottom: 10px;
}



#contactus fieldset#antispam
{
   padding:2px;
   border-top:1px solid #EEE;
   border-left:0;
   border-right:0;
   border-bottom:0;
   width:350px;
}

#contactus fieldset#antispam legend
{
   font-family : Arial, sans-serif;
   font-size: 0.8em;
   font-weight:bold;
   color:#333;   
}

#contactus .short_explanation
{
   font-family : Arial, sans-serif;
   font-size: 0.6em;
   color:#333;   
}

/* spam_trap: This input is hidden. This is here to trick the spam bots*/
#contactus .spmhidip
{
   display:none;
   width:10px;
   height:3px;
}
#fg_crdiv
{
   font-family : Arial, sans-serif;
   font-size: 0.3em;
   opacity: .2;
   -moz-opacity: .2;
   filter: alpha(opacity=20);   
}
#fg_crdiv p
{
    display:none;
}
#contactus .error
{
   font-family: "Lucida Console", Monaco, monospace;
   font-size: 14px;
   color: #09F;
   padding-left:10px;
}
#contactus input[type="text"]:focus,textarea:focus input[type="email"]:focus,textarea:focus
{
  color : #009;
  border : 1px solid #990000;
  background-color : #ffff99;
  font-weight:bold;
}
#contactus #scaptcha
{
  width:70px;
  height:22px; 
}
#contactus #scaptchatxt
{
  width:70px;
  height:25px; 
}


/*===================Registartion===============*/

.registerpost {width:1160px;}
.registerpost h3 {font-size:20px;}
.registerpost h4 {font-size:20px; color:#CCC;}
.btn{ margin:5px; font-size:1.3em; font-weight:bold; border:2px solid rgba(0,0,0,0.2); display:inline-block; box-shadow:0 -30px 30px -15px #00329B inset, 0 1px 0 rgba(255,255,255,0.3) inset; background:#0088CC; background-repeat:repeat-x; color:#FFF; text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25); border-radius:7px; padding:10px 20px; -webkit-transition:0.15s; transition:0.15s; }
.btn:hover{ background:#0068BA; }
.btn:active{ box-shadow:0 0 0 0 rgba(0, 0, 0, 0.3), 0 -30px 30px -15px #00329B inset, 0 0 6px #00243F inset; }
.btn.github{ float:right; }

#wrap1{ padding:50px; width:800px; background-color:#FFF; margin:20px auto; border:1px dashed #AAA; position:relative; }
.options{ position:absolute; top:0px; right:-1px; background-color:#F1F1F1; padding:4px 0; border-left:1px dashed #AAA; border-bottom:1px dashed #AAA; }
.options label{ cursor:pointer; margin:0 10px; }

input, textarea{ border:1px solid #D1D1D1; }
input, select{ font-size:inherit; margin:0; }
input:focus, textarea:focus{ border-color:#AAA; }

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
input[type=checkbox]{ width:auto; border:none; bottom:-1px; cursor:pointer; margin:0 5px 0 0; position:relative; }
button[type=submit]{ font-size:1.1em; padding:5px 25px; }

/* Tooltips helpers */
.item .tooltip{ float:left; top:2px; left:7px; position:relative; z-index:2; }
.item .tooltip:hover{ z-index:3; }
.item .tooltip > span{ display:inline-block; width:15px; height:15px; line-height:15px; font-size:0.9em; font-weight:bold; text-align:center; color:#FFF; cursor:help; background-color:#00AEEF; position:relative; border-radius:10px; }
.item .tooltip .content{ opacity:0; width:220px;height:30px;  background-color:#333; color:#FFF; 
							font-size:0.9em; position:absolute; top:0; left:20px; padding:8px; border-radius:6px; 
							pointer-events:none; transition:0.2s cubic-bezier(0.1, 0.1, 0.25, 2); 
							-webkit-transition:0.3s cubic-bezier(0.1, 0.2, 0.5, 2.2); 
							-moz-transition:0.3s cubic-bezier(0.1, 0.2, 0.5, 2.2); }
.item .tooltip p{ padding:0; }
.item .tooltip.down .content{ left:auto; right:0; top:30px; }
.item .tooltip:hover .content{ opacity:1; left:36px; }
.item .tooltip .content b{ height:0; width:0; border-color:#333 #333 transparent transparent; border-style:solid; border-width:9px 7px; position:absolute; left:-14px; top:8px; }
.item .tooltip.down .content b{ left:auto; right:6px; top:-10px; border-width:5px; border-color:transparent #333 #333 transparent; }

/* alerts (when validation fails) */
.item .alert{ float:left; margin:0 0 0 20px; padding:3px 10px; color:#FFF; border-radius:3px 4px 4px 3px; background-color:#CE5454; max-width:170px; white-space:pre; position:relative; left:-15px; opacity:0; z-index:1; transition:0.15s ease-out; }
.item .alert::after{ content:''; display:block; height:0; width:0; border-color:transparent #CE5454 transparent transparent; border-style:solid; border-width:11px 7px; position:absolute; left:-13px; top:1px; }
.item.bad .alert{ left:0; opacity:1; }


@keyframes shake{
    15%{ transform:translateX(-5px); }
    30%{ transform:translateX(5px); }
	45%{ transform:translateX(-3px); }
	60%{ transform:translateX(3px); }
	75%{ transform:translateX(2px); }
	100%{ transform:none; }
}
@-webkit-keyframes shake{
    25%{ -webkit-transform:translateX(-6px); }
    75%{ -webkit-transform:translateX(6px); }
}

form fieldset{ clear:both; margin:0 0 10px 0; border: 1px solid #CCC; }
#contactform fieldset{ clear:both; margin:0 0 10px 0;  border: 0px solid #CCC; }
form .item { padding:5px 0; position:relative; height:2em; }
form .itembig { padding:5px 0; position:relative; height:2em; }
form .itemradio { padding:5px 0; position:relative; height:2em; }
form .itemradiobig { padding:5px 0; position:relative; height:3em; }
form .itemsubmit label {padding:5px 0; position:relative; height:5em; margin-left:500px;}
form .item.items{ height:auto; }
	.item label, .item .label{ float:left; cursor:pointer; }
	.item label span, .item .label{ float:left; width:160px; text-transform:capitalize; line-height:2em; }
	.itembig label span, .item .label{ float:left; width:430px; text-transform:capitalize; line-height:2em; }
	.itemradio label span, .item .label{ float:left; width:160px; text-transform:capitalize; line-height:2em; }
	.itemradiobig label span, .item .label{ float:left; width:360px; text-transform:capitalize; line-height:2em; }
	.item input { float:left; padding:3px 4px; width:210px; -webkit-transition:0.2s; -moz-transition:0.2s; transition:0.2s; }
	.item input[type=checkbox]{ width:auto; }
	
	.label ~ label{ vertical-align:middle; margin:0.3em 1.2em 0 0; } 
	
	.item input.short{ width:90px; }
	.item input:focus:not([type="checkbox"]), .item textarea:focus{ box-shadow:0 0 4px #00AEEF; border:1px solid #00AEEF; }
	.item textarea{width:425px; height:100px; float:left; padding:3px 4px;-webkit-transition:0.2s; -moz-transition:0.2s; transition:0.2s;  }
	.item select{ float:left; width:220px; padding:2px 0; margin:0; border:1px solid #CCC; text-transform:capitalize; }
		.item select option{ padding:1px; }

    .item > .extra{ float:left; font-size:0.9em; color:#999; line-height:2em; margin-left:13px; }
    
	.item.multi .input{ float:left; }
		.item.multi input{ float:left; margin-right:5px; width:35px; text-align:center; }
		form .item.multi input:nth-last-child(-n+2){ margin:0; }
	.item.items input{ border-top:5px solid #E1E1E1; margin:0 0 0 160px; }
	
	.bad input, 
	.bad select, 
	.bad textarea{ border:1px solid #CE5454; box-shadow:0 0 4px -2px #CE5454; position:relative; left:0; -moz-animation:.7s 1 shake linear; -webkit-animation:0.7s 1 shake linear; }
    
	
/* mode2 - where the label's text is above the field and not next to it
--------------------------------------------------------------------------- 
.mode2 .item{ float:left; clear:left; margin-bottom:30px; height:auto; padding:0; zoom:1; }
.mode2 .item.bad{ margin-bottom:8px; }
.mode2 .item::before, .mode2 .item::after{ content:''; display:table; }
.mode2 .item::after{ clear:both; }
	.mode2 .item label{  }
		.mode2 .item label span{ float:none; display:block; line-height:inherit; }
	.mode2 .item input, .item textarea{ width:250px; margin:0; }
	.mode2 .item textarea{ width:350px; margin:0; }
	.mode2 .item select{ width:260px; float:none; }
	.mode2 .item.multi label{ float:none; }
	.mode2 .item.multi input{ float:left; margin-right:5px; width:35px; text-align:center; }
	.mode2 .item .tooltip{ left:auto; position:absolute; right:-22px; top:19px; }
	.mode2 .item .alert::after{ display:none; }
	.mode2 .item .alert{ float:none; clear:left; margin:0; padding:0 5px; border-radius:0 0 3px 3px; max-width:100%; height:22px; line-height:1.8em; }
    .mode2 .item > .extra{ position:absolute; right:0; }
/*=====================RegistrationClose==========*/
