/*=============================================>>>>>
= Breakpoints =
===============================================>>>>>*/
/*=============================================>>>>>
= Media Up =
===============================================>>>>>*/
/*=============================================>>>>>
= Media Down =
===============================================>>>>>*/
/*=============================================>>>>>
= Media Between =
===============================================>>>>>*/
/*=============================================>>>>>
= Placeholder =
===============================================>>>>>*/
/*=============================================>>>>>
= Animations =
===============================================>>>>>*/
/*=============================================>>>>>
= Ellipsis =
===============================================>>>>>*/
/*=============================================>>>>>
= Position =
===============================================>>>>>*/
/*=============================================>>>>>
= Clearfix =
===============================================>>>>>*/
/** Convert font-size from px to rem with px fallback  @param $size - the value in pixel you want to convert  e.g. p {@include fontSize(12px);}  */
.col-one { display: flex; flex-flow: wrap; margin: 0 -10px; }
.col-one > * { width: calc(100% / 1 - 20px); padding: 10px 10px; box-sizing: content-box; }
@media (max-width: 699px) { .col-one > * { width: 100%; box-sizing: inherit; } }

.col-two { display: flex; flex-flow: wrap; margin: 0 -10px; }
.col-two > * { width: calc(100% / 2 - 20px); padding: 10px 10px; box-sizing: content-box; }
@media (max-width: 699px) { .col-two > * { width: 100%; box-sizing: inherit; } }

.col-three { display: flex; flex-flow: wrap; margin: 0 -10px; }
.col-three > * { width: calc(100% / 3 - 20px); padding: 10px 10px; box-sizing: content-box; }
@media (max-width: 1079px) { .col-three > * { width: calc(100% / 2 - 20px); } }
@media (max-width: 699px) { .col-three > * { width: 100%; box-sizing: inherit; } }

.col-four { display: flex; flex-flow: wrap; margin: 0 -10px; }
.col-four > * { width: calc(100% / 4 - 20px); padding: 10px 10px; box-sizing: content-box; }
@media (max-width: 1079px) { .col-four > * { width: calc(100% / 2 - 20px); } }
@media (max-width: 699px) { .col-four > * { width: 100%; box-sizing: inherit; } }

footer .footer-main .inner .wrap .contact-details { width: auto; }

footer .footer-main .wrap .inner .footer-logo a { width: 247px; height: 91px; }
footer .footer-main .wrap .inner .footer-logo a svg path { fill: white; }