/*
 Theme Name:     Communication Design Studio (CDS)
 Theme URI:      https://www.commde.fullkorndesign.no
 Description:    Customised and performance optimised theme by CDS
 Author:         Communication Design Studio (CDS) 
 Author URI:     https://www.commde.fullkorndesign.no
 Template:       Divi
 Version:        1.0.0
 Price:          Contact CMD for more info 
 Store:          https://commde.studio
*/
 
 
/* =Theme customization starts here
------------------------------------------------------- */

/*MENU START*/

.et_pb_team_member_image {
	width: 150px!important;
}

.et-pb-contact-message {

	color: #2b9cf3;
	font-size: 20px;
    font-weight: 500;
	line-height: 1.8em;
	
}

.et_pb_toggle_title {
	
	margin-left: -20px;
}

/*rotate the Divi Menu icon on click*/

.mobile_menu_bar:before {
	transition: all .4s ease;
	transform: rotate(0deg);
	display: block;
}

/*change Divi hamburger menu to X*/
.mobile_nav.opened .mobile_menu_bar:before {
    content: '\4d';
}


/*rotate the Divi Menu icon on click*/

.mobile_nav.opened .mobile_menu_bar::before {
	transition: all .4s ease;
	transform: rotate(90deg);
	display: block;
}

.et_pb_scroll_top:before {
    content: '\21';
}

@media (min-width: 981px) {
#main-header.et-fixed-header {
    height: 81px;
    margin-top: -12px;
}
}

/*Mobile MENU from Pee Aye creative START*/




/*adjust the new toggle element which is added via jQuery*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
ul.et_mobile_menu li.page_item_has_children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.page_item_has_children .mobile-toggle {
	width: 44px;
	height: 10%;
	padding: 0px!important;
	max-height: 44px;
	border: left;
	position: absolute;
	right: 2px;
	top: 0px;
	z-index: 999;
	background-color: transparent;
}


/*some code to keep everyting positioned properly*/

ul.et_mobile_menu>li.menu-item-has-children,
ul.et_mobile_menu>li.page_item_has_children,
ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.page_item_has_children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children {
	position: relative;
}


/*remove default background color from menu items that have children*/

.et_mobile_menu .menu-item-has-children>a,
.et-db #et-boc .et-l .et_mobile_menu .menu-item-has-children>a {
	background-color: transparent!important;
}


/*hide the submenu by default*/

ul.et_mobile_menu .menu-item-has-children .sub-menu,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu {
	display: none !important;
	visibility: hidden !important;
}


/*show the submenu when toggled open*/

ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible {
	display: block !important;
	visibility: visible !important;
}



/*submenu toggle icon when closed*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after {
	top: 10px;
	position: relative;
	font-family: "ETMODULES";
	content: '\3b';
	color: #8077ff;
	padding: 3px;
}


/*submenu toggle icon when open*/

ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after {
	content: '\3a';
}

/*padding on solutions submenu icon to make it clikable with a fat finger*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after, .et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after {
    
    padding-right: 60px!important;
}


/*add point on top of the menu submenu dropdown*/

.et_pb_menu_0.et_pb_menu .et_mobile_menu:after {
	position: absolute;
	right: 5%;
	margin-left: -20px;
	top: -14px;
	width: 0;
	height: 0;
	content: '';
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-bottom: 20px solid #ffffff;
}


/*adjust the position of the hamburger menu*/

.mobile_menu_bar {
	position: relative;
	display: block;
	bottom: 10px;
	line-height: 0;
}


/*force the background color and add a rounded border*/

.et_pb_menu_0.et_pb_menu .et_mobile_menu,
.et_pb_menu_0.et_pb_menu .et_mobile_menu ul {
	background-color: #ffffff!important;
	border-radius: 10px!important;
}

/*Mobile MENU from Pee Aye creative END*/

/** Makes the menu background full width **/
 
@media (max-width: 980px) {
 .container.et_menu_container { 
    width: calc( 100% - 60px);
 }
}
 
