* {
    margin: 0;
    padding: 0;
}
 
html, body {
    width: 100%;
    height: 100%;
    float: left;
    color: #66666E;
    background: #ffffff;
    font-size: 18px;
    font-weight: 400;
    font-family: verdana, sans-serif;
    letter-spacing: 0.04em;
    line-height: 1.5em;
}

body {
    overflow-x: hidden;
    opacity: 0;
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}

#text {
    visibility: hidden;
}

.show {
    opacity: 1;
}

h1, h2 {
    text-transform: uppercase;
    margin-bottom: 0.4em;
    color: #66666E;
    line-height: 1em;
    font-size: 24px;

    border-bottom: 2px solid #841c2a;
    width: auto;
    font-weight: 700;
    letter-spacing: 1px;
    border-image: url(/assets/images/heading_line.png) 0 0 20 0 stretch;
    border-width: 8px;
    padding-bottom: 15px;
    margin-bottom: 1em;
    float: left;
    text-transform: uppercase;
    clear: both;
}

h2 {
    border-image: none;
    border: none;
}

.heading_line {
    width: 150px;
    margin-bottom: 1.2em;
}

img {
    width: 100%;
}

p.p_img b {
    width: 260px !important;
    height: 260px !important;
}

.p_img {
    margin-left: 4em;
    width: 295px;
    height: 290px;
    float: left;
    -webkit-border-radius: 18px;
    -moz-border-radius: 18px;
    border-radius: 18px;
    border: 8px solid #851D2A;
    border-image: url(/assets/images/image_border.png) 30 stretch;
    border-bottom-right-radius: 0px;
    padding: 15px;
    margin-top: 4em;
    /*top: 30%;
    -ms-transform: translate(0,30%);
    -webkit-transform: translate(0,30%);
    transform: translate(0,30%);*/
    position: relative;
}

.p_img b {
    width: 100%;
    height: 100%;
    float: left;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border-bottom-right-radius: 0px;
    position: absolute;
    top: 0;
    left: 0;
    height: 320px !important;
    width: 325px !important;
}

.half {
    width: 45%;
    float: left;
}

.half:nth-child(2n+1) {
    padding: 0 10% 5% 0;
}

a {
    text-decoration: none;
    color: #3E4745;
    cursor: pointer;
}

a, h1, h2, h3, h4, p, 
.p_img, .p_img b, button, #navigation ul img, 
.gallery #gallery_left, .gallery #gallery_right, 
#author, .footer_content li a, #navigation ul, #navigation ul li a, 
.open_nav, .contact_info a, .contact_info, 
footer a, footer p, form, .gallery_photo .overlay,
.navigation_fixed, .navigation_fixed ul li a,
#navigation ul.open_nav li a, #navigation ul.open_nav li a:hover,
.navigation_fixed ul.open_nav li a, .navigation_fixed ul.open_nav li a:hover,
.navigation_fixed ul li a, .navigation_fixed ul a:hover, .supplier_logo img,
.supplier_logo img:hover, #navigation ul a:hover, #contact a:hover {
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

#container {
    width: 100%;
    float: left;
    overflow-x: hidden;
}

.content {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 5em;
    position: relative;
    z-index: 3000;
}

.container {
    margin: 2em 0;
}

.content .container {
    padding: 3em 0;
}

.center {
    text-align: center;
}

.left {
    text-align: left;
}

.right {
    text-align: right;
}

.button {
    padding: 0.9em 2.5em;
    text-transform: uppercase;
    color: #ffffff;
    text-decoration: none;
    font-size: 1.3em;
    font-weight: 600;
    margin-top: 1em;
    display: inline-block;
    z-index: 100;
    position: relative;
    border: none;
    -webkit-background-clip: text;
    outline: 0;
    cursor: pointer;

    background-size: auto 100% !important;
    background-repeat: no-repeat;
    background-position: 100% 0 !important;
}

