@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab:400,700');
*{
	padding:0px;
	margin:0px;
	box-sizing:border-box;
	font-family: 'Roboto Slab', serif;		
	}
a{
	color:#3498db;
	   outline: 0;
	}
button,a:hover, a:active, a:focus,input::-moz-focus-inner{
		   border: 0;
	}
button:focus { 
    outline: none; 
}


button::-moz-focus-inner {
  border: 0;
}


body {
	overflow-y: scroll;
	background: fixed  url(../imgs/backgorund.jpg) no-repeat center top;
	background-size: cover;
	
	}
.row, .sub-header, .content-main, .content-back, .navigation, .subheader-container, .header-background{
	float:left;
	width:100%;
	}
.row{
	padding:0px 15px;
	}
.container{
	width:1170px;
	margin-left:-15px;
	margin-right:-15px;
	margin:0 auto;}
.logo{
	width:420px;
	float:left;
}

content-back.row > *{
	padding:15px 0px;}
.logo span{
	padding:0px;
	display:block;
	float:left;}
.logo .logo-title{
	
font-family: 'Roboto Slab', serif;
text-decoration:underline;	
		line-height: 0.8em;	

	font-size:3.0em;}
.sub-header{
	margin-bottom: -5px;
	  text-shadow: 2px 2px 4px #000000;
width: 100%;
background: rgba(0,0,0,.5) url(../imgs/conflict-resolution.png) right top no-repeat ;
	z-index: 2;
position: relative;
	padding-top:50px;
	padding: 40px;

margin: 40px 0px;}
.header .sub-header+ .sub-header{
	width:500px;
	position:absolute;
	z-index:1;
	
top: 40px;
right: -40px;}
.subheader-container{
	padding-bottom: 20px;
	position:relative;}
img{
	border:none;
	vertical-align:top;}
.sub-header h3{
position: relative;
	color:#fff;
padding-left:40px;
	font-size: 2.0em;}
.navigation{
	z-index: 5;
position: relative;
	padding:11px 0px;}
.sub-header p{
	color:#fff;
	padding:25px 0px;}
.sub-header h3:before{
	content:'\f05d';
		color:#fff;
	    font-family: FontAwesome;
    left: 0px;
    display: block;
    position: absolute;
   top: 7px;
	}
.navigation ul{
	list-style:none;
	float:right;
	}
.navigation ul li{
	position: relative;}

.navigation ul li, .header .sub-header+ .sub-header{
	float:left;
	
	}
.navigation ul li a{
	padding:35px 15px;
	line-height: 4.2em;
	text-decoration:none;
	text-transform:uppercase;
	margin:5px;
	-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
	
	}
.navigation ul > li > a:hover:after, .navigation ul > li.current_item > a:after {
	position:absolute;
	content:"";
	width:100%;
	left:0;
	opacity:0.9;
	background-color:#3498db;
	-webkit-transition:all 0.35s ease;
	-moz-transition:all 0.35s ease;
	-o-transition:all 0.35s ease;
	transition:all 0.35s ease;
}


.navigation ul > li > a:hover, .navigation ul > li.current_item > a{
	color:#3498db !important;
	background:transparent;
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
	transition:all 0.3s ease;
}
.navigation ul li a:after {
	position:absolute;
	content:"";
	height:3px;
	background-color:#3498db;
	right:0;
	width:0%;
	bottom: -15px;
	z-index:1;
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}
.header .sub-header + .sub-header img{
	float:right;
	}
.navigation li > a:before {
	top: 0;
	right: 0;
	height: 2px;
	
	}
.logo .sub-title{
	font-size:1.7em;}
.header{
	width:100%;
	z-index: 4;
position: relative;
	float:left;}
.header.class{


		
		background-size:cover;
	
	}
.header.register{
	margin-bottom:-40px;

		background: url(../imgs/register-background-header.jpg) no-repeat top center;
		background-size:cover;
	
	}
.header.billing{
	margin-bottom:-40px;

		background: url(../imgs/billing-background-header.jpg) no-repeat top center;
		background-size:cover;
	
	}

.button-box{
	margin:40px 0px;
	float:left;
	}
.content-back{
	padding:25px 30px;
            margin: 50px 0px;

	background:#fff;}

.btn {
  background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
  cursor:pointer;
    display: block;
  
}

.btn:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}
.navigation ul ul{
	position:absolute;
	width:400px;
	z-index: 5;
		background:#fff;
		display:none;
		box-shadow:5px 10px 18px #888888;
	top:80px;
	}