.et_mobile_menu {
    margin-left: -30px;
	margin-top: 0px;
    padding-top: 20;
    width: calc( 100% + 60px);
	height: 900px
}

/** Mobile menu font **/

.et_mobile_menu li a {
    font-size: 22px;
	font-weight: 600!important;
	line-height: 1.4em!important;
}

/*Divi mobile menu submenu links*/
.et_mobile_menu .menu-item-has-children li a {
    font-weight: 600!important;
	color: #2B9CF3;
}



/*Keeps the highlighted contact button in mobile menu left and sized*/

@media only screen and (max-width: 481px)  {
 .et_mobile_menu .menu-cta { 
     margin-right: 185px;	 
 }
}

@media only screen and (min-width: 482px) and (max-width: 768px)  {
 .et_mobile_menu .menu-cta { 
     margin-right: 350px;	 
 }
}

@media only screen and (min-width: 768px) and (max-width: 980px)  {
 .et_mobile_menu .menu-cta { 
	 margin-right: 500px;	 
 }
}

@media only screen and (min-width: 981px) {
 .et_mobile_menu .menu-cta { 
	 margin-right: 750px;
	 
 }
}

#top-menu-nav #top-menu a:hover,
#mobile_menu a:hover { 
    background: transparent;
	opacity:1 !important;
	color: #2B9CF3 !important; 
}

.sub-menu, .et_mobile_menu {
    border-top: 0px !important;
	border-radius: 0px;
}

/*END OF THE MENU*/

/*collpse and set the height of the toggle text 1*/

.pa-toggle-text .et_pb_text_inner {
	max-height: 200px;
	transition: max-height 0.3s ease-out;
	overflow: hidden;
}


/*add gradient to the collapsed text*/