/*-- header nav --*/
header .container {
    margin: 6em 0 0 0;
}

.mask {
    width: 100%;
    float: left;
    position: absolute;
    bottom: -10px;
}

header .content .container {
    margin-top: 0;
    padding: 5em 0;
}

header .content {
    padding: 0 2em;
}

header, footer, .container {
    width: 100%;
    float: left;
    position: relative;
}

header #logo {
    width: 400px;
    position: relative;
    left: 50%;
    -ms-transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

header #logo img {
    width: 100%;
}

header #logo:hover {
    opacity: 1 !important;
}

#contact {
    margin: 0;
    float: left;
    width: 100%;
    background-color: #851D2A;
    text-align: right;
}

#contact p {
    color: #ebebeb;
    margin: 1.8em 0;
    display: inline-block;
    line-height: 1em;
    float: left;
    font-size: 14px;
}

header nav a, header nav ul {
    display: inline-block;
    margin-top: 0;
}

header nav li {
    display: inline-block;
    list-style: none;
    padding-left: 0;
    margin-top: 0;
    position: relative;
    z-index: 10000;
}

#contact li, footer ul li {
    margin-left: 0.5em;
}

#contact ul {
    vertical-align: middle;
    padding: .8em 0;
}

#contact a {
    text-decoration: none;
    color: #EBEBEB;
    font-weight: 600;
}

#contact a:hover {
    opacity: 0.5;
}

#contact li a {
    color: #851D2A;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    background-color: #EBEBEB;
    width: 2em;
    height: 2em;
    position: relative;
}

footer li a {
    width: 2em !important;
    height: 2em !important;
}

#contact li a i, footer li a i {
    font-size: .8em;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

header a {
    display: inline-block;
    margin-top: 0;
}

header ul {
    float: right;
}

.arrow {
    width: 70px;
    position: absolute;
    bottom: 35%;
    left: 50%;
    -ms-transform: translate(-50%,-35%);
    -webkit-transform: translate(-50%,-35%);
    transform: translate(-50%,-35%);
    animation: pulse 2s infinite;
    z-index: 1000;
}

@keyframes pulse {
    0% {
         -ms-transform: translate(-50%,0);
        -webkit-transform: translate(-50%,0);
        transform: translate(-50%,0);
    }
    20% {
        -ms-transform: translate(-50%,25%);
        -webkit-transform: translate(-50%,25%);
        transform: translate(-50%,25%);
    }
}

header li {
    display: inline-block;
    list-style: none;
    padding-left: 0;
    margin-top: 0;
    position: relative;
    z-index: 10000;
}

nav {
    margin-top: 2em;
}

header nav {
    width: 100%;
    margin-top: 4em;
}

#menu {
    display: none;
}

.no_display {
    opacity: 0;
}

.display {
    opacity: 1;
}

nav ul {
    position: relative;
}

header #navigation li {
    width: auto;
    display: inline-block;
    list-style: none;
    padding-left: 2.5em;
    position: relative;
    z-index: 10000;
}

header #navigation li:first-of-type {
    padding-left: 0;
}

header #navigation ul {
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    transform: translate(-50%,0);
    float: left;
    position: relative;
}

/*header .navigation_fixed ul {
    left: auto !important;
    right: 2em !important;
    top: 50% !important;
    -ms-transform: translate(0,0) !important;
    -webkit-transform: translate(0,0) !important;
    transform: translate(0,0) !important;
    float: right !important;
}*/

#navigation ul li a {
    text-decoration: none;
    /*color: #EBEBEB;*/
    color: #ffffff;
    text-transform: uppercase;
    left: 50%;
    -ms-transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    transform: translate(-50%,0);
    position: relative;
    float: left;
    font-weight: 600;
}

#navigation ul li a:nth-last-child(n) {
    padding-right: 0;
}

#navigation ul a:hover {
    /*color: #841c2a;*/
    color: #aeaeae !important;
    opacity: 1 !important;
}