.navigation ul ul li, .section.classes_front img {
	width:100%;}
.navigation ul ul li a{
	padding:15px;
	background:#fff;
	width:100%;
	
	}
	
.navigation ul li:hover ul{
	display:block;}
.navigation ul ul li a::after {
	bottom:-4px;}
.content-main{
	position:relative;
	z-index:2;
	}
.class_desctiption{
	width:47%;
	float:left;
	padding:15px;
	margin:1.5%;
background: #fff;
border-radius: 3px;
box-shadow: 0 3px 11px 0 rgba(0, 0, 0, 0.15);
min-height: 800px;
position:relative;
	}
.class_desctiption h2, .class_desctiption p, .class_desctiption ul{
	list-style:none;
	padding:15px;
	
	}
.class_desctiption .button-box {
	position: absolute;
bottom: 15px;
left: 15px;
	margin-left:15px;
	margin-right:15px;}
table td{
	padding:10px;
	vertical-align:top;	
	}
.classes table .left-row{
	text-transform:capitalize;
	width:200px;}
.classes table tr{
	padding:15px;}
.classes h1{
	text-transform:capitalize;
	padding:15px 0px;}
table td.left-row{
	text-transform:capitalize;}	
input[type="text"], input[type="number"], input[type="password"], input[type="email"], textarea, select {
    border: 1px solid #CCC;
    padding: 9px;
    outline: medium none;
    border-radius: 2px;
    color: #555;
    margin: 0px 0px 20px;
    width: 100%;
    display: block;
    background: none repeat scroll 0% 0% #FFF;
    -moz-appearance: none;
}
.register .column{
	width:50%;
	padding:15px 25px;
	float:left;
	
	}