.pa-toggle-text .et_pb_text_inner:after {
	content: "";
	display: inline-block;
	position: absolute;
	pointer-events: none;
	height: 100px;
	width: 100%;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: linear-gradient(0deg, #fafafa 2%, transparent);
}


/*style the expand text link*/

.pa-toggle-text .pa-text-expand-button {
	padding: 0.5em;
	text-align: center;
	color: #4e4e4e!important;
	font-size: 20px!important;
}


/*change the curor to a pointed when hovering over the expand text link*/

.pa-toggle-text .pa-text-expand-button span {
	cursor: pointer;
}


/*define the font family for the toggle icon*/

.pa-toggle-text .pa-text-expand-button .pa-text-toggle-icon {
	font-family: ETMODULES, "sans-serif";
	
}

/*set the max height and transition of the expanded toggle*/

.pa-toggle-text .pa-text-toggle-expanded {
	max-height: 2000px;
	transition: max-height 0.3s ease-in;
}


/*hide the gradient when the toggle is expanded*/

.pa-toggle-text .pa-text-toggle-expanded.et_pb_text_inner:after {
	background: none;
}






/*collpse and set the height of the toggle text 2*/

.pa-toggle-text2 .et_pb_text_inner {
	max-height: 200px;
	transition: max-height 0.3s ease-out;
	overflow: hidden;
}


/*add gradient to the collapsed text*/

.pa-toggle-text2 .et_pb_text_inner:after {
	content: "";
	display: inline-block;
	position: absolute;
	pointer-events: none;
	height: 100px;
	width: 100%;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: linear-gradient(0deg, #fff9ed 2%, transparent);
}


/*style the expand text link*/

.pa-toggle-text2 .pa-text-expand-button {
	padding: 0.5em;
	text-align: center;
	color: #4e4e4e!important;
	font-size: 20px!important;
}


/*change the curor to a pointed when hovering over the expand text link*/

.pa-toggle-text2 .pa-text-expand-button span {
	cursor: pointer;
}


/*define the font family for the toggle icon*/

.pa-toggle-text2 .pa-text-expand-button .pa-text-toggle-icon {
	font-family: ETMODULES, "sans-serif";
	
}

/*set the max height and transition of the expanded toggle*/

.pa-toggle-text2 .pa-text-toggle-expanded {
	max-height: 2000px;
	transition: max-height 0.3s ease-in;
}


/*hide the gradient when the toggle is expanded*/

.pa-toggle-text2 .pa-text-toggle-expanded.et_pb_text_inner:after {
	background: none;
}

/*End of read more code*/



#main-header { box-shadow: none !important; }

/*JUST HEADERS*/

.et_pb_column_1_3 h3 {
    font-size: 22px!important;
    line-height: 1.4em !important;
}

.et_pb_column_1_3 h2, .et_pb_column_1_4 h2, .et_pb_column_1_5 h2, .et_pb_column_1_6 h2, .et_pb_column_2_5 h2 {
    font-size: 30px;
	}

/*End of HEADERS code*/


/*Cookie settings *****************************************************/

.cli-style-v2 .cli-bar-message {
    width: 50%;
    text-align: right;
	padding-top: 90px;
	padding-bottom: 90px;
}

.cli-bar-container {
    justify-content: left; 
}

.cli-style-v2 .cli-bar-btn_container .cli-plugin-button {
    border-radius: 7px;
}

.cli-tab-footer .wt-cli-privacy-accept-btn {

    border-radius: 7px!important;
}

.wt-cli-ckyes-brand-logo {
    display: none;
}

@media (max-width: 985px) {
.cli-style-v2 .cli-bar-btn_container {
    margin-left: 20px;
    margin-top: 10px;
   }
}
	
@media (max-width: 985px) {
	.cli-style-v2 .cli-bar-message {
    width: 80%!important;
    text-align: left;
    padding-top: 0px;
    padding-bottom: 0px;
	padding-left: 25px;
   }
}


/*Cookie illustration settings*/

 .something {
	width: 180px;
	display: block;
  margin-left: auto;
  margin-right: auto;
}


@media only screen and (max-width: 481px)  {
 .something {
	width: 180px;
	display: block;
  margin-left: 30px;
  margin-right: auto;
}
}

@media only screen and (min-width: 482px) and (max-width: 768px)  {
  .something {
	width: 180px;
	display: block;
  margin-left: 60px;
  margin-right: auto;
}
}

@media only screen and (min-width: 768px) and (max-width: 980px)  {
 .something {
	width: 180px;
	display: block;
  margin-left: auto;
  margin-right: auto;
}
}



	


/* all in Edit Themes after this
------------------------------------------------------- */


/*PORTFOLIO IMAGE*/

.et_pb_portfolio_image {
    padding-top: 100%;
}
.et_pb_portfolio_image img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    object-fit: cover;
    height: 100%;
    width: 100%;
}
.et_pb_portfolio_item, .et_pb_portfolio_items {
    height: auto!important;
}

@media (min-width: 981px){
.home .et_pb_fullwidth_portfolio_0 .et_pb_portfolio_item {max-width:33.33%!important;}
}

@media all and (max-width: 980px){
  .home .et_pb_fullwidth_portfolio_0 .et_pb_portfolio_item{
    max-width: 50% !important;
    width: 50% !important;
  }
}

@media all and (max-width: 600px){
  .home .et_pb_fullwidth_portfolio_0 .et_pb_portfolio_item{
    max-width: 100% !important;
    width: 100% !important;
  }
}

.single .et_pb_post {
 margin-bottom: 0px;

}

.et_contact_bottom_container p.clearfix {
    color: #fff !important;
}

/*MENU ITEMS COLOUR AND ON HOVER*/

.menu-cta a {
  
    padding: 6.5px !important;
    border-radius: 7px;
    text-align: center; 
	margin-left: 9px;
	
}

.menu-cta:hover a {
  
	transform: scale(1.05);
	transition: transform 0.2s!important;
}

.et_pb_button:hover {
	transform: scale(1.05);
}




.solutions a-hover {
    color: #2b9cf3;
}

@media (max-width: 980px) {
.et_non_fixed_nav.et_transparent_nav #main-header, .et_non_fixed_nav.et_transparent_nav #top-header, .et_fixed_nav #main-header, .et_fixed_nav #top-header {
    position: fixed;
}
}