#navigation ul li a:active {
    color: #D3D4D9 !important;
}

header #navigation a, header #navigation ul {
    display: inline-block;
    margin-top: 0;
}

header nav li {
    position: relative;
    list-style: none;
    padding-left: 0;
}

header, header nav li {
    z-index: 10000;
}

header nav li, header nav ul {
    margin-top: 0;
    display: inline-block;
}

#navigation ul li:hover ul {
    top: 100%;
    opacity: 1;
    visibility: visible;
}

.navigation_fixed {
    display: none;
    position: fixed;
        -webkit-transition: all 1s;
    transition: all 1s;
    background: #ffffff;
    top: 0;
    left: 0;
    margin: 0;
    padding: 2em 0;
    border-bottom: 2px solid #66666e;
    -webkit-transition: all 6s ease;
    transition: all 6s ease;
}

.navigation_fixed #logo {
    width: 190px;
    float: left;
    left: 2em;
    top: 50%;
    -ms-transform: translate(0,0);
    -webkit-transform: translate(0,0);
    transform: translate(0,0);
}

.navigation_fixed ul li a {
    color: #851D2A !important; 
}

/*-- banner --*/
.show {
    opacity: 1 !important;
    display: block !important;
}

#banner {
    height: 800px;
    overflow: hidden;
    margin-top: 0;
    margin-bottom: 2em;
}

#banner .banner_background {
    opacity: 0;


    -webkit-transition: all .6s ease !important;
    -moz-transition: all .6s ease !important;
    -ms-transition: all .6s ease !important;
    -o-transition: all .6s ease !important;
    transition: all .6s ease !important;
}

#banner_background_1 {
    background: url(/assets/images/header_background1.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

#banner_background_2 {
    background: url(/assets/images/header_background2.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

#banner_background_3 {
    background: url(/assets/images/header_background3.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

.banner_holder, .banner_background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #F4F4F4;
}

.overlay, .gallery_overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 1;
    background: rgba(34, 35, 35, 0.5);
}

.gallery_overlay {
    background: rgba(139, 139, 139, 0.4);
}

#banner .first {
  top: 50%;
  left: 50% !important;
}

.p_img span {
    width: 70%;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    font-weight: 500;
    color: #ffffff;
    font-size: 1.8em;
    line-height: 1.5em;
    text-align: center;
    text-shadow: 0 0 8px rgba(0, 0, 0, 1);
    filter:brightness(1);
}

.three_in_row { 
    margin: 0 2em 5em 0 !important;
    width: 33.3%;
    width: -moz-calc(33.3% - 0px - 2em);
    width: -webkit-calc(33.3% - 0px - 2em);
    width: -o-calc(33.3% - 0px - 2em);
    width: calc(33% - 0px - 2em);
    float: left;
}

/*-- about --*/
.container .content p {
    margin-bottom: 2em;
    clear: both;
}

.container .content ul {
    margin-bottom: 1em;
}

.container .content h1:nth-last-child(1),
.container .content h2:nth-last-child(1),
.container .content h3:nth-last-child(1),
.container .content h4:nth-last-child(1),
.container .content h5:nth-last-child(1),
.container .content p:nth-last-child(1),
.container .content ul:nth-last-child(1) {
    margin-bottom: 0;
}

.background_image {
    display: none;
}

/*-- contact --*/
.contact_info a:hover {
    color: #851D2A !important;
}

.contact_info p {
    line-height: 1em !important;
    margin-bottom: 1em;
}

.contact_info b {
    margin-right: .5em;
}

form input, form textarea {
    width: 94%;
    float: left;
    padding: 1.5em 3%;
    border-radius: 10px;
    margin: 0 0 1em 0;
    font-size: 1em;
    color: #3E4745;
    background: #DBDBDB;
    -webkit-appearance: none;
    border: none;
}