.register .column + .column{
		border-left:1px solid #ccc;}
.register .column h1{
	padding-bottom:30px;}
.register .column h3{
	padding:25px 0px 10px}
.register .column h2{
	padding:25px 0px 10px;}
.floater, .first_name {
    position: relative;
    float: left;
}
.floater {
    width: 100%;
}
.first_name, .last_name, .second_name {
    width: 48%;
    float: left;
}
.section{
    padding: 80px 0px;
    z-index:3;
	position:relative;
	float:left;
    width: 100%;
    
    
}
.section p, .section.our_staff span, .section.our_staff h2{
    padding: 0px 15px;
}
.section.our_staff h2{
    padding: 5px 15px;
}
.section.our_staff .column{
    background: #f1f1f1;
    padding: 15px;
    width:30%;
    
}
.section.our_staff .column{
    margin-right: 5%;
}
.section.our_staff .column:last-child{
    margin-right: 0px;
}
.section.our_staff p{}
.section.about.classes_front{
    text-align:center;
    
}
.section.about.front{
    border-bottom:1px solid #ddd; 
    
    
}
.section.about p{
    width:60%;
}
.section.about.classes_front p{
    width:100%;
    
}
.section.about:before{
    content:'';
    background: url("../imgs/hammer.png") right center no-repeat;
background-size: 31%;
position: absolute;
right: 100px;
top: 0px;
width: 100%;
height: 100%;
    
    
    
}
.class_desctiption_front{
    width: 31%;
    min-height: 500px;
    margin: 1%;
    display: inline-block;
    padding: 15px;
    border: 1px solid #ddd;
vertical-align: top;
    z-index: 10;
position: relative;
    
}
.class_desctiption_front h2{
    font-size: 1.1em;
    padding: 15px 0px;
    
    
}
.class_desctiption_front .button-box{
    position: absolute;
bottom: 15px;
    margin: 0px;
    
    
    
}

.section.about.classes_front:before{
    background: none;
}
.section.about, .section.our_staff{
    background: #fff;
}

.section.our_staff{}
.title{
    	margin-bottom:40px;
}
.title h2, .title h1{
    	font-size:2.0em;
	padding: 0px 15px;
    margin-bottom: 30px;

	text-transform:uppercase;
}
.column{
    pading:0px 15px;
    width:100%;
	float:left;
	position:relative;
    
}

.first_name, .second_name{
	margin-right:3.5%}
.span_er, .not {
    position: absolute;
    right: 0px;
    color: #F00;
    display: none;
    top: -11px;
    font-size: 1.0em;
    text-transform: capitalize;
	    background: #fff;
    border: 1px solid red;
    padding: 3px 7px;
}
.span_er:before, .not:before{
	content:'\f0dd';
	font-family: FontAwesome;
	position:absolute;
	left:45%;
	bottom: -8px;

	}

.select{
	position:relative;}
select{
		background: none;
z-index: 5;
position: relative;
}
.pin{
	position: absolute;
top: 0%;
right: 0px;
background: #f1f1f1;
width: 30px;
height: 100%;}
.pin:after{
	content:'\f107';
	font-family: FontAwesome;
	position:absolute;
	right:9px;
	top:35%;

	
	}
.cart_item{
	    padding: 15px;
    border: 1px solid #f1f1f1;
	margin-bottom: 50px;

	}
.floater, .first_name {
    position: relative;
    float: left;
}
.card_month {
    width: 9%;
    margin-right: 1%;
    float: left;
}
option{
	padding: 0px 5px;}
.card_year {
    width: 12%;
    float: left;
}
.card_number {
    width: 53%;
    margin-right: 5%;
    float: left;
}
.card_svc {
    width: 10%;
    float: left;
    margin-right: 10%;
}
.check_out_box{
	background:#fff;
	padding:30px;
	width: 600px;
margin: 0 auto;
overflow: hidden;
	}
.messages-box{
width: 100%;
float:left;
background: #fff;
padding-bottom: 50px;
	}
	
	
	
	
	
	
	
	
	

.final_message{
width: 650px;
position:relative;
margin: 0 auto;
	
	}	
.final_message i{
	position:absolute;
	top:10px;
	font-size: 2.0em;
	-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
padding:10px;
padding: 10px 13px;
border:1px solid #5db02b;
color:#5db02b;

}
.final_message h3{
	padding:30px 0px}
		
.final_message h1{
color:#5db02b;
line-height: 2.0em;
	padding-left:60px;}	
	
	
.summary_item_image_content {
	float:left;
	
	width:100px;}

.final_purchase_image{
	float:left;}
.summary_item_name{
	float:left;}
.summary_item_desc_content{
	padding:15px 0px;
	width:520px;
	float:left;}
.summary_total div{
	font-size:1.4em;
	float:left;
	width: 230px;}
.summary_total div+div{
	float:left;
	}
.summary_item_price span{
	display:block;}
.summary_item, .summary_item_price h2, .summary_item_name, .footer{

	width:100%;
	float:left;}
.footer{
    background: #3498db;
    
}
.footer .contact-form{
    padding:20px;
    
}
.footer .column{
    width:50%;
    padding: 30px;
    float: left;
    
}
.footer .column .title{
    padding: 15px;
    color: #fff;
}
.footer .column ul{
   
    list-style: none;
    margin-bottom: 25px;
    
    
}
.footer .column ul li{
    padding: 5px 15px;
    color: #fff;
}
.footer .column ul li a{
    color: #fff;
}
.summary_total{
	float:left;
	width: 100%;
	padding: 15px 0px;

	}	
	.fa-exclamation-circle{
		position:absolute;
top: 2px;
color:#b02b2b;
left: 3px;
font-size: 2.0em;}
.summary_item_price{
	width: 120px;
padding:0px 2px;
	float:left;
	} 
.chek_out_devices h1{
	padding:15px 0px;
	}
.message-sent{
	margin: 30px 0px;
	position:relative;}
.message-sent h2{
	padding:0px;}
.message-sent.success h3{
	padding-bottom:20px}
.message-sent.failure h1{
	padding:0px 0px 0px 40px;
	color:#b02b2b;
	font-size:1.6em;}
.summary_item_name h2{
	padding:0px 0px 8px;
}
.summary_item{
	border-bottom:1px solid #f1f1f1;
	margin-bottom:15px;}
.total-price.main_offer span span{
	float:right;
	}
.shipping-container {
    display: none;
}
.mobile-nav{
	float:right;
	display:none;}
.classes h1 {
    background: #fff;
	padding:15px;}
.navigation {
		background: url(../imgs/header-backgrpund.jpg) repeat-x top left;

	
	}
	

.content-back.classes{
	background:#fff url(../imgs/classes-background-header.jpg) no-repeat center top;
	min-height:200px;
	width:100%;
	
	}
.content-main{
}	
.content-main table{
	margin-top:420px;
	background: #fff;

	}	
.class_desctiption h2, .class_desctiption h1{
	background:#3498db;
	margin: -15px -15px 20px;

	color:#fff;
	
	}
.section .title h1{
    margin: 0px;
    
}
.footer h2, .footer h1{
    margin: 0px;
    
}
.class_desctiption h2::before,
.class_desctiption h2::after, .class_desctiption h1::before, .class_desctiption h1::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    border-color: transparent;
    border-style: solid;
}