.et_pb_fullwidth_header .et-pb-icon.scroll-down {
	animation: fullwidth-header-bounce 4s ease-in infinite;
}
@keyframes fullwidth-header-bounce {
  0% { transform:translateY(0%); }
  12.5% { transform:translateY(20%); }
  25% { transform:translateY(0%); }
  37.5% { transform:translateY(20%); }
  50% { transform:translateY(0%); }
}

/*MENU END****************************************************/


/*UNDERLINES OF HYPERLINKS*/

.border-underline a {
border-bottom: 1px solid #8077FF;
	padding: 1px
}

.border-underline:hover a {
border-bottom: 1px solid #2B9CF3;
	padding: 1px
}

.border-underline2 a {
border-bottom: 1px solid #99fff6;
	padding: 1px
}

.border-underline2:hover a {
border-bottom: 1px solid #2B9CF3;
	padding: 1px
}

.border-underline3 a {
border-bottom: 1px solid #99fff6;
	padding: 1px
}

.border-underline3:hover a {
border-bottom: 1px solid #fffa70;
	padding: 1px
}

.border-underline4 a {
border-bottom: 1px solid #99fff6;
	padding: 1px
}

.border-underline4:hover a {
border-bottom: 1px solid #FFFA70;
	padding: 1px
}

.border-underline5 a {
border-bottom: 1px solid #2B9CF3;
	padding: 1px
}

.border-underline5:hover a {
border-bottom: 1px solid #8077FF;
	padding: 1px
}


@media (max-width: 980px) {

	.dica_divi_carousel_0 .dica-container .swiper-button-next {
	
	display: none!important;
}
	}


/*Toogle module and its higlighted header text */

.et_pb_module_header {
  text-align: center; 
   
	display: table;
	padding: 0px!important;
}

/*Logo change animation 
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
*/ 

/*changed logo fixed header on scroll*/

.et-fixed-header #logo {
    content: url(https://commde.fullkorndesign.no/wp-content/uploads/2023/09/communication-design-studio-logo-after.png);
}

.et-fixed-header #logo {
  padding-top: 10px!important;
  padding-bottom: 0px;
}

/*without axterisk bottom inactive*/	
	


@media (min-width: 981px){
#logo {
  height: 80px;
  max-height: 84%;
}
	  }

.et-fixed-header #logo {
  height: 100%!important;
  padding-bottom: 0px;
}


@media all and (max-width: 980px){
  #logo {
  height: 80px !important;
  max-height: 84%;
  padding-top: 5px
}
	  }



/*logo animation for mobile devices*/

@media all and (max-width: 980px){

#logo {
    height: 123px;
    max-height: 90% !important;
}

#logo {
    width: auto;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 500ms ease-in-out 0ms;
    margin-bottom: 0;
    max-height: 80%;
    display: inline-block;
    float: none;
    vertical-align: middle;
    -webkit-transform: translate3d(0, 0, 0);
}
img {
    max-width: 100%;
    height: auto;
}

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
}


@media (max-width: 980px) {
  .et_header_style_left #logo {
    max-width: 100%;
  }
}










/*REMOVED CODE CAUSING NOT SPACE BETWEEN PARAGPRAHPS

a, abbr, acronym, address, applet, b, big, blockquote, body, center, cite, code, dd, del, dfn, div, dl, dt, em, fieldset, font, form, h1, h2, h3, h4, h5, h6, html, i, iframe, img, ins, kbd, label, legend, li, object, ol, p, pre, q, s, samp, small, span, strike, strong, sub, sup, tt, u, ul, var {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    vertical-align: baseline;
    background: transparent;
} 

/*