form input[type="submit"] {
    cursor: pointer;
    float: right;
    background: #BB3E54; 
    background: -moz-linear-gradient(top, #BB3E54 0%, #851D2A 100%);
    background: -webkit-linear-gradient(top, #BB3E54 0%,#851D2A 100%);
    background: linear-gradient(to bottom, #BB3E54 0%,#851D2A 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#BB3E54', endColorstr='#851D2A',GradientType=1 );
    color: #ffffff;
    font-weight: 600;
    text-transform: uppercase;
    width: 130px;
    padding: 1em 0;
    letter-spacing: 1px;
    border-radius: 10px;
}

form input[type="submit"]:hover {
    background: #BB3E54; 
}

/*-- Services --*/
.slider, 
.slider div {
    background-position: 50% 50%;
    display: block;
    width: 100%;
    height: 500px;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden;
    -moz-transition: transform .4s;
    -o-transition: transform .4s;
    -webkit-transition: transform .4s;
    transition: transform .4s;
}

.slider {
    margin: 4em 0;
}

.slider div {
    position: absolute;
}

.slider i {
    position: absolute;
    top: 45%;
    transition: .8s;
    width: 40px;
    height: 40px;
    cursor: pointer;
    background-size: 25px;
    background-repeat: no-repeat;
    background-repeat: no-repeat;
    z-index:2;
}

.slider .left {
    left: -100px;
    background-image: url(/assets/images/left_arrow.png);
}

.slider .right {
    right: -100px;
    background-image: url(/assets/images/right_arrow.png);
}

.slider:hover .left {
    left: 2em;
}

.slider:hover .right {
    right: 2em;
}

.slider i:hover {
    transform: translateX(-2px);
}

.slider i.right:hover {
    transform: translateX(2px);
}

.slider:hover div {
    transform: scale(1.01);
}

.hoverZoomOff:hover div {
    transform: scale(1);
}

.slider ul {
    position: absolute;
    bottom: 10px;
    left: 50%;
    z-index: 4;
    padding: 0;
    margin: 0;
    transform: translateX(-50%);
}

.slider ul li {
    padding: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    list-style: none;
    float: left;
    margin: 10px 10px 0;
    cursor: pointer;
    border: 1px solid #fff;
    -moz-transition: .3s;
    -o-transition: .3s;
    -webkit-transition: .3s;
    transition: .3s;
}

.slider .show {
    z-index: 1;
}

.slider ul {
    display: none;
}

/*-- footer --*/
footer {
    margin-top: 2em;
    height: 220px;
    background: #D8D8D8 url(/assets/images/footer_logo_icon.png);
    color: #66666E;
    overflow: hidden;
    background-size: 220px;
    background-position: 20px bottom;
    background-repeat: no-repeat;
}

#author {
    width: 134px;
    position: absolute;
    right: 0;
    color: #ffffff;
    font-weight: normal;
    font-size: 0.9em;
    cursor: pointer;
    right: 5em;
    bottom: 2em;
    z-index: 3000;
}

#author span {
    width: 100%;
    float: left;
    text-align: center;
    margin-bottom: 0.5em;
    color: #66666E;
    font-size: .7em;
    text-transform: uppercase;
}

#author:hover {
    opacity: 0.5;
}

.footer_content {
    padding-top: 0;
    position: absolute;
    bottom: 0;
    width: 100%;
    z-index: 1;
}

.footer_content, footer .content .container {
    margin-bottom: 0;
}

.footer_content p {
    font-weight: 100;
    font-size: 0.8em;
    padding: 2em 0;
    color: #66666E;
    text-transform: uppercase;
    position: relative;
    clear: both;
}

/*-- Suppliers --*/
.grey_banner {
    background: #cacaca url(/assets/images/supplier_banner_backdrop.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    float: left;
    height: auto;
    padding: 6em 0;
    margin: 6em 0;
}