.class_desctiption h2::before {
    border-width: 1.4em;

}

.class_desctiption h2::after, h1::after {
    border-width: 1.30em;
    border-right-color: #0c0;
    border-top-color: #0c0;
}
.class_desctiption.about{
	width:97%;
	}
.class_desctiption.about li{
	padding:0px 0px 7px;
	
	}
.class_desctiption.about li.break{
	margin:0px 0px 30px;
	padding:0px 0px 30px;
	border-bottom:1px solid #f1f1f1;
	
	}
.class_desctiption.about .column{
		width:50%;
		padding:15px;
		float:left;}
	.class_desctiption ul {
		padding:30px 15px;}
.contact-form{
	margin:40px 0px;}
.call-now {
    position: fixed;
    display: none;
    left: 15px;
    padding: 20px;
    z-index: 1000;
    bottom: 15px;
}
.call-now a {
    display: block;
    border-radius: 50px;
    background: #fff;
width: 70px;
height: 70px;
box-shadow: 0 4px 44px #ccc;
}
.call-now a i {
    left: 40px;
    position: absolute;
    color: #3498db;
    font-size: 2.0em;
    top: 40px;
}
.required-box{
	position:relative;}
.span_er {
    display: none;
    position: absolute;
    color: red;
    right: 15px;
    z-index: 2;
    top: -13px;
}
.overflow {
    display: none;
    width: 100%;
    height: 100%;
    top: 0px;
    background: #fff;
    opacity: 0.8;
    left: 0px;
    position: fixed;
    z-index: 9990;
}
.floating_box {
    display: none;
    top: 100px;
    font-family: "Roboto", sans-serif;
    position: fixed;
    left: 50%;
    transform: translate(-50%, 0);
    z-index: 9991;
    background: #fff;
box-shadow: 0 4px 44px #ccc;
}
.floating_box div{
	padding:30px;
	
	}
.content-back.classes.family-mediation-training{
	background:url("../imgs/family-mediation.jpg") center top no-repeat;
	background-size:95%;
	
}
.content-back.classes.civil-mediation-training{
	
	background:url("../imgs/civil-familty-mediation.jpg") center top no-repeat;
	background-size:95%;	
}
.content-back.classes.family-to-civil-mediation-training{
	background:url("../imgs/family-to-civil-mediation.jpg") center top no-repeat;
	background-size:95%;	
	
}
.content-back.classes.civil-to-family-mediation-training{
	
	background:url("../imgs/family-civil-mediation.jpg") center top no-repeat;
	background-size:95%;	
}
.content-back.classes.domestic-violence-training{
	background:url("../imgs/domestic-violence-training.jpg") center top no-repeat;
	background-size:95%;	
	
}

@media only screen and (max-width : 1180px) {
	.container, .class_desctiption, .sub-header, .class_desctiption_front, .footer .column, .section.our_staff .column, .class_desctiption.about .column{
		width:100%;
		
		}
	
.class_desctiption .button-box {
	position:relative;}
	.content-back {
		
		padding:0px;}
.class_desctiption {
	margin:0px 0px 50px;
	
	}
.navigation ul li a {
	margin:0px;
	font-size:0.9em;}
.navigation ul{
	width:100%;
}
.navigation ul ul li a {
	color:inherit;}
.navigation ul ul {
	
	}
.header .sub-header + .sub-header {
	right:0px;}
	.logo {
		max-width:420px;}
	.sub-header h3{
		font-size:1.3em;
		}
.header {
	height:100%;}	
.navigation {
	}
	
	}
@media only screen and (max-width : 870px) {
.logo .logo-title {
	font-size: 2.0em;

	}
.logo {
    max-width: 260px;
}
.header {
	min-height:150px;}
.content-main .row, .navigation .row{
	padding:0px;}
.navigation ul li{
	width:100%;
	background:#fff;

}
.navigation ul li a{
	color:#000;}
.mobile-nav{
	float:right;
	padding: 13px;
	display:block;}
.navigation ul{
	display:none;}
.logo .sub-title {
	font-size: 1.13em;	
	}
	.navigation ul li a{
		color:#000;}
.navigation ul ul {
	left:15px;
	top:40px}

}
