@font-face {
    font-family: open-sans-regular;
    src: url('../fonts/OpenSans-Regular.woff');
}

@font-face {
    font-family: open-sans-bold;
    src: url('../fonts/OpenSans-SemiBold.woff');
}


	html{
		height: 100%;
		font-family: open-sans-regular;
	}
	body{
		margin: 0px 0px;
		height: 100%;
	}
	.containerMain{
		width: 100%;
		height: 100%;
		position: relative;
		background: #1d1d1d;  /* сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}
	.containerMain .leftFrame{
		width: 50%;
		height: 100%;
		background: #1d1d1d; 
		float: left;
	}
	.containerMain .rightFrame{
		width: 50%;
		height: 100%;
		background: #FFFFFF;
		float: left;
	}
	.containerMain .rightFrame .header{
		width: 100%;
		height: 12.22%;
		float:left;
		/* background: #454545; сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}
	.containerMain .rightFrame .separator{
		width: 100%;
		float: left;
		height: 4%;
		/*background: red; /* сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}
	.containerMain .rightFrame .logo{
	width: 100%;
	float: left;
	text-align: center;
	height: 46%;
	}
	
	.containerMain .rightFrame .title{
	width: 100%;
	font-size: 2vh;
	text-align: center;
	height: 42%;
	vertical-align: middle;
	text-transform: uppercase;
	font-family: open-sans-bold;
	
	}
	.containerMain .rightFrame .body{
		width: 100%;
		height: 75.56%;
		float:left;
	/*	background: blue; /* сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}
	.containerMain .rightFrame .body .separatorRows{
		width: 100%;
		height: 14.89%;
		float: left;
		
 /*     background: red; /* сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}
	.containerMain .rightFrame .body .rowGrid{
		width: 100%;
		float: left;
		height: 27.57%;
		text-align: center;
/*		background: #A9AC36; /* сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}
	.containerMain .rightFrame .body .rowGrid .separator{
		width: 7.34%;
		float: left;
		height: 100%;
	/*	background: #55557c; /* сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}
	.containerMain .rightFrame .body .rowGrid .category{
		width: 22.81%;
		float: left;
		height: 100%;
		border: 1px solid #e2e2e2;
		box-shadow: 6px 6px #F1f1f1;
/*		background: #a5a5a5; /* сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}

	.containerMain .rightFrame .logo img{
		height: 100%;
	}

	.containerMain .rightFrame .body .rowGrid .category .picture{
		width: 100%;
		
		float: left;
		height: 50%;
	/*	background: #20bc57; /* сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}
	.containerMain .rightFrame .body .rowGrid .category .picture img{
			width:100%;
		
	}
	.containerMain .rightFrame .body .rowGrid .category .nameCategory{
		width: 100%;
		float: left;
		height: 50%;
		display:table-cell;
		vertical-align: middle;
		text-transform: uppercase;
		display: table-cell;
		vertical-align: middle;
		/* font-family: open-sans-bold; */
		font-size: 1vw;
		background: #FFF; /* трябва да се преработа снимките и да се махне;
	/*	background: #065221; /* сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}
	.containerMain .rightFrame .footer{
		width: 100%;
		height: 12.22%;
		float:left;
		
		
		
/*	 background: #464646;/* сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}
	.containerMain .rightFrame .footer .footerMargin{
		width: 3.13%;
		height: 100%;
		float:left;
		
	/* background: #1d1d65;/* сложено с тестова цел да се проличи ако някъде не се разпъва правилно изгледа */
	}
	.containerMain .rightFrame .footer .containerCompany{
		float:left;
		width: 93.74%;
		height: 100%;
		text-align: right;
		display: table;
		
		
	}
	
	.containerMain .rightFrame .footer .containerCompany img{
		max-width: 100%;
		margin-top: 3.03%;
	}



.left-side-div{
	position: relative;
    height: 100%;
    background-color: #1d1d1d; 
}

#white-logo{
    margin-top:35%;
	height: 5.625vw;
}

#logo-text {
	color: #737373;
	font-size: 1.484375vw;
	letter-spacing: 0.1171875vw; 
	margin-bottom: 10%;
	font-family: 'openSans-regular';
}

.notice-line {
	background-image: url('../img/bar.png');
	height: 8px;
}

.leftFrame{
    text-align: center;
    background-color: #1d1d1d; 
}