.grey_banner h1 {
    float: none;
    text-align: center !important;
    color: #851D2A;
    border: none;
    margin-bottom: 4em;
}

.supplier_logo {
    width: auto;
    display: inline-block;
    position: relative;
    left: 50%;
    -ms-transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    transform: translate(-50%,0);
    /*left: 50%;
    top: 15%;
    float: left;
    position: relative;
    -ms-transform: translate(-50%,15%);
    -webkit-transform: translate(-50%,15%);
    transform: translate(-50%,15%);*/
}

.supplier_logo img:hover {
    opacity: 0.7;
}

.long_logo {
    width: 450px;
    padding: 5.2em 0;
    /*-ms-transform: translate(-50%,120%);
    -webkit-transform: translate(-50%,120%);
    transform: translate(-50%,120%);*/
}

.grey_banner .half {
    width: 50%;
    height: auto;
    margin-bottom: 2em;
}

.grey_banner .half:nth-child(2n+1) {
    padding: 0;
}

.supplier_logo:hover img {
    -ms-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    transition: 1s;
}

.three_quarters {
    float: left;
    width: 100%;
    height: -moz-calc(100% - 360px - 3.5em);
    width: -webkit-calc(100% - 360px - 3.5em);
    height: -o-calc(100% - 360px - 3.5em);
    width: calc(100% - 360px - 3.5em);
}

/* Get in Touch */
.address_holder {
    margin-bottom: 2em;
}

.contact_info p {
    line-height: 1.6em !important;
}

.back_to_top {
    width: 40px;
    background: #851D2A;
    border: 3px solid #851D2A;
    float: left;
    position: relative;
    height: 40px;
    left: 0;
    border-radius: 10px;
    margin: 3em 0;
}

.back_to_top i {
    color: #d8d8d8;
    font-size: 1.2em;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

.back_to_top:hover {
    opacity: .5;
}   

@media only screen and (max-width: 1400px) {
    #banner {
        height: 650px;
    }

    .arrow {
        bottom: 30%;
        -ms-transform: translate(-50%,-30%);
        -webkit-transform: translate(-50%,-30%);
        transform: translate(-50%,-30%);
    }

    html, body {
        font-size: 16px;
    }

    .slider, .slider div {
        height: 450px;
    }
}

@media only screen and (max-width: 1000px) {
    h1, h2 {
        text-align: center;
        left: 50%;
        transform: translate(-50%,0);
        position: relative;
        float: left;
    }

    p {
        text-align: center;
    }
    
    .contact_info .half {
        width: 100%;
        float: left;
    }

    .contact_info .half:nth-child(2n+1) {
        padding-bottom: 12%;
    }

    .contact_info p {
        text-align: center;
    }

    .three_quarters {
        width: 100%;
    }

    .p_img {
        margin-left: 0;
        margin-top: 4em;
        top: 0;
        left: 50%;
        -ms-transform: translate(-50%,0);
        -webkit-transform: translate(-50%,0);
        transform: translate(-50%,0);
    }

    .footer_content p {
        font-size: .6em;
    }

    .grey_banner .half {
        width: 100%;
        float: left;
    }

    .grey_banner h1 {
        margin-bottom: 0;
    }

    .supplier_logo {
        -ms-transform: translate(-50%,0);
        -webkit-transform: translate(-50%,0);
        transform: translate(-50%,0);
    }
}

