a.contact_box
{
	width:50%;
	height:100%;
	float:left;
	background:#fff;
	border:4px solid #fff;
	padding:20px 10px;
	margin:0px;
	text-decoration:none;
 	transition: all 0.5s ease;
 }
 
a.contact_box:hover
{
	border:4px solid rgba(0,0,0,0.2);
	text-decoration:none;
 	transition: all 0.5s ease;
 }
a.contact_box h3,
a.contact_box p
{
	color:#fff;
	text-decoration:none;
 	transition: all 0.5s ease;
}
a.contact_box:hover h3,
a.contact_box:hover p
{
	color:#fff;
	text-decoration:none;
 	transition: all 0.5s ease;
}


.knockknock
{
	display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-direction: row;
}


.center-y {
	width:50%;
	height:100vh;
	transition:all 300ms ease-in-out;
}
.center-y:hover {
    transition: all 300ms ease-in-out;
}

.center-y .form-button{
	width:100%;
	text-align:center;
	color:#fff;
    position: relative;
    z-index: 2;
	cursor: default;
}
.center-y.bg-pink:hover{background:#FC0095}
.center-y.bg-bluish:hover{background:#015194;text-decoration:none !important;}

.form-button
{
	height:100vh;
	text-align:center;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.form-button,
.form-button h2,
.form-button p {
	color:#fff;
	text-decoration:none;
    -webkit-align-items: center;
    -ms-flex-align: center;	
	transition: all 300ms ease-in-out;
}
.form-button h2
{
	text-transform:uppercase;
	letter-spacing:1px;
	font-weight:600;
}	
.form-button p 
{
	letter-spacing: 1px;
}


.form-button:hover
{
	text-decoration:none !important;
    -webkit-box-shadow: 0px 2px 250px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: 0px 2px 250px 0px rgba(0,0,0,0.6);
    box-shadow: 0px 2px 250px 0px rgba(0,0,0,0.6);
    -o-box-shadow: 0px 2px 250px 0px rgba(0,0,0,0.6);
	
    /*-box-shadow: inset 0px 0px 100px 100px rgba(0,0,0,0.1), 0px 2px 63px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: inset 0px 0px 100px 100px rgba(0,0,0,0.1), 0px 2px 63px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: inset 0px 0px 100px 100px rgba(0,0,0,0.1), 0px 2px 63px 0px rgba(0,0,0,0.75);
    -o-box-shadow: inset 0px 0px 100px 100px rgba(0,0,0,0.1), 0px 2px 63px 0px rgba(0,0,0,0.75);*/
	
	transition: all 300ms ease-in-out;	
}

.form-button:focus {text-decoration:none !important;}

.form-button:hover h2 ,
.form-button:hover p,
.form-button:hover .lined-hover
{
	color:#fffa2b;
    text-shadow: 4px 6px 10px rgba(0, 0, 0, 0.2);
	transition: all 300ms ease-in-out;
	text-decoration:none !important;
}


.lined-hover {color: #FFF;font-weight: 600;margin: 0 auto;display: table;position: relative;padding-bottom: 10px;cursor:pointer}
.lined-hover:hover {color: #FFF;text-decoration: none;}
.form-button:hover .lined-hover {}

.lined-hover::before,
.lined-hover::after {
	content: '';
	position: absolute;
	background-color: #FFFa2b;
	width: 0px;
    height: 2px;
    bottom: 0;
    left: 0;
	-webkit-transition: all 280ms ease-in-out;transition: all 280ms ease-in-out;
}
.lined-hover::before {}
.form-button:hover .lined-hover::after {width: 80px;}
.form-button .lined-hover:hover::after {width: 100%;}





/*a.contact_box
{
	width:90%;
	height:100%;
	float:left;
	background:#fff;
	border:4px solid #fff;
	padding:20px 10px;
	margin:15px;
	text-decoration:none;
 	transition: all 0.5s ease;
 }
 
a.contact_box:hover
{
	background:#ff1b00;
	border:4px solid rgba(0,0,0,0.2);
	text-decoration:none;
 	transition: all 0.5s ease;
 }
a.contact_box h3,
a.contact_box p
{
	color:#333333;
	text-decoration:none;
 	transition: all 0.5s ease;
}
a.contact_box:hover h3,
a.contact_box:hover p
{
	color:#fff;
	text-decoration:none;
 	transition: all 0.5s ease;
}*/
/*----from---*/ 


form  label
{
	font-weight:600;
}
form input[type="text"],
form input[type="email"],
form input[type="number"]
{
    padding: 15px 10px;
    height: 70px;
    width: 100%;
    float: left;
    border: 1px solid #ccc;
    margin-bottom: 20px;
    transition: all .5s ease-in-out;
}
 form input[type="text"]:hover, 
 form input[type="text"]:focus,
 form input[type="email"]:hover, 
 form input[type="email"]:focus, 
 form input[type="number"]:hover, 
 form input[type="number"]:focus 
{
    -webkit-box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
    box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
    transition: all .5s ease-in-out;
}


 form input[type="radio"]:hover, 
 form input[type="radio"]:focus 
{
    -webkit-box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
    box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
    transition: all .5s ease-in-out;
}
 
form textarea { 
    display: block;
    font-size: 16px;
    font-weight: 300;
    line-height: 34px;
    margin-bottom: 15px;
    padding: 12px 15px;
    width: 100%;
	float:left;
	border-color:#e21688;
}


.checkbox-custom, .radio-custom {
    opacity: 0;
    position: absolute;   
}

.checkbox-custom, .checkbox-custom-label, .radio-custom, .radio-custom-label {
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 20px;
    cursor: pointer;
}

.checkbox-custom-label:hover, 
.checkbox-custom-label:focus, 
.radio-custom-label 
{
	border:1px solid #ffffff;
}

.checkbox-custom-label, .radio-custom-label {
   	position: relative;
    width: 100%;
    padding: 20px 10px;
	border:1px solid #ff1b00;
	transition:all .5s ease-in-out;
}

.checkbox-custom + .checkbox-custom-label:before, .radio-custom + .radio-custom-label:before {
    content: '';
    /* background: #fff; */
    /* border: 2px solid #ddd; */
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    height: 100%;
    float: left;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9;
    padding: 2px;
    color: #fff;
    line-height: 7;
    font-size: 2em;
    margin-right: 10px;
    text-align: center;
	transition:all .5s ease-in-out;
}
.checkbox-custom-label:hover,
.checkbox-custom-label:focus
{  
    color: #fff;
    background: rgba(236, 0, 140, 0.69);
	
	webkit-box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
    box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
	
	transition:all .5s ease-in-out;
}


.checkbox-custom:checked + .checkbox-custom-label:before{}

.checkbox-custom:checked + .checkbox-custom-label > .check_box_list span.check_txt{position:relative; z-index:999; color:#fff}

.checkbox-custom:hover + .checkbox-custom-label > .check_box_list span.check_txt{position:relative; z-index:999; color:#fff}

.checkbox-custom:checked + .checkbox-custom-label:before {
    content: "\f00c";
    font-family: 'FontAwesome';
    background: rgba(236, 0, 140, 0.88);
    color: #fff;
    line-height: 7;
    font-size: 2em;
	
	webkit-box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
    box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.3);
	
	transition:all .5s ease-in-out;
}

.radio-custom + .radio-custom-label:before {
    border-radius: 50%;
}

.radio-custom:checked + .radio-custom-label:before {
    content: "\f00c";
    font-family: 'FontAwesome';
    color: #bbb;
}

.checkbox-custom:focus + .checkbox-custom-label, .radio-custom:focus + .radio-custom-label {
  outline: 1px solid #ddd; /* focus style */
}
.check_box_list
{
	 font-size:17px;
    color: #ff1b00;
}
 span.req {
    position: absolute;
    top: 22px;
    font-size: 1.5em;
    color: red;
    right: 8%;
}

.req_fields_line {
    padding: 10px 0px;
	color:#fff;
    font-size: 12px;
    border-bottom: 2px dashed #e21688;
}
.contact_serial {
    font-size: 15px;
    font-weight: 400;
    color: #000;
    border: 1px solid #333;
    padding: 10px 17px;
    float: left;
	margin:30px 0px;
	display:none;
}
.contact_serial_head {
    font-size: 18px;
	text-transform:uppercase;
    font-weight: 600;
    color: #033e6f; 
    padding: 0px;
    float: left;
	margin:30px 0px 10px 0px;
}

a.back_btn1 {
    border: 1px solid #033e6f;
	width:55px;
	float:left;
    padding: 7px 17px;
    font-size: 20px;
	font-weight:100;
    color: #033e6f;
	text-decoration:none;
	transition:all .5s ease-in-out;
}
a.back_btn1:hover { 
    padding: 7px 27px 7px 7px; 
    color: #fff;
    background: #033e6f;
	transition:all .5s ease-in-out;
}
 

a.close_btn1 {
    border: 1px solid #033e6f;
	width:55px;
	float:right;
    padding: 7px 20px;
    font-size: 19px;
	font-weight:400;
    color: #033e6f;
	text-decoration:none;
	transition:all .5s ease-in-out;
}

a.close_btn1:hover {  

    color: #fff;
    background: #033e6f;
	transition:all .5s ease-in-out;
}
input#catwebformbutton {
    width: 91%;
    padding: 13px;
    font-size: 18px;
    color: #333;
    background: #fff;
    border: 1px solid #333;
	transition:all .5s ease-in-out;
	
}

input#catwebformbutton:hover {
    color: #fff;
    background: #ff1b00;
	transition:all .5s ease-in-out;
	
}

input#FileAttachment {
    padding: 20px 15px;
    border: 1px solid #ccc;
    width: 100%;
    height: 70px;
}
.FileAttachment{padding: 20px 15px 20px 65px; border: 1px solid #e21688; width: 100%; height: 70px; color: #e21688; background:url(../images/icons/download.png) no-repeat 20px center}

.FileAttachment-input{opacity:0; position: absolute; z-index: 1; top: 0px; margin: 0px;}




.checkbox-custom:checked + .checkbox-custom-label:before + .check_box_list
{
	display:none;
}













/*-----------*/


svg#home-anim
{
  position:absolute;
  z-index:2;
  display:none;
}
#home {
  clip-path: url(#cache);
  position:absolute;
  z-index:2;
}

#red {
  display:none;
  fill: none;
  opacity: 0.15;
  stroke: #CE1B5F;
  stroke-width: 4;
  stroke-miterlimit:10;
  animation: show 4s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out; 
}

#blue {
  fill: none;
  opacity: 0.15;
  stroke: rgba(0,0,0,0.5);
  stroke-width: 2;
  stroke-miterlimit:10;
  stroke-dasharray: 200;
  stroke-dashoffset: 800;
  animation: draw 4s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;    
}

#light-blue {
  fill: none;
  opacity: 0.15;
  stroke: rgba(0,0,0,0.2);
  stroke-width: 5;
  stroke-miterlimit:10;
  stroke-dasharray: 100;
  stroke-dashoffset: 400;
  animation: draw 10s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;    
}

@keyframes draw {
  to {
    stroke-dashoffset: 0;
 }
    }

@keyframes show {
  0% {
    opacity: 0.15;
 }
  50% {
    opacity: 0.2;
 }
  100% {
    opacity: 0.15;
 }
    }



@media (max-width: 768px) {
	.knockknock {display: block;width: 100%}
	.knockknock .center-y {display: block;height: auto;width: 100%}
	.knockknock .center-y .form-button {height: 50vh;}
}