/****************************
 * Theme Name: CSC - Soapbox
 * Author: Soapbox
 * Template version: 1.0 by Soapbox
*****************************/

/***************************************
*              Fonts import
****************************************/
/* Font Awesome */
@import url("assets/css/font-awesome.min.css");

/* Google fonts */
@import url("assets/css/fonts.css");
/*font-family: 'Roboto', sans-serif; 400, 700, 900*/
/*font-family: 'Roboto Slab', serif; 300, 400, 700*/

/* Icomoon */
@font-face {
    font-family: 'icomoon';
    src:  url('assets/fonts/icomoon.eot?97rzgr');
    src:  url('assets/fonts/icomoon.eot?97rzgr#iefix') format('embedded-opentype'),
    url('assets/fonts/icomoon.ttf?97rzgr') format('truetype'),
    url('assets/fonts/icomoon.woff?97rzgr') format('woff'),
    url('assets/fonts/icomoon.svg?97rzgr#icomoon') format('svg');
    font-weight: normal; font-style: normal;}

/***************************************
*             Style for Editor
****************************************/
/* Common styles */
* {margin: 0; padding: 0; border:0; outline: none; box-sizing: border-box}

body {
    color: #6c6c6c; background-color: #ffffff;
    font-family: 'Roboto', sans-serif; font-size: 16px; line-height: 2; font-weight: 400;
    text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
a {
    color: #89236f; text-decoration: none;
    -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease; transition: all 0.3s ease;}
a:focus, a:active, a:hover {
    color: #89236f; text-decoration: none; outline: 0;}

/* Headings */
.mceContentBody h1,.mceContentBody h2,.mceContentBody h3,.mceContentBody h4,.mceContentBody h5,.mceContentBody h6,
.main_content h1, .main_content h2, .main_content h3, .main_content h4, .main_content h5, .main_content h6 {
    font-family: 'Roboto', sans-serif; font-weight: 900;
    color: #333333; margin: 0 0 20px 0; padding:0;}
.mceContentBody h1, .main_content h1 {font-size: 75px; line-height: 85px;}
.mceContentBody h2, .main_content h2 {font-size: 36px; line-height: 42px;}
.mceContentBody h3, .main_content h3 {font-size: 32px; line-height: 42px;}
.mceContentBody h4, .main_content h4 {font-size: 26px; line-height: 42px;}
.mceContentBody h5, .main_content h5 {font-size: 24px; line-height: 31px;}
.mceContentBody h6, .main_content h6 {font-size: 20px; line-height: 28px;}
.mceContentBody hr, .main_content hr {
    height: 0; border-bottom:2px solid #ccc;
    background:none; margin-bottom:25px;}
/*********************************************************************** NO STYLING FROM THIS LINE */
/* Text elements */
.mceContentBody ul li, .mceContentBody ol li,
.main_content ul li, .main_content ol li {padding:5px 0 5px 7px;}
.mceContentBody p, .main_content p {margin-bottom: 20px; display: block;}
.mceContentBody ul, .mceContentBody ol, .main_content ul,
.main_content ol {margin:0 0 25px 15px; padding: 0;}
.mceContentBody ul, .main_content ul {list-style: disc;}
.mceContentBody ol,
.main_content ol {list-style-type: decimal;}
.mceContentBody ol ol,
.main_content ol ol {list-style: upper-alpha;}
.mceContentBody ol ol ol,
.main_content ol ol ol {list-style: lower-roman;}
.mceContentBody ol ol ol ol,
.main_content ol ol ol ol {list-style: lower-alpha;}
.mceContentBody ul ul, .mceContentBody ol ol,
.mceContentBody ul ol, .mceContentBody ol ul,
.main_content ul ul, .main_content ol ol,
.main_content ul ol, .main_content ol ul {margin-bottom: 0;}
.mceContentBody strong, .main_content strong {font-weight: 700;}
.mceContentBody cite, .mceContentBody em, .mceContentBody i,
.main_content cite, .main_content em,
.main_content i {font-style: normal;}
.mceContentBody cite, .main_content cite  {border: none;}
.mceContentBody big, .main_content big {font-size: 131.25%;}
.mceContentBody blockquote, .mceContentBody blockquote p,
.main_content blockquote, .main_content blockquote p {
    font-style: italic !important; margin: 0 3em;}
.mceContentBody blockquote em, .mceContentBody blockquote i,
.mceContentBody blockquote cite,
.main_content blockquote em, .main_content blockquote i,
.main_content blockquote cite {font-style: normal;}
.mceContentBody blockquote cite, .main_content blockquote cite {
    color: #555; font-size: 12px; letter-spacing: 0.05em; text-transform: uppercase;}
.mceContentBody pre, .main_content pre {
    background: #f4f4f4; font-size: 1em; margin-bottom: 1.625em; padding: 0.75em 1.625em;}
.mceContentBody code, .mceContentBody kbd, .mceContentBody samp,
.mceContentBody var, .main_content code, .main_content kbd,
.main_content samp, .main_content var {font-size: 1em;}
.mceContentBody abbr, .mceContentBody acronym,
.mceContentBody dfn {border-bottom: 1px dotted #ccc; cursor: help;}
.mceContentBody address {display: block; margin: 0 0 1.625em;}
.mceContentBody del {color: #555;}
.mceContentBody ins {background: #f8f8f8; border: none; color: #555; text-decoration: none;}
.mceContentBody sup, .mceContentBody sub {
    font-size: 10px;height: 0;line-height: 1;
    position: relative; vertical-align: baseline;}
.mceContentBody sup {bottom: 1ex;}
.mceContentBody sub {top: .5ex;}
.mceContentBody input[type=text],
.mceContentBody textarea {
    background: #fbfbfb; border: 1px solid #D9D9D9; color: #555;
    -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
.mceContentBody input[type=text]:focus,
.mceContentBody textarea:focus { color: #555;}
.mceContentBody textarea { padding-left: 10px; width: 95%;}
.mceContentBody input[type=text] { padding: 15px 10px; width: 197px;}

/* Tables */
.mceContentBody table, .main_content table {
    border-collapse: collapse; text-align: left;
    width: 100%; margin-bottom: 25px;}
.mceContentBody tr td, .main_content tr td {
    padding: 10px; vertical-align: top;
    border:1px solid #ccc;}

/* Images */
.mceContentBody img[class*="wp-image-"],
.main_content img[class*="wp-image-"] {
    height: auto; max-width: 97.5%;}
.mceContentBody img.size-full,.main_content img.size-full {
    width: auto; /* Prevent stretching of full-size images in IE8 */}
.mceContentBody img.wp-smiley,.main_content img.wp-smiley {
    border: none; margin-bottom: 0; margin-top: 0; padding: 0;}
.mceContentBody img.alignleft, .mceContentBody img.alignright,
.mceContentBody img.aligncenter,.main_content img.alignleft,
.main_content img.alignright, .main_content img.aligncenter {margin-bottom: 5px;}
.mceContentBody .wp-caption,.main_content .wp-caption {
    background: #eee; border: none; margin-bottom: 1.625em;
    max-width: 96%; padding: 9px;}
.mceContentBody .wp-caption img,.main_content .wp-caption img {
    display: block; margin: 5px auto 0 !important;
    max-width: 98%; border-color: #eee;}
.mceContentBody .wp-caption .wp-caption-text, .mceContentBody .wp-caption-dd,
.main_content .wp-caption .wp-caption-text, .main_content .wp-caption-dd {
    color: #555; font-size: 12px; margin: 0 0 0.6em 0 !important;
    padding: 0 0 5px 40px; position: relative; text-align: left;}
.mceContentBody .wp-caption .wp-caption-text::before,
.main_content .wp-caption .wp-caption-text::before {
    color: #555; content: '\2014'; font-size: 14px;
    font-style: normal; font-weight: 700;
    margin-right: 5px; position: absolute; left: 10px; top: 7px;}
.mceContentBody a:focus img[class*="wp-image-"],
.mceContentBody a:hover img[class*="wp-image-"],
.mceContentBody a:active img[class*="wp-image-"],
.main_content a:focus img[class*="wp-image-"],
.main_content a:hover img[class*="wp-image-"],
.main_content a:active img[class*="wp-image-"] {opacity:0.8;}
.mceContentBody .wp-caption a:focus img,
.mceContentBody .wp-caption a:active img,
.mceContentBody .wp-caption a:hover img,
.main_content .wp-caption a:focus img,
.main_content .wp-caption a:active img,
.main_content .wp-caption a:hover img {background: #fff; border-color: #ddd;}
.mceContentBody br, .main_content br {clear: both; float: none;}

/********************************************************************************** END NO STYLING */

/* Text sizes */
.txt_size_36px {font-size: 36px; line-height: 42px;}
.txt_size_32px {font-size: 32px; line-height: 42px;}
.txt_size_30px {font-size: 30px; line-height: 42px;}
.txt_size_28px {font-size: 28px; line-height: 42px;}
.txt_size_26px {font-size: 26px; line-height: 42px;}
.txt_size_24px {font-size: 24px;}
.txt_size_22px {font-size: 22px;}
.txt_size_20px {font-size: 20px;}
.txt_size_18px {font-size: 18px;}
.txt_size_16px {font-size: 16px;}
.txt_size_15px {font-size: 15px;}
.txt_size_14px {font-size: 14px;}
.txt_size_11px {font-size: 11px;}

/* Text colors & fonts */
.txt_violet {color: #89236f;}
.txt_black {color:#000000;}
.txt_white {}
.txt_lightGray {color: #999999;}
.txt_lightGrey {color: #6c6c6c;}
.txt_grey {color: #424242;}
.txt_dark_grey {color: #333333;}
.txt_light {font-weight: 300 !important;}
.txt_regular {font-weight: 400 !important;}
.txt_medium {font-weight: 500 !important;}
.txt_bold {font-weight: 700 !important;}
.txt_heavy {font-weight: 900 !important;}
.txt_italic {font-style: italic !important;}
.txt_font_robotoSlab {font-family: 'Roboto Slab', serif;}

/* Text align */
.txt_uppercase {text-transform: uppercase;}
.txt_inline_block {display:inline-block;}
.txt_right {text-align: right; display:block;}
.txt_center {text-align: center; display:block;}
.txt_justify {text-align: justify; display:block;}
p.margin-bottom-0 {margin-bottom: 0 !important;}

/* Text styles */
.txt_robotoSlab_16px_bold_lightGrey {
    font-family: 'Roboto Slab', serif; font-size: 16px; font-weight: 700; color: #6c6c6c;}
.txt_robotoSlab_18px_regular_dark_grey {
    font-family: 'Roboto Slab', serif; font-size: 18px; font-weight: 400; color: #333333;}
.txt_robotoSlab_18px_light_dark_grey {
    font-family: 'Roboto Slab', serif; font-size: 18px; font-weight: 300; color: #333333;}
.txt_robotoSlab_18px_regular_white {
    font-family: 'Roboto Slab', serif; font-size: 18px; font-weight: 400; line-height: 28px;}
.txt_robotoSlab_27px_light_dark_grey {
    font-family: 'Roboto Slab', serif; font-size: 27px; font-weight: 300; color: #333333;}
.txt_robotoSlab_22px_light_white {
    font-family: 'Roboto Slab', serif; font-size: 22px; font-weight: 300;}
.txt_robotoSlab_16px_light_lightGrey {
    font-family: 'Roboto Slab', serif; font-size: 16px; font-weight: 300; color: #6c6c6c;}
.txt_22px_regular_white {font-size: 22px; font-weight: 400;}
.txt_25px_heavy_white {font-size: 25px; font-weight: 900; line-height: 42px;}
.txt_link_underline {text-decoration: underline;}

/* Titles styles */
.title_24px_bold_grey {font-size: 24px; font-weight: 700; color: #424242; line-height: 31px;}
.title_26px_heavy_dark_grey {font-size: 26px; font-weight: 900; color: #333333; line-height: 42px;}
.title_33px_heavy_dark_grey {font-size: 33px; font-weight: 900; color: #333333; line-height: 42px;}
.title_36px_heavy_dark_grey {font-size: 36px; font-weight: 900; color: #333333; line-height: 42px;}


/*** BUTTONS ***/
/* btn_arrow_right_bgWhite */
a.btn_arrow_right_bgWhite {
    display: inline-block; padding: 10px 78px 10px 18px; position: relative;
    color: #565656; background-color: #ffffff;
    font-weight: 900; letter-spacing: 1px; font-size: 15px; text-transform: uppercase;
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
    box-sizing: border-box; border: 1px solid #565656;}
a.btn_arrow_right_bgWhite::before {
    content: "\e902"; font-family: 'icomoon'; position: absolute; top: 50%; right: 0;
    -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);-o-transform: translate(0, -50%); transform: translate(0, -50%);
    width: 60px; height: 50px; text-align: center; line-height: 50px;}
a.btn_arrow_right_bgWhite::after {
    content: ""; position: absolute; top: 50%; right: 60px; opacity: 1;
    -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);-o-transform: translate(0, -50%); transform: translate(0, -50%);
    width: 1px; height: 100%; background-color: #565656;}
/* transition & hover */
a.btn_arrow_right_bgWhite,
a.btn_arrow_right_bgWhite::after {
    -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
a.btn_arrow_right_bgWhite:hover {
    background-color: #FFFFFF; color: #89236f;
    border: 1px solid #89236f; box-shadow: -4px 4px 10px 0 rgba(0,0,0,0.27)}
a.btn_arrow_right_bgWhite:hover::after {color: #89236f; right: 0; opacity: 0;}

/* btn_arrow_right_bgDarkGrey & btn_arrow_right_bgTransparent */
a.btn_arrow_right_bgDarkGrey,
a.btn_arrow_right_bgTransparent {
    display: inline-block; padding: 10px 78px 10px 18px; position: relative;
    background-color: #565656;
    font-weight: 900; letter-spacing: 1px; font-size: 15px; text-transform: uppercase;
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
    box-sizing: border-box; border: 1px solid #565656;}
a.btn_arrow_right_bgDarkGrey {color: #ffffff;}
a.btn_arrow_right_bgTransparent {padding: 10px 70px 10px 10px; background-color: transparent;}
a.btn_arrow_right_bgDarkGrey::before,
a.btn_arrow_right_bgTransparent::before {
    content: "\e902"; font-family: 'icomoon'; position: absolute; top: 50%; right: 0;
    -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);-o-transform: translate(0, -50%); transform: translate(0, -50%);
    width: 60px; height: 50px; text-align: center; line-height: 50px;}
a.btn_arrow_right_bgDarkGrey::after,
a.btn_arrow_right_bgTransparent::after {
    content: ""; position: absolute; top: 50%; right: 60px; opacity: 1;
    -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);-o-transform: translate(0, -50%); transform: translate(0, -50%);
    width: 1px; height: 100%; background-color: #89236f;}
a.btn_arrow_right_bgDarkGrey::after {background-color: #ffffff;}
/* transition & hover */
a.btn_arrow_right_bgDarkGrey,
a.btn_arrow_right_bgTransparent,
a.btn_arrow_right_bgDarkGrey::after,
a.btn_arrow_right_bgTransparent::after {
    -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
a.btn_arrow_right_bgDarkGrey:hover,
a.btn_arrow_right_bgTransparent:hover {
    color: #89236f; background-color: #ffffff;
    border: 1px solid #89236f; box-shadow: -4px 4px 10px 0 rgba(0,0,0,0.27)}
a.btn_arrow_right_bgDarkGrey:hover::after,
a.btn_arrow_right_bgTransparent:hover::after {right: 0; opacity: 0;}
a.btn_arrow_right_bgTransparent:hover {border: 1px solid #ffffff; box-shadow: -4px 4px 10px 0 rgba(255,255,255,0.27)}

/* btn-read-more */
a.btn-read-more {
    padding: 7px 40px 8px 0; position: relative; color: #89236f;
    font-weight: 700; letter-spacing: 1px; font-size: 13px; text-transform: uppercase;
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
    box-sizing: border-box; border: 1px solid transparent;}
a.btn-read-more::before {
    content: "\e902"; font-family: 'icomoon'; position: absolute; top: 50%; right: 0;
    -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);-o-transform: translate(0, -50%); transform: translate(0, -50%);
    width: 30px; height: 30px; text-align: center; line-height: 30px; color: #565656;
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
    box-sizing: border-box; border: 1px solid #565656;}
/* transition & hover */
a.btn-read-more,
a.btn-read-more::before,
a.btn-read-more::after {
    -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
a.btn-read-more:hover {
    background-color: #89236f; color: #ffffff; padding: 7px 40px 8px 10px;
    box-shadow: -4px 4px 10px 0 rgba(0,0,0,0.27);}
a.btn-read-more:hover::before {color: #ffffff; border-color: transparent;}

/* btn-load-more */
a.btn-load-more {
    display: inline-block; padding: 10px 45px 10px 45px; position: relative;
    color: #565656; background-color: #ffffff;
    font-weight: 900; letter-spacing: 1px; font-size: 15px; text-transform: uppercase;
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
    box-sizing: border-box; border: 1px solid #565656;
    -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out}
a.btn-load-more:hover {background-color: #89236f; color: #ffffff; box-shadow: 0 10px 10px -3px rgba(0,0,0,0.27);}

/* BOX TEXT HIGHLIGHT */
.box_txt_bgTransparent {
    padding: 20px 30px !important;
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
    border: 1px solid #565656; color: #6c6c6c; background-color: transparent;
    font-family: 'Roboto Slab', serif; font-size: 16px; font-weight: 300; line-height: 32px;}

/* Lists */
ul.custom-ul {list-style:none; margin: 0 0 20px 0;}
ul.custom-ul > li {padding:0 0 0 70px; margin-bottom: 10px; position: relative}
ul.custom-ul > li::before {
    content: ""; position: absolute; top: 14px; left: 30px;
    width: 4px; height: 4px; background-color: #6c6c6c;
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
    -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;}