@media only screen and (max-width: 715px) { 
    #menu {
        display: block;
        clear: both;
        float: left;
        /*float: right;*/
        /*background: #EBEBEB;*/
        background: none;
        width: 55px;
        font-size: 1.5em;
        /*color: #841c2a;*/
        color: #ebebeb;
        border: none;
        height: 55px;
        border-radius: 5px;
        outline: none;
        cursor: pointer;
        position: relative;
        left: 50%;
        -ms-transform: translate(-50%,0);
        -webkit-transform: translate(-50%,0);
        transform: translate(-50%, 0);
    }

    #menu i {
        position: absolute;
        font-size: 1.2em;
        left: 50%;
        top: 50% !important;
        -ms-transform: translate(-50%,-50%);
        -webkit-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
    }

    .navigation_fixed #menu {
        width: 20%;
        margin-top: 0;
        color: #841c2a;
    }

    header #navigation ul {
        display: none;
    }

    header #navigation ul.open_nav {
        width: 100%;
        display: block;
        background: #ebebeb;
        margin-top: 1em;
        border-radius: 10px;
    }

    header .navigation_fixed ul.open_nav {
        background: #ffffff !important;
    }

    header #navigation ul li a {
        color: #831b2a;
    }

    header #navigation li {
        width: 100%;
        border-bottom: 2px solid #ffffff;
        line-height: 1em;
        padding: .8em 0 !important;
    }

    header #navigation li:last-of-type {
        border: none;
    }

    #author {
        left: 50%;
        -ms-transform: translate(-50%,0);
        -webkit-transform: translate(-50%,0);
        transform: translate(-50%,0);
        top: -5.5em;
    }

    .footer_content p {
        text-align: center;
        font-size: .8em;
    }

    .back_to_top {
        position: relative;
        left: 50%;
        top: -35px;
        float: left;
        transform: translate(-50%,0);
        margin: 0;
    }

    footer { 
        padding: 2em 0; 
    }

    form input[type="submit"] {
        position: relative;
        float: left;
        left: 50%;
        transform: translate(-50%,0);
    }
}

@media only screen and (max-width: 600px) {
    header .container {
        margin: 3em 0 0 0;
    }

    header nav {
        margin-top: 2em;
    }

    .content {
        padding: 0 2em;
    }

    .footer_content p {
        font-size: 0.7em;
    }

    .container .content p, h1, h2, h3 {
        text-align: center;
    }

    h1 {
        position: relative;
        float: left;
        left: 50%;
        transform: translate(-50%,0);
    }

    .p_img {
        width: 250px;
        height: 250px;
    }

    .p_img b {
        height: 280px !important;
        width: 280px !important;
    }

    .heading_line {
        left: 50%;
        position: relative;
        -ms-transform: translate(-50%,0);
        -webkit-transform: translate(-50%,0);
        transform: translate(-50%,0);
    }

    #banner {
        height: 500px;
    }

    header #logo {
        width: 300px;
    }

    .gallery_right {
       right: 2em; 
    }

    .gallery_left {
        left: 2em;
    }

    .supplier_holder .half {
        width: 100%;
        float: left;
    }

    .supplier_holder .half:nth-child(2n+1) {
        padding: 0 0 10% 0;
    }

    .supplier_logo {
        width: 85%;
    } 

    .supplier_logo img {
        width: 80%;
        left: 50%;
        position: relative;
        float: left;
        transform: translate(-50%,0);
    }

    .slider, .slider div {
        height: 300px;
    }

    .slider i.left {
        left: 0;
    }

    .slider i.right {
        right: 0;
    }

    .slider:hover .left {
        left: 0;
    }

    .slider:hover .right {
        right: 0;
    }

    .slider i {
        background-size: 20px;
    }

    .supplier_logo:hover img {
        -ms-transform: scale(1.05) translate(-50%,0);
        -webkit-transform: scale(1.05) translate(-50%,0);
        transform: scale(1.05) translate(-50%,0);
        transition: 1s;
    }
}

@media only screen and (max-width: 500px) {
    #contact ul {
        clear: both;
        float: left;
        left: 50%;
        position: relative;
        -ms-transform: translate(-50%,0);
        -webkit-transform: translate(-50%,0);
        transform: translate(-50%,0);
    }

    #contact p {
        width: 100%;
        text-align: center;
    }

    .p_img {
        width: 200px;
        height: 200px;
    }

    .p_img b {
        width: 230px !important;
        height: 230px !important;
    }
}