/*--
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
--*/

body {
	margin:0;
	padding:0;
	font-family: 'Open Sans', sans-serif;
}
.clear {
	clear:both;
}
.header {
	margin-top:2%;
	width:100%;
	text-align:center;
}
.header h1 {
	font-family: 'Open Sans', sans-serif;
	line-height:25px;
	text-transform:uppercase;
	color:grey;
}
.content{
	width:80%;
	margin:3% auto 0 auto;
	height:460px;
	background-color:#F5F5F5;
}
.content1 {
	background-color:#d3bea0;
	text-align:center;
	padding:2em;
}
.content1 h2 {
	font-family: 'Open Sans', sans-serif;
	text-transform:uppercase;
	margin:0;
	color:#fff;
}
.content2 {
	background-color:#e6dac9;
}
.content2-header1 {
	float:left;
	width:30%;
	text-align:center;
	padding:1.5em;
}
.content2-header1 p {
	font-family: 'Open Sans', sans-serif;
	font-size:16px;
	font-weight:700;
	color:#555;
	margin:0;
}
.content2-header1 span {
	font-size:14px;
	font-weight:400;
}

.address-info-row {
 float: left;
 width: 100%;
 margin: 40px 0 50px 0;
}
.address-info-row .address-box {
 float: left;
 width: 100%;
 border: 1px solid #f0f0f0;
 padding: 35px 30px;
 max-height: 300px;
 min-height: 240px;
 box-sizing: border-box;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
}
.address-info-row .address-box i {
 width: 54px;
 height: 54px;
 display: block;
 margin: 0 auto 17px;
 border-radius: 100%;
 border: 2px solid;
 text-align: center;
 line-height: 54px;
}
.address-info-row .address-box strong.title {
 display: block;
 text-align: center;
 font: 16px/16px 'Montserrat', sans-serif;
 color: #444;
 padding: 0 0 20px 0;
}
.address-info-row .address-box p {
 font: 14px/26px 'Open Sans', sans-serif;
 color: #777;
 text-align: center;
 margin: 0;
}
.address-info-row .address-box p span {
 display: block;
}

/*---- responsive-design -----*/
@media(max-width:1920px){
	span.line {
	width:157px;
	left:32%;
	}
	.shipment{
		margin-top:6%;
	}
.content3 p{
margin-left:-65%;
}
}

@media(max-width:1680px){
	.content3 p {
    margin-left: -60%;
}
span.line {
    width: 127px;
    left: 37%;
}
}

@media(max-width:1600px){
span.line {
    width: 117px;
    left: 39%;
}
}

@media(max-width:1440px){
.content3 p {
    margin-left: -66%;
}
span.line {
    width: 265px;
    left: 20%;
}
}

@media (max-width: 1366px){
span.line {
    width: 215px;
    left: 25%;
}
.shipment {
    margin-top: 10%;
}
}

@media (max-width: 1280px){
span.line {
       width: 225px;
        left: 20%;
        top: 29%;
    }
}

@media (max-width: 1080px){
.content {
width: 75%;
}
span.line {
    width: 88px;
left: 46%;
}
}

@media (max-width: 1050px){
span.line {
    width: 153px;
    left: 30%;
    }
}

@media (max-width: 1024px){
	.content{
		width:77%;
	}
	.content3 p {
		font-size:14px;
	}
}

@media (max-width: 991px){
	.content {
    width: 80%;
}
span.line {
    width: 84px;
    left: 47%;
}
}

@media (max-width: 900px){
.content {
    width: 85%;
}
span.line {
    width: 154px;
    left: 33%;
}
}

@media (max-width: 800px){
.content {
    width: 95%;
}
.content2-header1 p {
	margin: 0 0 0 -7%;
}
}

@media (max-width: 768px){
	.content {
    width: 90%;
}
.content2-header1 {
	width: 25%;
}
.content2-header1 p {
    margin: 0 -19% 0 -10%;
}
span.line {
    width: 132px;
    left: 33%;
    }
}

@media (max-width: 736px){
	span.line {
    width: 62px;
    left: 55%;
}
}

@media (max-width: 667px){
	
span.line {
       width: 104px;
    left: 38%;
    }
}

@media (max-width: 600px){
	
span.line {
    width: 95px;
    left: 40%;
}
    .content3{
        margin-left: 7%;
    }
}

@media (max-width: 568px){
	
}

@media (max-width: 414px){
	.header {
    margin-top: 8%;
}
	
  
	.footer {
	padding:1%;
}
	.footer p {
	font-size:16px;
}
}

@media (max-width: 384px){
	.header {
    margin-top: 9%;
}
	.footer {
    padding: 3%;
}
	.footer p {
    font-size: 15px;
}
}

@media (max-width: 375px){
	.content {
    height: 755px;
	width:100%;
}
	.content2{
	width:128%;
}
	.content1 h2 {
    font-size: 19px;
}
	.content3 p {
    margin: -20% 0 8% -95%;
}
	span.line {
    top: 105%;
    left: 47.5%;
    height: 52px;
}
	.shipment {
    margin-left: 17%;
}
}

@media (max-width: 320px){
	.header {
    margin-top: 10%;
}
	.content{
	width:66%;
	margin-top: 10%;
	padding:12%;
    height: 709px;
}
	.content1 {
    padding: 0.7em;
	width:136%;
	margin:-18% 0 0 -18%;
}
	.header h1{
	font-size:30px;
}
	.content2 {
	margin-left: -18%;
	width: 136.5%;
}
	.content1 h2 {
    font-size: 16px;
}
	.content2-header1 span {
    font-size: 15px;
}
	.content3 p {
        margin: 8% 0 12% -64%;
}
	.shipment {
	margin: 16% 0 0 19%;
}
	span.line {
        top: 62%;
        left: 69%;
        height: 72px;
    }
	.footer {
	margin-top: 1%;
}
	.footer p {
    font-size: 14px;
}
}