#notice {
	letter-spacing: 0.15625vw;
	font-size: 0.9375vw;
	font-weight: bold;
	text-transform: uppercase;
	color: #fefefe;
	margin-bottom: 0.9375vw;  
	margin-top: 0.9375vw; 
	font-family: 'openSans-regular';
}

#contacts-btn {
	letter-spacing: 0.1015625vw;
	position: absolute;
	bottom: 20px;
	width:25%;
	margin-left:37.5%;
	color: #88b222;
	font-size: 1.09375vw;
	margin-top: 7%; 
	display: block; 
	text-decoration: none;
	font-family: 'openSans-regular';
}

#logo-text{
    font-family: open-sans-regular;
}

#notice{
    font-family: open-sans-regular;
}

#contacts-btn{
    font-family: open-sans-regular;
}

.hidden{
    display: none !important;
}

.hr {
    border-top: 1px solid #4c4c4c;
    padding-bottom: 6px;
	margin: 9px auto;
	width: 30%;
}


/* <CONTACTER>*/


        .img-top-phones{
            display: inline-block;
        }

        p{
            margin:0;
        }

        .inline-block{
            display: inline-block;
        }

        .phone-after-text{
            display: inline-block;
        }

        .telephone-text{
            display: inline-block;
            margin-left:14.8%;
        }
        
        .different-parcels-contacter{
            /* text-align: center; */
            margin-left:26.5%;
            margin-top:4.3%;
        }

        .different-parcels-contacter-second{
            margin-left:26.5%;
            margin-top:3.3%;
        }

        

        .text-without-images-bolding{
            margin-left: 17.65%;
        }

        .text-after-images{
            margin-left: 14.35%;
        }

        .text-after-images-email-box{
            margin-left: 13%;
        }

        .green{
            color: #93c123;
            font-family: 'open-sans-bold';
            margin-left: 16%;
        }

        .bolded-text{
            font-family: 'open-sans-bold';
        }

        #contactsContainer{
            font-size: 1.09375vw;
            line-height: 1.52857143vw;
            font-family: 'open-sans-regular';
			color:#333;
        }

        .fax{
            display: inline-block;
            margin-left:28%;
        }

        .phone-after-text{
            margin-left:4%;
        }

        #top-phones{
            margin-top: -2%;
        }

        .img-contacter{
            height: 1.04166666667vw;
		}
		
		.different-parcels-contacter-top{
			margin-left: 26.5%;
		}
	
 
/* <CONTACTER /> */



/* <REPONSIVE > */

@media only screen and (max-width: 768px) {
    .containerMain .leftFrame{
        width: 100% !important;
	}

	#notice{
		font-size: 1.9375vw;
	}

	#contactsContainer{
		margin-top:200%;
		padding-bottom: 30%;
	}
	
	.containerMain .rightFrame .title{
		font-size: 3vh;
	}
    
    .containerMain .rightFrame{
        width:100% !important;
    }
    
    .nameCategory p{
        margin: 13% auto;
        font-size: 2.35vw;
    }

    #logo-text{
        font-size: 3.484375vw;
    }

    #white-logo{
        height: 17.625vw;
	}

	.containerMain .rightFrame .logo img{
		height: 150% !important;
	}

	#contactsContainer p{
		height: 100%;
		line-height: 1.5;
		font-size: 3.53125vw;
	}

	/* .first-line-top-phones{
		margin-top: 170% !important;
	} */

	.text-without-images-bolding{
		margin-left: 17.4%;
	}

	.text-after-images-email-box{
		margin-left: 13.3%;
	}

	.img-top-icon{
		margin-left:2%;
	}

	.img-top-icon-a{
		margin-left:1%;
	}

	.img-contacter{
		height: 4.79166666668vw;
	}

	.green{
		margin-left: 9.5%;
	}

	.telephone-text{
		margin-left: 9.5%;
	}
	
	

	.text-after-images{
		margin-left: 7.35%;
	}

	.text-after-images-email-box{
		margin-left: 6%;
	}

	.text-without-images-bolding{
		margin-left: 13.8%;
	}

	.fax{
		margin-left: 28.5%;
	}

	.different-parcels-contacter-top{
		margin-left: 14%;
	}

	.different-parcels-contacter-second{
		margin-left: 14%;
	}

	.different-parcels-contacter{
		margin-left: 14%;
	}
}

/* <REPONSIVE /> */